模板管理bug

src/views/system-config/template/CardCommon.vue

@@ -67,11 +67,12 @@
     <el-drawer
       v-model="cardeditDrawer"
       direction="rtl"
-      :title="currentType"
+      :title="type === '模板' ? '编辑模板' : '编辑标签'"
       :before-close="handleClose"
     >
       <DrawerCommonVue
         :detail="currentdrawerFormData"
+        :type="props.type"
         v-if="currentdrawerFormData"
         @submit-drawer="submitDrawer"
       />
@@ -90,7 +91,7 @@
 
   // const currentFormType = ref('场景');
 
-  export type CreateType = '添加模板' | '修改模板';
+  export type CreateType = '添加模板' | '编辑模板' | '添加标签' | '编辑标签';
   export interface TableModel {
     id: number;
     name: string;
@@ -109,7 +110,7 @@
     size: number;
   }
 
-  const currentType = ref<CreateType>('添加模板');
+  // const currentType = ref<CreateType>('编辑模板');
   const currentdrawerFormData = ref<FormModelCommon>({} as FormModelCommon);
   const cardeditDrawer = ref(false);
   const cardaddDrawer = ref(false);

src/views/system-config/template/DrawerCommon.vue

@@ -2,7 +2,7 @@
   <div>
     <el-form ref="ruleDrawerRef" :model="form" label-width="100px">
       <el-form-item
-        label="模板名称"
+        :label="props.type === '模板' ? '模板名称' : '标签名称'"
         prop="name"
         :rules="[
           {
@@ -16,7 +16,7 @@
       </el-form-item>
 
       <el-form-item
-        label="模板代码"
+        :label="props.type === '模板' ? '模板代码' : '标签代码'"
         prop="code"
         :rules="[
           {
@@ -57,29 +57,47 @@
   import { ref, watch } from 'vue';
   import { FormInstance } from 'element-plus';
   import { onMounted } from 'vue';
+  import { cloneDeep } from 'lodash-es';
 
   export interface FormModelCommon {
-    id: number;
+    id?: number;
     code: string;
     name: string;
     status: number;
     remark: string;
   }
   export type CreateType = 'create' | 'edit';
-  const props = defineProps<{ detail: FormModelCommon }>();
+  const props = defineProps<{ detail: FormModelCommon; type: string }>();
   const emit = defineEmits(['submitDrawer']);
+  // const form = ref<FormModelCommon>({
+  //   id: props.detail.id,
+  //   name: props.detail.name,
+  //   code: props.detail.code,
+  //   remark: props.detail.remark,
+  //   status: props.detail.status,
+  // });
+
   const form = ref<FormModelCommon>({
-    id: props.detail.id,
-    name: props.detail.name,
-    code: props.detail.code,
-    remark: props.detail.remark,
-    status: props.detail.status,
+    id: undefined,
+    name: '',
+    code: '',
+    remark: '',
+    status: 0,
   });
 
+  const getValue = () => {
+    const dataForm = cloneDeep(props.detail);
+    form.value.id = dataForm.id;
+    form.value.name = dataForm.name;
+    form.value.code = dataForm.code;
+    form.value.remark = dataForm.remark;
+    form.value.status = dataForm.status;
+  };
+
   watch(
     () => props.detail,
-    (newdetail) => {
-      form.value = newdetail;
+    () => {
+      getValue();
     },
     { immediate: true },
   );
@@ -89,6 +107,10 @@
   function resetForm(formE1: FormInstance | undefined) {
     if (!formE1) return;
     formE1.resetFields();
+    form.value.name = '';
+    form.value.code = '';
+    form.value.remark = '';
+    form.value.status = 0;
     console.log('resetForm');
   }
 

src/views/system-config/template/TitleCommon.vue

@@ -22,13 +22,18 @@
         @click="addForm"
         style="position: absolute; right: 0; width: 100px"
       >
-        模板</el-button
+        {{ props.type }}</el-button
       >
     </el-form>
   </div>
 
-  <el-drawer v-model="titleDrawer" direction="rtl" :title="currentType" :before-close="handleClose">
-    <DrawerCommonVue :detail="drawerFormData" @submit-drawer="submitDrawer" />
+  <el-drawer
+    v-model="titleDrawer"
+    direction="rtl"
+    :title="props.type === '模板' ? '添加模板' : '添加标签'"
+    :before-close="handleClose"
+  >
+    <DrawerCommonVue :detail="drawerFormData" :type="props.type" @submit-drawer="submitDrawer" />
   </el-drawer>
 </template>