vue2-client 1.7.11 → 1.7.13

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,210 +1,210 @@
1
- <template>
2
- <div>
3
- <a-input
4
- @click="inputClick"
5
- :value="valueView"
6
- style="cursor:pointer"
7
- readOnly/>
8
- <a-modal
9
- v-if="visible"
10
- v-model="visible"
11
- :title="placeholder"
12
- :z-index="1031"
13
- :bodyStyle="{ maxHeight: '68vh', overflowY: 'auto' }"
14
- @ok="handleOk"
15
- @close="visible=false"
16
- >
17
- <!-- 搜索框 -->
18
- <a-input-search :value="searchValue" style="margin-bottom: 8px" placeholder="搜索" @change="handleSearch"/>
19
- <!-- 树形图 -->
20
- <a-tree
21
- v-model="checkedKeys"
22
- :expanded-keys="expandedKeys"
23
- :selectable="false"
24
- checkable
25
- @expand="onExpand"
26
- >
27
- <!-- department -->
28
- <a-tree-node
29
- v-for="department in treeData"
30
- v-show="!department.hidden"
31
- :key="department.key"
32
- :title="department.title">
33
- <!-- person -->
34
- <a-tree-node v-for="person in department.children" v-show="!person.hidden" :key="person.key">
35
- <!-- 搜索关键词红色 -->
36
- <template slot="title">
37
- <span v-if="person.title.indexOf(searchValue) > -1">
38
- {{ person.title.substr(0, person.title.indexOf(searchValue)) }}
39
- <span style="color: #f50">{{ searchValue }}</span>
40
- {{ person.title.substr(person.title.indexOf(searchValue) + searchValue.length) }}
41
- </span>
42
- <span v-else>{{ person.title }}</span>
43
- </template>
44
- </a-tree-node>
45
- </a-tree-node>
46
- </a-tree>
47
- </a-modal>
48
- </div>
49
- </template>
50
-
51
- <script>
52
- import { commonApi, post } from '@vue2-client/services/api'
53
-
54
- const departments = ['运维部', '项目部', '项目一部', '项目二部', '开发部', '售后部', '办公室', '管理员', '软件工程部', 'IC卡部', '销售部']
55
-
56
- export default {
57
- name: 'PersonSetting',
58
- data () {
59
- return {
60
- searchValue: '',
61
- treeData: [],
62
- checkedKeys: [],
63
- expandedKeys: [],
64
- sourceTreeData: [],
65
- visible: false,
66
- valueView: this.placeholder
67
- }
68
- },
69
- props: {
70
- buttonText: {
71
- type: String,
72
- default: '选择人员'
73
- },
74
- placeholder: {
75
- type: String,
76
- default: '请选择人员'
77
- },
78
- value: {
79
- type: Array,
80
- default: () => []
81
- },
82
- // // 返回数据类型 String,Array 发现返回类型只能有一个
83
- // type: {
84
- // type: String,
85
- // default: 'Array'
86
- // },
87
- // 返回数据字段 name , id
88
- field: {
89
- type: String,
90
- default: 'name'
91
- },
92
- },
93
- model: {
94
- prop: 'value',
95
- event: 'onOk'
96
- },
97
- watch: {},
98
- components: {},
99
- created () {
100
- post(commonApi.getEmpTree, {}).then(res => {
101
- this.sourceTreeData = res
102
- })
103
- },
104
- methods: {
105
- inputClick () {
106
- this.visible = true
107
- this.searchValue = ''
108
- this.treeData = this.sourceTreeData
109
- if (this.value.length > 0) {
110
- this.checkedKeys = this.getCheckedKeys(this.value)
111
- }
112
- this.expandedKeys = []
113
- },
114
- // 获取选择得key
115
- getCheckedKeys (arr) {
116
- const brr = []
117
- this.treeData.forEach(item => {
118
- adaptToChildrenList(item)
119
- })
120
- function adaptToChildrenList (o) {
121
- if (arr.some(item => o.key.indexOf(item) > -1)) {
122
- brr.push(o.key)
123
- }
124
- if (o.children) {
125
- for (const c of o.children) {
126
- adaptToChildrenList(c)
127
- }
128
- }
129
- }
130
- return brr
131
- },
132
- handleOk () {
133
- this.$emit('onOk', this.allPerson())
134
- this.visible = false
135
- },
136
- onExpand (expandedKeys) {
137
- this.expandedKeys = expandedKeys
138
- },
139
- // 搜索处理
140
- handleSearch (e) {
141
- const value = e.target.value.trim()
142
- if (!value) {
143
- this.treeData = this.sourceTreeData
144
- this.expandedKeys = []
145
- this.searchValue = ''
146
- return
147
- }
148
- const expandedKeys = []
149
- const treeData = JSON.parse(JSON.stringify(this.sourceTreeData))
150
- // 过滤结果
151
- for (const department of treeData) {
152
- if (department.key.includes(value)) {
153
- continue
154
- }
155
- let hasChildren = false
156
- if (department.children) {
157
- for (const person of department.children) {
158
- if (!person.key.includes(value)) {
159
- person.hidden = true
160
- } else {
161
- hasChildren = true
162
- }
163
- }
164
- }
165
- if (!hasChildren) {
166
- department.hidden = true
167
- } else {
168
- expandedKeys.push(department.key)
169
- }
170
- }
171
- this.treeData = treeData
172
- this.expandedKeys = expandedKeys
173
- this.searchValue = value
174
- },
175
- allPerson () {
176
- const index = this.type === 'id' ? 1 : 0
177
- const _allPerson = this.checkedKeys.filter(value => !departments.includes(value)).map(item => item.split('_')[index])
178
- this.valueView = this.checkedKeys.filter(value => !departments.includes(value)).map(item => item.split('_')[0]).join(',')
179
- return _allPerson
180
- }
181
- },
182
- }
183
- </script>
184
- <style lang="less" scoped>
185
- .ant-tree-title {
186
- width: 100%;
187
- }
188
-
189
- .title {
190
- float: left;
191
- }
192
-
193
- .ant-card-body {
194
- :global {
195
- .ant-tree {
196
- line-height: 3;
197
-
198
- li {
199
- position: relative;
200
- }
201
- }
202
- }
203
- }
204
-
205
- .ant-card-body .but_type {
206
- float: right;
207
- position: absolute;
208
- right: 40px;
209
- }
210
- </style>
1
+ <template>
2
+ <div>
3
+ <a-input
4
+ @click="inputClick"
5
+ :value="valueView"
6
+ style="cursor:pointer"
7
+ readOnly/>
8
+ <a-modal
9
+ v-if="visible"
10
+ v-model="visible"
11
+ :title="placeholder"
12
+ :z-index="1031"
13
+ :bodyStyle="{ maxHeight: '68vh', overflowY: 'auto' }"
14
+ @ok="handleOk"
15
+ @close="visible=false"
16
+ >
17
+ <!-- 搜索框 -->
18
+ <a-input-search :value="searchValue" style="margin-bottom: 8px" placeholder="搜索" @change="handleSearch"/>
19
+ <!-- 树形图 -->
20
+ <a-tree
21
+ v-model="checkedKeys"
22
+ :expanded-keys="expandedKeys"
23
+ :selectable="false"
24
+ checkable
25
+ @expand="onExpand"
26
+ >
27
+ <!-- department -->
28
+ <a-tree-node
29
+ v-for="department in treeData"
30
+ v-show="!department.hidden"
31
+ :key="department.key"
32
+ :title="department.title">
33
+ <!-- person -->
34
+ <a-tree-node v-for="person in department.children" v-show="!person.hidden" :key="person.key">
35
+ <!-- 搜索关键词红色 -->
36
+ <template slot="title">
37
+ <span v-if="person.title.indexOf(searchValue) > -1">
38
+ {{ person.title.substr(0, person.title.indexOf(searchValue)) }}
39
+ <span style="color: #f50">{{ searchValue }}</span>
40
+ {{ person.title.substr(person.title.indexOf(searchValue) + searchValue.length) }}
41
+ </span>
42
+ <span v-else>{{ person.title }}</span>
43
+ </template>
44
+ </a-tree-node>
45
+ </a-tree-node>
46
+ </a-tree>
47
+ </a-modal>
48
+ </div>
49
+ </template>
50
+
51
+ <script>
52
+ import { commonApi, post } from '@vue2-client/services/api'
53
+
54
+ const departments = ['运维部', '项目部', '项目一部', '项目二部', '开发部', '售后部', '办公室', '管理员', '软件工程部', 'IC卡部', '销售部']
55
+
56
+ export default {
57
+ name: 'PersonSetting',
58
+ data () {
59
+ return {
60
+ searchValue: '',
61
+ treeData: [],
62
+ checkedKeys: [],
63
+ expandedKeys: [],
64
+ sourceTreeData: [],
65
+ visible: false,
66
+ valueView: this.placeholder
67
+ }
68
+ },
69
+ props: {
70
+ buttonText: {
71
+ type: String,
72
+ default: '选择人员'
73
+ },
74
+ placeholder: {
75
+ type: String,
76
+ default: '请选择人员'
77
+ },
78
+ value: {
79
+ type: Array,
80
+ default: () => []
81
+ },
82
+ // // 返回数据类型 String,Array 发现返回类型只能有一个
83
+ // type: {
84
+ // type: String,
85
+ // default: 'Array'
86
+ // },
87
+ // 返回数据字段 name , id
88
+ field: {
89
+ type: String,
90
+ default: 'name'
91
+ },
92
+ },
93
+ model: {
94
+ prop: 'value',
95
+ event: 'onOk'
96
+ },
97
+ watch: {},
98
+ components: {},
99
+ created () {
100
+ post(commonApi.getEmpTree, {}).then(res => {
101
+ this.sourceTreeData = res
102
+ })
103
+ },
104
+ methods: {
105
+ inputClick () {
106
+ this.visible = true
107
+ this.searchValue = ''
108
+ this.treeData = this.sourceTreeData
109
+ if (this.value.length > 0) {
110
+ this.checkedKeys = this.getCheckedKeys(this.value)
111
+ }
112
+ this.expandedKeys = []
113
+ },
114
+ // 获取选择得key
115
+ getCheckedKeys (arr) {
116
+ const brr = []
117
+ this.treeData.forEach(item => {
118
+ adaptToChildrenList(item)
119
+ })
120
+ function adaptToChildrenList (o) {
121
+ if (arr.some(item => o.key.indexOf(item) > -1)) {
122
+ brr.push(o.key)
123
+ }
124
+ if (o.children) {
125
+ for (const c of o.children) {
126
+ adaptToChildrenList(c)
127
+ }
128
+ }
129
+ }
130
+ return brr
131
+ },
132
+ handleOk () {
133
+ this.$emit('onOk', this.allPerson())
134
+ this.visible = false
135
+ },
136
+ onExpand (expandedKeys) {
137
+ this.expandedKeys = expandedKeys
138
+ },
139
+ // 搜索处理
140
+ handleSearch (e) {
141
+ const value = e.target.value.trim()
142
+ if (!value) {
143
+ this.treeData = this.sourceTreeData
144
+ this.expandedKeys = []
145
+ this.searchValue = ''
146
+ return
147
+ }
148
+ const expandedKeys = []
149
+ const treeData = JSON.parse(JSON.stringify(this.sourceTreeData))
150
+ // 过滤结果
151
+ for (const department of treeData) {
152
+ if (department.key.includes(value)) {
153
+ continue
154
+ }
155
+ let hasChildren = false
156
+ if (department.children) {
157
+ for (const person of department.children) {
158
+ if (!person.key.includes(value)) {
159
+ person.hidden = true
160
+ } else {
161
+ hasChildren = true
162
+ }
163
+ }
164
+ }
165
+ if (!hasChildren) {
166
+ department.hidden = true
167
+ } else {
168
+ expandedKeys.push(department.key)
169
+ }
170
+ }
171
+ this.treeData = treeData
172
+ this.expandedKeys = expandedKeys
173
+ this.searchValue = value
174
+ },
175
+ allPerson () {
176
+ const index = this.type === 'id' ? 1 : 0
177
+ const _allPerson = this.checkedKeys.filter(value => !departments.includes(value)).map(item => item.split('_')[index])
178
+ this.valueView = this.checkedKeys.filter(value => !departments.includes(value)).map(item => item.split('_')[0]).join(',')
179
+ return _allPerson
180
+ }
181
+ },
182
+ }
183
+ </script>
184
+ <style lang="less" scoped>
185
+ .ant-tree-title {
186
+ width: 100%;
187
+ }
188
+
189
+ .title {
190
+ float: left;
191
+ }
192
+
193
+ .ant-card-body {
194
+ :global {
195
+ .ant-tree {
196
+ line-height: 3;
197
+
198
+ li {
199
+ position: relative;
200
+ }
201
+ }
202
+ }
203
+ }
204
+
205
+ .ant-card-body .but_type {
206
+ float: right;
207
+ position: absolute;
208
+ right: 40px;
209
+ }
210
+ </style>
@@ -1,3 +1,3 @@
1
- import PersonSetting from './PersonSetting'
2
-
3
- export default PersonSetting
1
+ import PersonSetting from './PersonSetting'
2
+
3
+ export default PersonSetting
@@ -1,3 +1,3 @@
1
- import Upload from './Upload'
2
-
3
- export default Upload
1
+ import Upload from './Upload'
2
+
3
+ export default Upload
@@ -2,46 +2,53 @@
2
2
  <div>
3
3
  <a-skeleton :loading="loading" :paragraph="{ rows: 4 }" />
4
4
  <div v-show="!loading">
5
- <x-add-form
6
- ref="xAddForm"
7
- @onSubmit="onAddOrEditSubmit"
8
- />
9
- <x-form
10
- ref="xForm"
11
- style="margin-bottom: 14px;"
12
- @onSubmit="onSearchSubmit">
13
- <slot name="formBtnExpand"></slot>
14
- </x-form>
15
- <x-table
16
- ref="xTable"
17
- :fixedQueryForm="fixedQueryForm"
18
- :queryParamsName="queryParamsName"
19
- :query-params-json="queryParamsJson"
20
- :show-pagination="showPagination"
21
- @add="add"
22
- @edit="edit"
23
- @afterDelete="afterDelete"
24
- @action="action"
25
- @selectRow="selectRow"
26
- @afterQuery="afterQuery"
27
- @tempTableEdit="tempTableEdit">
28
- <template slot="leftButton" slot-scope="{selectedRowKeys, selectedRows}">
29
- <slot name="leftButton" :selectedRowKeys="selectedRowKeys" :selectedRows="selectedRows"></slot>
30
- </template>
31
- <template slot="button" slot-scope="{selectedRowKeys, selectedRows}">
32
- <slot name="button" :selectedRowKeys="selectedRowKeys" :selectedRows="selectedRows"></slot>
33
- </template>
34
- <template slot="rightBtnExpand" slot-scope="{selectedRowKeys, selectedRows}">
35
- <slot name="rightBtnExpand" :selectedRowKeys="selectedRowKeys" :selectedRows="selectedRows"></slot>
36
- <a-button @click="toggleIsFormShow">
37
- <a-icon :style="iconStyle" type="vertical-align-top"/>
38
- </a-button>
39
- </template>
40
- <!-- 底部插槽 -->
41
- <template slot="footer" slot-scope="{selectedRowKeys, selectedRows}">
42
- <slot name="footer" :selectedRowKeys="selectedRowKeys" :selectedRows="selectedRows"></slot>
43
- </template>
44
- </x-table>
5
+ <template v-if="!loadError">
6
+ <x-add-form
7
+ ref="xAddForm"
8
+ @onSubmit="onAddOrEditSubmit"
9
+ />
10
+ <x-form
11
+ ref="xForm"
12
+ style="margin-bottom: 14px;"
13
+ @onSubmit="onSearchSubmit">
14
+ <slot name="formBtnExpand"></slot>
15
+ </x-form>
16
+ <x-table
17
+ ref="xTable"
18
+ :fixedQueryForm="fixedQueryForm"
19
+ :queryParamsName="queryParamsName"
20
+ :query-params-json="queryParamsJson"
21
+ :show-pagination="showPagination"
22
+ @add="add"
23
+ @edit="edit"
24
+ @afterDelete="afterDelete"
25
+ @action="action"
26
+ @selectRow="selectRow"
27
+ @afterQuery="afterQuery"
28
+ @tempTableEdit="tempTableEdit">
29
+ <template slot="leftButton" slot-scope="{selectedRowKeys, selectedRows}">
30
+ <slot name="leftButton" :selectedRowKeys="selectedRowKeys" :selectedRows="selectedRows"></slot>
31
+ </template>
32
+ <template slot="button" slot-scope="{selectedRowKeys, selectedRows}">
33
+ <slot name="button" :selectedRowKeys="selectedRowKeys" :selectedRows="selectedRows"></slot>
34
+ </template>
35
+ <template slot="rightBtnExpand" slot-scope="{selectedRowKeys, selectedRows}">
36
+ <slot name="rightBtnExpand" :selectedRowKeys="selectedRowKeys" :selectedRows="selectedRows"></slot>
37
+ <a-button @click="toggleIsFormShow">
38
+ <a-icon :style="iconStyle" type="vertical-align-top"/>
39
+ </a-button>
40
+ </template>
41
+ <!-- 底部插槽 -->
42
+ <template slot="footer" slot-scope="{selectedRowKeys, selectedRows}">
43
+ <slot name="footer" :selectedRowKeys="selectedRowKeys" :selectedRows="selectedRows"></slot>
44
+ </template>
45
+ </x-table>
46
+ </template>
47
+ <template v-else>
48
+ <a-empty>
49
+ <span slot="description"> 页面配置不存在,请联系系统管理员 </span>
50
+ </a-empty>
51
+ </template>
45
52
  </div>
46
53
  </div>
47
54
  </template>
@@ -70,6 +77,7 @@ export default {
70
77
  position: 'relative',
71
78
  top: '1px'
72
79
  },
80
+ loadError: false,
73
81
  // 实际查询配置内容
74
82
  realQueryConfig: {}
75
83
  }
@@ -143,44 +151,51 @@ export default {
143
151
  watch: {
144
152
  logicParam: {
145
153
  handler () {
146
- this.getColumnJsonByLogic()
154
+ this.initConfig()
147
155
  },
148
156
  deep: true
149
157
  },
150
158
  queryParamsJson: {
151
159
  handler () {
152
- this.getConfigBySource()
160
+ this.initConfig()
153
161
  },
154
162
  deep: true
155
163
  },
156
164
  queryParamsName: {
157
165
  handler () {
158
- this.getConfig()
166
+ this.initConfig()
159
167
  }
160
168
  }
161
169
  },
162
170
  created () {
163
- if (this.queryParamsName) {
164
- this.getConfig()
165
- } else if (this.queryParamsJson) {
166
- this.getConfigBySource()
167
- }
171
+ this.initConfig()
168
172
  },
169
173
  methods: {
170
- getConfig () {
174
+ initConfig () {
171
175
  this.loading = true
176
+ this.loadError = false
177
+ if (this.queryParamsName) {
178
+ this.getConfig()
179
+ } else if (this.queryParamsJson) {
180
+ this.getConfigBySource()
181
+ } else if (this.logicName && this.logicParam) {
182
+ this.getColumnJsonByLogic()
183
+ } else {
184
+ this.loading = false
185
+ this.loadError = true
186
+ }
187
+ },
188
+ getConfig () {
172
189
  getConfig(this.queryParamsName, this.serviceName, (res) => {
173
190
  this.updateComponents(res)
174
191
  })
175
192
  },
176
193
  getConfigBySource () {
177
- this.loading = true
178
194
  parseConfig(this.queryParamsJson, 'CRUD_FORM', this.serviceName).then(res => {
179
195
  this.updateComponents(res, true)
180
196
  })
181
197
  },
182
198
  getColumnJsonByLogic () {
183
- this.loading = true
184
199
  getConfigByLogic(this.logicName, this.logicParam, this.serviceName, (res) => {
185
200
  this.updateComponents(res, true)
186
201
  })
@@ -334,15 +349,6 @@ export default {
334
349
  */
335
350
  refreshTable (toFirstPage = true) {
336
351
  this.$refs.xTable.refresh(toFirstPage)
337
- },
338
- /**
339
- * 设置固定查询表单
340
- */
341
- setFixedQueryForm (form, isRefreshTable) {
342
- this.fixedQueryForm = form
343
- if (isRefreshTable) {
344
- this.refreshTable(true)
345
- }
346
352
  }
347
353
  }
348
354
  }
@@ -324,7 +324,9 @@ export default {
324
324
  * 如果参数为 true, 则强制刷新到第一页
325
325
  */
326
326
  refresh (bool) {
327
- this.$refs.table.refresh(bool)
327
+ this.$nextTick(() => {
328
+ this.$refs.table.refresh(bool)
329
+ })
328
330
  },
329
331
  /**
330
332
  * 格式化日期