¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <BasicDrawer |
| | | v-bind="$attrs" |
| | | @register="registerDrawer" |
| | | :title="getTitle" |
| | | :width="adaptiveWidth" |
| | | @ok="handleSubmit" |
| | | :showFooter="showFooter" |
| | | destroyOnClose |
| | | > |
| | | <BasicForm @register="registerForm" /> |
| | | </BasicDrawer> |
| | | </template> |
| | | <script lang="ts" setup> |
| | | import { defineComponent, ref, computed, unref, useAttrs } from 'vue'; |
| | | import { BasicForm, useForm } from '/@/components/Form/index'; |
| | | import { formSchema } from './user.data'; |
| | | import { getTenantId, getToken } from "/@/utils/auth"; |
| | | import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'; |
| | | import { saveOrUpdateUser, getUserRoles, getUserDepartList } from './user.api'; |
| | | import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth'; |
| | | // 声æEmits |
| | | const emit = defineEmits(['success', 'register']); |
| | | const attrs = useAttrs(); |
| | | const isUpdate = ref(true); |
| | | const rowId = ref(''); |
| | | const departOptions = ref([]); |
| | | //表åé
ç½® |
| | | const [registerForm, { setProps, resetFields, setFieldsValue, validate, updateSchema }] = useForm({ |
| | | labelWidth: 90, |
| | | schemas: formSchema, |
| | | showActionButtonGroup: false, |
| | | }); |
| | | // TODO [VUEN-527] https://www.teambition.com/task/6239beb894b358003fe93626 |
| | | const showFooter = ref(true); |
| | | //表åèµå¼ |
| | | const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { |
| | | await resetFields(); |
| | | showFooter.value = data?.showFooter ?? true; |
| | | setDrawerProps({ confirmLoading: false, showFooter: showFooter.value }); |
| | | isUpdate.value = !!data?.isUpdate; |
| | | if (unref(isUpdate)) { |
| | | rowId.value = data.record.id; |
| | | //ç§æ·ä¿¡æ¯å®ä¹ææ°ç» |
| | | if (data.record.relTenantIds && !Array.isArray(data.record.relTenantIds)) { |
| | | data.record.relTenantIds = data.record.relTenantIds.split(','); |
| | | } else { |
| | | //ãissues/I56C5Iãç¨æ·ç®¡çä¸è¿ç»ç¹ä¸¤æ¬¡ç¼è¾ç§æ·é
ç½®å°±ä¸¢å¤±äº |
| | | //data.record.relTenantIds = []; |
| | | } |
| | | |
| | | //æ¥è§è²/èµå¼/try catch å¤çï¼ä¸ç¶ç¼è¾æé®é¢ |
| | | try { |
| | | const userRoles = await getUserRoles({ userid: data.record.id }); |
| | | if (userRoles && userRoles.length > 0) { |
| | | data.record.selectedroles = userRoles; |
| | | } |
| | | } catch (error) {} |
| | | |
| | | //æ¥æå±é¨é¨/èµå¼ |
| | | const userDepart = await getUserDepartList({ userId: data.record.id }); |
| | | if (userDepart && userDepart.length > 0) { |
| | | data.record.selecteddeparts = userDepart; |
| | | let selectDepartKeys = Array.from(userDepart, ({ key }) => key); |
| | | data.record.selecteddeparts = selectDepartKeys.join(','); |
| | | departOptions.value = userDepart.map((item) => { |
| | | return { label: item.title, value: item.key }; |
| | | }); |
| | | } |
| | | //è´è´£é¨é¨/èµå¼ |
| | | data.record.departIds && !Array.isArray(data.record.departIds) && (data.record.departIds = data.record.departIds.split(',')); |
| | | //update-begin---author:zyf Date:20211210 forï¼é¿å
ç©ºå¼æ¾ç¤ºå¼å¸¸------------ |
| | | data.record.departIds = data.record.departIds == '' ? [] : data.record.departIds; |
| | | //update-begin---author:zyf Date:20211210 forï¼é¿å
ç©ºå¼æ¾ç¤ºå¼å¸¸------------ |
| | | } |
| | | //å¤çè§è²ç¨æ·å表æ
åµ(åè§è²å表æå
³ç³») |
| | | data.selectedroles && (await setFieldsValue({ selectedroles: data.selectedroles })); |
| | | //ç¼è¾æ¶éèå¯ç /è§è²å表éèè§è²ä¿¡æ¯/æçé¨é¨æ¶éèæå±é¨é¨ |
| | | updateSchema([ |
| | | { |
| | | field: 'password', |
| | | show: !unref(isUpdate), |
| | | }, |
| | | { |
| | | field: 'confirmPassword', |
| | | ifShow: !unref(isUpdate), |
| | | }, |
| | | { |
| | | field: 'selectedroles', |
| | | show: !data.isRole, |
| | | }, |
| | | { |
| | | field: 'departIds', |
| | | componentProps: { options: departOptions }, |
| | | }, |
| | | { |
| | | field: 'selecteddeparts', |
| | | show: !data?.departDisabled ?? false, |
| | | }, |
| | | { |
| | | field: 'selectedroles', |
| | | show: !data?.departDisabled ?? false, |
| | | }, |
| | | { |
| | | field: 'relTenantIds', |
| | | show: Number(getTenantId())<=0, |
| | | }, |
| | | ]); |
| | | // æ 论æ°å¢è¿æ¯ç¼è¾ï¼é½å¯ä»¥è®¾ç½®è¡¨åå¼ |
| | | if (typeof data.record === 'object') { |
| | | setFieldsValue({ |
| | | ...data.record, |
| | | }); |
| | | } |
| | | // éèåºé¨æ¶ç¦ç¨æ´ä¸ªè¡¨å |
| | | //update-begin-author:taoyan date:2022-5-24 for: VUEN-1117ãissueã0523å¨å¼æºé®é¢ |
| | | setProps({ disabled: !showFooter.value }); |
| | | //update-end-author:taoyan date:2022-5-24 for: VUEN-1117ãissueã0523å¨å¼æºé®é¢ |
| | | }); |
| | | //è·åæ é¢ |
| | | const getTitle = computed(() => (!unref(isUpdate) ? 'æ°å¢ç¨æ·' : 'ç¼è¾ç¨æ·')); |
| | | const { adaptiveWidth } = useDrawerAdaptiveWidth(); |
| | | |
| | | //æäº¤äºä»¶ |
| | | async function handleSubmit() { |
| | | try { |
| | | let values = await validate(); |
| | | setDrawerProps({ confirmLoading: true }); |
| | | values.userIdentity === 1 && (values.departIds = ''); |
| | | let isUpdateVal = unref(isUpdate); |
| | | //æäº¤è¡¨å |
| | | await saveOrUpdateUser(values, isUpdateVal); |
| | | //å
³éå¼¹çª |
| | | closeDrawer(); |
| | | //å·æ°å表 |
| | | emit('success',{isUpdateVal ,values}); |
| | | } finally { |
| | | setDrawerProps({ confirmLoading: false }); |
| | | } |
| | | } |
| | | </script> |