vue2-client 1.2.29 → 1.2.32-test

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.
@@ -1,113 +1,113 @@
1
- <template>
2
- <a-list
3
- :data-source="model.rows"
4
- :bordered="bordered"
5
- v-infinite-scroll="handleInfiniteOnLoad"
6
- class="srcoll-list-infinite-container"
7
- :infinite-scroll-disabled="busy"
8
- :infinite-scroll-distance="distance"
9
- >
10
- <a-list-item slot="renderItem" class="srcoll_list_li" slot-scope="item,index" @click="selectItem(index,item)">
11
- <slot :item="item" :index="index" >
12
- </slot>
13
- </a-list-item>
14
- <div v-if="loading && !busy" class="srcoll-list-loading-container">
15
- <a-spin />
16
- </div>
17
- </a-list>
18
- </template>
19
-
20
- <script>
21
- import infiniteScroll from 'vue-infinite-scroll'
22
- import { post } from '@vue2-client/services/api/restTools'
23
-
24
- export default {
25
- name: 'SrcollList1',
26
- directives: { infiniteScroll },
27
- props: {
28
- 'busy': { // 是否执行回调
29
- type: Boolean,
30
- default: false
31
- },
32
- 'distance': { // 距底部多少像素触发回调
33
- type: Number,
34
- default: 1
35
- },
36
- 'bordered': { // 是否显示列表边框
37
- type: Boolean,
38
- default: true
39
- },
40
- 'model': {
41
- type: Object,
42
- default: () => {
43
- return {}
44
- }
45
- }
46
- },
47
- data () {
48
- return {
49
- selectRow: {},
50
- loading: false
51
- }
52
- },
53
- mounted () {
54
- },
55
- methods: {
56
- selectItem (index, item) {
57
- this.$emit('selectItem', index, item)
58
- },
59
- handleInfiniteOnLoad () {
60
- this.loading = true
61
- if (this.model.pageNo < this.model.totalPage || this.model.pageNo == 0) {
62
- this.model.pageNo = this.model.pageNo + 1
63
- post(this.model.url, { data: this.model }).then((res) => {
64
- this.model.rows = this.model.rows.concat(res.data).map((item, index) => ({ ...item, index }))
65
- this.loading = false
66
- this.model.totalPage = res.totalPage
67
- this.model.totalCount = res.totalCount
68
- })
69
- } else {
70
- this.loading = false
71
- }
72
- },
73
- search () {
74
- this.model.pageNo = 0
75
- this.model.rows = []
76
- this.handleInfiniteOnLoad()
77
- }
78
- }
79
- }
80
- </script>
81
-
82
- <style scoped>
83
- .srcoll-list-infinite-container {
84
- border-radius: 4px;
85
- height: 100%;
86
- overflow-y: scroll;
87
- }
88
- /*滚动条样式*/
89
- .srcoll-list-infinite-container::-webkit-scrollbar {
90
- width: 4px;
91
- /*height: 4px;*/
92
- }
93
- .srcoll-list-infinite-container::-webkit-scrollbar-thumb {
94
- border-radius: 10px;
95
- -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
96
- background: rgba(0,0,0,0.2);
97
- }
98
- .srcoll-list-infinite-container::-webkit-scrollbar-track {
99
- -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
100
- border-radius: 0;
101
- background: rgba(0,0,0,0.1);
102
-
103
- }
104
- .srcoll-list-loading-container {
105
- position: absolute;
106
- bottom: 10%;
107
- width: 100%;
108
- text-align: center;
109
- }
110
- .srcoll_list_li:hover{
111
- background-color: rgb(203,234,241);
112
- }
113
- </style>
1
+ <template>
2
+ <a-list
3
+ :data-source="model.rows"
4
+ :bordered="bordered"
5
+ v-infinite-scroll="handleInfiniteOnLoad"
6
+ class="srcoll-list-infinite-container"
7
+ :infinite-scroll-disabled="busy"
8
+ :infinite-scroll-distance="distance"
9
+ >
10
+ <a-list-item slot="renderItem" class="srcoll_list_li" slot-scope="item,index" @click="selectItem(index,item)">
11
+ <slot :item="item" :index="index" >
12
+ </slot>
13
+ </a-list-item>
14
+ <div v-if="loading && !busy" class="srcoll-list-loading-container">
15
+ <a-spin />
16
+ </div>
17
+ </a-list>
18
+ </template>
19
+
20
+ <script>
21
+ import infiniteScroll from 'vue-infinite-scroll'
22
+ import { post } from '@vue2-client/services/api/restTools'
23
+
24
+ export default {
25
+ name: 'SrcollList1',
26
+ directives: { infiniteScroll },
27
+ props: {
28
+ 'busy': { // 是否执行回调
29
+ type: Boolean,
30
+ default: false
31
+ },
32
+ 'distance': { // 距底部多少像素触发回调
33
+ type: Number,
34
+ default: 1
35
+ },
36
+ 'bordered': { // 是否显示列表边框
37
+ type: Boolean,
38
+ default: true
39
+ },
40
+ 'model': {
41
+ type: Object,
42
+ default: () => {
43
+ return {}
44
+ }
45
+ }
46
+ },
47
+ data () {
48
+ return {
49
+ selectRow: {},
50
+ loading: false
51
+ }
52
+ },
53
+ mounted () {
54
+ },
55
+ methods: {
56
+ selectItem (index, item) {
57
+ this.$emit('selectItem', index, item)
58
+ },
59
+ handleInfiniteOnLoad () {
60
+ this.loading = true
61
+ if (this.model.pageNo < this.model.totalPage || this.model.pageNo == 0) {
62
+ this.model.pageNo = this.model.pageNo + 1
63
+ post(this.model.url, { data: this.model }).then((res) => {
64
+ this.model.rows = this.model.rows.concat(res.data).map((item, index) => ({ ...item, index }))
65
+ this.loading = false
66
+ this.model.totalPage = res.totalPage
67
+ this.model.totalCount = res.totalCount
68
+ })
69
+ } else {
70
+ this.loading = false
71
+ }
72
+ },
73
+ search () {
74
+ this.model.pageNo = 0
75
+ this.model.rows = []
76
+ this.handleInfiniteOnLoad()
77
+ }
78
+ }
79
+ }
80
+ </script>
81
+
82
+ <style scoped>
83
+ .srcoll-list-infinite-container {
84
+ border-radius: 4px;
85
+ height: 100%;
86
+ overflow-y: scroll;
87
+ }
88
+ /*滚动条样式*/
89
+ .srcoll-list-infinite-container::-webkit-scrollbar {
90
+ width: 4px;
91
+ /*height: 4px;*/
92
+ }
93
+ .srcoll-list-infinite-container::-webkit-scrollbar-thumb {
94
+ border-radius: 10px;
95
+ -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
96
+ background: rgba(0,0,0,0.2);
97
+ }
98
+ .srcoll-list-infinite-container::-webkit-scrollbar-track {
99
+ -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
100
+ border-radius: 0;
101
+ background: rgba(0,0,0,0.1);
102
+
103
+ }
104
+ .srcoll-list-loading-container {
105
+ position: absolute;
106
+ bottom: 10%;
107
+ width: 100%;
108
+ text-align: center;
109
+ }
110
+ .srcoll_list_li:hover{
111
+ background-color: rgb(203,234,241);
112
+ }
113
+ </style>
@@ -1,3 +1,3 @@
1
- import SrcollList from './SrcollList'
2
-
3
- export default SrcollList
1
+ import SrcollList from './SrcollList'
2
+
3
+ export default SrcollList
@@ -0,0 +1,119 @@
1
+ <template>
2
+ <div>
3
+ <a-upload-dragger
4
+ v-if="model.type === 'file'"
5
+ name="file"
6
+ :multiple="true"
7
+ :remove="deleteFileItem"
8
+ :customRequest="uploadFiles"
9
+ :file-list="uploadedFileList">
10
+ <p class="ant-upload-drag-icon">
11
+ <a-icon type="inbox"/>
12
+ </p>
13
+ <p class="ant-upload-text">
14
+ 点击或拖动文件到该区域上传
15
+ </p>
16
+ <p class="ant-upload-hint">
17
+ 支持单个或多个文件
18
+ </p>
19
+ </a-upload-dragger>
20
+ <a-upload
21
+ v-if=" model.type === 'image'"
22
+ list-type="picture-card"
23
+ :customRequest="uploadFiles"
24
+ :remove="deleteFileItem"
25
+ :file-list="uploadedFileList">
26
+ <a-icon type="plus"/>
27
+ <div class="ant-upload-text">
28
+ Upload
29
+ </div>
30
+ </a-upload>
31
+ </div>
32
+ </template>
33
+
34
+ <script>
35
+
36
+ import { post } from '@/services/api'
37
+ import { mapState } from 'vuex'
38
+
39
+ export default {
40
+ name: 'uploads',
41
+ data () {
42
+ return {
43
+ uploadedFileList: [],
44
+ }
45
+ },
46
+ props: {
47
+ // 表单属性
48
+ model: {
49
+ type: Object,
50
+ default: () => {
51
+ return {}
52
+ }
53
+ }
54
+ },
55
+ computed: {
56
+ ...mapState('account', { currUser: 'user' })
57
+ },
58
+ methods: {
59
+ async uploadFiles (info) {
60
+ // 初始化文件信息
61
+ const fileInfo = {
62
+ uid: info.file.uid,
63
+ name: info.file.name,
64
+ status: 'uploading',
65
+ response: '',
66
+ url: '',
67
+ }
68
+ // 放入上传列表中,以便于显示上传进度
69
+ this.uploadedFileList.push(fileInfo)
70
+ // 组装上传数据
71
+ const headers = {
72
+ 'Content-Type': 'multipart/form-data',
73
+ }
74
+ const formData = new FormData()
75
+ formData.append('avatar', info.file)
76
+ formData.append('resUploadMode', this.model.resUploadMode)
77
+ if (this.model.pathKey) {
78
+ formData.append('pathKey', this.model.pathKey)
79
+ }
80
+ formData.append('stockAlias', this.model.stockAlias)
81
+ formData.append('resUploadStock', this.model.resUploadStock)
82
+ formData.append('filename', info.file.name)
83
+ formData.append('filesize', (info.file.size / 1024 / 1024).toFixed(4))
84
+ formData.append('f_operator', this.currUser.username)
85
+
86
+ let url = '/webmeteruploadapi/upload'
87
+ if (process.env.NODE_ENV === 'production') {
88
+ url = `/${this.model.stockAlias}/webmeteruploadapi/upload`
89
+ }
90
+ const res = await post(url, formData, { headers })
91
+ // 根据服务端返回的结果判断成功与否,设置文件条目的状态
92
+ if (res.success) {
93
+ fileInfo.status = 'done'
94
+ fileInfo.response = JSON.parse(res.data)
95
+ fileInfo.id = JSON.parse(res.data).id
96
+ fileInfo.url = JSON.parse(res.data).f_downloadpath
97
+ this.$emit('setFiles', this.uploadedFileList.filter(item => item.status === 'done').map(item => item.id))
98
+ this.$message.success('上传成功!')
99
+ } else {
100
+ fileInfo.status = 'error'
101
+ fileInfo.response = res.data
102
+ this.$message.error('上传失败!')
103
+ }
104
+ },
105
+ // 删除文件
106
+ deleteFileItem (file) {
107
+ // 找到当前文件所在列表的索引
108
+ const index = this.uploadedFileList.indexOf(file)
109
+ // 从列表中移除该文件
110
+ this.uploadedFileList.splice(index, 1)
111
+ this.$emit('setFiles', this.uploadedFileList.filter(item => item.status === 'done').map(item => item.id))
112
+ return true
113
+ }
114
+ }
115
+ }
116
+ </script>
117
+ <style lang="less" scoped>
118
+
119
+ </style>
@@ -0,0 +1,3 @@
1
+ import Upload from './Upload'
2
+
3
+ export default Upload