From d50c90afd1ebe4f71429616d2c5dd1ccbeab4acf Mon Sep 17 00:00:00 2001 From: gssong <1742057357@qq.com> Date: 星期四, 07 三月 2024 21:18:08 +0800 Subject: [PATCH] fix 修复设计器无法选人问题,修复抄送打开弹出选中全部人员问题 --- src/components/RoleSelect/index.vue | 103 ++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 77 insertions(+), 26 deletions(-) diff --git a/src/components/RoleSelect/index.vue b/src/components/RoleSelect/index.vue index ec5bcc7..e190b20 100644 --- a/src/components/RoleSelect/index.vue +++ b/src/components/RoleSelect/index.vue @@ -36,7 +36,7 @@ :data="roleList" :loading="loading" :row-config="{ keyField: 'roleId' }" - :checkbox-config="{ reserve: true, checkRowKeys: roleIds }" + :checkbox-config="{ reserve: true, checkRowKeys: defaultSelectRoleIds }" highlight-current-row @checkbox-all="handleCheckboxAll" @checkbox-change="handleCheckboxChange" @@ -63,42 +63,41 @@ v-model:total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" - @pagination="getList" + @pagination="pageList" /> </el-card> <template #footer> - <el-button @click="roleDialog.closeDialog">鍙栨秷</el-button> + <el-button @click="close">鍙栨秷</el-button> <el-button type="primary" @click="confirm">纭畾</el-button> </template> </el-dialog> </div> </template> -<script setup name="Role" lang="ts"> -import { listRole } from '@/api/system/role'; +<script setup lang="ts"> import { RoleVO, RoleQuery } from '@/api/system/role/types'; import { VxeTableInstance } from 'vxe-table'; import useDialog from '@/hooks/useDialog'; +import api from '@/api/system/role'; interface PropType { - modelValue?: RoleVO[]; + modelValue?: RoleVO[] | RoleVO | undefined; + multiple?: boolean; + data?: string | number | (string | number)[]; } const prop = withDefaults(defineProps<PropType>(), { - modelValue: () => [] + multiple: true, + modelValue: undefined, + data: undefined }); -const emit = defineEmits(['update:modelValue']); +const emit = defineEmits(['update:modelValue', 'confirmCallBack']); const router = useRouter(); const { proxy } = getCurrentInstance() as ComponentInternalInstance; const { sys_normal_disable } = toRefs<any>(proxy?.useDict('sys_normal_disable')); -const roleIds = computed(() => prop.modelValue.map((item) => item.roleId as string)); - const roleList = ref<RoleVO[]>(); const loading = ref(true); const showSearch = ref(true); -const ids = ref<Array<string | number>>([]); -const single = ref(true); -const multiple = ref(true); const total = ref(0); const dateRange = ref<[DateModelType, DateModelType]>(['', '']); const selectRoleList = ref<RoleVO[]>([]); @@ -117,22 +116,46 @@ roleKey: '', status: '' }); + +const defaultSelectRoleIds = computed(() => computedIds(prop.data)); + const confirm = () => { - emit('update:modelValue', [...selectRoleList.value]); + emit('update:modelValue', selectRoleList.value); + emit('confirmCallBack', selectRoleList.value); roleDialog.closeDialog(); }; + +const computedIds = (data) => { + if (data instanceof Array) { + return [...data]; + } else if (typeof data === 'string') { + return data.split(','); + } else if (typeof data === 'number') { + return [data]; + } else { + console.warn('<RoleSelect> The data type of data should be array or string or number, but I received other'); + return []; + } +}; + /** * 鏌ヨ瑙掕壊鍒楄〃 */ const getList = () => { loading.value = true; - listRole(proxy?.addDateRange(queryParams.value, dateRange.value)).then((res) => { + api.listRole(proxy?.addDateRange(queryParams.value, dateRange.value)).then((res) => { roleList.value = res.rows; total.value = res.total; loading.value = false; }); }; - +const pageList = async () => { + await getList(); + const roles = roleList.value.filter((item) => { + return selectRoleList.value.some((role) => role.roleId === item.roleId); + }); + await tableRef.value.setCheckboxRow(roles, true); +}; /** * 鎼滅储鎸夐挳鎿嶄綔 */ @@ -149,6 +172,10 @@ }; const handleCheckboxChange = (checked) => { + if (!prop.multiple && checked.checked) { + tableRef.value.setCheckboxRow(selectRoleList.value, false); + selectRoleList.value = []; + } const row = checked.row; if (checked.checked) { selectRoleList.value.push(row); @@ -181,19 +208,43 @@ tableRef.value?.setCheckboxRow(rows, false); selectRoleList.value.splice(index, 1); }; +/** + * 鍒濆鍖栭�変腑鏁版嵁 + */ +const initSelectRole = async () => { + if (defaultSelectRoleIds.value.length > 0) { + const { data } = await api.optionSelect(defaultSelectRoleIds.value); + selectRoleList.value = data; + const users = roleList.value.filter((item) => { + return defaultSelectRoleIds.value.includes(String(item.roleId)); + }); + await nextTick(() => { + tableRef.value.setCheckboxRow(users, true); + }); + } +}; +const close = () => { + roleDialog.closeDialog(); +}; watch( - () => prop.modelValue, - (newVal, oldValue) => { - Object.assign(selectRoleList.value, newVal); - }, - { deep: true } + () => roleDialog.visible.value, + (newValue: boolean) => { + if (newValue) { + initSelectRole(); + } else { + tableRef.value.clearCheckboxReserve(); + tableRef.value.clearCheckboxRow(); + resetQuery(); + selectRoleList.value = []; + } + } ); +onMounted(() => { + getList(); // 鍒濆鍖栧垪琛ㄦ暟鎹� +}); + defineExpose({ open: roleDialog.openDialog, close: roleDialog.closeDialog }); - -onMounted(() => { - getList(); -}); -</script> \ No newline at end of file +</script> -- Gitblit v1.9.3