feat：新版交接班

src/components/Upload/Excel.vue

@@ -2,7 +2,7 @@
 <template>
   <el-dialog :title="prop.title" v-model="state.upload.open" :close-on-click-modal="false" draggable>
     <el-upload ref="uploadRef" :limit="1" accept=".xlsx, .xls" :headers="headers"
-      :action="baseURL + other.adaptationUrl(url)" :disabled="state.upload.isUploading"
+      :action="baseURL + other.adaptationUrl(url)" :data="importData" :disabled="state.upload.isUploading"
       :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :on-error="handleFileError"
       :auto-upload="false" drag>
       <i class="el-icon-upload"></i>
@@ -48,6 +48,10 @@ const prop = defineProps({
   url: {
     type: String,
   },
+  importData: {
+    type: Object,
+    default: () => { },
+  },
   title: {
     type: String,
   },
@@ -75,7 +79,7 @@ const state = reactive({
  * 下载模板文件
  */
 const downExcelTemp = async () => {
-  if (prop.tempUrl) {
+  if (prop.tempUrl && prop.tempUrl !== 'null') {
     try {
       await other.downBlobFile(other.adaptationUrl(prop.tempUrl), {}, 'temp.xlsx');
     } catch (error) {

src/views/duty/sysDuty/components/duty-table.vue

@@ -0,0 +1,136 @@
+<template>
+    <el-dialog title="排班表" v-model="visible" style="width: 80%;" :close-on-click-modal="false" draggable>
+        <el-table v-if="tableHeaderList && tableHeaderList.length" :data="disposeDataList" v-loading="state.loading"
+            border :cell-style="tableStyle.cellStyle" :header-cell-style="tableStyle.headerCellStyle"
+            @sort-change="sortChangeHandle">
+            <el-table-column type="index" label="#" width="40" />
+            <el-table-column v-for="(v, i) in tableHeaderList" width="100" :prop="v.prop" :label="v.label">
+                <el-table-column v-if="v.children && v.children.length" v-for="(v2, i2) in v.children" :prop="v2.prop"
+                    :label="v2.label" />
+            </el-table-column>
+        </el-table>
+        <template #footer>
+            <span class="dialog-footer">
+                <el-button @click="visible = false">取消</el-button>
+            </span>
+        </template>
+    </el-dialog>
+</template>
+
+<script setup lang="ts" name="dutyTable">
+import { BasicTableProps, useTable } from "/@/hooks/table";
+
+import * as sysDutyApi from "/@/api/sys/sysDuty";
+import * as sysDutyItemApi from "/@/api/sys/sysDutyItem";
+
+const emit = defineEmits(['refresh']);
+
+const visible = ref(false)
+
+const tableHeaderList = ref<Array<{
+    prop: string,
+    label: string,
+    children: Array<{
+        prop: string,
+        label: string,
+    }>
+}>>([])
+
+const disposeDataList = ref<any>([])
+
+const queryForm = reactive<any>({
+    id: ''
+})
+
+const detail = reactive<any>({
+})
+
+const state: BasicTableProps = reactive<BasicTableProps>({
+    createdIsNeed: false,
+    queryForm: {
+        dutyId: ""
+    },
+    pageList: sysDutyItemApi.fetchList
+})
+
+//  table hook
+const {
+    getDataList,
+    currentChangeHandle,
+    sizeChangeHandle,
+    sortChangeHandle,
+    downBlobFile,
+    tableStyle
+} = useTable(state)
+
+
+// 打开弹窗
+const openDialog = async (id: string) => {
+    visible.value = true
+    queryForm.id = id
+    state.queryForm.dutyId = id
+    if (id) {
+        await getsysDutyData(id)
+        await getDataList()
+        const _list: Array<any> = []
+        if (state.dataList && state.dataList.length) {
+            for (const v of state.dataList) {
+                if (!v.rowJson || !v.rowJson.length) continue
+                const _obj: any = {}
+                for (const item of v.rowJson) {
+                    _obj[item.key] = item.content
+                }
+                _list.push(_obj)
+            }
+        }
+        disposeDataList.value = _list
+    }
+}
+
+// 初始化表单数据
+const getsysDutyData = async (id: string) => {
+    // 获取数据
+    try {
+        const { data } = await sysDutyApi.getObj(id)
+        Object.assign(detail, data)
+        const _tableHeaderList: Array<{
+            prop: string,
+            label: string,
+            children: []
+        }> = []
+        if (data && data.configJson && data.configJson.length) {
+            for (let index = 0; index < data.configJson.length; index++) {
+                const element = data.configJson[index];
+                if (!element) continue
+                const isExist = _tableHeaderList.some(v => v.label == element.mainLabel)
+                if (isExist) continue
+                const entity = {
+                    prop: element.key,
+                    label: element.mainLabel,
+                    children: []
+                }
+                const children = data.configJson.filter((v: any) => v.mainLabel == element.mainLabel) ?? []
+                if (children.length >= 2) {
+                    entity.prop = ""
+                    entity.children = children.map((v: any) => {
+                        return {
+                            prop: v.key,
+                            label: v.subLabel,
+                        }
+                    })
+                }
+                _tableHeaderList.push(entity as any)
+            }
+        }
+        tableHeaderList.value = _tableHeaderList
+        console.log("tableHeaderList:", tableHeaderList.value);
+    } catch (error) {
+        console.log("|初始化表单数据|意外的错误:", error);
+    }
+};
+
+// 暴露变量
+defineExpose({
+    openDialog
+});
+</script>

src/views/duty/sysDuty/index.vue

@@ -43,11 +43,14 @@
             <span>{{ row.endTime }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="操作" width="200">
+        <el-table-column label="操作" width="300">
           <template #default="{ row }">
             <el-button icon="UploadFilled" text type="primary" @click="importDutyItem(row)">
               导入
             </el-button>
+            <el-button icon="Grid" text type="primary" @click="dutyTable(row)">
+              排班表
+            </el-button>
             <el-button icon="edit-pen" text type="primary" v-auth="'admin_sysDuty_edit'"
               @click="formDialogRef.openDialog(row.id)">
               编辑
@@ -64,9 +67,11 @@
     <!-- 编辑、新增  -->
     <form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
 
+    <duty-table-dialog ref="dutyTableDialogRef" />
+
     <!-- 导入 -->
-    <upload-excel ref="excelUploadRef" title="基地周值班表导入" temp-url="" url="/admin/user/import"
-      @refreshDataList="getDataList" @downExcelTemp="downExcelTemp" />
+    <upload-excel ref="excelUploadRef" title="基地周值班表导入" temp-url="null" :importData="importData"
+      url="/admin/sys-duty/import-template" @refreshDataList="getDataList" @downExcelTemp="downExcelTemp" />
 
   </div>
 </template>
@@ -81,10 +86,13 @@ import { useDict } from '/@/hooks/dict';
 
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
+const DutyTableDialog = defineAsyncComponent(() => import('./components/duty-table.vue'));
+
 // 定义查询字典
 
 // 定义变量内容
 const formDialogRef = ref()
+const dutyTableDialogRef = ref()
 const excelUploadRef = ref()
 // 搜索变量
 const queryRef = ref()
@@ -92,6 +100,8 @@ const showSearch = ref(true)
 // 多选变量
 const selectObjs = ref([]) as any
 const multiple = ref(true)
+const currentRow = ref()
+const importData = ref({})
 
 const state: BasicTableProps = reactive<BasicTableProps>({
   queryForm: {},
@@ -129,14 +139,22 @@ const selectionChangHandle = (objs: { id: string }[]) => {
 };
 
 const importDutyItem = (row: any) => {
+  currentRow.value = row
+  importData.value = {
+    id: currentRow.value.id
+  }
   excelUploadRef.value.show()
 }
 
+const dutyTable = (row: any) => {
+  dutyTableDialogRef.value.openDialog(row.id)
+}
+
 const downExcelTemp = async () => {
   try {
-    await other.downBlobFile(other.adaptationUrl(""), {}, 'temp.xlsx');
+    await other.downBlobFile("/admin/sys-duty/export-template", { dutyId: currentRow.value.id }, "基地周值班表模版.xlsx");
   } catch (error) {
-    useMessage().error("模板下载失败");
+    useMessage().error("基地周值班表模版下载失败");
   }
 }