Browse Source

添加委外

qinhb 1 year ago
parent
commit
ce665d5c2a

+ 15 - 0
src/api/device/index.ts

@@ -99,5 +99,20 @@ export function queryTypeAliasList(params: any) {
     data: params,
   });
 }
+export function deviceUpdateCollect(params: any) {
+  return request({
+    url: "/api/v1/device/updateCollect",
+    method: "post",
+    data: params,
+  });
+}
+
+export function updateProtocol(params: any) {
+  return request({
+    url: "/api/v1/device/updateProtocol",
+    method: "post",
+    data: params,
+  });
+}
 
 

+ 22 - 0
src/api/process/index.ts

@@ -0,0 +1,22 @@
+import request from "@/utils/request";
+import { AxiosPromise } from "axios";
+
+export function queryOutSourceDetails(
+    id: object
+): AxiosPromise<any> {
+  return request({
+    url: "/api/v1/process/outsource/get/" + id,
+    method: "get",
+  });
+}
+
+export function updateOutSourceApply(
+    params: object
+): AxiosPromise<any> {
+  return request({
+    url: "/api/v1/process/outsource/update",
+    method: "post",
+    data: params
+  });
+}
+

+ 4 - 1
src/common/configs/dictDataUtil.ts

@@ -56,7 +56,10 @@ const DictDataUtil = {
  //   生产计划-工位任务状态
     station_task_state: "station_task_state",
 //领用申请状态
-    requisition_state:"requisition_state",  },
+    requisition_state:"requisition_state",
+    //委外状态
+    outsource_state: "outsource_state",
+  },
   EXPAND_FIELD_TABLE: {
     //字段类型
     expand_field_type: "expand_field_type",

+ 6 - 8
src/hooks/userCrud.ts

@@ -8,10 +8,8 @@ import { configs } from "@typescript-eslint/eslint-plugin";
 interface UseCrudConfig {
   // 模块的url,用来进行增删改查
   src?: string;
-  // getUrl?: string;
-  // getUrl?: string;
-  // getUrl?: string;
-  // getUrl?: string;
+
+  dataListUrl?: string;
 
   // 需要操作的数据
   row?: any;
@@ -104,7 +102,7 @@ export const useCrud = (config?: UseCrudConfig) => {
       handleSearchData();
       try {
         const res = await request({
-          url: `${url.value}/page`,
+          url: commonConfig.value.dataListUrl ?? `${url.value}/page`,
           method: "post",
           data: {
             pageNo: page.value.currentPage,
@@ -115,13 +113,13 @@ export const useCrud = (config?: UseCrudConfig) => {
         });
         if (res?.data) {
 		  if(res?.data instanceof Array){
-			 data.value = res?.data || [] 
+			 data.value = res?.data || []
 			 page.value.total = res?.data?.length || 0
 		  }else{
 			data.value = res?.data?.records || [];
-			page.value.total = res?.data?.totalCount || 0;  
+			page.value.total = res?.data?.totalCount || 0;
 		  }
-          
+
         }
         config?.done && config?.done();
       } catch (err) {

+ 45 - 3
src/views/device/instance/index.vue

@@ -16,6 +16,19 @@
         @current-change="dataList"
         @selection-change="selectionChange"
     >
+      <template #collect="scope">
+        <el-switch
+            active-value="1"
+            inactive-value="0"
+            inline-prompt
+            active-text="是"
+            inactive-text="否"
+            v-model="scope.row.collect"
+            @click="changeItem($event,scope.row)"
+            class="ml-2"
+            style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
+        />
+      </template>
       <template #menu="{size,row,index}">
         <el-button
             v-hasPerm="[buttonPermission.DEVICE.BTNS.maintenance_edit]"
@@ -23,7 +36,7 @@
             link
             size="small"
             @click="showParamsPage(row)"
-        ><i-ep-edit />参数
+        ><i-ep-edit />模型
         </el-button>
       </template>
       <template #menu-left="{ size }">
@@ -118,7 +131,7 @@
 import { ref, getCurrentInstance } from "vue";
 import { useCrud } from "@/hooks/userCrud";
 import buttonPermission from "@/common/configs/buttonPermission";
-import {configSave,configList} from "@/api/device";
+import {configSave,configList,deviceUpdateCollect} from "@/api/device";
 import { useCommonStoreHook } from "@/store";
 import dictDataUtil from "@/common/configs/dictDataUtil";
 const { isShowTable, tableType } = toRefs(useCommonStoreHook());
@@ -134,6 +147,15 @@ const addItem = () =>{
 const minusItem = (row) =>{
   pageData.value = pageData.value.filter(item=>item.fieldCode !== row.fieldCode)
 }
+const changeItem =(obj,row) => {
+    deviceUpdateCollect({id: row.id,collect: row.collect,deviceNo: row.deviceNo}).then((data)=>{
+      if(data.code === '200'){
+        ElMessage.success(data.msg);
+      }else{
+        ElMessage.error(data.msg);
+      }
+    })
+}
 const clickRow = ref(null)
 const showParamsPage = (row)=>{
   clickRow.value = row
@@ -143,7 +165,7 @@ const showParamsPage = (row)=>{
   })
 }
 const dialog = reactive({
-  title: "参数设置",
+  title: "模型设置",
   visible: false,
 });
 const handleSubmit = () => {
@@ -259,6 +281,20 @@ option.value = Object.assign(option.value, {
       ],
     },
     {
+      label: "在线状态",
+      prop: "onlineState",
+      width: 100,
+      display: false,
+      html: true,
+      formatter: (val) => {
+        if (val.onlineState === "1") {
+          return '<b class="el-tag el-tag--success el-tag--light">在线</b>';
+        } else {
+          return '<b class="el-tag el-tag--warning el-tag--light">离线</b>';
+        }
+      },
+    },
+    {
       label: "负责人",
       prop: "head",
       width: 160,
@@ -285,6 +321,12 @@ option.value = Object.assign(option.value, {
       }
     },
     {
+      label: "是否采集",
+      prop: "collect",
+      slot: true,
+      width: 100,
+    },
+    {
       label: "供应厂商",
       prop: "manufacturer",
       width: 160,

+ 14 - 0
src/views/device/pac/index.vue

@@ -138,6 +138,20 @@ option.value = Object.assign(option.value, {
       ],
     },
     {
+      label: "在线状态",
+      prop: "onlineState",
+      width: 100,
+      display: false,
+      html: true,
+      formatter: (val) => {
+        if (val.onlineState === "1") {
+          return '<b class="el-tag el-tag--success el-tag--light">在线</b>';
+        } else {
+          return '<b class="el-tag el-tag--warning el-tag--light">离线</b>';
+        }
+      },
+    },
+    {
       label: "负责人",
       prop: "head",
       width: 160,

+ 33 - 6
src/views/device/model/index.vue

@@ -18,6 +18,13 @@
     >
       <template #menu-left="{ size }">
         <el-button
+            type="primary"
+            icon="el-icon-plus"
+            :size="size"
+            @click="addItem"
+        >新增</el-button
+        >
+        <el-button
           :disabled="toDeleteIds.length < 1"
           type="danger"
           icon="el-icon-delete"
@@ -30,7 +37,7 @@
   </div>
 </template>
 <script setup>
-import { ref, getCurrentInstance } from "vue";
+import {ref, getCurrentInstance, defineProps} from "vue";
 import { useCrud } from "@/hooks/userCrud";
 import buttonPermission from "@/common/configs/buttonPermission";
 import {configList} from "@/api/device";
@@ -47,9 +54,22 @@ const dialog = reactive({
   title: "参数设置",
   visible: false,
 });
-const handleSubmit = () => {
-  //
-};
+const props = defineProps({
+  deviceType: {
+    type: String,
+    default: () => {
+      return '';
+    }
+  },
+})
+watch(
+    () => props.deviceType,
+    () => {
+      search.value.deviceType = props.deviceType
+      form.value.deviceType = props.deviceType
+      dataList();
+    },
+);
 // 传入一个url,后面不带/
 const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
   useCrud({
@@ -60,18 +80,24 @@ const { selectionChange, multipleDelete } = Methords; //选中和批量删除事
 const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
 const crudRef = ref(null); //crudRef.value 获取avue-crud对象
 
+const addItem =()=>{
+  form.value.deviceType = props.deviceType
+  crudRef.value && crudRef.value.rowAdd();
+}
 // 设置表格列或者其他自定义的option
 option.value = Object.assign(option.value, {
   delBtn: false,
   selection: true,
+  addBtn: false,
+  searchBtn: false,
   column: [
     {
       label: "设备类型",
       prop: "deviceType",
       type: "select",
       width: 130,
+      disabled: true,
       overHidden: true,
-      search: true,
       dicUrl:
         dictDataUtil.request_url +
         dictDataUtil.TYPE_CODE.device_type,
@@ -144,7 +170,8 @@ option.value = Object.assign(option.value, {
 });
 
 onMounted(() => {
-  // console.log("crudRef", crudRef)
+  form.value.deviceType = props.deviceType
+  search.value.deviceType = props.deviceType
   dataList();
 });
 </script>

+ 49 - 128
src/views/device/protocol/index.vue

@@ -16,26 +16,46 @@
         @current-change="dataList"
         @selection-change="selectionChange"
     >
-      <template #menu="{size,row,index}">
+      <template #menu="{row}">
+        <el-button
+            icon="el-icon-setting"
+            text
+            @click="openDialog(row.deviceType)"
+            type="primary"
+            size="small">模型</el-button>
+      </template>
+      <template #protocolState="{row}">
         <el-switch
-            active-value="1"
-            inactive-value="0"
-            v-model="row.collect"
-            @change="changeItem(row)"
+            active-value= '1'
+            inactive-value= '0'
+            width="60"
+            inline-prompt
+            active-text="启用"
+            inactive-text="禁用"
+            v-model="row.protocolState"
+            @click="changeItem(row)"
             class="ml-2"
             style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
         />
       </template>
     </avue-crud>
+    <el-dialog
+        v-model="dialog.visible"
+        :title="dialog.title"
+        width="60%"
+        @close="dialog.visible = false"
+    >
+      <model-page :deviceType="choiceDeviceType"></model-page>
+    </el-dialog>
   </div>
 </template>
 <script setup>
 import { ref, getCurrentInstance } from "vue";
 import { useCrud } from "@/hooks/userCrud";
-import buttonPermission from "@/common/configs/buttonPermission";
-import {deviceUpdate} from "@/api/device";
+import {updateProtocol} from "@/api/device";
 import { useCommonStoreHook } from "@/store";
 import dictDataUtil from "@/common/configs/dictDataUtil";
+import ModelPage from "./components/model-page.vue";
 const { isShowTable, tableType } = toRefs(useCommonStoreHook());
 const test = () => {
   isShowTable.value = true;
@@ -45,21 +65,31 @@ const loading = ref(false); //  加载状态
 // 传入一个url,后面不带/
 const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
   useCrud({
-    src: "/api/v1/device",
+    dataListUrl: "/api/v1/device/protocolPage",
   });
 const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } = Methords; //增删改查
 const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
 const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
 const crudRef = ref(null); //crudRef.value 获取avue-crud对象
 const changeItem =(row) => {
-  deviceUpdate({id: row.id,collect: row.collect,deviceNo: row.deviceNo}).then((data)=>{
+  updateProtocol({state: row.protocolState,deviceType: row.deviceType}).then((data)=>{
     if(data.code === '200'){
       ElMessage.success(data.msg);
+      dataList()
     }else{
       ElMessage.error(data.msg);
     }
   })
 }
+const choiceDeviceType = ref(null)
+const dialog = reactive({
+  title: "模型",
+  visible: false,
+});
+const openDialog = (type) =>{
+  dialog.visible = true
+  choiceDeviceType.value = type
+}
 // 设置表格列或者其他自定义的option
 option.value = Object.assign(option.value, {
   delBtn: false,
@@ -67,43 +97,14 @@ option.value = Object.assign(option.value, {
   addBtn: false,
   editBtn: false,
   viewBtn: false,
-  menuTitle: "是否采集",
+  searchBtn: false,
+  menuTitle: "模型设置",
   column: [
     {
-      label: "设备编号",
-      prop: "deviceNo",
-      search: true,
-      width: 160,
-      overHidden: true,
-      rules: [
-        {
-          required: true,
-          message: "设备编号不能为空",
-          trigger: "trigger",
-        },
-      ],
-    },
-    {
-      label: "设备名称",
-      prop: "deviceName",
-      search: true,
-      width: 160,
-      overHidden: true,
-      rules: [
-        {
-          required: true,
-          message: "设备名称不能为空",
-          trigger: "trigger",
-        },
-      ],
-    },
-    {
       label: "设备类型",
       prop: "deviceType",
       type: "select",
-      width: 130,
       overHidden: true,
-      search: true,
       dicUrl:
         dictDataUtil.request_url +
         dictDataUtil.TYPE_CODE.device_type,
@@ -120,100 +121,19 @@ option.value = Object.assign(option.value, {
       ],
     },
     {
-      label: "设备状态",
-      prop: "state",
-      type: "select",
-      width: 160,
-      overHidden: true,
-      search: true,
-      dicUrl:
-          dictDataUtil.request_url +
-          dictDataUtil.TYPE_CODE.device_status,
-      props: {
-        label: "dictLabel",
-        value: "dictValue",
-      },
-      rules: [
-        {
-          required: true,
-          message: "设备状态不能为空",
-          trigger: "trigger",
-        },
-      ],
-    },
-    {
-      label: "负责人",
-      prop: "head",
-      width: 160,
-      overHidden: true,
-      rules: [
-        {
-          required: true,
-          message: "负责人不能为空",
-          trigger: "trigger",
-        },
-      ],
-    },
-    {
-      label: "所属PAC",
-      prop: "terminal",
-      type: "select",
-      width: 160,
-      overHidden: true,
-      search: true,
-      dicUrl:import.meta.env.VITE_APP_BASE_API + "/api/v1/device/pacList",
-      props: {
-        label: "deviceName",
-        value: "deviceNo",
-      }
+      label: "协议状态",
+      prop: "protocolState",
+      slot: true,
     },
     {
-      label: "供应厂商",
-      prop: "manufacturer",
-      width: 160,
+      label: "更新时间",
+      prop: "updated",
       overHidden: true,
     },
     {
-      label: "所属部门",
-      prop: "deptId",
-      width: 160,
+      label: "更新人",
+      prop: "updator",
       overHidden: true,
-      type: "tree",
-      dicUrl: dictDataUtil.dept_tree_url,
-      props: {
-        label: "deptName",
-        value: "id",
-      }
-    },
-    {
-      label: "所在车间",
-      prop: "workshop",
-      width: 160,
-      overHidden: true,
-    },
-    {
-      label: "所在工位",
-      prop: "station",
-      width: 160,
-      overHidden: true,
-    },
-    {
-      label: "设备位置",
-      prop: "devicePosition",
-      width: 160,
-      overHidden: true,
-    },
-    {
-      label: "规格",
-      prop: "specifications",
-      width: 160,
-      overHidden: true,
-    },
-    {
-      label: "品牌",
-      width: 160,
-      overHidden: true,
-      prop: "brand",
     },
   ],
 });
@@ -222,5 +142,6 @@ onMounted(() => {
   search.value.protocol = "1"
   // console.log("crudRef", crudRef)
   dataList();
+
 });
 </script>

+ 333 - 0
src/views/quality/outsource/index.vue

@@ -0,0 +1,333 @@
+<template>
+  <div class="mainContentBox">
+    <avue-crud
+        ref="crudRef"
+        v-model:search="search"
+        v-model="form"
+        :data="data"
+        :option="option"
+        v-model:page="page"
+        @row-save="createRow"
+        @row-update="updateRow"
+        @row-del="deleteRow"
+        @search-change="searchChange"
+        @search-reset="resetChange"
+        @size-change="dataList"
+        @current-change="dataList"
+        @selection-change="selectionChange"
+    >
+      <template #menu="{size,row,index}">
+<!--        <el-button
+            icon="el-icon-delete"
+            text
+            @click="deleteRow(row)"
+            type="danger"
+            :size="size">删除</el-button>-->
+        <el-button
+            icon="el-icon-edit"
+            text
+            v-if="row.state === '0'"
+            @click="openDialog(1,row.id)"
+            type="primary"
+            :size="size">审核</el-button>
+
+        <el-button
+            icon="el-icon-edit"
+            text
+            @click="openDialog(0,row.id)"
+            type="primary"
+            :size="size">详情</el-button>
+      </template>
+    </avue-crud>
+    <el-dialog
+        v-model="dialog.visible"
+        :title="dialog.title"
+        width="950px"
+        @close="dialog.visible = false"
+    >
+
+      <el-form ref="queryFormRef"  label-width="100" :inline="true">
+        <el-row :gutter="24">
+          <el-col :lg="10" :xs="24">
+            <el-form-item label="产品名称">
+              <el-text>{{form.materialName}}</el-text>
+            </el-form-item>
+          </el-col>
+
+          <el-col :lg="6" :xs="24">
+            <el-form-item label="产品编码">
+              <el-text>{{form.materialCode}}</el-text>
+            </el-form-item>
+          </el-col>
+
+          <el-col :lg="2" :xs="24">
+            <el-form-item label="产品数量">
+              <el-text>{{form.outNum}}</el-text>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="24">
+          <el-col :lg="24" :xs="24">
+            <el-form-item label=" ">
+              <el-table border=true
+                  class="gray-header-table"
+                  v-loading="loading"
+                  :data="form.details"
+                  highlight-current-row>
+                <el-table-column
+                    label="序列号"
+                    align="left"
+                    width=350
+                    prop="seqNo"
+                />
+                <el-table-column
+                    label="状态"
+                    width=250
+                    align="left"
+                    prop="state"
+                >
+                  <template #default="scope">
+                    <el-tag
+                        v-if="scope.row.state === 0"
+                        type="success"
+                    >合格</el-tag>
+                    <el-tag
+                        v-if="scope.row.state === 1"
+                        type="error"
+                    >不合格</el-tag>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :lg="24" :xs="24">
+            <el-form-item label="委外工序">
+              <el-text>{{form.operationName}}</el-text>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+        <el-col :lg="24" :xs="24">
+          <el-form-item label="委外供应商">
+            <el-text>{{form.manufacturers}}</el-text>
+          </el-form-item>
+        </el-col>
+        </el-row>
+        <el-row>
+        <el-col :lg="24" :xs="24">
+          <el-form-item label="备注">
+            <el-text>{{form.remark}}</el-text>
+          </el-form-item>
+        </el-col>
+      </el-row>
+        <el-row  v-if="dialog.type === 1 && checkPerm('outsource:audit')" >
+          <el-col :lg="24" :xs="24">
+            <el-form-item label="审核意见">
+              <el-radio-group v-model="radio">
+                <el-radio :value=0>通 过</el-radio>
+                <el-radio :value=1>不通过</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row  v-if="form.state !== '0'" >
+          <el-col :lg="8" :xs="24">
+            <el-form-item label="审核人">
+              <el-text>{{form.auditUser}}</el-text>
+            </el-form-item>
+          </el-col>
+          <el-col :lg="8" :xs="24">
+            <el-form-item label="审核时间">
+              <el-text>{{form.auditTime}}</el-text>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      <div class="dialog-footer" align="center" v-if="dialog.type === 1 && checkPerm('outsource:audit')">
+        <el-button @click="dialog.visible = false">取 消</el-button>
+        <el-button type="primary" @click="audit">审 核</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script setup>
+import { ref, getCurrentInstance } from "vue";
+import { useCrud } from "@/hooks/userCrud";
+import { checkPerm } from "@/directive/permission";
+import ButtonPermKeys from "@/common/configs/buttonPermission";
+import {queryOutSourceDetails,updateOutSourceApply} from "@/api/process";
+import { useCommonStoreHook } from "@/store";
+import dictDataUtil from "@/common/configs/dictDataUtil";
+const { isShowTable, tableType } = toRefs(useCommonStoreHook());
+const test = () => {
+  isShowTable.value = true;
+  tableType.value = tableType.value == 1 ? 2 : 1;
+};
+const radio = ref(0)
+// 传入一个url,后面不带/
+const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
+  useCrud({
+    src: "/api/v1/process/outsource",
+  });
+const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } = Methords; //增删改查
+const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
+const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
+const loading = ref(false)
+const crudRef = ref(null); //crudRef.value 获取avue-crud对象
+const dialog = reactive({
+  title: "委外详情",
+  visible: false,
+  type: 0
+});
+const openDialog = (type,id) =>{
+  dialog.title = type === 0 ? '委外详情' : '委外审核' ;
+  queryOutSourceDetails(id).then((data)=>{
+    form.value = data.data
+    radio.value = 0
+    if(form.value){
+      if(form.value.state === '2'){
+        radio.value = 1
+      }
+    }
+    dialog.visible = true
+    dialog.type = type
+  })
+}
+const audit = () =>{
+  form.value.state = radio.value === 0 ? 1: 2;
+  updateOutSourceApply(form.value).then((data)=>{
+    if(data.code === '200'){
+      ElMessage.success("操作成功")
+      dialog.visible = false
+      dataList()
+    }else{
+      ElMessage.error(data.msg)
+    }
+  })
+}
+// 设置表格列或者其他自定义的option
+option.value = Object.assign(option.value, {
+  addBtn: false,
+  editBtn: false,
+  viewBtn: false,
+  delBtn: false,
+  selection: true,
+  column: [
+    {
+      label: "计划编号",
+      prop: "orderCode",
+      width: 150,
+      overHidden: true,
+      search: true,
+    },
+    {
+      label: "计划名称",
+      prop: "orderName",
+      width: 150,
+      overHidden: true,
+    },
+    {
+      label: "物料编码",
+      prop: "materialCode",
+      search: true,
+      width: 150,
+      overHidden: true,
+    },
+    {
+      label: "物料名称",
+      width: 150,
+      overHidden: true,
+      prop: "materialName",
+    },
+    {
+      label: "工单数量",
+      width: 120,
+      overHidden: true,
+      prop: "workOrderNum",
+    },
+    {
+      label: "委外数量",
+      width: 120,
+      prop: "outNum",
+      overHidden: true,
+    },
+    {
+      label: "委外工序",
+      width: 150,
+      overHidden: true,
+      prop: "operationName",
+    },
+    {
+      label: "委外厂商",
+      prop: "manufacturers",
+      width: 150,
+      overHidden: true,
+    },
+    {
+      label: "状态",
+      prop: "state",
+      type: "select",
+      search: true,
+      width: 90,
+      dicUrl:
+          dictDataUtil.request_url +
+          dictDataUtil.TYPE_CODE.outsource_state,
+      props: {
+        label: "dictLabel",
+        value: "dictValue",
+      },
+    },
+    {
+      label: "申请人",
+      width: 120,
+      overHidden: true,
+      prop: "creator",
+    },
+    {
+      label: "申请时间",
+      width: 120,
+      overHidden: true,
+      prop: "created",
+    },
+    {
+      label: "审核人",
+      width: 120,
+      overHidden: true,
+      prop: "auditUser",
+    },
+    {
+      label: "审核时间",
+      width: 120,
+      overHidden: true,
+      prop: "auditTime",
+    },
+    {
+      label: "接收人",
+      width: 120,
+      overHidden: true,
+      prop: "receiveUser",
+    },
+    {
+      label: "接收时间",
+      width: 120,
+      overHidden: true,
+      prop: "receiveTime",
+    },
+  ],
+});
+
+onMounted(() => {
+  // console.log("crudRef", crudRef)
+  dataList();
+});
+</script>
+<style>
+/* 添加自定义类名以区分不同表格的样式 */
+.gray-header-table .el-table__header-wrapper {
+  background-color: #f2f2f2; /* 灰色背景 */
+}
+</style>