样式调整

frontend/src/views/home/components/table.vue

@@ -8,17 +8,18 @@
       :init-param="initParam"
       :data-callback="dataCallback"
       @drag-sort="sortTable"
-      :height="tableHeight"
+
       :stripe="true"
       :pagination = "false"
       :key="tableKey"
       @selection-change='handleSelectionChange'
     >
+    <!-- :height="tableHeight" -->
       <!-- 表格 header 按钮 -->
       <template #tableHeader="scope">
-        <el-form :model="form" label-width="80px" :inline="true">
+        <el-form :model="form" :inline="true">
-          <el-form-item label="模糊搜索">
+          <el-form-item label="关键字搜索">
-            <el-input v-model="form.search" placeholder="请输入搜索内容"></el-input>
+            <el-input v-model="form.search" placeholder="输入设备名称或类型搜索"></el-input>
           </el-form-item>
           <el-form-item label="检测状态" v-if="form.activeTabs != 3 && form.activeTabs != 5">
             <el-select v-model="form.checkStatus" clearable>
@@ -76,6 +77,7 @@
               :icon="Clock"
               @click="handleTest('手动检测')"
               v-if="form.activeTabs === 0"
+              :disabled='!scope.isSelected'
               >手动检测</el-button
             >
             <el-button
@@ -83,6 +85,7 @@
               :icon="ChatLineRound"
               @click="handleTest('自动检测')"
               v-if="form.activeTabs === 0"
+              :disabled='!scope.isSelected'
               >自动检测</el-button
             >
             <el-button type="primary" :icon="ChatLineSquare" @click="handleTest('不合格项复检')" v-if="form.activeTabs === 2"
@@ -99,9 +102,13 @@
             <el-button type="primary" :icon="Postcard"  :disabled='!scope.isSelected' @click="handleTest('批量生成')" v-if="form.activeTabs === 3"
               >批量生成</el-button
             >
-            <el-button type="primary" :icon="Notebook" @click="handleTest('批量归档')" v-if="form.activeTabs === 4"
+            <el-button type="primary" :icon="Notebook" :disabled="!scope.isSelected || scope.selectedList.filter((item) => item.check_State === '检测完成').length === 0" @click="handleTest('批量归档')" v-if="form.activeTabs === 0"
               >批量归档</el-button
             >
+            <el-button type="primary" :icon="CirclePlus" @click="addDevice('设备新增')" v-if="form.activeTabs === 0"
+              >设备新增</el-button
+            >
+            
           </el-form-item>
         </el-form>
       </template>
@@ -118,7 +125,7 @@
         <div class='cn-render-buttons' v-if="form.activeTabs === 3 && form.activeChildTabs === 0">
           <el-dropdown trigger='click'>
             <el-button link type='primary' :icon="Download" class='table-operate'>
-              <div class='table-operate-text'>下载</div>
+              <div class='table-operate-text'>报告下载</div>
             </el-button>
             <template #dropdown>
               <el-dropdown-menu>
@@ -136,7 +143,7 @@
           :icon="Postcard"
           @click="openDrawer('生成', scope.row)"
           v-if="form.activeTabs === 3"
-          >生成</el-button
+          >报告生成</el-button
         >
         <!-- <el-button
         type="primary"
@@ -152,6 +159,7 @@
           :icon="Notebook"
           @click="openDrawer('归档', scope.row)"
           v-if="form.activeTabs === 0"
+          :disabled = "scope.row.check_State != '检测完成'"
           >归档</el-button
         >
         <el-button
@@ -218,7 +226,7 @@ import { ElMessage, ElMessageBox, ElLoading} from "element-plus";
 import ProTable from "@/components/ProTable/index.vue";
 import { type ProTableInstance, type ColumnProps } from '@/components/ProTable/interface'
 import {
-  Search,View,Delete,Download,EditPen,Clock,ChatLineRound,ChatLineSquare,ChatDotSquare,Postcard,Notebook,Switch,PieChart
+  Search,View,Delete,Download,EditPen,Clock,ChatLineRound,ChatLineSquare,ChatDotSquare,Postcard,Notebook,Switch,PieChart,CirclePlus
 } from "@element-plus/icons-vue";
 import { getPlanList } from "@/api/plan/planList";
 import deviceDataList from '@/api/device/device/deviceData'
@@ -421,6 +429,7 @@ const getTableList = (params: any) => {
 // 表格配置项
 const columns = reactive<ColumnProps<Device.ResPqDev>[]>([
     { type: 'selection', fixed: 'left', width: 70 },
+    { type: 'index', fixed: 'left', width: 70, label: '序号' },
     {
       prop: 'name',
       label: '设备名称',
@@ -435,31 +444,37 @@ const columns = reactive<ColumnProps<Device.ResPqDev>[]>([
       prop: 'dev_Chns',
       label: '通道数',
       minWidth: 100,
+      sortable:true,
     },
     {
       prop: 'reCheck_Num',
       label: '复检次数',
       minWidth: 100,
+      sortable:true,
     },
     {
       prop: 'check_State',
       label: '检测状态',
       minWidth: 100,
+      sortable:true,
     },
     {
       prop: 'check_Result',
       label: '检测结果',
       minWidth: 100,
+      sortable:true,
     },
     {
       prop: 'report_State',
       label: '报告状态',
       minWidth: 100,
+      sortable:true,
     },
     {
       prop: 'document_State',
       label: '归档状态',
       minWidth: 100,
+      sortable:true,
     },
     { prop: 'operation', label: '操作', fixed: 'right', minWidth: 200 ,isShow: operationShow},
   ])
@@ -762,7 +777,7 @@ function tableHeaderInit(val: number) {
       // disableCheckStatus("归档")
       disablecheckResultList("未检测")
       disableCheckReportStatus("未检测")
-      columns[columns.length - 1].minWidth = 150;
+      columns[columns.length - 1].minWidth = 180;
       tableKey.value += 1;
       operationShow.value = true;
     break;
@@ -836,6 +851,12 @@ function disablecheckResultList(val: string){
   });
 }
 
+const addDevice = (val:string) => {
+  router.push({
+    path: "/machine/device",
+  });
+};
+
 
 const handleTest = (val:string) => {
 

frontend/src/views/home/tabs/dashboard.vue

@@ -147,6 +147,9 @@ const handleCollapseChange = (val: string[]) => {
   tabsHeight.value = newHeight;
   tabPaneHeight.value = `calc(100% - 5px)`; 
   tableHeight.value = `calc(100% - 5px)`; 
+
+  // tableRef1.value.resize();
+  // tableRef2.value.resize();
 };
 
 const handleTabsChange = (val) => {
@@ -379,7 +382,7 @@ onMounted(() => {
       background: #fff;
       border-radius: 4px;
       display: flex;
-      justify-content: space-between;
+      justify-content: flex-start;
       align-items: center;
       margin-bottom: 10px;
       padding: 10px 20px 10px 20px;
@@ -397,7 +400,7 @@ onMounted(() => {
         background-color: #607eab;
         border-radius: 8px;
         padding: 0px 30px;
-
+        margin-right: 50px;;
         .item_img {
           width: 60px;
           height: 60px;
@@ -589,8 +592,8 @@ onMounted(() => {
     .container_table {
       // width: 100%;
       flex: 1 !important;
-      height: calc(100vh - 360px - 180px);
+      //height: calc(100vh - 360px - 180px);
-      //height: 100% !important;
+      height: 100% !important;
       border-radius: 4px;
       width: 100% !important;
       // display: none;