adtec-core-package 0.4.0 → 0.4.2

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.
Files changed (207) hide show
  1. package/.editorconfig +6 -6
  2. package/.prettierrc.json +7 -7
  3. package/.vscode/extensions.json +8 -8
  4. package/README.en.md +36 -36
  5. package/README.md +39 -39
  6. package/env.d.ts +1 -1
  7. package/eslint.config.js +56 -56
  8. package/index.html +13 -13
  9. package/package.json +59 -59
  10. package/src/App.vue +9 -9
  11. package/src/api/BasicApi.ts +17 -17
  12. package/src/api/DocumentApi.ts +27 -27
  13. package/src/api/SysDictCacheApi.ts +26 -26
  14. package/src/api/SysUserApi.ts +35 -35
  15. package/src/api/framework.ts +12 -12
  16. package/src/assets/base.css +86 -86
  17. package/src/assets/logo.svg +1 -1
  18. package/src/assets/main.css +35 -35
  19. package/src/assets/style/ant.scss +19 -19
  20. package/src/assets/style/index.less +180 -180
  21. package/src/assets/style/transition.scss +49 -49
  22. package/src/components/ElFlex/ElFlex.vue +297 -297
  23. package/src/components/OperationAuth/operationAuth.vue +26 -26
  24. package/src/components/Search/ElIconSearch.vue +260 -239
  25. package/src/components/Search/ElSearch.vue +154 -154
  26. package/src/components/Table/ElTableColumnEdit.vue +218 -218
  27. package/src/components/Title/ElTitle.vue +49 -49
  28. package/src/components/autoToolTip/ElAutoToolTip.vue +61 -61
  29. package/src/components/baseEcharts/index.vue +48 -48
  30. package/src/components/business/userSelect.vue +412 -412
  31. package/src/components/icon/ElIconBtn.vue +182 -182
  32. package/src/components/icon/ElIcons.vue +38 -38
  33. package/src/components/upload/ElUploads.vue +286 -279
  34. package/src/components/upload/FileView.vue +158 -158
  35. package/src/components/upload/FileViewComponents.vue +57 -57
  36. package/src/config/ElementPlusConfig.ts +95 -95
  37. package/src/css/elementUI/affix.scss +7 -7
  38. package/src/css/elementUI/alert.scss +115 -115
  39. package/src/css/elementUI/anchor-link.scss +41 -41
  40. package/src/css/elementUI/anchor.scss +88 -88
  41. package/src/css/elementUI/aside.scss +8 -8
  42. package/src/css/elementUI/autocomplete.scss +89 -89
  43. package/src/css/elementUI/avatar.scss +55 -55
  44. package/src/css/elementUI/backtop.scss +29 -29
  45. package/src/css/elementUI/badge.scss +58 -58
  46. package/src/css/elementUI/base.scss +3 -3
  47. package/src/css/elementUI/breadcrumb.scss +62 -62
  48. package/src/css/elementUI/button-group.scss +80 -80
  49. package/src/css/elementUI/button.scss +304 -304
  50. package/src/css/elementUI/calendar.scss +80 -80
  51. package/src/css/elementUI/card.scss +45 -45
  52. package/src/css/elementUI/carousel-item.scss +58 -58
  53. package/src/css/elementUI/carousel.scss +188 -188
  54. package/src/css/elementUI/cascader-panel.scss +138 -138
  55. package/src/css/elementUI/cascader.scss +230 -230
  56. package/src/css/elementUI/check-tag.scss +60 -60
  57. package/src/css/elementUI/checkbox-button.scss +140 -140
  58. package/src/css/elementUI/checkbox-group.scss +7 -7
  59. package/src/css/elementUI/checkbox.scss +298 -298
  60. package/src/css/elementUI/col.scss +48 -48
  61. package/src/css/elementUI/collapse.scss +70 -70
  62. package/src/css/elementUI/color/index.scss +20 -20
  63. package/src/css/elementUI/color-picker.scss +392 -392
  64. package/src/css/elementUI/common/popup.scss +47 -47
  65. package/src/css/elementUI/common/transition.scss +122 -122
  66. package/src/css/elementUI/common/var.scss +1549 -1549
  67. package/src/css/elementUI/container.scss +14 -14
  68. package/src/css/elementUI/dark/css-vars.scss +39 -39
  69. package/src/css/elementUI/dark/var.scss +222 -222
  70. package/src/css/elementUI/date-picker/date-picker.scss +110 -110
  71. package/src/css/elementUI/date-picker/date-range-picker.scss +113 -113
  72. package/src/css/elementUI/date-picker/date-table.scss +158 -158
  73. package/src/css/elementUI/date-picker/month-table.scss +112 -112
  74. package/src/css/elementUI/date-picker/picker-panel.scss +131 -131
  75. package/src/css/elementUI/date-picker/picker.scss +219 -219
  76. package/src/css/elementUI/date-picker/time-picker.scss +90 -90
  77. package/src/css/elementUI/date-picker/time-range-picker.scss +33 -33
  78. package/src/css/elementUI/date-picker/time-spinner.scss +111 -111
  79. package/src/css/elementUI/date-picker/year-table.scss +108 -108
  80. package/src/css/elementUI/date-picker.scss +9 -9
  81. package/src/css/elementUI/descriptions-item.scss +73 -73
  82. package/src/css/elementUI/descriptions.scss +152 -152
  83. package/src/css/elementUI/dialog.scss +199 -199
  84. package/src/css/elementUI/display.scss +12 -12
  85. package/src/css/elementUI/divider.scss +48 -48
  86. package/src/css/elementUI/drawer.scss +164 -164
  87. package/src/css/elementUI/dropdown.scss +208 -208
  88. package/src/css/elementUI/empty.scss +49 -49
  89. package/src/css/elementUI/footer.scss +12 -12
  90. package/src/css/elementUI/form.scss +243 -243
  91. package/src/css/elementUI/header.scss +12 -12
  92. package/src/css/elementUI/icon.scss +45 -45
  93. package/src/css/elementUI/image-viewer.scss +139 -139
  94. package/src/css/elementUI/image.scss +49 -49
  95. package/src/css/elementUI/index.scss +110 -110
  96. package/src/css/elementUI/input-number.scss +178 -178
  97. package/src/css/elementUI/input.scss +478 -478
  98. package/src/css/elementUI/link.scss +90 -90
  99. package/src/css/elementUI/loading.scss +104 -104
  100. package/src/css/elementUI/main.scss +14 -14
  101. package/src/css/elementUI/mention.scss +88 -88
  102. package/src/css/elementUI/menu.scss +339 -339
  103. package/src/css/elementUI/message-box.scss +213 -213
  104. package/src/css/elementUI/message.scss +98 -98
  105. package/src/css/elementUI/mixins/_button.scss +165 -165
  106. package/src/css/elementUI/mixins/_col.scss +33 -33
  107. package/src/css/elementUI/mixins/_var.scss +67 -67
  108. package/src/css/elementUI/mixins/config.scss +5 -5
  109. package/src/css/elementUI/mixins/function.scss +88 -88
  110. package/src/css/elementUI/mixins/mixins.scss +237 -237
  111. package/src/css/elementUI/mixins/utils.scss +39 -39
  112. package/src/css/elementUI/notification.scss +104 -104
  113. package/src/css/elementUI/option-group.scss +33 -33
  114. package/src/css/elementUI/option.scss +71 -71
  115. package/src/css/elementUI/overlay.scss +17 -17
  116. package/src/css/elementUI/page-header.scss +60 -60
  117. package/src/css/elementUI/pagination.scss +238 -238
  118. package/src/css/elementUI/popconfirm.scss +16 -16
  119. package/src/css/elementUI/popover.scss +61 -61
  120. package/src/css/elementUI/popper.scss +106 -106
  121. package/src/css/elementUI/progress.scss +179 -179
  122. package/src/css/elementUI/radio-button.scss +169 -169
  123. package/src/css/elementUI/radio-group.scss +9 -9
  124. package/src/css/elementUI/radio.scss +215 -215
  125. package/src/css/elementUI/rate.scss +108 -108
  126. package/src/css/elementUI/reset.scss +98 -98
  127. package/src/css/elementUI/result.scss +57 -57
  128. package/src/css/elementUI/row.scss +35 -35
  129. package/src/css/elementUI/scrollbar.scss +97 -97
  130. package/src/css/elementUI/segmented.scss +183 -183
  131. package/src/css/elementUI/select-dropdown-v2.scss +1 -1
  132. package/src/css/elementUI/select-dropdown.scss +57 -57
  133. package/src/css/elementUI/select-v2.scss +4 -4
  134. package/src/css/elementUI/select.scss +253 -253
  135. package/src/css/elementUI/skeleton-item.scss +83 -83
  136. package/src/css/elementUI/skeleton.scss +44 -44
  137. package/src/css/elementUI/slider.scss +212 -212
  138. package/src/css/elementUI/space.scss +20 -20
  139. package/src/css/elementUI/spinner.scss +43 -43
  140. package/src/css/elementUI/statistic.scss +35 -35
  141. package/src/css/elementUI/step.scss +316 -316
  142. package/src/css/elementUI/steps.scss +21 -21
  143. package/src/css/elementUI/switch.scss +300 -300
  144. package/src/css/elementUI/table-column.scss +98 -98
  145. package/src/css/elementUI/table-v2.scss +236 -236
  146. package/src/css/elementUI/table.scss +694 -694
  147. package/src/css/elementUI/tabs.scss +659 -659
  148. package/src/css/elementUI/tag.scss +181 -181
  149. package/src/css/elementUI/text.scss +51 -51
  150. package/src/css/elementUI/time-picker.scss +5 -5
  151. package/src/css/elementUI/time-select.scss +37 -37
  152. package/src/css/elementUI/timeline-item.scss +84 -84
  153. package/src/css/elementUI/timeline.scss +46 -46
  154. package/src/css/elementUI/tooltip-v2.scss +95 -95
  155. package/src/css/elementUI/tour.scss +187 -187
  156. package/src/css/elementUI/transfer.scss +203 -203
  157. package/src/css/elementUI/tree-select.scss +41 -41
  158. package/src/css/elementUI/tree.scss +134 -134
  159. package/src/css/elementUI/upload.scss +654 -654
  160. package/src/css/elementUI/var.scss +87 -87
  161. package/src/css/elementUI/virtual-list.scss +40 -40
  162. package/src/directives/vKeydown.ts +93 -93
  163. package/src/hooks/useDictHooks.ts +79 -76
  164. package/src/hooks/useEcharts.ts +58 -58
  165. package/src/hooks/useFileView.ts +34 -34
  166. package/src/hooks/useMessageHooks.ts +132 -132
  167. package/src/hooks/useResetRefHooks.ts +18 -18
  168. package/src/interface/BaseEntity.ts +28 -28
  169. package/src/interface/IMdmDept.ts +82 -82
  170. package/src/interface/IOrgDeptInfo.ts +12 -12
  171. package/src/interface/ISysDictDataCacheVo.ts +46 -46
  172. package/src/interface/ISysDictType.ts +37 -37
  173. package/src/interface/ISysMenuDataVo.ts +22 -22
  174. package/src/interface/ISysMenuInfoVo.ts +83 -83
  175. package/src/interface/ISysMenuOperationVo.ts +21 -21
  176. package/src/interface/ISysUploadFiles.ts +16 -16
  177. package/src/interface/ISysUserInfo.ts +70 -70
  178. package/src/interface/IUserPermissionVo.ts +34 -34
  179. package/src/interface/Message.ts +69 -69
  180. package/src/interface/PageData.ts +17 -17
  181. package/src/interface/ResponseData.ts +16 -16
  182. package/src/interface/dictMapType.ts +11 -11
  183. package/src/interface/enum/FlexEnum.ts +85 -85
  184. package/src/interface/enum/MessageEnum.ts +41 -41
  185. package/src/main.ts +14 -14
  186. package/src/mixin/globalMixin.ts +37 -37
  187. package/src/packages/index.ts +18 -18
  188. package/src/packages/text.vue +13 -13
  189. package/src/plugins/echartsConfig.ts +73 -73
  190. package/src/plugins/plugins.ts +12 -12
  191. package/src/router/index.ts +23 -23
  192. package/src/stores/dictStore.ts +27 -20
  193. package/src/stores/messageStore.ts +49 -49
  194. package/src/stores/permissionStore.ts +108 -108
  195. package/src/stores/storeConfig.ts +23 -23
  196. package/src/stores/userInfoStore.ts +31 -31
  197. package/src/utils/AxiosConfig.ts +216 -216
  198. package/src/utils/encrypt.ts +10 -10
  199. package/src/utils/request.ts +55 -55
  200. package/tsconfig.app.json +12 -12
  201. package/tsconfig.json +11 -11
  202. package/tsconfig.node.json +18 -18
  203. package/vite.config.ts +38 -38
  204. package/adtec-core-package/adtec-core-package.css +0 -1
  205. package/adtec-core-package/adtec-core-package.js +0 -41364
  206. package/adtec-core-package/adtec-core-package.umd.cjs +0 -79
  207. package/adtec-core-package/favicon.ico +0 -0
@@ -1,412 +1,412 @@
1
- <!--创建人 丁盼-->
2
- <!--说明: userSelect 人员选择-->
3
- <!--创建时间: 2024/12/9 上午10:27-->
4
- <!--修改时间: 2024/12/9 上午10:27-->
5
- <template>
6
- <el-drawer
7
- v-if="viewType === 'drawer'"
8
- :title="title"
9
- v-model="dialogVisible"
10
- :destroy-on-close="true"
11
- size="800px"
12
- @close="close"
13
- @open="open"
14
- >
15
- <el-flex :vertical="true" v-loading="loading">
16
- <el-flex :vertical="false">
17
- <el-flex :vertical="true" style="padding-right: 15px">
18
- <el-title title="人员列表" style="border-bottom: var(--border)"> </el-title>
19
- <el-input v-model="filterText" placeholder="请输入用户名称或者编码进行搜索"></el-input>
20
- <el-flex :vertical="true">
21
- <el-tree
22
- style="width: 100%"
23
- :filter-node-method="filterNode"
24
- show-checkbox
25
- ref="ref_tree"
26
- :data="deptUserTree"
27
- @check-change="handleCheckChange"
28
- node-key="id"
29
- :default-expanded-keys="defaultExpandedKeys"
30
- :default-checked-keys="defaultCheckedKeys"
31
- :props="{
32
- label: 'name',
33
- children: 'children',
34
- }"
35
- >
36
- <template #default="{ data }">
37
- <el-flex align="center">
38
- <el-flex align="center" justify="center" width="20px">
39
- <el-icons
40
- model-value="adtec-dept"
41
- v-if="data.type === 'BM'"
42
- :style="{ color: 'var(--el-color-primary)' }"
43
- ></el-icons>
44
- <el-icons
45
- model-value="adtec-user"
46
- v-if="data.type === 'YH'"
47
- :style="{ color: data.sex === '1' ? '#ef5fa6' : 'var(--el-color-primary)' }"
48
- ></el-icons>
49
- </el-flex>
50
- <el-flex align="center">
51
- <el-text v-if="data.type === 'YH'">{{ data.name + `(${data.code})` }}</el-text>
52
- <el-text v-else>{{ data.name }}</el-text>
53
- </el-flex>
54
- </el-flex>
55
- </template>
56
- </el-tree>
57
- </el-flex>
58
- </el-flex>
59
-
60
- <el-flex :vertical="true" style="border-left: var(--border); padding-left: 15px">
61
- <el-title
62
- :title="`已选人员(${selectedUserList.length})`"
63
- style="border-bottom: var(--border); margin-top: 5px"
64
- ></el-title>
65
- <el-flex :vertical="true">
66
- <template v-for="data of selectedUserList" :key="data.id">
67
- <div class="user-select">
68
- <el-flex height="50px" style="border-bottom: var(--border); cursor: pointer">
69
- <el-flex align="center" width="30px">
70
- <el-icons
71
- model-value="adtec-user"
72
- style="font-size: 20px"
73
- :style="{ color: data.sex === '1' ? '#ef5fa6' : 'var(--el-color-primary)' }"
74
- >
75
- </el-icons>
76
- </el-flex>
77
- <el-flex align="center" :vertical="true" justify="flex-start">
78
- <el-flex>
79
- <el-text>{{ data.userName + `(${data.loginName})` }}</el-text>
80
- </el-flex>
81
- <el-flex align="flex-start" height="18px" style="overflow: hidden">
82
- <el-text style="font-size: 12px; opacity: 0.8; margin-bottom: 8px">{{
83
- data.deptName
84
- }}</el-text>
85
- </el-flex>
86
- </el-flex>
87
- <el-flex width="50px" align="center">
88
- <el-icon-btn
89
- @click="handleDelete(data)"
90
- model-value="adtec-close"
91
- style="opacity: 0.8; cursor: pointer"
92
- ></el-icon-btn>
93
- </el-flex>
94
- </el-flex>
95
- </div>
96
- </template>
97
- </el-flex>
98
- </el-flex>
99
- </el-flex>
100
- </el-flex>
101
- <template #footer>
102
- <el-button @click="cancel">取消</el-button>
103
- <el-button type="primary" @click="success">确定</el-button>
104
- </template>
105
- </el-drawer>
106
- <el-dialog
107
- v-else
108
- :title="title"
109
- top="10vh"
110
- v-model="dialogVisible"
111
- width="1000px"
112
- @close="close"
113
- @open="open"
114
- >
115
- <el-flex :vertical="true" v-loading="loading" height="500px">
116
- <el-flex :vertical="false">
117
- <el-flex :vertical="true" style="padding-right: 15px">
118
- <el-title title="人员列表" style="border-bottom: var(--border)"> </el-title>
119
- <el-input v-model="filterText" placeholder="请输入用户名称或者编码进行搜索"></el-input>
120
- <el-flex :vertical="true">
121
- <el-tree
122
- style="width: 100%"
123
- :filter-node-method="filterNode"
124
- show-checkbox
125
- ref="ref_tree"
126
- :data="deptUserTree"
127
- @check-change="handleCheckChange"
128
- node-key="id"
129
- :default-expanded-keys="defaultExpandedKeys"
130
- :default-checked-keys="defaultCheckedKeys"
131
- :props="{
132
- label: 'name',
133
- children: 'children',
134
- }"
135
- >
136
- <template #default="{ data }">
137
- <el-flex align="center">
138
- <el-flex align="center" justify="center" width="20px">
139
- <el-icons
140
- model-value="adtec-dept"
141
- v-if="data.type === 'BM'"
142
- :style="{ color: 'var(--el-color-primary)' }"
143
- ></el-icons>
144
- <el-icons
145
- model-value="adtec-user"
146
- v-if="data.type === 'YH'"
147
- :style="{ color: data.sex === '1' ? '#ef5fa6' : 'var(--el-color-primary)' }"
148
- ></el-icons>
149
- </el-flex>
150
- <el-flex align="center">
151
- <el-text v-if="data.type === 'YH'">{{ data.name + `(${data.code})` }}</el-text>
152
- <el-text v-else>{{ data.name }}</el-text>
153
- </el-flex>
154
- </el-flex>
155
- </template>
156
- </el-tree>
157
- </el-flex>
158
- </el-flex>
159
-
160
- <el-flex :vertical="true" style="border-left: var(--border); padding-left: 15px">
161
- <el-title
162
- :title="`已选人员(${selectedUserList.length})`"
163
- style="border-bottom: var(--border); margin-top: 5px"
164
- ></el-title>
165
- <el-flex :vertical="true">
166
- <template v-for="data of selectedUserList" :key="data.id">
167
- <div class="user-select">
168
- <el-flex height="50px" style="border-bottom: var(--border); cursor: pointer">
169
- <el-flex align="center" width="30px">
170
- <el-icons
171
- model-value="adtec-user"
172
- style="font-size: 20px"
173
- :style="{ color: data.sex === '1' ? '#ef5fa6' : 'var(--el-color-primary)' }"
174
- >
175
- </el-icons>
176
- </el-flex>
177
- <el-flex align="center" :vertical="true" justify="flex-start">
178
- <el-flex>
179
- <el-text>{{ data.userName + `(${data.loginName})` }}</el-text>
180
- </el-flex>
181
- <el-flex align="flex-start" height="18px" style="overflow: hidden">
182
- <el-text style="font-size: 12px; opacity: 0.8; margin-bottom: 8px">{{
183
- data.deptName
184
- }}</el-text>
185
- </el-flex>
186
- </el-flex>
187
- <el-flex width="50px" align="center">
188
- <el-icon-btn
189
- @click="handleDelete(data)"
190
- model-value="adtec-close"
191
- style="opacity: 0.8; cursor: pointer"
192
- ></el-icon-btn>
193
- </el-flex>
194
- </el-flex>
195
- </div>
196
- </template>
197
- </el-flex>
198
- </el-flex>
199
- </el-flex>
200
- </el-flex>
201
- <template #footer>
202
- <el-button @click="cancel">取消</el-button>
203
- <el-button type="primary" @click="success">确定</el-button>
204
- </template>
205
- </el-dialog>
206
- </template>
207
- <script setup lang="ts">
208
- import { useVModel } from '@vueuse/core'
209
- import { type PropType, ref, watch } from 'vue'
210
- import basicApi from '../../api/BasicApi.ts'
211
- import type { IOrgDeptInfo } from '../../interface/IOrgDeptInfo'
212
- import type { ISysUserInfo } from '../../interface/ISysUserInfo'
213
- import sysUserApi from '../../api/SysUserApi.ts'
214
- import { ElMessage, type TreeInstance } from 'element-plus'
215
- const loading = ref(false)
216
- const userList = ref<ISysUserInfo[]>()
217
- const orgDeptTree = ref<IOrgDeptInfo[]>([])
218
- const deptUserTree = ref<any[]>([])
219
- const selectedUserList = ref<ISysUserInfo[]>([])
220
- const defaultExpandedKeys = ref<any[]>([])
221
- const defaultCheckedKeys = ref<any[]>([])
222
- const ref_tree = ref<TreeInstance>()
223
- const filterText = ref('')
224
- const props = defineProps({
225
- modelValue: {
226
- type: Boolean,
227
- },
228
- /**
229
- * @description 已选人员id
230
- * @default []
231
- * @type Array
232
- */
233
- selectedUserIds: {
234
- type: Array as PropType<string[]>,
235
- default: () => [] as string[],
236
- },
237
- /**
238
- * @description 标题
239
- * @default 人员选择
240
- * @type String
241
- */
242
- title: {
243
- type: String,
244
- default: '人员选择',
245
- },
246
- /**
247
- * @description 视图类型
248
- * @default drawer
249
- @type {"drawer" | "dialog" }
250
- **/
251
- viewType: {
252
- type: String,
253
- default: 'drawer',
254
- validator: (value: string) => ['drawer', 'dialog'].includes(value),
255
- },
256
- /**
257
- * @description 是否允许多选
258
- * @default false
259
- * @type Boolean
260
- */
261
- multiple: {
262
- type: Boolean,
263
- default: false,
264
- },
265
- })
266
- watch(filterText, (val) => {
267
- ref_tree.value!.filter(val)
268
- })
269
-
270
- const filterNode = (value: string, data: any) => {
271
- if (!value) return true
272
- return data.name.includes(value) || data.code.includes(value)
273
- }
274
- function success() {
275
- emit('success', selectedUserList.value)
276
- }
277
- function cancel() {
278
- emit('cancel')
279
- }
280
- function handleDelete(row: ISysUserInfo) {
281
- const index = selectedUserList.value.findIndex((item) => item.id === row.id)
282
- if (index !== -1) {
283
- selectedUserList.value.splice(index, 1) // 删除该对象
284
- const key = selectedUserList.value.map((item) => item.id)
285
- ref_tree.value?.setCheckedKeys(key as any[])
286
- }
287
- }
288
- const emit = defineEmits(['update:modelValue', 'success', 'cancel'])
289
- const dialogVisible = useVModel(props, 'modelValue', emit)
290
- const getInitUserList = async () => {
291
- if (props.selectedUserIds) {
292
- try {
293
- selectedUserList.value = await sysUserApi.getInitUserListComp(props.selectedUserIds)
294
- defaultCheckedKeys.value = []
295
- selectedUserList.value.forEach((item) => {
296
- defaultCheckedKeys.value.push(item.id)
297
- })
298
- } catch (err: any) {
299
- ElMessage.error(err.msg)
300
- }
301
- }
302
- }
303
- const open = async () => {
304
- loading.value = true
305
- selectedUserList.value = []
306
- userList.value = []
307
- orgDeptTree.value = await basicApi.getMdmOrgDeptTree()
308
- const userTreeList: any[] = []
309
- const userTreeList1: any[] = []
310
- orgDeptTree.value.forEach((item) => {
311
- item.children?.forEach((item2) => {
312
- item2.parentId = item.id
313
- })
314
- const list = flattenTreeToArray(item)
315
- userTreeList.push(...list)
316
- })
317
- userList.value = await sysUserApi.getSysUserInfoUserSelectComp()
318
- //根据部门关联岗位
319
- userTreeList.forEach((item) => {
320
- item.type = 'BM'
321
- const f = userList.value?.filter((c) => c.mdmDeptId === item.id)
322
- if (f) {
323
- f.forEach((item2) => {
324
- userTreeList1.push({
325
- id: item2.id,
326
- code: item2.loginName,
327
- name: item2.userName,
328
- parentId: item.id,
329
- type: 'YH',
330
- sex: item2.sex,
331
- })
332
- })
333
- }
334
- })
335
- userTreeList.push(...userTreeList1)
336
- const treeData = buildTree(userTreeList)
337
- defaultExpandedKeys.value = []
338
- treeData.forEach((item) => {
339
- defaultExpandedKeys.value.push(item.id)
340
- })
341
- await getInitUserList()
342
- deptUserTree.value = treeData
343
- loading.value = false
344
- }
345
- function buildTree(flatArray: any[]) {
346
- const map = new Map()
347
- const tree: any[] = []
348
- // 首先将平面数组的每个元素都放入 Map 中,以 id 为键,元素本身为值
349
- flatArray.forEach((item) => {
350
- map.set(item.id, { ...item, children: [] })
351
- })
352
- // 然后通过遍历每个元素,将它们归类到正确的父节点中
353
- flatArray.forEach((item) => {
354
- const node = map.get(item.id)
355
- if (item.parentId === null) {
356
- // 如果没有 parentId,说明是根节点
357
- tree.push(node)
358
- } else {
359
- // 否则,将当前节点添加到它的父节点的 children 数组中
360
- const parentNode = map.get(item.parentId)
361
- if (parentNode) {
362
- parentNode.children.push(node)
363
- }
364
- }
365
- })
366
- return tree
367
- }
368
- function flattenTreeToArray(tree: IOrgDeptInfo) {
369
- const result: any = []
370
- function traverse(node: IOrgDeptInfo) {
371
- if (!node) return
372
- // 将当前节点添加到结果数组
373
- result.push({
374
- id: node.id,
375
- code: node.code,
376
- name: node.name,
377
- parentId: node.parentId,
378
- })
379
- // 如果有子节点,递归遍历子节点
380
- if (node.children && node.children.length > 0) {
381
- node.children.forEach((child) => traverse(child))
382
- }
383
- }
384
- // 开始遍历树
385
- traverse(tree)
386
- return result
387
- }
388
- const handleCheckChange = () => {
389
- const data = ref_tree.value?.getCheckedNodes().filter((c) => c.type === 'YH')
390
- selectedUserList.value = []
391
- if (data) {
392
- data.forEach((item: any) => {
393
- const f = userList.value?.find((c) => c.id === item.id)
394
- if (f) {
395
- selectedUserList.value.push(f)
396
- }
397
- })
398
- }
399
- }
400
- const close = () => {
401
- selectedUserList.value = []
402
- }
403
- </script>
404
- <style scoped lang="scss">
405
- .user-select {
406
- //background: red;
407
- width: 100%;
408
- }
409
- .user-select :hover {
410
- background: #f5f7fa !important;
411
- }
412
- </style>
1
+ <!--创建人 丁盼-->
2
+ <!--说明: userSelect 人员选择-->
3
+ <!--创建时间: 2024/12/9 上午10:27-->
4
+ <!--修改时间: 2024/12/9 上午10:27-->
5
+ <template>
6
+ <el-drawer
7
+ v-if="viewType === 'drawer'"
8
+ :title="title"
9
+ v-model="dialogVisible"
10
+ :destroy-on-close="true"
11
+ size="800px"
12
+ @close="close"
13
+ @open="open"
14
+ >
15
+ <el-flex :vertical="true" v-loading="loading">
16
+ <el-flex :vertical="false">
17
+ <el-flex :vertical="true" style="padding-right: 15px">
18
+ <el-title title="人员列表" style="border-bottom: var(--border)"> </el-title>
19
+ <el-input v-model="filterText" placeholder="请输入用户名称或者编码进行搜索"></el-input>
20
+ <el-flex :vertical="true">
21
+ <el-tree
22
+ style="width: 100%"
23
+ :filter-node-method="filterNode"
24
+ show-checkbox
25
+ ref="ref_tree"
26
+ :data="deptUserTree"
27
+ @check-change="handleCheckChange"
28
+ node-key="id"
29
+ :default-expanded-keys="defaultExpandedKeys"
30
+ :default-checked-keys="defaultCheckedKeys"
31
+ :props="{
32
+ label: 'name',
33
+ children: 'children',
34
+ }"
35
+ >
36
+ <template #default="{ data }">
37
+ <el-flex align="center">
38
+ <el-flex align="center" justify="center" width="20px">
39
+ <el-icons
40
+ model-value="adtec-dept"
41
+ v-if="data.type === 'BM'"
42
+ :style="{ color: 'var(--el-color-primary)' }"
43
+ ></el-icons>
44
+ <el-icons
45
+ model-value="adtec-user"
46
+ v-if="data.type === 'YH'"
47
+ :style="{ color: data.sex === '1' ? '#ef5fa6' : 'var(--el-color-primary)' }"
48
+ ></el-icons>
49
+ </el-flex>
50
+ <el-flex align="center">
51
+ <el-text v-if="data.type === 'YH'">{{ data.name + `(${data.code})` }}</el-text>
52
+ <el-text v-else>{{ data.name }}</el-text>
53
+ </el-flex>
54
+ </el-flex>
55
+ </template>
56
+ </el-tree>
57
+ </el-flex>
58
+ </el-flex>
59
+
60
+ <el-flex :vertical="true" style="border-left: var(--border); padding-left: 15px">
61
+ <el-title
62
+ :title="`已选人员(${selectedUserList.length})`"
63
+ style="border-bottom: var(--border); margin-top: 5px"
64
+ ></el-title>
65
+ <el-flex :vertical="true">
66
+ <template v-for="data of selectedUserList" :key="data.id">
67
+ <div class="user-select">
68
+ <el-flex height="50px" style="border-bottom: var(--border); cursor: pointer">
69
+ <el-flex align="center" width="30px">
70
+ <el-icons
71
+ model-value="adtec-user"
72
+ style="font-size: 20px"
73
+ :style="{ color: data.sex === '1' ? '#ef5fa6' : 'var(--el-color-primary)' }"
74
+ >
75
+ </el-icons>
76
+ </el-flex>
77
+ <el-flex align="center" :vertical="true" justify="flex-start">
78
+ <el-flex>
79
+ <el-text>{{ data.userName + `(${data.loginName})` }}</el-text>
80
+ </el-flex>
81
+ <el-flex align="flex-start" height="18px" style="overflow: hidden">
82
+ <el-text style="font-size: 12px; opacity: 0.8; margin-bottom: 8px">{{
83
+ data.deptName
84
+ }}</el-text>
85
+ </el-flex>
86
+ </el-flex>
87
+ <el-flex width="50px" align="center">
88
+ <el-icon-btn
89
+ @click="handleDelete(data)"
90
+ model-value="adtec-close"
91
+ style="opacity: 0.8; cursor: pointer"
92
+ ></el-icon-btn>
93
+ </el-flex>
94
+ </el-flex>
95
+ </div>
96
+ </template>
97
+ </el-flex>
98
+ </el-flex>
99
+ </el-flex>
100
+ </el-flex>
101
+ <template #footer>
102
+ <el-button @click="cancel">取消</el-button>
103
+ <el-button type="primary" @click="success">确定</el-button>
104
+ </template>
105
+ </el-drawer>
106
+ <el-dialog
107
+ v-else
108
+ :title="title"
109
+ top="10vh"
110
+ v-model="dialogVisible"
111
+ width="1000px"
112
+ @close="close"
113
+ @open="open"
114
+ >
115
+ <el-flex :vertical="true" v-loading="loading" height="500px">
116
+ <el-flex :vertical="false">
117
+ <el-flex :vertical="true" style="padding-right: 15px">
118
+ <el-title title="人员列表" style="border-bottom: var(--border)"> </el-title>
119
+ <el-input v-model="filterText" placeholder="请输入用户名称或者编码进行搜索"></el-input>
120
+ <el-flex :vertical="true">
121
+ <el-tree
122
+ style="width: 100%"
123
+ :filter-node-method="filterNode"
124
+ show-checkbox
125
+ ref="ref_tree"
126
+ :data="deptUserTree"
127
+ @check-change="handleCheckChange"
128
+ node-key="id"
129
+ :default-expanded-keys="defaultExpandedKeys"
130
+ :default-checked-keys="defaultCheckedKeys"
131
+ :props="{
132
+ label: 'name',
133
+ children: 'children',
134
+ }"
135
+ >
136
+ <template #default="{ data }">
137
+ <el-flex align="center">
138
+ <el-flex align="center" justify="center" width="20px">
139
+ <el-icons
140
+ model-value="adtec-dept"
141
+ v-if="data.type === 'BM'"
142
+ :style="{ color: 'var(--el-color-primary)' }"
143
+ ></el-icons>
144
+ <el-icons
145
+ model-value="adtec-user"
146
+ v-if="data.type === 'YH'"
147
+ :style="{ color: data.sex === '1' ? '#ef5fa6' : 'var(--el-color-primary)' }"
148
+ ></el-icons>
149
+ </el-flex>
150
+ <el-flex align="center">
151
+ <el-text v-if="data.type === 'YH'">{{ data.name + `(${data.code})` }}</el-text>
152
+ <el-text v-else>{{ data.name }}</el-text>
153
+ </el-flex>
154
+ </el-flex>
155
+ </template>
156
+ </el-tree>
157
+ </el-flex>
158
+ </el-flex>
159
+
160
+ <el-flex :vertical="true" style="border-left: var(--border); padding-left: 15px">
161
+ <el-title
162
+ :title="`已选人员(${selectedUserList.length})`"
163
+ style="border-bottom: var(--border); margin-top: 5px"
164
+ ></el-title>
165
+ <el-flex :vertical="true">
166
+ <template v-for="data of selectedUserList" :key="data.id">
167
+ <div class="user-select">
168
+ <el-flex height="50px" style="border-bottom: var(--border); cursor: pointer">
169
+ <el-flex align="center" width="30px">
170
+ <el-icons
171
+ model-value="adtec-user"
172
+ style="font-size: 20px"
173
+ :style="{ color: data.sex === '1' ? '#ef5fa6' : 'var(--el-color-primary)' }"
174
+ >
175
+ </el-icons>
176
+ </el-flex>
177
+ <el-flex align="center" :vertical="true" justify="flex-start">
178
+ <el-flex>
179
+ <el-text>{{ data.userName + `(${data.loginName})` }}</el-text>
180
+ </el-flex>
181
+ <el-flex align="flex-start" height="18px" style="overflow: hidden">
182
+ <el-text style="font-size: 12px; opacity: 0.8; margin-bottom: 8px">{{
183
+ data.deptName
184
+ }}</el-text>
185
+ </el-flex>
186
+ </el-flex>
187
+ <el-flex width="50px" align="center">
188
+ <el-icon-btn
189
+ @click="handleDelete(data)"
190
+ model-value="adtec-close"
191
+ style="opacity: 0.8; cursor: pointer"
192
+ ></el-icon-btn>
193
+ </el-flex>
194
+ </el-flex>
195
+ </div>
196
+ </template>
197
+ </el-flex>
198
+ </el-flex>
199
+ </el-flex>
200
+ </el-flex>
201
+ <template #footer>
202
+ <el-button @click="cancel">取消</el-button>
203
+ <el-button type="primary" @click="success">确定</el-button>
204
+ </template>
205
+ </el-dialog>
206
+ </template>
207
+ <script setup lang="ts">
208
+ import { useVModel } from '@vueuse/core'
209
+ import { type PropType, ref, watch } from 'vue'
210
+ import basicApi from '../../api/BasicApi.ts'
211
+ import type { IOrgDeptInfo } from '../../interface/IOrgDeptInfo'
212
+ import type { ISysUserInfo } from '../../interface/ISysUserInfo'
213
+ import sysUserApi from '../../api/SysUserApi.ts'
214
+ import { ElMessage, type TreeInstance } from 'element-plus'
215
+ const loading = ref(false)
216
+ const userList = ref<ISysUserInfo[]>()
217
+ const orgDeptTree = ref<IOrgDeptInfo[]>([])
218
+ const deptUserTree = ref<any[]>([])
219
+ const selectedUserList = ref<ISysUserInfo[]>([])
220
+ const defaultExpandedKeys = ref<any[]>([])
221
+ const defaultCheckedKeys = ref<any[]>([])
222
+ const ref_tree = ref<TreeInstance>()
223
+ const filterText = ref('')
224
+ const props = defineProps({
225
+ modelValue: {
226
+ type: Boolean,
227
+ },
228
+ /**
229
+ * @description 已选人员id
230
+ * @default []
231
+ * @type Array
232
+ */
233
+ selectedUserIds: {
234
+ type: Array as PropType<string[]>,
235
+ default: () => [] as string[],
236
+ },
237
+ /**
238
+ * @description 标题
239
+ * @default 人员选择
240
+ * @type String
241
+ */
242
+ title: {
243
+ type: String,
244
+ default: '人员选择',
245
+ },
246
+ /**
247
+ * @description 视图类型
248
+ * @default drawer
249
+ @type {"drawer" | "dialog" }
250
+ **/
251
+ viewType: {
252
+ type: String,
253
+ default: 'drawer',
254
+ validator: (value: string) => ['drawer', 'dialog'].includes(value),
255
+ },
256
+ /**
257
+ * @description 是否允许多选
258
+ * @default false
259
+ * @type Boolean
260
+ */
261
+ multiple: {
262
+ type: Boolean,
263
+ default: false,
264
+ },
265
+ })
266
+ watch(filterText, (val) => {
267
+ ref_tree.value!.filter(val)
268
+ })
269
+
270
+ const filterNode = (value: string, data: any) => {
271
+ if (!value) return true
272
+ return data.name.includes(value) || data.code.includes(value)
273
+ }
274
+ function success() {
275
+ emit('success', selectedUserList.value)
276
+ }
277
+ function cancel() {
278
+ emit('cancel')
279
+ }
280
+ function handleDelete(row: ISysUserInfo) {
281
+ const index = selectedUserList.value.findIndex((item) => item.id === row.id)
282
+ if (index !== -1) {
283
+ selectedUserList.value.splice(index, 1) // 删除该对象
284
+ const key = selectedUserList.value.map((item) => item.id)
285
+ ref_tree.value?.setCheckedKeys(key as any[])
286
+ }
287
+ }
288
+ const emit = defineEmits(['update:modelValue', 'success', 'cancel'])
289
+ const dialogVisible = useVModel(props, 'modelValue', emit)
290
+ const getInitUserList = async () => {
291
+ if (props.selectedUserIds) {
292
+ try {
293
+ selectedUserList.value = await sysUserApi.getInitUserListComp(props.selectedUserIds)
294
+ defaultCheckedKeys.value = []
295
+ selectedUserList.value.forEach((item) => {
296
+ defaultCheckedKeys.value.push(item.id)
297
+ })
298
+ } catch (err: any) {
299
+ ElMessage.error(err.msg)
300
+ }
301
+ }
302
+ }
303
+ const open = async () => {
304
+ loading.value = true
305
+ selectedUserList.value = []
306
+ userList.value = []
307
+ orgDeptTree.value = await basicApi.getMdmOrgDeptTree()
308
+ const userTreeList: any[] = []
309
+ const userTreeList1: any[] = []
310
+ orgDeptTree.value.forEach((item) => {
311
+ item.children?.forEach((item2) => {
312
+ item2.parentId = item.id
313
+ })
314
+ const list = flattenTreeToArray(item)
315
+ userTreeList.push(...list)
316
+ })
317
+ userList.value = await sysUserApi.getSysUserInfoUserSelectComp()
318
+ //根据部门关联岗位
319
+ userTreeList.forEach((item) => {
320
+ item.type = 'BM'
321
+ const f = userList.value?.filter((c) => c.mdmDeptId === item.id)
322
+ if (f) {
323
+ f.forEach((item2) => {
324
+ userTreeList1.push({
325
+ id: item2.id,
326
+ code: item2.loginName,
327
+ name: item2.userName,
328
+ parentId: item.id,
329
+ type: 'YH',
330
+ sex: item2.sex,
331
+ })
332
+ })
333
+ }
334
+ })
335
+ userTreeList.push(...userTreeList1)
336
+ const treeData = buildTree(userTreeList)
337
+ defaultExpandedKeys.value = []
338
+ treeData.forEach((item) => {
339
+ defaultExpandedKeys.value.push(item.id)
340
+ })
341
+ await getInitUserList()
342
+ deptUserTree.value = treeData
343
+ loading.value = false
344
+ }
345
+ function buildTree(flatArray: any[]) {
346
+ const map = new Map()
347
+ const tree: any[] = []
348
+ // 首先将平面数组的每个元素都放入 Map 中,以 id 为键,元素本身为值
349
+ flatArray.forEach((item) => {
350
+ map.set(item.id, { ...item, children: [] })
351
+ })
352
+ // 然后通过遍历每个元素,将它们归类到正确的父节点中
353
+ flatArray.forEach((item) => {
354
+ const node = map.get(item.id)
355
+ if (item.parentId === null) {
356
+ // 如果没有 parentId,说明是根节点
357
+ tree.push(node)
358
+ } else {
359
+ // 否则,将当前节点添加到它的父节点的 children 数组中
360
+ const parentNode = map.get(item.parentId)
361
+ if (parentNode) {
362
+ parentNode.children.push(node)
363
+ }
364
+ }
365
+ })
366
+ return tree
367
+ }
368
+ function flattenTreeToArray(tree: IOrgDeptInfo) {
369
+ const result: any = []
370
+ function traverse(node: IOrgDeptInfo) {
371
+ if (!node) return
372
+ // 将当前节点添加到结果数组
373
+ result.push({
374
+ id: node.id,
375
+ code: node.code,
376
+ name: node.name,
377
+ parentId: node.parentId,
378
+ })
379
+ // 如果有子节点,递归遍历子节点
380
+ if (node.children && node.children.length > 0) {
381
+ node.children.forEach((child) => traverse(child))
382
+ }
383
+ }
384
+ // 开始遍历树
385
+ traverse(tree)
386
+ return result
387
+ }
388
+ const handleCheckChange = () => {
389
+ const data = ref_tree.value?.getCheckedNodes().filter((c) => c.type === 'YH')
390
+ selectedUserList.value = []
391
+ if (data) {
392
+ data.forEach((item: any) => {
393
+ const f = userList.value?.find((c) => c.id === item.id)
394
+ if (f) {
395
+ selectedUserList.value.push(f)
396
+ }
397
+ })
398
+ }
399
+ }
400
+ const close = () => {
401
+ selectedUserList.value = []
402
+ }
403
+ </script>
404
+ <style scoped lang="scss">
405
+ .user-select {
406
+ //background: red;
407
+ width: 100%;
408
+ }
409
+ .user-select :hover {
410
+ background: #f5f7fa !important;
411
+ }
412
+ </style>