adtec-core-package 0.7.0 → 0.7.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "adtec-core-package",
-  "version": "0.7.0",
+  "version": "0.7.2",
   "private": false,
   "type": "module",
   "scripts": {

package/src/components/business/comp.selectUser.vue

@@ -51,11 +51,24 @@
         </el-form>
       </el-search>
       <el-title class="border" style="border-bottom: var(--border)" title="人员列表"></el-title>
+      <div style="padding-top: 4px">
+        <el-tag
+          v-for="user in selectUserList"
+          :key="user.code"
+          closable
+          style="margin: 2px"
+          @close="handleCloseTag(user)"
+        >
+          {{ user.name }}
+        </el-tag>
+      </div>
       <el-table
         ref="ref_table"
         :data="userList?.records"
         border
         height="100%"
+        @select="selectRows"
+        @select-all="selectRows"
         style="margin-top: 8px"
       >
         <el-table-column align="center" type="selection" width="40" />
@@ -93,7 +106,7 @@
 <script lang="ts" setup>
 import { useVModel } from '@vueuse/core'
 import type { IMdmEmployeeQuery } from '../../interface/IMdmEmployeeQuery'
-import { computed, onMounted, ref, watch } from 'vue'
+import { nextTick, onMounted, ref, watch } from 'vue'
 import type { IpageDataQuery, PageData } from '../../interface//PageData'
 import type { IMdmEmployee } from '../../interface/IMdmEmployee'
 import { ElMessage, ElTooltip, type TableInstance, type TreeNode } from 'element-plus'
@@ -107,41 +120,45 @@ interface Props<T extends IpageDataQuery, E extends IMdmEmployee> {
   modelValue: boolean
   title?: string
   fetchData?: (data: T) => Promise<PageData<E>>
+  defalutQueryParam?: any
+  diagLogLoading?: boolean
 }
 
 const props = withDefaults(defineProps<Props<IMdmEmployeeQuery, IMdmEmployee>>(), {
   title: '选择人员',
   fetchData: EmployeeInfoApi.getMdmEmployeeListByIds,
+  defalutQueryParam: {},
+  diagLogLoading: false,
 })
 const [queryParam, resetQueryParam] = useResetRefHooks<IMdmEmployeeQuery>({
   postIds: [],
+  orgIds: [],
+  deptIds: [],
   emplyeeCode: '',
   emplyeeName: '',
   codeorname: '',
-  size: 15,
+  size: 25,
   current: 1,
 })
 watch(
   () => props.modelValue,
   (value) => {
+    resetSelectUserList()
+    resetUserList()
     if (value) {
-      queryRef.value?.resetFields()
-      resetQueryParam()
-      handleQuery()
+      resetQuery()
     }
   },
 )
-const emit = defineEmits(['update:modelValue', 'success'])
+const emit = defineEmits(['update:modelValue', 'update:diagLogLoading', 'success'])
 const orgDeptTree = ref<IOrgDeptInfo[]>([])
 const dialogVisible = useVModel(props, 'modelValue', emit)
-const loading = ref(false)
+const loading = useVModel(props, 'diagLogLoading', emit)
 const queryRef = ref()
 const ref_table = ref<TableInstance>()
 
 const ref_tree = ref()
-const selectRows = computed(() => {
-  return ref_table.value?.getSelectionRows()
-})
+const [selectUserList, resetSelectUserList] = useResetRefHooks<IMdmEmployee[]>([])
 const [userList, resetUserList] = useResetRefHooks<PageData<IMdmEmployee>>({
   records: [],
   total: 0,
@@ -164,20 +181,49 @@ const renderTreeNode = (
       ElTooltip,
       {
         content: data.name,
-        placement: 'top,
+        placement: 'top',
       },
-      () => [h('span', {}, data.name)]
+      () => [h('span', {}, data.name)],
     ),
   ]
 }
+const selectRows = (selects: IMdmEmployee[], row?: IMdmEmployee) => {
+  if (row) {
+    //此时要先判断是选中还是取消选中
+    if (!judgeIsSel(selects, row)) {
+      selectUserList.value = selectUserList.value.filter((item) => item.code !== row.code)
+    } else {
+      selectUserList.value.push(row)
+    }
+  } else {
+    //此时是全选中或全取消
+    if (selects.length) {
+      const selCodes = selectUserList.value.map((item: IMdmEmployee) => item.code)
+      selects.forEach((item: IMdmEmployee) => {
+        if (!selCodes.includes(item.code)) {
+          selectUserList.value.push(item)
+        }
+      })
+    } else {
+      const delCodes = userList.value?.records.map((item: IMdmEmployee) => item.code)
+      selectUserList.value = selectUserList.value.filter((item) => !delCodes?.includes(item.code))
+    }
+  }
+}
+const judgeIsSel = (selects: IMdmEmployee[], row: IMdmEmployee) => {
+  return selects.some((item) => item.code === row.code)
+}
 const resetQuery = () => {
+  queryRef.value?.resetFields()
+  ref_tree.value?.setCheckedKeys([])
   resetQueryParam()
-  handleQuery()
+  nextTick(() => {
+    handleQuery()
+  })
 }
 const handleQuery = async () => {
   try {
     loading.value = true
-    resetUserList()
     const deptIds = [] as string[]
     const orgIds = [] as string[]
     const select: IOrgDeptInfo[] = ref_tree.value?.getCheckedNodes()
@@ -191,22 +237,37 @@ const handleQuery = async () => {
         item.mdmOrgId && !orgIds.includes(item.mdmOrgId) && deptIds.push(item.id!)
       })
     }
-    const params = JSON.parse(JSON.stringify(queryParam.value))
+    let params = JSON.parse(JSON.stringify(queryParam.value))
     params.deptIds = deptIds
     params.orgIds = orgIds
+    //需要合并默认参数
+    params = { ...props.defalutQueryParam, ...params }
     userList.value = await props.fetchData(params)
+    //设置选中
+    const selCodes = selectUserList.value.map((item: IMdmEmployee) => item.code)
+    nextTick(() => {
+      userList.value.records.forEach((item: IMdmEmployee) => {
+        selCodes.includes(item.code) && ref_table.value?.toggleRowSelection(item, true)
+      })
+    })
+    queryParam.value.current = userList.value.current
   } catch (error: any) {
     ElMessage.error(error.msg || error.message)
   } finally {
     loading.value = false
   }
 }
+const handleCloseTag = (row: IMdmEmployee) => {
+  selectUserList.value = selectUserList.value.filter((item) => item.code !== row.code)
+  //同时去除表格选中
+  const find = userList.value.records.find((item) => item.code === row.code)
+  find && ref_table.value?.toggleRowSelection(find, false)
+}
 const confirm = async () => {
-  if (!selectRows.value.length) {
+  if (!selectUserList.value.length) {
     ElMessage.warning('未选择需要新增的人员！')
   } else {
-    emit('success', selectRows.value)
-    dialogVisible.value = false
+    emit('success', selectUserList.value)
   }
 }
 onMounted(() => {