添加 循环体间隔字段, 修改刷新问题

src/layout/components/LayoutSiderBar.vue

@@ -17,7 +17,8 @@ import SiderBarItem from './SiderBarItem.vue';
 const isCollapse = ref(false)
 import { routes } from '@/router/index'
 import { useRouter } from 'vue-router';
-const items = ref(routes)
+
+const items = ref(routes.filter(_ => !_.hidden))
 const router = useRouter()
 const activeIndex = computed(() => router.currentRoute.value.path)
 

src/router/index.ts

@@ -146,6 +146,7 @@ export const routes = [
   {
     path: '/online-excel',
     name: 'OnlineExcel',
+    hidden: true,
     meta: {
       title: '订单上传'
     },
@@ -154,8 +155,17 @@ export const routes = [
   {
     path: '/comment-excel',
     name: 'CommentExcel',
+    hidden: true,
     meta: {
-      title: '订单上传2'
+      title: '订单文件标注'
+    },
+    component: () => import('@/views/comment-excel/CommentExcel.vue')
+  },
+  {
+    path: '/comment-upload',
+    name: 'CommentUpload',
+    meta: {
+      title: '订单上传'
     },
     component: () => import('@/views/comment-excel/CommentExcel.vue')
   }

src/views/comment-excel/CommentExcel.vue

 <template>
-  <ChooseFile @upload="fileUpload" v-if="mode === 'upload'" />
-
-  <ExcelOperate v-else-if="mode === 'operate'" />
+  <ExcelOperate v-if="loading"  />
 </template>
 
 <script lang="ts" setup>
@@ -9,24 +7,22 @@ import { onMounted, ref } from 'vue'
 import { useRoute } from 'vue-router'
 import { getOrderFileById } from '@/api/order'
 import { useCommentExcel } from '@/stores/commentExcel'
-import ChooseFile from './components/ChooseFile/ChooseFile.vue'
 import ExcelOperate from './components/ExcelOperate/ExcelOperate.vue'
 
+
+const loading = ref(false)
 const route = useRoute()
 const { setFileInfo } = useCommentExcel()
-const mode = ref('upload')
-const fileUpload = () => {
-  mode.value = 'operate'
-}
 
 // 获取文件信息及客户信息
 const queryFileInfo = async () => {
   const { data } = await getOrderFileById(route.query.fileId as string)
   setFileInfo(data.result)
-  mode.value = 'operate'
+  loading.value = true
 }
 
 onMounted(() => {
+  
   route.query?.fileId && queryFileInfo()
 })
 </script>

src/views/comment-excel/CommentUpload.vue

+<template>
+  <ChooseFile @upload="uploadSuccess" />
+</template>
+
+<script lang="ts" setup>
+import { useRouter } from 'vue-router'
+import ChooseFile from './components/ChooseFile/ChooseFile.vue'
+
+const router = useRouter()
+const uploadSuccess = (data) => {
+  router.replace({
+    path: '/comment-excel',
+    query: {
+      fileId: data.fileId
+    }
+  })
+}
+</script>
+<style lang="scss" scoped></style>

src/views/comment-excel/components/ChooseFile/ChooseFile.vue

@@ -106,8 +106,8 @@ const submitForm = async () => {
     customerId: formState.customerId
   }
   apiSaveUpload(params).then(({ data }) => {
-    const { setFileInfo } = useCommentExcel()
-    setFileInfo(data.result)
+    // const { setFileInfo } = useCommentExcel()
+    // setFileInfo(data.result)
     emit('upload', data.result)
   })
 }

src/views/comment-excel/components/ExcelOperate/ExcelOperate.vue

@@ -29,6 +29,11 @@
                 <el-input v-model="formState.excelAreaNicname" clearable></el-input>
               </el-form-item>
             </el-col>
+            <el-col :span="24">
+              <el-form-item label="循环体间隔" prop="checkNumber">
+                <el-input type="number" v-model="formState.checkNumber" clearable></el-input>
+              </el-form-item>
+            </el-col>
             <el-col :span="24">
               <el-button type="primary" @click="setAreaMark('data')">设置数据区</el-button>
               <el-button type="primary" @click="setAreaMark('head')">设置标题区</el-button>
@@ -37,9 +42,15 @@
         </el-form>
 
         <div class="border-b-2 p-2 leading-7 text-sm">
-          <p class="font-bold">当前标记数据区域：</p>
-          <p class="text-slate-600">
-            选择区域：{{
+          <el-descriptions
+            class="current-area-mark"
+            border
+            title="当前标记数据区域"
+            size="small"
+            :column="2"
+          >
+            <el-descriptions-item label-class-name="descriptions-label" label="标记区域">
+              {{
                 getRangetxt(
                   currentAreaMark.beginRow,
                   currentAreaMark.endRow,
@@ -47,13 +58,21 @@
                   currentAreaMark.endColum
                 )
               }}
-          </p>
-          <p class="text-slate-600">
-            区域类型：{{ getAreaTypeText(currentAreaMark.excelAreaType) }}
-          </p>
-          <p class="text-slate-600">区域别称：{{ currentAreaMark.excelAreaNicname || '--' }}</p>
+            </el-descriptions-item>
+            <el-descriptions-item label-class-name="descriptions-label" label="区域类型">
+              {{ getAreaTypeText(currentAreaMark.excelAreaType) }}
+            </el-descriptions-item>
+            <el-descriptions-item label-class-name="descriptions-label" :span="2" label="区域别称">
+              {{ currentAreaMark.excelAreaNicname || '--' }}
+            </el-descriptions-item>
+            <el-descriptions-item label-class-name="descriptions-label" label="循环体间隔">
+              {{ currentAreaMark.checkNumber || '--' }}
+            </el-descriptions-item>
+            
+          </el-descriptions>
+
           <el-checkbox true-label="Y" false-label="N" v-model="currentAreaMark.oneself"
-            >是否包含自身</el-checkbox
+            >标题区作为数据</el-checkbox
           >
           <vxe-table
             class="mb-2"
@@ -202,9 +221,9 @@
       </template>
     </vxe-modal>
 
-    <vxe-modal width="1200" title="解析结果" v-model="runResultVisible">
+    <vxe-modal width="80%" title="解析结果" v-model="runResultVisible">
       <el-button @click="exportRunData">导出数据</el-button>
-      <vxe-table ref="runDataTable" size="mini" :data="runResultData" border height="600">
+      <vxe-table ref="runDataTable" size="mini" :data="runResultData" border height="500">
         <vxe-column title="行号" field="sortNum" width="120"></vxe-column>
         <template v-for="item in runResultTitle" :key="item">
           <vxe-column :title="item" :field="item" width="120"></vxe-column>
@@ -229,7 +248,7 @@ import { flatten, cloneDeep } from 'lodash-es'
 import { useCommentExcel } from '@/stores/commentExcel'
 import { storeToRefs } from 'pinia'
 import { isFunction } from '@/utils/is'
-import { ElMessage, ElMessageBox, type FormInstance } from 'element-plus'
+import { ElMessage, ElMessageBox, type FormInstance, type FormItemRule } from 'element-plus'
 import {
   addExcelArea,
   addExcelAreaConnect,
@@ -248,7 +267,19 @@ import { apiDictFindById, apiDictList } from '@/api/common'
 const settingForm = ref<FormInstance>()
 const rules = reactive({
   excelAreaNicname: [{ required: true, message: '请输入区域别称！', trigger: 'change' }],
-  excelAreaType: [{ required: true, message: '请选择区域类型！', trigger: 'change' }]
+  excelAreaType: [{ required: true, message: '请选择区域类型！', trigger: 'change' }],
+  checkNumber: [
+    {
+      validator: (rule, value, cb) => {
+        if (value <= 0) {
+          cb(new Error('请输入正整数！'))
+          return false
+        }
+        return true
+      },
+      trigger: 'change'
+    }
+  ]
 })
 const connectVisible = ref(false)
 const xTableConnect = ref<VxeTableInstance>()
@@ -295,7 +326,8 @@ const formState = reactive({
   endRow: '',
   endColum: '',
   excelAreaType: '',
-  excelAreaNicname: ''
+  excelAreaNicname: '',
+  checkNumber: 1
 })
 
 watch(
@@ -475,7 +507,8 @@ const resetCurrentAreaState = (isedit: boolean = false) => {
     excelAreaType: '',
     excelAreaNicname: '',
     excelAreaTitle: [],
-    oneself: 'N'
+    oneself: 'N',
+    checkNumber: ''
   }
   isedit && (tmp.excelAreaId = '')
   Object.assign(currentAreaMark, tmp)
@@ -911,3 +944,10 @@ onUnmounted(() => {
   }
 }
 </style>
+<style lang="scss">
+.current-area-mark {
+  .el-descriptions__label {
+    width: 7em;
+  }
+}
+</style>

src/views/order/orderList/OrderList.vue

@@ -34,7 +34,7 @@
         <vxe-column field="customerId_dictText" title="客户名称" width="200"></vxe-column>
         <vxe-column field="filePath" title="原始文件地址"></vxe-column>
         <vxe-column field="mergeFilePath" title="标注文件地址"></vxe-column>
-        <vxe-column field="action" title="操作" width="100">
+        <vxe-column field="action" title="操作" width="140">
           <template #default="{row}">
             <el-button type="primary" text size="small" @click="toDetail(row)">查看</el-button>
             <el-button type="primary" text size="small" @click="toDetail2(row)">查看新</el-button>