Merge branch 'lkh-template' into 'all-v4'

Lkh template

See merge request skyeye/skyeye_frontend/skyeye-admin!203

src/api/template/template.ts

@@ -3,11 +3,13 @@ import { http } from '@/utils/http/axios';
 export interface SceneModule {
   code: string;
   // createdAt: string,
-  id: number;
+  id?: number | null;
   // isDeleted: number,
   name: string;
+  previewImage: string | null | undefined;
   remark: string;
-  status: number;
+  isDisabled: number;
+  elementIdList?: Array<string>;
   // updatedAt: string,
 }
 
@@ -78,7 +80,7 @@ export interface Response<Records> {
 // 查询所有场景模板,这边是新的
 export function getSceneModuleList(data: { pageNumber: number; pageSize: number }) {
   return http.request<Response<Records>>({
-    url: '/viewTemplate/queryViewTemplatePage',
+    url: '/admin/viewTemplate/queryViewTemplatePage',
     method: 'post',
     data,
   });
@@ -86,7 +88,7 @@ export function getSceneModuleList(data: { pageNumber: number; pageSize: number
 // 查询所有场景模板,全量接口
 export function getAllSceneModuleList() {
   return http.request<Records[]>({
-    url: '/viewTemplate/queryViewTemplateList',
+    url: '/admin/viewTemplate/queryViewTemplateList',
     method: 'post',
   });
 }
@@ -144,12 +146,20 @@ export function findWorkshopModuleByName(
   });
 }
 
-// 添加场景模板
-export function saveSceneModule(sceneModule: SceneModule) {
+// 添加场景模板,老的注释掉
+// export function saveSceneModule(sceneModule: SceneModule) {
+//   return http.request({
+//     url: '/template/saveSceneModule',
+//     method: 'post',
+//     params: sceneModule,
+//   });
+// }
+// 添加场景模板,老的注释掉
+export function saveSceneModule(data: SceneModule) {
   return http.request({
-    url: '/template/saveSceneModule',
+    url: '/admin/viewTemplate/saveViewTemplate',
     method: 'post',
-    params: sceneModule,
+    data,
   });
 }
 
@@ -171,10 +181,17 @@ export function saveWorkshopModule(workshopModule: WorkshopModule) {
   });
 }
 
+// 删除场景模板,老的注释掉
+// export function deleteSceneModule(sceneModuleId: number) {
+//   return http.request({
+//     url: `/template/deleteSceneModule?sceneModuleId=${sceneModuleId}`,
+//     method: 'delete',
+//   });
+// }
 // 删除场景模板
 export function deleteSceneModule(sceneModuleId: number) {
   return http.request({
-    url: `/template/deleteSceneModule?sceneModuleId=${sceneModuleId}`,
+    url: `/admin/viewTemplate/deleteViewTemplate?viewTemplateId=${sceneModuleId}`,
     method: 'delete',
   });
 }
@@ -195,12 +212,21 @@ export function deleteWorkshopModule(workshopModuleId: number) {
   });
 }
 
+// 编辑场景模板,老的注释掉
+// export function updateSceneModule(sceneModule: SceneModule) {
+//   return http.request({
+//     url: '/template/updateSceneModule',
+//     method: 'put',
+//     params: sceneModule,
+//   });
+// }
+
 // 编辑场景模板
-export function updateSceneModule(sceneModule: SceneModule) {
+export function updateSceneModule(data: SceneModule) {
   return http.request({
-    url: '/template/updateSceneModule',
+    url: '/admin/viewTemplate/updateViewTemplate',
     method: 'put',
-    params: sceneModule,
+    data,
   });
 }
 

src/views/templateManage/CardCommon.vue

@@ -12,25 +12,36 @@
       @clear-data="clearData"
     >
     </TitleCommon> -->
+    <el-image-viewer
+      v-if="showViewer"
+      :url-list="urlList"
+      @close="
+        () => {
+          showViewer = false;
+        }
+      "
+      :z-index="99"
+    />
 
     <div class="body">
       <el-button type="primary" :icon="Plus" @click="addForm" style="margin-bottom: 16px">
-        {{ props.type }}</el-button
+        添加模板</el-button
       >
       <el-table style="width: 100%" :data="tableData" highlight-current-row>
-        <el-table-column :label="props.type + `名称`" prop="name" />
+        <el-table-column label="模板名称" prop="name" min-width="14%" />
         <!-- <el-table-column :label="props.type + `代码`" prop="code" /> -->
-
-        <el-table-column prop="status" label="状态">
+        <el-table-column label="模板编码" prop="code" min-width="14%" />
+        <el-table-column label="看板组件" min-width="14%" />
+        <el-table-column prop="isDisabled" label="状态" min-width="14%">
           <template #default="scope">
             <el-tag v-if="scope.row.isDisabled === 0" type="success">启用</el-tag>
             <el-tag v-else type="danger">禁用</el-tag>
           </template>
         </el-table-column>
 
-        <el-table-column label="备注" prop="remark" />
-        <el-table-column label="创建时间" prop="createdAt" />
-        <el-table-column label="操作">
+        <el-table-column label="创建时间" prop="createdAt" min-width="14%" />
+        <el-table-column label="备注" prop="remark" min-width="16%" />
+        <el-table-column label="操作" min-width="14%">
           <!-- <template #default="scoped">
             <el-popconfirm title="确认要删除吗？" @confirm="deleteTableData(scoped.row)">
               <template #reference>
@@ -51,7 +62,7 @@
             />
           </template> -->
           <template #default="scope">
-            <el-button link type="primary" size="small" @click="showEditDrawer(scope.row)"
+            <el-button link type="primary" size="small" @click="showPreview(scope.row)"
               ><el-tooltip class="box-item" effect="dark" content="预览" placement="top">
                 <el-icon :size="16">
                   <View />
@@ -66,7 +77,7 @@
               </el-tooltip>
             </el-button>
 
-            <el-button link type="primary" size="small" @click="deleteTableData(scope.row)"
+            <el-button link type="primary" size="small" @click="showDeleteDialog(scope.row)"
               ><el-tooltip class="box-item" effect="dark" content="删除" placement="top">
                 <el-icon :size="16">
                   <Delete />
@@ -90,31 +101,32 @@
       </div>
     </div>
 
-    <el-drawer
-      v-model="cardeditDrawer"
-      direction="rtl"
-      :title="type === '模板' ? '编辑模板' : '编辑标签'"
-      :before-close="handleClose"
-    >
-      <DrawerCommonVue
-        :detail="currentdrawerFormData"
-        :type="props.type"
-        v-if="currentdrawerFormData"
-        @submit-drawer="submitDrawer"
-      />
-    </el-drawer>
+    <DrawerCommonVue
+      ref="childRef"
+      :type="props.type"
+      :drawer-type="drawerType"
+      :add-item="addData"
+      :edit-item="submitDrawer"
+    />
+    <el-dialog v-model="dialogVisible" title="删除该条模板" width="30%" align-center>
+      <p>删除后，其他功能若关联该结构，也将同步更新。</p>
+      <p>是否确认删除？</p>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="dialogVisible = false">取消</el-button>
+          <el-button type="primary" @click="deleteTableData(currentRow)">确定</el-button>
+        </span>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
 <script setup lang="ts">
   import { onMounted, ref } from 'vue';
-  import { ElDrawer } from 'element-plus';
+  import { ElImageViewer } from 'element-plus';
   import { Plus, EditPen, View, Delete } from '@element-plus/icons-vue';
   import DrawerCommonVue, { FormModelCommon } from './DrawerCommon.vue';
-  import TitleCommon from './TitleCommon.vue';
   import { Records, SceneModule } from '@/api/template/template';
-  import del from '@/assets/icons/del.png';
-  import edit from '@/assets/icons/edit.png';
   // import { LabelType } from './constant';
 
   // const currentFormType = ref('场景');
@@ -130,7 +142,17 @@
   }>();
 
   const addForm = () => {
-    cardeditDrawer.value = true;
+    drawerType.value = 'add';
+    openDrawer(true);
+    setDrawerForm({
+      id: null,
+      code: '',
+      name: '',
+      component: '',
+      remark: '',
+      thumbnail: null,
+      isDisabled: 0,
+    });
   };
 
   export type CreateType = '添加模板' | '编辑模板' | '添加标签' | '编辑标签';
@@ -138,9 +160,10 @@
     id: number;
     name: string;
     code: string;
-    status: number;
+    isDisabled: number;
     remark: string;
     createAt: string;
+    previewImage: string;
   }
 
   export interface ModelCommon {
@@ -148,55 +171,109 @@
   }
 
   export interface Page {
-    page: number;
-    size: number;
+    pageNumber: number;
+    pageSize: number;
   }
 
   // const currentType = ref<CreateType>('编辑模板');
-  const currentdrawerFormData = ref<FormModelCommon>({} as FormModelCommon);
-  const cardeditDrawer = ref(false);
-  const cardaddDrawer = ref(false);
+  // const currentdrawerFormData = ref<FormModelCommon>({} as FormModelCommon);
+  // const cardeditDrawer = ref(false);
+  // const cardaddDrawer = ref(false);
   const currentPage = ref(1);
   const currentPageSize = ref(10);
   const total = ref(100);
   const tableData = ref<Records[]>([]);
 
+  const drawerType = ref('add'); //抽屉的功能是新建还是编辑
+
+  const childRef = ref<typeof DrawerCommonVue | null>(null);
+
+  const setDrawerForm = (detailsData: FormModelCommon) => {
+    if (childRef.value) {
+      // console.log('调用了子组件函数');
+      childRef.value.setForm(detailsData);
+    }
+  };
+
+  const openDrawer = (index: boolean) => {
+    if (childRef.value) {
+      // console.log('调用了子组件函数');
+      childRef.value.drawerSwitch(index);
+    }
+  };
+
+  const fillFileList = (name: string, url: string) => {
+    if (childRef.value) {
+      // console.log('调用了子组件函数');
+      childRef.value.setFileList(name, url);
+    }
+  };
+
+  const dialogVisible = ref(false);
+  const currentRow = ref<TableModel>({} as TableModel);
+
+  const showDeleteDialog = (row: TableModel) => {
+    dialogVisible.value = true;
+    currentRow.value = row;
+  };
+
   // 删除数据-finish
   function deleteTableData(row: TableModel) {
     // emit('deleteTableData', row);
-    props.deleteTableData(row).then((res) => {
-      console.log('deleteTableData', res);
-      getData({ page: currentPage.value, size: currentPageSize.value });
+    props.deleteTableData(row).then(() => {
+      dialogVisible.value = false;
+      getData({ pageNumber: currentPage.value, pageSize: currentPageSize.value });
     });
   }
 
+  const showViewer = ref(false);
+
+  const urlList = ref<string[]>();
+
+  const showPreview = (row: TableModel) => {
+    urlList.value = [];
+    // console.log('preViewImg=', row.previewImage);
+    urlList.value.push(row.previewImage);
+    showViewer.value = true;
+  };
+
   // 编辑数据弹框-finish
   function showEditDrawer(row: TableModel) {
-    cardeditDrawer.value = true;
-    console.log('row', row);
-    currentdrawerFormData.value = row;
+    drawerType.value = 'edit';
+    openDrawer(true);
+
+    setDrawerForm({
+      id: row.id,
+      code: row.code,
+      name: row.name,
+      component: '',
+      remark: row.remark,
+      thumbnail: row.previewImage,
+      isDisabled: row.isDisabled,
+    });
+    fillFileList(row.name, row.previewImage);
   }
 
   // 弹框关闭事件-finish
-  const handleClose = (done: () => void) => {
-    done();
-    closeDrawer();
-  };
+  // const handleClose = (done: () => void) => {
+  //   done();
+  //   closeDrawer();
+  // };
 
   // 编辑提交数据
   function submitDrawer(data: SceneModule) {
-    console.log('编辑提交数据：', data);
-    props.submitDrawer(data).then((res) => {
-      console.log('submitDrawer', res);
-      closeDrawer();
-      getData({ page: currentPage.value, size: currentPageSize.value });
+    // console.log('编辑提交数据：', data);
+    props.submitDrawer(data).then(() => {
+      // console.log('submitDrawer', res);
+      openDrawer(false);
+      getData({ pageNumber: currentPage.value, pageSize: currentPageSize.value });
     });
   }
 
   // 查询数据列表-finish
   function getData(data: Page) {
     props.getData(data).then((res) => {
-      console.log('getData', res);
+      // console.log('getData', res);
       tableData.value = res.records;
       total.value = res.totalRow;
     });
@@ -211,48 +288,50 @@
   // }
 
   // 单机添加按钮，控制弹框显示-finish
-  function clickAddData() {
-    cardaddDrawer.value = true;
-  }
+  // function clickAddData() {
+  //   cardaddDrawer.value = true;
+  // }
 
   // 添加数据-finish
   function addData(data: SceneModule) {
-    props.addData(data).then((res) => {
-      console.log('addData', res);
-      closeDrawer();
-
-      getData({ page: currentPage.value, size: currentPageSize.value });
+    props.addData(data).then(() => {
+      // console.log('addData', res);
+      openDrawer(false);
+      //如果是创建了新的，则列表回到第一页；如果只是编辑则列表位置不变
+      currentPage.value = 1;
+      currentPageSize.value = 10;
+      getData({ pageNumber: currentPage.value, pageSize: currentPageSize.value });
     });
   }
 
-  function closeDrawer() {
-    cardaddDrawer.value = false;
-    cardeditDrawer.value = false;
-    getData({ page: currentPage.value, size: currentPageSize.value });
-  }
+  // function closeDrawer() {
+  //   cardaddDrawer.value = false;
+  //   cardeditDrawer.value = false;
+  //   // getData({ pageNumber: currentPage.value, pageSize: currentPageSize.value });更新数据另外干，不用每次关闭抽屉就拉后端
+  // }
 
   // 清空输入框数据-finish
-  function clearData() {
-    // getSceneLabelList(currentPage.value, currentPageSize.value);
-    getData({ page: currentPage.value, size: currentPageSize.value });
-  }
+  // function clearData() {
+  //   // getSceneLabelList(currentPage.value, currentPageSize.value);
+  //   getData({ pageNumber: currentPage.value, pageSize: currentPageSize.value });
+  // }
 
   // 页数-finish
   function handleSizeChangeFun(val: number) {
     currentPageSize.value = val;
-    getData({ page: currentPage.value, size: currentPageSize.value });
+    getData({ pageNumber: currentPage.value, pageSize: currentPageSize.value });
   }
 
   // 翻页-finish
   function handlePageChangeFun(val: number) {
     currentPage.value = val;
     console.log('currentPage:' + currentPage.value);
-    getData({ page: currentPage.value, size: currentPageSize.value });
+    getData({ pageNumber: currentPage.value, pageSize: currentPageSize.value });
   }
 
   onMounted(() => {
     // getData(props.currentPage, props.currentPageSize);
-    getData({ page: currentPage.value, size: currentPageSize.value });
+    getData({ pageNumber: currentPage.value, pageSize: currentPageSize.value });
   });
 </script>
 

src/views/templateManage/DrawerCommon.vue

@@ -1,141 +1,170 @@
 <template>
   <div>
-    <el-form ref="ruleDrawerRef" :model="form" label-width="100px">
-      <el-form-item
-        label="模板名称"
-        prop="name"
-        :rules="[
-          {
-            required: true,
-            message: '输入模板名称',
-            trigger: 'blur',
-          },
-        ]"
-      >
-        <el-input placeholder="请输入模板名称" v-model="form.name" />
-      </el-form-item>
-
-      <el-form-item
-        label="模板编码"
-        prop="code"
-        :rules="[
-          {
-            required: true,
-            message: '输入模板编码',
-            trigger: 'blur',
-          },
-        ]"
-      >
-        <el-input placeholder="请输入模板编码" v-model="form.code" />
-      </el-form-item>
-
-      <el-form-item label="看板组件">
-        <el-select v-model="form.component" disabled>
-          <el-option label="Zone one" value="shanghai" />
-          <el-option label="Zone two" value="beijing" />
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="预览图片">
-        <el-upload
-          ref="uploadRef"
-          :class="{ 'no-el-upload': fileList.length > 0 }"
-          :action="actionUrl"
-          :on-preview="handlePictureCardPreview"
-          :on-remove="handleUploadRemove"
-          :on-success="handleUploadSuccess"
-          :before-upload="beforeThumbnailUpload"
-          :limit="1"
-          :headers="getHeaders()"
-          :data="{ bizType: 'COMPANY_THUMBNAIL' }"
-          list-type="picture-card"
-          v-model:file-list="fileList"
+    <el-drawer v-model="openDrawer" :title="props.drawerType === 'add' ? '添加模板' : '编辑模板'">
+      <el-form ref="ruleDrawerRef" :model="form" label-width="100px">
+        <el-form-item
+          label="模板名称"
+          prop="name"
+          :rules="[
+            {
+              required: true,
+              message: '输入模板名称',
+              trigger: 'blur',
+            },
+          ]"
         >
-          <!-- <img v-if="ruleForm.thumbnail" :src="ruleForm.thumbnail" />
+          <el-input placeholder="请输入模板名称" v-model="form.name" />
+        </el-form-item>
+
+        <el-form-item
+          label="模板编码"
+          prop="code"
+          :rules="[
+            {
+              required: true,
+              message: '输入模板编码',
+              trigger: 'blur',
+            },
+          ]"
+        >
+          <el-input placeholder="请输入模板编码" v-model="form.code" />
+        </el-form-item>
+
+        <el-form-item label="看板组件">
+          <el-select v-model="form.component" disabled>
+            <el-option label="Zone one" value="shanghai" />
+            <el-option label="Zone two" value="beijing" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item
+          label="预览图片"
+          prop="thumbnail"
+          :rules="[
+            {
+              required: true,
+              message: '上传预览图片',
+              trigger: 'blur',
+            },
+          ]"
+        >
+          <el-upload
+            ref="uploadRef"
+            :class="{ 'no-el-upload': fileList.length > 0 }"
+            :action="actionUrl"
+            :on-preview="handlePictureCardPreview"
+            :on-remove="handleUploadRemove"
+            :on-success="handleUploadSuccess"
+            :before-upload="beforeThumbnailUpload"
+            :limit="1"
+            :headers="getHeaders()"
+            :data="{ bizType: 'COMPANY_THUMBNAIL' }"
+            list-type="picture-card"
+            v-model:file-list="fileList"
+          >
+            <!-- <img v-if="ruleForm.thumbnail" :src="ruleForm.thumbnail" />
             <el-icon v-else><Plus /></el-icon> -->
-          <el-icon v-if="!form.thumbnail || form.thumbnail.length === 0"><Plus /></el-icon>
-        </el-upload>
-      </el-form-item>
+            <el-icon v-if="!form.thumbnail || form.thumbnail.length === 0"><Plus /></el-icon>
+          </el-upload>
+        </el-form-item>
 
-      <el-form-item label="备注" prop="remark">
-        <el-input placeholder="请输入备注" v-model="form.remark" />
-      </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input placeholder="请输入备注" v-model="form.remark" />
+        </el-form-item>
 
-      <!-- <el-form-item label="模板上传">
+        <!-- <el-form-item label="模板上传">
         <el-upload>
           <el-button disabled>上传</el-button>
         </el-upload>
       </el-form-item> -->
 
-      <!-- <el-form-item label="状态" prop="status">
+        <!-- <el-form-item label="状态" prop="status">
         <el-switch v-model="form.status" :active-value="0" :inactive-value="1" />
       </el-form-item> -->
 
-      <el-form-item label="状态" label-position="right">
-        <el-radio-group v-model="status" aria-label="label position">
-          <el-radio-button :value="1">启用</el-radio-button>
-          <el-radio-button :value="0">禁用</el-radio-button>
-        </el-radio-group>
-      </el-form-item>
-
-      <el-form-item style="margin-top: 100px">
-        <el-button style="margin-left: auto" @click="resetForm(ruleDrawerRef)">重置</el-button>
-        <el-button @click="submitDrawer(ruleDrawerRef)" type="primary">提交</el-button>
-      </el-form-item>
-    </el-form>
+        <el-form-item label="状态" label-position="right">
+          <el-radio-group v-model="status" aria-label="label position">
+            <el-radio-button :value="0">启用</el-radio-button>
+            <el-radio-button :value="1">禁用</el-radio-button>
+          </el-radio-group>
+        </el-form-item>
+
+        <el-form-item style="margin-top: 100px">
+          <el-button style="margin-left: auto" @click="resetForm(ruleDrawerRef)">重置</el-button>
+          <el-button @click="submitDrawer(ruleDrawerRef)" type="primary">提交</el-button>
+        </el-form-item>
+      </el-form>
+    </el-drawer>
   </div>
 </template>
 
 <script setup lang="ts">
-  import { ref, watch, computed } from 'vue';
+  import { ref, computed, defineExpose } from 'vue';
   import { FormInstance, ElMessage } from 'element-plus';
   import { onMounted } from 'vue';
-  import { cloneDeep, isEqual } from 'lodash-es';
+  // import { cloneDeep, isEqual } from 'lodash-es';
   import type { UploadRawFile, UploadFile } from 'element-plus';
   import { Plus } from '@element-plus/icons-vue';
   import { getHeaders } from '@/utils/http/axios';
   import { useGlobSetting } from '@/hooks/setting';
   import urlJoin from 'url-join';
-  import { uid } from 'uid';
+  import { SceneModule } from '@/api/template/template';
+  // import { uid } from 'uid';
 
   export interface FormModelCommon {
-    id?: number;
+    id?: number | null;
     code: string;
     name: string;
     component: string;
-    image: string;
     remark: string;
-    thumbnail?: string;
+    thumbnail: string | null | undefined;
+    isDisabled?: number;
   }
   export type CreateType = 'create' | 'edit';
-  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 props = defineProps<{
+    type: string;
+    drawerType: string;
+    addItem: (data: SceneModule) => unknown;
+    editItem: (data: SceneModule) => unknown;
+  }>();
+
+  const openDrawer = ref(false);
 
   const form = ref<FormModelCommon>({
-    id: undefined,
     name: '',
     code: '',
     component: '',
-    image: '',
     remark: '',
+    thumbnail: null,
   });
 
-  const status = ref(1); //el-radio不能绑对象，因此把他独立出来
+  const dataUpload = ref<SceneModule>({
+    code: '',
+    name: '',
+    previewImage: null,
+    remark: '',
+    isDisabled: 0,
+  });
+
+  const status = ref(0); //el-radio不能绑对象，因此把他独立出来
 
   const { urlPrefix } = useGlobSetting();
 
   const actionUrl = computed(() => {
-    return urlJoin(urlPrefix!, `/issue/uploadPicture`);
+    return urlJoin(urlPrefix!, `admin/minio/uploadFile`);
   });
   const uploadRef = ref();
   const fileList = ref<UploadFile[]>([]);
+
+  // watch(
+  //   fileList,
+  //   (newVal) => {
+  //     form.value.thumbnail = newVal[0]?.url;
+  //   },
+  //   {
+  //     deep: true, // 如果数组中是对象，则需要设置deep选项来深度监听
+  //   },
+  // );
   const dialogImageUrl = ref('');
   const dialogVisible = ref(false);
 
@@ -161,23 +190,6 @@
     return true;
   };
 
-  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,
-    () => {
-      getValue();
-    },
-    { immediate: true },
-  );
-
   const ruleDrawerRef = ref<FormInstance>();
 
   function resetForm(formE1: FormInstance | undefined) {
@@ -186,23 +198,61 @@
     form.value.name = '';
     form.value.code = '';
     form.value.remark = '';
-    form.value.status = 0;
-    console.log('resetForm');
+    status.value = 0;
+    form.value.thumbnail = null;
+    // console.log('resetForm');
   }
 
+  const setForm = (details: FormModelCommon) => {
+    // console.log('form=====', form.value);
+    form.value.id = details.id;
+    form.value.name = details.name;
+    form.value.code = details.code;
+    form.value.remark = details.remark;
+    status.value = details.isDisabled ? details.isDisabled : 0;
+    form.value.thumbnail = details.thumbnail;
+  };
+
+  const drawerSwitch = (index: boolean) => {
+    openDrawer.value = index;
+  };
+
+  const setFileList = (name: string, url: string) => {
+    fileList.value = [];
+    fileList.value.push({
+      name: name + '模板图片',
+      status: 'success',
+      uid: 1,
+      url: url,
+    });
+  };
+
+  defineExpose({
+    setForm,
+    drawerSwitch,
+    setFileList,
+  });
+
   function submitDrawer(formEl: FormInstance | undefined) {
-    console.log('common-', form, props.detail.code);
     if (!formEl) return;
     formEl.validate((valid, fields) => {
       if (valid) {
-        const drawerData = {
-          id: form.value.id,
-          name: form.value.name,
-          code: form.value.code === '' ? uid(16) : form.value.code,
-          remark: form.value.remark,
-          status: form.value.status,
-        };
-        emit('submitDrawer', drawerData);
+        if (props.drawerType === 'add') {
+          dataUpload.value.code = form.value.code;
+          dataUpload.value.name = form.value.name;
+          dataUpload.value.previewImage = form.value.thumbnail;
+          dataUpload.value.remark = form.value.remark;
+          dataUpload.value.isDisabled = status.value;
+          props.addItem(dataUpload.value);
+        } else {
+          dataUpload.value.id = form.value.id;
+          dataUpload.value.code = form.value.code;
+          dataUpload.value.name = form.value.name;
+          dataUpload.value.previewImage = form.value.thumbnail;
+          dataUpload.value.remark = form.value.remark;
+          dataUpload.value.isDisabled = status.value;
+          props.editItem(dataUpload.value);
+        }
       } else {
         console.log('error submit!', fields);
       }
@@ -210,8 +260,10 @@
   }
 
   onMounted(() => {
-    console.log('drawercommon-form', form);
-    console.log('drawercommon-props', props.detail);
+    if (props.drawerType === 'add') {
+      console.log('出发了重置');
+      resetForm(undefined);
+    }
   });
 </script>
 

src/views/templateManage/SceneManager.vue

@@ -73,8 +73,8 @@
   // }
 
   // 查找数据列表-finish
-  function getSceneLabelListFun(data) {
-    return getSceneModuleList(data.page, data.size)
+  function getSceneLabelListFun(data: { pageNumber: number; pageSize: number }) {
+    return getSceneModuleList({ pageNumber: data.pageNumber, pageSize: data.pageSize })
       .then((res) => {
         return res;
       })