vue2-client 1.2.94 → 1.2.95

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,10 +1,11 @@
1
1
  # Change Log
2
2
  > 所有关于本项目的变化都在该文档里。
3
3
 
4
- **1.2.94 -2022-08-05 @张振宇**
4
+ **1.2.94 -2022-08-05 - 1.2.95 @张振宇**
5
5
  - 功能新增:
6
6
  - 新增表单组件 人员选择框
7
7
  - 新增表单配置可以配置自定义请求
8
+ - 文件表单项新增附件用途配置
8
9
 
9
10
  **1.2.93 -2022-08-03 @江超**
10
11
  - 功能新增:
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vue2-client",
3
- "version": "1.2.94",
3
+ "version": "1.2.95",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "serve": "vue-cli-service serve",
@@ -299,6 +299,11 @@
299
299
  :min="1"
300
300
  />
301
301
  </a-form-model-item>
302
+ <a-form-model-item label="附件用途" prop="useType">
303
+ <a-select v-model="item.useType" placeholder="指定文件用途,同表单不同用途">
304
+ <a-select-option v-for="userTypeItem in $appdata.getDictionaryList('useType')" :key="userTypeItem.value">{{ userTypeItem.value }}</a-select-option>
305
+ </a-select>
306
+ </a-form-model-item>
302
307
  <a-form-model-item label="上传的仓库" prop="resUploadStock">
303
308
  <a-select v-model="item.resUploadStock" placeholder="选择文件上传到的仓库" @change="changeStock">
304
309
  <a-select-option v-for="stock in stockList" :key="stock.id">{{ stock.f_name }}</a-select-option>
@@ -1,151 +1,152 @@
1
- <template>
2
- <div>
3
- <a-upload-dragger
4
- v-if="model.type === 'file'"
5
- name="file"
6
- :multiple="true"
7
- :accept="model.accept.join('')"
8
- :remove="deleteFileItem"
9
- :customRequest="uploadFiles"
10
- :file-list="uploadedFileList">
11
- <p class="ant-upload-drag-icon">
12
- <a-icon type="inbox"/>
13
- </p>
14
- <p class="ant-upload-text">
15
- 点击或拖动文件到该区域上传
16
- </p>
17
- <p class="ant-upload-hint">
18
- 支持单个或多个文件
19
- </p>
20
- </a-upload-dragger>
21
- <a-upload
22
- v-if=" model.type === 'image'"
23
- list-type="picture-card"
24
- :accept="model.accept.join('')"
25
- :customRequest="uploadFiles"
26
- :remove="deleteFileItem"
27
- :file-list="uploadedFileList">
28
- <a-icon type="plus"/>
29
- <div class="ant-upload-text">
30
- Upload
31
- </div>
32
- </a-upload>
33
- </div>
34
- </template>
35
-
36
- <script>
37
-
38
- import { post } from '@vue2-client/services/api'
39
- import { mapState } from 'vuex'
40
-
41
- export default {
42
- name: 'uploads',
43
- data () {
44
- return {
45
- uploadedFileList: [],
46
- }
47
- },
48
- props: {
49
- // 表单属性
50
- model: {
51
- type: Object,
52
- default: () => {
53
- return {}
54
- }
55
- },
56
- files: {
57
- type: Array,
58
- default: () => {
59
- return []
60
- }
61
- },
62
- images: {
63
- type: Array,
64
- default: () => {
65
- return []
66
- }
67
- }
68
- },
69
- computed: {
70
- ...mapState('account', { currUser: 'user' })
71
- },
72
- created () {
73
- this.uploadedFileList = this.model.type === 'file' ? [...this.files] : [...this.images]
74
- },
75
- methods: {
76
- uploadFiles (info) {
77
- if (this.uploadedFileList.length >= this.model.acceptCount) {
78
- this.$message.error(`当前表单限制仅可上传 ${this.model.acceptCount} 个文件`)
79
- return
80
- }
81
- // 初始化文件信息
82
- const fileInfo = {
83
- uid: info.file.uid,
84
- name: info.file.name,
85
- status: 'uploading',
86
- response: '',
87
- url: '',
88
- }
89
- // 放入上传列表中,以便于显示上传进度
90
- this.uploadedFileList.push(fileInfo)
91
- // 组装上传数据
92
- const headers = {
93
- 'Content-Type': 'multipart/form-data',
94
- }
95
- // TODO 暂时给默认值 基础表单调整好后处理
96
- const formData = new FormData()
97
- formData.append('avatar', info.file)
98
- formData.append('resUploadMode', this.model.resUploadMode ?? 'server')
99
- if (this.model.pathKey) {
100
- formData.append('pathKey', this.model.pathKey ?? 'Default')
101
- }
102
- // formData.append('stockAlias', this.model.stockAlias)
103
- formData.append('formType', this.model.type)
104
- formData.append('resUploadStock', this.model.resUploadStock)
105
- formData.append('filename', info.file.name)
106
- formData.append('filesize', (info.file.size / 1024 / 1024).toFixed(4))
107
- formData.append('f_operator', this.currUser ? this.currUser.username : '')
108
-
109
- // const url = '/webmeteruploadapi/resource'
110
- // if (process.env.NODE_ENV === 'production') {
111
- // url = `/${this.model.stockAlias}/webmeteruploadapi/resource`
112
- // }
113
- post('/webmeterresourceapi/upload', formData, { headers }).then(res => {
114
- // 根据服务端返回的结果判断成功与否,设置文件条目的状态
115
- if (res.success) {
116
- fileInfo.status = 'done'
117
- fileInfo.response = JSON.parse(res.data)
118
- fileInfo.id = JSON.parse(res.data).id
119
- fileInfo.url = JSON.parse(res.data).f_downloadpath
120
- this.$emit('setFiles', this.uploadedFileList.filter(item => item.status === 'done').map(item => item.id))
121
- this.$message.success('上传成功!')
122
- } else {
123
- fileInfo.status = 'error'
124
- fileInfo.response = res.data
125
- this.$message.error('上传失败!')
126
- }
127
- }).catch((e) => {
128
- fileInfo.status = 'error'
129
- fileInfo.response = e
130
- this.$message.error(`请求失败!${e}`)
131
- })
132
- },
133
- // 删除文件
134
- deleteFileItem (file) {
135
- if (file.id) {
136
- post('/rs/entity/t_files', { id: file.id, f_state: '删除' }).then(res => {
137
- }).catch(e => { })
138
- }
139
- // 找到当前文件所在列表的索引
140
- const index = this.uploadedFileList.indexOf(file)
141
- // 从列表中移除该文件
142
- this.uploadedFileList.splice(index, 1)
143
- this.$emit('setFiles', this.uploadedFileList.filter(item => item.status === 'done').map(item => item.id))
144
- return true
145
- }
146
- }
147
- }
148
- </script>
149
- <style lang="less" scoped>
150
-
151
- </style>
1
+ <template>
2
+ <div>
3
+ <a-upload-dragger
4
+ v-if="model.type === 'file'"
5
+ name="file"
6
+ :multiple="true"
7
+ :accept="model.accept.join('')"
8
+ :remove="deleteFileItem"
9
+ :customRequest="uploadFiles"
10
+ :file-list="uploadedFileList">
11
+ <p class="ant-upload-drag-icon">
12
+ <a-icon type="inbox"/>
13
+ </p>
14
+ <p class="ant-upload-text">
15
+ 点击或拖动文件到该区域上传
16
+ </p>
17
+ <p class="ant-upload-hint">
18
+ 支持单个或多个文件
19
+ </p>
20
+ </a-upload-dragger>
21
+ <a-upload
22
+ v-if=" model.type === 'image'"
23
+ list-type="picture-card"
24
+ :accept="model.accept.join('')"
25
+ :customRequest="uploadFiles"
26
+ :remove="deleteFileItem"
27
+ :file-list="uploadedFileList">
28
+ <a-icon type="plus"/>
29
+ <div class="ant-upload-text">
30
+ Upload
31
+ </div>
32
+ </a-upload>
33
+ </div>
34
+ </template>
35
+
36
+ <script>
37
+
38
+ import { post } from '@vue2-client/services/api'
39
+ import { mapState } from 'vuex'
40
+
41
+ export default {
42
+ name: 'uploads',
43
+ data () {
44
+ return {
45
+ uploadedFileList: [],
46
+ }
47
+ },
48
+ props: {
49
+ // 表单属性
50
+ model: {
51
+ type: Object,
52
+ default: () => {
53
+ return {}
54
+ }
55
+ },
56
+ files: {
57
+ type: Array,
58
+ default: () => {
59
+ return []
60
+ }
61
+ },
62
+ images: {
63
+ type: Array,
64
+ default: () => {
65
+ return []
66
+ }
67
+ }
68
+ },
69
+ computed: {
70
+ ...mapState('account', { currUser: 'user' })
71
+ },
72
+ created () {
73
+ this.uploadedFileList = this.model.type === 'file' ? [...this.files] : [...this.images]
74
+ },
75
+ methods: {
76
+ uploadFiles (info) {
77
+ if (this.uploadedFileList.length >= this.model.acceptCount) {
78
+ this.$message.error(`当前表单限制仅可上传 ${this.model.acceptCount} 个文件`)
79
+ return
80
+ }
81
+ // 初始化文件信息
82
+ const fileInfo = {
83
+ uid: info.file.uid,
84
+ name: info.file.name,
85
+ status: 'uploading',
86
+ response: '',
87
+ url: '',
88
+ }
89
+ // 放入上传列表中,以便于显示上传进度
90
+ this.uploadedFileList.push(fileInfo)
91
+ // 组装上传数据
92
+ const headers = {
93
+ 'Content-Type': 'multipart/form-data',
94
+ }
95
+ // TODO 暂时给默认值 基础表单调整好后处理
96
+ const formData = new FormData()
97
+ formData.append('avatar', info.file)
98
+ formData.append('resUploadMode', this.model.resUploadMode ?? 'server')
99
+ if (this.model.pathKey) {
100
+ formData.append('pathKey', this.model.pathKey ?? 'Default')
101
+ }
102
+ // formData.append('stockAlias', this.model.stockAlias)
103
+ formData.append('formType', this.model.type)
104
+ formData.append('useType', this.model.useType ?? 'Default')
105
+ formData.append('resUploadStock', this.model.resUploadStock)
106
+ formData.append('filename', info.file.name)
107
+ formData.append('filesize', (info.file.size / 1024 / 1024).toFixed(4))
108
+ formData.append('f_operator', this.currUser ? this.currUser.username : '')
109
+
110
+ // const url = '/webmeteruploadapi/resource'
111
+ // if (process.env.NODE_ENV === 'production') {
112
+ // url = `/${this.model.stockAlias}/webmeteruploadapi/resource`
113
+ // }
114
+ post('/webmeterresourceapi/upload', formData, { headers }).then(res => {
115
+ // 根据服务端返回的结果判断成功与否,设置文件条目的状态
116
+ if (res.success) {
117
+ fileInfo.status = 'done'
118
+ fileInfo.response = JSON.parse(res.data)
119
+ fileInfo.id = JSON.parse(res.data).id
120
+ fileInfo.url = JSON.parse(res.data).f_downloadpath
121
+ this.$emit('setFiles', this.uploadedFileList.filter(item => item.status === 'done').map(item => item.id))
122
+ this.$message.success('上传成功!')
123
+ } else {
124
+ fileInfo.status = 'error'
125
+ fileInfo.response = res.data
126
+ this.$message.error('上传失败!')
127
+ }
128
+ }).catch((e) => {
129
+ fileInfo.status = 'error'
130
+ fileInfo.response = e
131
+ this.$message.error(`请求失败!${e}`)
132
+ })
133
+ },
134
+ // 删除文件
135
+ deleteFileItem (file) {
136
+ if (file.id) {
137
+ post('/rs/entity/t_files', { id: file.id, f_state: '删除' }).then(res => {
138
+ }).catch(e => { })
139
+ }
140
+ // 找到当前文件所在列表的索引
141
+ const index = this.uploadedFileList.indexOf(file)
142
+ // 从列表中移除该文件
143
+ this.uploadedFileList.splice(index, 1)
144
+ this.$emit('setFiles', this.uploadedFileList.filter(item => item.status === 'done').map(item => item.id))
145
+ return true
146
+ }
147
+ }
148
+ }
149
+ </script>
150
+ <style lang="less" scoped>
151
+
152
+ </style>