feat开发

src/views/production-safety/risk-identification-and-control/labor-products-purchase-apply-manage/Item.vue

@@ -1,46 +1,7 @@
 <template>
-  <div class="safety-platform-container">
-    <header class="safety-platform-container__header">
-      <BreadcrumbBack />
-      <span class="breadcrumb-title">{{ headerTitle }}</span>
-    </header>
-    <Detail />
-  </div>
+  <Detail />
 </template>
 
 <script setup lang="ts">
-  import { computed } from 'vue';
-  import { useRoute } from 'vue-router';
-  import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
   import Detail from './components/detail.vue';
-
-  const route = useRoute();
-  const operate = route.query.operate as string;
-
-  const headerTitle = computed(() => {
-    switch (operate) {
-      case 'inventory-create':
-        return '新增劳防用品采购申请';
-      case 'inventory-edit':
-        return '编辑劳防用品采购申请';
-      case 'inventory-view':
-        return '查看劳防用品采购申请';
-      case 'audit':
-        return '审核劳防用品采购申请';
-      default:
-        return '劳防用品采购申请详情';
-    }
-  });
 </script>
-
-<style scoped lang="scss">
-  @use '@/styles/page-details-layout.scss' as *;
-  @use '@/styles/page-main-layout.scss' as *;
-
-  .safety-platform-container__header {
-    flex-direction: row !important;
-    justify-content: flex-start !important;
-    gap: 8px !important;
-  }
-</style>
-

src/views/production-safety/risk-identification-and-control/labor-products-purchase-apply-manage/components/detail.vue

@@ -1,5 +1,10 @@
 <template>
-  <main class="safety-platform-container__main">
+  <div class="safety-platform-container">
+    <header class="safety-platform-container__header">
+      <BreadcrumbBack />
+      <span class="breadcrumb-title">{{ headerTitle }}</span>
+    </header>
+    <main class="safety-platform-container__main">
     <el-form
       ref="formRef"
       :model="form"
@@ -144,23 +149,6 @@
       </div>
     </el-form>
 
-    <footer class="safety-platform-container__footer">
-      <el-button @click="router.back()">返回</el-button>
-      <template v-if="isCreateMode || isEditMode">
-        <el-button type="primary" :loading="submitting" @click="handleSubmit">
-          {{ isCreateMode ? '提交' : '保存' }}
-        </el-button>
-      </template>
-      <template v-if="isAuditMode">
-        <el-button type="success" :loading="auditSubmitting" @click="handleAuditPass">
-          审核通过
-        </el-button>
-        <el-button type="danger" :loading="auditSubmitting" @click="showRejectDialog = true">
-          审核不通过
-        </el-button>
-      </template>
-    </footer>
-
     <!-- 审核不通过原因 -->
     <el-dialog
       v-model="showRejectDialog"
@@ -182,7 +170,24 @@
         </el-button>
       </template>
     </el-dialog>
-  </main>
+    </main>
+    <footer class="safety-platform-container__footer">
+      <el-button @click="router.back()">返回</el-button>
+      <template v-if="isCreateMode || isEditMode">
+        <el-button type="primary" :loading="submitting" @click="handleSubmit">
+          {{ isCreateMode ? '提交' : '保存' }}
+        </el-button>
+      </template>
+      <template v-if="isAuditMode">
+        <el-button type="success" :loading="auditSubmitting" @click="handleAuditPass">
+          审核通过
+        </el-button>
+        <el-button type="danger" :loading="auditSubmitting" @click="showRejectDialog = true">
+          审核不通过
+        </el-button>
+      </template>
+    </footer>
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -191,6 +196,7 @@
   import { ElMessage } from 'element-plus';
   import type { FormInstance, FormRules } from 'element-plus';
   import { Plus, Minus } from '@element-plus/icons-vue';
+  import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
   import UploadFiles from '@/components/UploadFiles/UploadFiles.vue';
   import type { FileItem } from '@/components/UploadFiles/types';
   import { queryPersonalProtectiveEquipmentList } from '@/api/production-safety/personal-protective-equipment';
@@ -216,6 +222,21 @@
   const operate = computed(() => (route.query.operate as string) || 'inventory-create');
   const currentId = computed(() => Number(route.query.id));
 
+  const headerTitle = computed(() => {
+    switch (operate.value) {
+      case 'inventory-create':
+        return '新增劳防用品采购申请';
+      case 'inventory-edit':
+        return '编辑劳防用品采购申请';
+      case 'inventory-view':
+        return '查看劳防用品采购申请';
+      case 'audit':
+        return '审核劳防用品采购申请';
+      default:
+        return '劳防用品采购申请详情';
+    }
+  });
+
   const isCreateMode = computed(() => operate.value === 'inventory-create');
   const isEditMode = computed(() => operate.value === 'inventory-edit');
   const isViewMode = computed(() => operate.value === 'inventory-view');
@@ -408,7 +429,13 @@
 
 <style scoped lang="scss">
   @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
 
+  .safety-platform-container__header {
+    flex-direction: row !important;
+    justify-content: flex-start !important;
+    gap: 8px !important;
+  }
   .purchase-apply-form {
     max-width: 100%;
   }

src/views/production-safety/risk-identification-and-control/labor-products-purchase-apply-manage/configs/tables.ts

@@ -1,13 +1,13 @@
 import type { TableColumnProps } from '@/types/basic-table';
 
-export const TABLE_OPTIONS = {
+const TABLE_OPTIONS = {
   emptyText: '暂无数据',
   loading: true,
   maxHeight: 'calc(70vh - 150px)',
 };
 
 /** 劳防用品采购申请列表列：申请单号、申请人、申请人部门、状态、当前流程节点、操作 */
-export const PURCHASE_APPLY_TABLE_COLUMNS: TableColumnProps[] = [
+const PURCHASE_APPLY_TABLE_COLUMNS: TableColumnProps[] = [
   {
     label: '编号',
     type: 'index',
@@ -54,3 +54,5 @@ export const PURCHASE_APPLY_TABLE_COLUMNS: TableColumnProps[] = [
     align: 'left',
   },
 ];
+
+export { TABLE_OPTIONS, PURCHASE_APPLY_TABLE_COLUMNS };