From 08f479f3e17799122d53406d70369198bfaaa555 Mon Sep 17 00:00:00 2001 From: zty <tianyuan233.zhang@gmail.com> Date: Wed, 14 Jun 2023 06:08:39 +0800 Subject: [PATCH] RoleDrawe.vue 改造为setup,角色编辑时状态不正确 (#2857) --- src/views/demo/system/role/RoleDrawer.vue | 88 +++++++++++++++++++++++++++++++++++++--------------------------------------------------- src/views/demo/system/role/role.data.ts | 8 ++++---- 2 files changed, 41 insertions(+), 55 deletions(-) diff --git a/src/views/demo/system/role/RoleDrawer.vue b/src/views/demo/system/role/RoleDrawer.vue index 16fa395..5df22c5 100644 --- a/src/views/demo/system/role/RoleDrawer.vue +++ b/src/views/demo/system/role/RoleDrawer.vue @@ -21,8 +21,8 @@ </BasicForm> </BasicDrawer> </template> -<script lang="ts"> - import { defineComponent, ref, computed, unref } from 'vue'; +<script lang="ts" setup> + import { ref, computed, unref } from 'vue'; import { BasicForm, useForm } from '/@/components/Form/index'; import { formSchema } from './role.data'; import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'; @@ -30,59 +30,45 @@ import { getMenuList } from '/@/api/demo/system'; - export default defineComponent({ - name: 'RoleDrawer', - components: { BasicDrawer, BasicForm, BasicTree }, - emits: ['success', 'register'], - setup(_, { emit }) { - const isUpdate = ref(true); - const treeData = ref<TreeItem[]>([]); + const emit = defineEmits(['success', 'register']); + const isUpdate = ref(true); + const treeData = ref<TreeItem[]>([]); - const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({ - labelWidth: 90, - baseColProps: { span: 24 }, - schemas: formSchema, - showActionButtonGroup: false, - }); + const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({ + labelWidth: 90, + baseColProps: { span: 24 }, + schemas: formSchema, + showActionButtonGroup: false, + }); - const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { - resetFields(); - setDrawerProps({ confirmLoading: false }); - // 需要在setFieldsValue之前先填充treeData,否则Tree组件可能会报key not exist警告 - if (unref(treeData).length === 0) { - treeData.value = (await getMenuList()) as any as TreeItem[]; - } - isUpdate.value = !!data?.isUpdate; + const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { + resetFields(); + setDrawerProps({ confirmLoading: false }); + // 需要在setFieldsValue之前先填充treeData,否则Tree组件可能会报key not exist警告 + if (unref(treeData).length === 0) { + treeData.value = (await getMenuList()) as any as TreeItem[]; + } + isUpdate.value = !!data?.isUpdate; - if (unref(isUpdate)) { - setFieldsValue({ - ...data.record, - }); - } + if (unref(isUpdate)) { + setFieldsValue({ + ...data.record, }); + } + }); - const getTitle = computed(() => (!unref(isUpdate) ? '新增角色' : '编辑角色')); - - async function handleSubmit() { - try { - const values = await validate(); - setDrawerProps({ confirmLoading: true }); - // TODO custom api - console.log(values); - closeDrawer(); - emit('success'); - } finally { - setDrawerProps({ confirmLoading: false }); - } - } + const getTitle = computed(() => (!unref(isUpdate) ? '新增角色' : '编辑角色')); - return { - registerDrawer, - registerForm, - getTitle, - handleSubmit, - treeData, - }; - }, - }); + async function handleSubmit() { + try { + const values = await validate(); + setDrawerProps({ confirmLoading: true }); + // TODO custom api + console.log(values); + closeDrawer(); + emit('success'); + } finally { + setDrawerProps({ confirmLoading: false }); + } + } </script> diff --git a/src/views/demo/system/role/role.data.ts b/src/views/demo/system/role/role.data.ts index c177f10..7f6e0d2 100644 --- a/src/views/demo/system/role/role.data.ts +++ b/src/views/demo/system/role/role.data.ts @@ -76,8 +76,8 @@ export const searchFormSchema: FormSchema[] = [ component: 'Select', componentProps: { options: [ - { label: '启用', value: '0' }, - { label: '停用', value: '1' }, + { label: '启用', value: '1' }, + { label: '停用', value: '0' }, ], }, colProps: { span: 8 }, @@ -104,8 +104,8 @@ export const formSchema: FormSchema[] = [ defaultValue: '0', componentProps: { options: [ - { label: '启用', value: '0' }, - { label: '停用', value: '1' }, + { label: '启用', value: '1' }, + { label: '停用', value: '0' }, ], }, }, -- libgit2 0.23.3