fixbufen

src/views/dashboard/monitor/CompanyDrawer.vue

@@ -11,12 +11,13 @@
       </el-button></div
     > -->
     <el-drawer
+      ref="companyDrawerRef"
       class="test"
       v-model="showDrawer"
       with-header="true"
       size="35%"
       @open="() => emit('update-tab-com', true)"
-      @close="() => emit('update-tab-com', false)"
+      @close="handleClose"
     >
       <template #header="{ titleId }">
         <p :id="titleId">{{ props.companyAddTitle }}</p>
@@ -92,7 +93,7 @@
         </el-form-item>
       </el-form>
       <div style="position: absolute; left: 108px; bottom: 67px">
-        <el-button v-if="!props.comEdit" type="warning" @click="resetDraw">重置</el-button>
+        <el-button v-if="!props.comEdit" type="warning" @click="resetDrawCom">重置</el-button>
         <el-button type="primary" v-if="!props.comEdit" @click="newCompanyAdd"> 提交 </el-button>
         <el-button type="primary" v-if="props.comEdit" @click="editedSub"> 提交 </el-button>
       </div>
@@ -131,7 +132,12 @@
   const selectItems = ref<SelectItemType[]>([{ tag: '', template: '' }]);
 
   //将表单数据传至父组件
-  const emit = defineEmits(['upload-company-data', 'edit-company-data', 'update-tab-com']);
+  const emit = defineEmits([
+    'upload-company-data',
+    'edit-company-data',
+    'update-tab-com',
+    'add-change-enable',
+  ]);
 
   //drawer的开关
   const showDrawer = computed(() => props.tableCom);
@@ -221,6 +227,9 @@
       tag: '',
       template: '',
     });
+    // add - change - enable;
+    // console.log(1231);
+    // emit('add-change-enable', addEnable);
   };
 
   //删除场景&模板
@@ -238,27 +247,31 @@
       });
   };
 
+  const handleClose = () => {
+    emit('update-tab-com', false);
+    // ruleForm1.name = '';
+    // ruleForm1.code = '';
+  };
   // const formEl = ref<FormInstance>();
 
   //添加新公司的提交
   const newCompanyAdd = (formEl: FormInstance | undefined) => {
     if (!formEl) return;
     emit('upload-company-data', ruleForm1, selectItems, addEnable, () => {
-      resetDraw();
+      resetDrawCom();
     });
   };
 
   //编辑公司时的提交
   const editedSub = () => {
     emit('edit-company-data', ruleForm1, selectItems, addEnable, () => {
-      resetDraw();
+      resetDrawCom();
     });
   };
 
   //重置编辑框
-  const resetDraw = () => {
+  const resetDrawCom = () => {
     ruleForm1.name = '';
-
     ruleForm1.code = '';
     ruleForm1.sceneCode = '';
     addEnable.value = 0;
@@ -267,6 +280,8 @@
     ruleForm1.templateWorkshop = undefined;
     ruleForm1.tagWorkshop = undefined;
   };
+
+  defineExpose({ resetDrawCom });
 </script>
 
 <style scoped></style>

src/views/dashboard/monitor/monitor.vue

@@ -136,6 +136,7 @@
       </div>
     </el-drawer> -->
     <CompanyDrawer
+      ref="companyDrawerChild"
       :table-com="tableCom"
       :companyAddTitle="companyAddTitle"
       :comEdit="comEdit"
@@ -326,38 +327,6 @@
     templateWorkshop: undefined,
     principal: '',
   });
-  // const rules = reactive<FormRules<RuleForm>>({
-  //   name: [
-  //     { required: true, message: '', trigger: 'blur' },
-  //     { min: 1, max: 100, message: 'Length should be 3 to 5', trigger: 'blur' },
-  //   ],
-  //   seniorScene: [
-  //     { required: true, message: '', trigger: 'blur' },
-  //     { min: 1, max: 100, message: 'Length should be 1 to 100', trigger: 'blur' },
-  //   ],
-  //   code: [
-  //     { required: true, message: '', trigger: 'blur' },
-  //     { min: 1, max: 100, message: 'Length should be 1 to 100', trigger: 'blur' },
-  //   ],
-  //   sceneCode: [
-  //     { required: true, message: '', trigger: 'blur' },
-  //     { min: 1, max: 100, message: 'Length should be 1 to 100', trigger: 'blur' },
-  //   ],
-  //   tagCom: [{ required: true, message: '', trigger: 'blur' }],
-  //   templateCom: [{ required: true, message: '', trigger: 'blur' }],
-  //   tagWorkshop: [
-  //     { required: true, message: '', trigger: 'blur' },
-  //     { min: 1, max: 100, message: 'Length should be 1 to 100', trigger: 'blur' },
-  //   ],
-  //   templateWorkshop: [
-  //     { required: true, message: '', trigger: 'blur' },
-  //     { min: 1, max: 100, message: 'Length should be 1 to 100', trigger: 'blur' },
-  //   ],
-  //   principal: [
-  //     { required: true, message: '', trigger: 'blur' },
-  //     { min: 1, max: 100, message: 'Length should be 1 to 100', trigger: 'blur' },
-  //   ],
-  // });
 
   //添加组件的添加功能
   const table = ref(false); //添加公司级的场景
@@ -384,54 +353,11 @@
   const level = ref<number>();
 
   onMounted(() => {
+    console.log('Company Drawer Child Ref:', companyDrawerChild.value);
     //添加父级，主要用于排序功能
     dataSourceWithParent(tableData.value, null);
     //获取tableData数据
     getSceneDetail();
-
-    // // 示例数据
-    const data = [
-      {
-        id: 1,
-        tag: 'hailou',
-        children: [
-          {
-            id: 1,
-            tag: 'anlai',
-            children: [
-              { id: 1, tag: '33233', children: [] },
-              { id: 2, tag: 'anlai110', children: [] },
-              { id: 3, tag: 'anlai122', children: [] },
-            ],
-          },
-          { id: 2, tag: 'hailou110', children: [] },
-          { id: 3, tag: 'hailou001', children: [] },
-        ],
-      },
-      {
-        id: 2,
-        tag: 'nihao',
-        children: [
-          {
-            id: 1,
-            tag: 'anlai',
-            children: [
-              { id: 1, tag: 'vaigou', children: [] },
-              { id: 2, tag: 'kegou', children: [] },
-            ],
-          },
-          { id: 2, tag: 'kengzi', children: [] },
-        ],
-      },
-    ];
-
-    // 查找 { id: 1, tag: 'vaigou', children: [] } 的索引
-    const result1 = findIndexByItem(data, { id: 1, tag: '33233', children: [] });
-    console.log('Result 1:', result1); // 输出 [1, 0, 0]
-
-    // 查找 { id: 2, tag: 'kengzi', children: [] } 的索引
-    const result2 = findIndexByItem(data, { id: 2, tag: 'anlai110', children: [] });
-    console.log('Result 2:', result2); // 输出 [1, 1, -1]
   });
   watch(
     () => tableData.value,
@@ -448,12 +374,19 @@
   const handlePageNumChange = () => {};
   const handlePageSizeChange = () => {};
 
+  const companyDrawerChild = ref();
+
   const companyAdd = () => {
     tableCom.value = true;
     // emit;
 
-    resetDraw();
-    console.log('ruleForm', ruleForm);
+    // const childComponent = refs.companyDrawerChild;
+    if (companyDrawerChild.value) {
+      companyDrawerChild.value.resetDrawCom(); // 这里假设resetDraw是子组件中用于重置的方法
+    }
+
+    // resetDraw();
+    // console.log('ruleForm', ruleForm);
 
     addEnable.value = ENABLED.TRUE;
     ruleForm.seniorScene = '顶级场景';
@@ -491,11 +424,6 @@
 
   //添加公司场景的提交按钮
   const addNewTypeCom = (ruleFormCom, selectItemsCom, addEnableCom) => {
-    //选出不为空字符串的数据
-    selectItemsCom.value = selectItemsCom.value.filter((item) => {
-      return item.tag && item.template;
-    });
-
     //取出数据中所有的code数据
     const allCodes = flattenCodes(tableData.value);
 
@@ -517,17 +445,20 @@
         type: 'error',
       })
         .then(() => {
-          ruleFormCom.code = '';
+          // ruleFormCom.code = '';
+          console.log('场景代码重复，请重新填写');
         })
         .catch(() => {
           console.log('取消删除物件');
         });
     } else {
-      // tableData.value.push(newComData);
-
       //提交数据并重置关闭el-draw
       addCompany(newComData)
         .then((res) => {
+          //选出不为空字符串的数据
+          selectItemsCom.value = selectItemsCom.value.filter((item) => {
+            return item.tag && item.template;
+          });
           //将selectItems加工成保存公司-模板的数据类型
           const newModuleLabel = selectItemsCom.value.map((item) => {
             return {
@@ -593,7 +524,8 @@
         type: 'error',
       })
         .then(() => {
-          ruleForm.sceneCode = '';
+          // ruleForm.sceneCode = '';
+          console.log('场景代码重复，请重新填写');
         })
         .catch(() => {
           console.log('取消删除物件');