feat：前端优化提交

admin.ui.plus-master/src/api/admin/reportManagement/displayControl/displayControldto.ts

@@ -8,6 +8,13 @@
   msg?: string | null
   /** 数据 */
  data?:PageOutputencodercontrolsDto[] | null
+ startDate?: string | null
+ endDate?: string | null
+ createTimeRange?: Array<string> | null
+    /** 安全装置状态 */
+    deviceStatus?: string
+    onlineStatus?: string
+ 
 }
     export interface PageOutputencodercontrolsDto{
       /**
@@ -17,8 +24,14 @@
       total?: number
       /** 数据 */
       list?: encodercontrolsDto[] | null
+      startDate?: string | null
+      endDate?: string | null
+      createTimeRange?: Array<string> | null
     }
     export interface encodercontrolsDto{
+      startDate?: string | null;
+      endDate?: string | null;
+      createTimeRange?: Array<string> | null; 
    /** 石油公司 */
       oilCompanyName?: string
    /** 软件版本号 */

admin.ui.plus-master/src/api/admin/reportManagement/encoder/encoderDto.ts

@@ -28,16 +28,31 @@ export interface DynamicFilterInfo {
  * 编码器列表查询信息
  */
 export interface encoderFilterModel_SearchFilter{
-  /**设备类型 */
-  deviceType?:string | null,
-  /**在线状态 */
-  onlineStatus?:string | null,
-  /**设备状态 */
-  deviceStatus?:string | null,
-  /**序列号 */
-  sn?:string | null,
-  /**设备报警级别 */
-  deviceAlarmLevel?:string | null
+  startDate?: string | null;
+  endDate?: string | null;
+  createTimeRange?: Array<string> | null; 
+    /** 序列号 */
+    sn?: number | null ,
+    /** 石油公司 */
+    companyName?: string | null ,
+    /** 加油站名称 */
+    stationName?: string | null ,
+    /** 加油机厂商 */
+    supplierName?: string | null ,
+    /** 编码器厂商 */
+    manufacturerName?: string | null ,
+    /** 油枪号 */
+    nozzleconName?: string | null ,
+    /** 编码器编号 */
+    uuid?: string | null ,
+    /** 编码器状态 */
+    deviceStatus?: string | null ,
+    /** 在线状态 */
+    onlineStatus?: string | null ,
+    /** 安装时间 */
+    soldTime?: string | null ,
+    /** 出场时间 */
+    productTime?: string | null 
 }
   
   /**

admin.ui.plus-master/src/api/admin/reportManagement/gasStation/gasStationDto.ts

@@ -28,10 +28,15 @@ export interface DynamicFilterInfo {
  * 列表查询信息
  */
 export  interface gasStationFilterModel_SearchFilter{
+  startDate?: string | null;
+  endDate?: string | null;
+  createTimeRange?: Array<string> | null; 
     /**省份*/
     province?: string,
     /**加油站名称*/
     name?: string,
+    type?: string | null ,
+
   }
   
   /**

admin.ui.plus-master/src/api/admin/reportManagement/listOfOilEngines/listOfOilEnginesApi.ts

@@ -1,5 +1,7 @@
+import { storeToRefs } from "pinia";
 import {ContentType, HttpClient, RequestParams} from "/@/api/admin/http-client";
-import {PageInputFuelDispenserDto,ResultOutputPageOutputFuelDispenserDto} from "/@/api/admin/reportManagement/listOfOilEngines/listOfOilEnginesDto";;
+import {ExportExcelInputDto, PageInputFuelDispenserDto,ResultOutputPageOutputFuelDispenserDto} from "/@/api/admin/reportManagement/listOfOilEngines/listOfOilEnginesDto";import { useUserInfo } from "/@/stores/userInfo";
+;
 
 export class ListOfOilEnginesApi <SecurityDataType = unknown> extends HttpClient<SecurityDataType> {
 
@@ -98,4 +100,43 @@ export class ListOfOilEnginesApi <SecurityDataType = unknown> extends HttpClient
         })
       },this.timer)
     })
+    
+    
+  // 导出excel
+  onExportExcel = (data: PageInputFuelDispenserDto, params: RequestParams = {}) => {
+    const { userInfos } = storeToRefs(useUserInfo());
+    const accessToken = userInfos.value.token;
+    const token = `Bearer ${accessToken}`;
+
+    const myHeaders = new Headers();
+    myHeaders.append("Authorization", token);
+    myHeaders.append("Content-Type", "application/json");
+
+    // 请求体
+    const body = JSON.stringify(data);
+
+    const requestOptions: RequestInit = {
+      method: 'POST',
+      headers: myHeaders,
+      body: body,
+      redirect: 'follow',
+    };
+
+    // const fileUrl = import.meta.env.VITE_API_URL + '/api/app/fuel-dispenser/export-excel';
+    const fileUrl = "http://192.168.0.202:8003" + '/api/app/fuel-dispenser/export-excel';
+
+    fetch(fileUrl, requestOptions)
+      .then(response => response.blob())
+      .then(blob => {
+        const link = document.createElement('a');
+        link.href = URL.createObjectURL(blob);
+        // link.download = fileName; // 使用参数中的 fileName
+        link.download = "test"; // 使用参数中的 fileName
+        link.click();
+        URL.revokeObjectURL(link.href);
+      })
+      .catch(error => {
+        console.error('下载失败：', error);
+      });
+  };
 }

admin.ui.plus-master/src/api/admin/reportManagement/listOfOilEngines/listOfOilEnginesDto.ts

@@ -22,23 +22,43 @@ export interface DynamicFilterInfo {
  * 油机列表查询信息
  */
 export  interface FuelDispenserDto_SearchFilter{
-  /**加油号*/
-  name?: string,
-  /**加油站*/
-  gasStation?: string,
-  /**加油机机型*/
-  model?: string,
-  /**设备状态*/
-  deviceStatus?: string,
-  /**在线状态*/
-  onlineStatus?: string,
+  startDate?: string | null;
+  endDate?: string | null;
+  createTimeRange?: Array<string> | null; 
+    /**加油号*/
+    name?: string,
+    /**石油公司*/
+    oilCompany?: string,
+    /**加油站*/
+    gasStation?: string,
+    /**序列号*/
+    serialNumber?: string,
+    /**加油机机型*/
+    model?: string,
+    /**加油机枪数量*/
+    gunCount?: number,
+    /**加油机厂商*/
+    manufacturer?: string,
+    /**出厂时间*/
+    manufactureDate?: string,
+    /**启动时间*/
+    startupDate?: string,
+    /**安装时间*/
+    installationDate?: string,
+    /**设备状态*/
+    deviceStatus?: string,
+    /**在线状态*/
+    onlineStatus?: string
 }
 
 /**
  * 油机列表信息
  */
 export  interface FuelDispenserDto{
-  /**加油号*/
+  startDate?: string | null;
+  endDate?: string | null;
+  createTimeRange?: Array<string> | null; 
+    /**加油号*/
   name?: string,
   /**石油公司*/
   oilCompany?: string,
@@ -102,3 +122,39 @@ export interface PageInputFuelDispenserDto{
   dynamicFilter?: DynamicFilterInfo
   filter?: FuelDispenserDto_SearchFilter
 }
+
+/** 导出Excel信息输入 */
+export interface ExportExcelInputDto {
+  currentPage?: number,
+  pageSize?: number,
+  filter?: {
+    bomName?: string,
+    bomType?: number,
+    bomMateNo?: string,
+    bomProNo?: string,
+    id: number,
+    name:String ,
+    fuelId: 0,
+    oilCompany: String,
+    gasStation:String,
+    serialNumber:String ,
+    model: String,
+    gunCount: 0,
+    manufacturer: String,
+    manufactureDate: String,
+    startupDate: String,
+    installationDate: String,
+    deviceStatus: String,
+    onlineStatus: String,
+    measureRang:String,
+    accuracyLevel: String,
+    modelSpec:String,
+    description:String ,
+    alarmLevel: 0,
+    onlineDesc:String ,
+    stationID: 0,
+    startDate: String,
+    endDate: String
+  }
+}
+

admin.ui.plus-master/src/api/admin/reportManagement/taxcontrol/taxcontroldto.ts

@@ -47,6 +47,7 @@
    /** 出厂时间 */
       soldTime?: string
 
+
 }
 export interface PageInput {
       /**当前页数 */

admin.ui.plus-master/src/components/StatusBox.vue

@@ -49,6 +49,33 @@
 
           case "出厂注册": return 'blue'
           case '在线': return 'green'
+          // 生产管理-电子说明书          
+          case "开启": return 'green'
+          case "关闭": return 'red'
+
+          // 生产管理-软件包管理          
+          case '已发布': return 'green'
+          case '待发布': return 'blue'
+          case '失效': return 'red'
+
+          // 应用授权-大屏SDK授权
+          case '正常': return 'green'
+          case '未授权': return 'red'
+
+          // 电子档案-加油机列表
+          case '已启用': return 'green'
+          case '已禁用': return 'red'
+          case '开启': return 'green'
+          case '未开启': return 'red'
+
+          // 电子档案-显示屏
+          case "已生产": return 'blue'
+          case "生产中": return 'hotpink'
+          case "已装机": return 'green'
+          case "待灌注": return 'red'
+          case "已灌注": return 'yelbluevioletlow'
+          case "已备案": return 'gray'
+          
 
           default: return 'red'
         }
@@ -73,6 +100,33 @@
           case "出厂注册": return 'blue'
           case '在线': return 'green'
 
+         // 生产管理-电子说明书          
+          case "开启": return 'green'
+          case "关闭": return 'red'
+
+         // 生产管理-软件包管理          
+          case '已发布': return 'green'
+          case '待发布': return 'blue'
+          case '失效': return 'red'
+
+          // 应用授权-大屏SDK授权
+          case '正常': return 'green'
+          case '未授权': return 'red'
+
+          // 电子档案-加油机列表
+          case '已启用': return 'green'
+          case '已禁用': return 'red'
+          case '开启': return 'green'
+          case '未开启': return 'red'
+
+          // 电子档案-显示屏
+          case "已生产": return 'blue'
+          case "生产中": return 'hotpink'
+          case "已装机": return 'green'
+          case "待灌注": return 'red'
+          case "已灌注": return 'yelbluevioletlow'
+          case "已备案": return 'gray'
+          
           default: return 'red'
         }
       }
@@ -118,6 +172,16 @@
     background-color:#fefff4;
   }
 
+  .status-box.yelbluevioletlow {
+    border-color:blueviolet;
+    background-color:rgb(222, 195, 248);
+  }
+
+  .status-box.hotpink {
+    border-color:hotpink;
+    background-color:rgb(248, 196, 222);
+  }
+
   span.green {
     color: green;
   }
@@ -135,6 +199,15 @@
   }
 
   .status-box.yellow {
-    color: rgb(255, 208, 0);
+    color: yellow;
+  }
+
+  .status-box.yelbluevioletlow{
+    color: blueviolet;
   }
+
+.status-box.status-box.hotpink{
+  color: hotpink;
+}
+
   </style>

admin.ui.plus-master/src/views/admin/authorize/fuelingsdk/index.vue

@@ -17,7 +17,7 @@
                 </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
-                <el-form-item label="SN">
+                <el-form-item label="SN号">
                   <el-input v-model="sdkData.Filter.SN" placeholder="单行输入" clearable></el-input>
                 </el-form-item>
               </el-col>
@@ -65,29 +65,42 @@
       <!--表格-->
       <el-col :xs="24">
         <el-card class="my-fill mt8" shadow="hover">
-          <el-table ref="multipleTableRef" v-loading="sdkData.loading" stripe :data="sdkData.tableModel" row-key="id"
-            style="width: 100%" @row-click="onOilSdkRowClick">
-            <el-table-column type="selection" width="50"></el-table-column>
-            <el-table-column v-for="column in sdkData.dynamicColumns" :key="column.prop" :prop="column.prop"
-              :label="column.label" />
-            <el-table-column label="操作" fixed="right" header-align="center" align="center" class="right-operation"
-              width="100">
-              <template #default="{ row }">
-                <el-link class="my-el-link mr12 ml12" type="primary" icon="ele-Edit" @click="editTableData(row)"
-                  :underline="false" target="_blank">编辑</el-link>
-                <!-- <el-link
-                  class="my-el-link mr12 ml12"
-                  v-if="showAudit(row)"
-                  type="primary"
-                  icon="ele-Tickets"
-                  size="small"
-                  @click="onAuditRecord(row)"
-                  :underline="false"
-                  target="_blank"
-                >审核</el-link> -->
-              </template>
-            </el-table-column>
-          </el-table>
+          <el-table 
+  ref="multipleTableRef" 
+  v-loading="sdkData.loading" 
+  stripe 
+  :data="sdkData.tableModel" 
+  row-key="id"
+  style="width: 100%" 
+  @row-click="onOilSdkRowClick"
+>
+  <el-table-column type="selection" width="50"></el-table-column>
+  
+  <el-table-column 
+    v-for="column in sdkData.dynamicColumns" 
+    :key="column.prop" 
+    :prop="column.prop"
+    :label="column.label"
+  >
+    <template #default="{ row }">
+      <template v-if="column.prop === 'state'">
+        <StatusBox :status="row.state" />
+      </template>
+      <template v-else>
+        {{ row[column.prop] }}
+      </template>
+    </template>
+  </el-table-column>
+  
+  <!-- 操作列保持不变 -->
+  <el-table-column label="操作" fixed="right" width="100">
+    <template #default="{ row }">
+      <el-link icon="ele-Edit" @click="editTableData(row)">
+        编辑
+      </el-link>
+    </template>
+  </el-table-column>
+</el-table>
           <div class="my-flex my-flex-end" style="margin-top: 20px">
             <el-pagination v-model:currentPage="sdkData.pageInput.CurrentPage"
               v-model:page-size="sdkData.pageInput.PageSize" :total="sdkData.total"
@@ -112,6 +125,9 @@ import eventBus from "/@/utils/mitt";
 import * as ExcelJS from 'exceljs';
 import * as FileSaver from 'file-saver';
 import { ElTable } from 'element-plus'
+import StatusBox from "/@/components/StatusBox.vue";
+
+
 /**引入组件*/
 const EditDialog = defineAsyncComponent(() => import('/src/views/admin/authorize/fuelingsdk/components/form-edit.vue'))
 const AuditDialog = defineAsyncComponent(() => import('/src/views/admin/authorize/fuelingsdk/components/form-audit.vue'))

admin.ui.plus-master/src/views/admin/authorize/softwarePackageManagement/index.vue

@@ -76,7 +76,16 @@
               :label="column.label">
               <template #default="{ row }">
                 <span :style="getColor(column.prop, row)">
-                  {{ getProp(column.prop, row) }}
+               <!-- 如果是状态列，使用 StatusBox 组件 -->
+              <StatusBox 
+               v-if="column.prop === 'state'" 
+               :status="getStatusInfo(row[column.prop]).name"  />
+               <!-- 其他列保持原有逻辑 -->
+               <span 
+                v-else 
+                :style="getColor(column.prop, row)">
+                {{ getProp(column.prop, row) }}
+           </span>
                 </span>
               </template>
             </el-table-column>
@@ -379,6 +388,18 @@ const getColor = (val, row) => {
   return {}
 }
 
+
+// 状态映射表 
+const statusMap = {
+  "0": { name: "待发布"}, 
+  "1": { name: "已发布"}, 
+  "2": { name: "失效"}, 
+};
+
+// 根据 status 值获取映射后的对象
+const getStatusInfo = (status: string) => {
+  return statusMap[status] || { name: "未知状态" };
+};
 </script>
 
 <style scoped lang="scss">

admin.ui.plus-master/src/views/admin/product/qrBook/index.vue

@@ -61,10 +61,20 @@
                 <el-card class="my-fill mt8" shadow="hover">
                     <el-table v-loading="qrBookData.loading" stripe :data="qrBookData.tableModel" row-key="id"
                         style="width: 100%;">
-                        <el-table-column v-for="column in qrBookData.dynamicColumns" :key="column.prop"
-                            :prop="column.prop" :label="column.label">
+                        <el-table-column 
+                            v-for="column in qrBookData.dynamicColumns" 
+                            :key="column.prop" 
+                            :prop="column.prop" 
+                            :label="column.label">
                             <template #default="{ row }">
-                                <span :style="getColor(column.prop, row)">
+                                <!-- 如果是状态列，使用 StatusBox 组件 -->
+                                <StatusBox 
+                                    v-if="column.prop === 'status'" 
+                                    :status="getStatusInfo(row[column.prop]).name"  />
+                                <!-- 其他列保持原有逻辑 -->
+                                <span 
+                                    v-else 
+                                    :style="getColor(column.prop, row)">
                                     {{ getName(column.prop, row) }}
                                 </span>
                             </template>
@@ -250,6 +260,17 @@ onBeforeMount(() => {
     eventBus.off('refreshView')
 })
 
+// 状态映射表
+const statusMap = {
+  "0": { name: "关闭", color: "#F56C6C" }, // 红色表示关闭
+  "1": { name: "开启", color: "#67C23A" }, // 绿色表示开启
+};
+
+// 根据 status 值获取映射后的对象
+const getStatusInfo = (status: string) => {
+  return statusMap[status] || { name: "未知状态", color: "#000" };
+};
+
 </script>
 <style scoped lang="scss">
 .el-input,

admin.ui.plus-master/src/views/admin/statement/BlackBox/index.vue

@@ -63,6 +63,14 @@
         <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
 <el-table v-loading="state.loading" stripe :data="state.tableModel" row-key="id" style="width: 100%">
         <el-table-column v-for="column in state.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label"  >
+          <template #default="{ row }">
+      <template v-if="column.prop === 'deviceStatus'">
+        <StatusBox :status="row.deviceStatus" />
+      </template>
+      <template v-else>
+        {{ row[column.prop] }}
+      </template>
+    </template>
         </el-table-column>
 </el-table>
 <div class="my-flex my-flex-end" style="margin-top: 20px">
@@ -88,6 +96,9 @@
   import eventBus from "/@/utils/mitt";
   import { PageInput,BlackBoxDto } from "/@/api/admin/reportManagement/BlackBox/BlackBoxdto";
   import {Api} from "/@/api/admin/reportManagement/BlackBox/BlackBoxapi";
+  import StatusBox from "/@/components/StatusBox.vue";
+
+
 /**数据对象*/
   const state = reactive({
     /**加载显示 */
@@ -114,15 +125,15 @@ tableModel: [] as BlackBoxDto,
 { prop: 'softwareVersion', label: '软件版本号' },
 { prop: 'hardwareVersion', label: '硬件版本号' },
 { prop: 'serialNumber', label: '序列号' },
-{ prop: 'bindingDispenserManufacturer', label: '绑定加油机厂商' },
-{ prop: 'componentManufacturer', label: '部件出厂加油机厂商' },
 { prop: 'stationName', label: '加油站名称' },
 { prop: 'safetyDeviceManufacturer', label: '安全装置厂家' },
 { prop: 'dispenserNumber', label: '油机号' },
 { prop: 'nozzleNumber', label: '油枪号' },
 { prop: 'deviceStatus', label: '安全装置状态' },
 { prop: 'fixTime', label: '安装时间' },
-{ prop: 'soldTime', label: '出厂时间' },],
+{ prop: 'soldTime', label: '出厂时间' },
+{ prop: 'bindingDispenserManufacturer', label: '绑定加油机厂商' },
+{ prop: 'componentManufacturer', label: '部件出厂加油机厂商' },],
 /**分页标识 */
     pageInput:{
       currentPage: 1,

admin.ui.plus-master/src/views/admin/statement/displayControl/index.vue

@@ -19,28 +19,26 @@
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
                 <el-form-item label="显示屏状态">
-                  <el-select  placeholder="请选择状态">
+                  <el-select v-model="state.filter.deviceStatus" placeholder="请选择状态">
                                    <el-option label="所有" :value="''"></el-option>
-                                   <el-option label="已备案" :value="''"></el-option>
-                                   <el-option label="未备案" :value="''"></el-option>
+                                   <el-option v-for="(value, key) in FuelDispenserEnum" :key="key" :label="value" :value="key" />
                                  </el-select> 
                   </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
                 <el-form-item label="在线状态">
-                  <el-select  placeholder="请选择状态">
+                  <el-select v-model="state.filter.onlineStatus" placeholder="请选择状态">
                                    <el-option label="所有" :value="''"></el-option>
-                                   <el-option label="在线" :value="''"></el-option>
-                                   <el-option label="离线" :value="''"></el-option>
+                                   <el-option v-for="(value, key) in OnlineStatus" :key="key" :label="value" :value="key" />
                                  </el-select>             
                 </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
             <el-form-item label="选择时间">
                   <el-date-picker
-                    v-model="state.filter.FixTime"
-                    type="datetimerange"
-                    value-format="YYYY-MM-DD HH:mm:ss"
+                    v-model="state.filter.createTimeRange"
+                    type="daterange"
+                    value-format="YYYY-MM-DD"
                     range-separator="To"
                     start-placeholder="开始日期"
                     end-placeholder="结束日期"
@@ -74,10 +72,31 @@
 <!--表格-->
       <el-col  :xs="24" >
         <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-<el-table v-loading="state.loading" stripe :data="state.tableModel" row-key="id" style="width: 100%">
-        <el-table-column v-for="column in state.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label"  >
-        </el-table-column>
-</el-table>
+<el-table 
+            ref="multipleTableRef" 
+            v-loading="state.loading" 
+            stripe 
+            :data="state.tableModel" 
+            row-key="id" 
+            style="width: 100%">
+            <el-table-column 
+              v-for="column in state.dynamicColumns" 
+              :key="column.prop" 
+              :prop="column.prop" 
+              :label="column.label">
+              <template #default="{ row }">
+                <template v-if="column.prop === 'onlineStatus'">
+                  <StatusBox :status="row.onlineStatus" />
+                </template>
+                <template v-else-if="column.prop === 'deviceStatus'">
+                  <StatusBox :status="row.deviceStatus" />
+                </template>
+                <template v-else>
+                  {{ row[column.prop] }}
+                </template>
+              </template>
+            </el-table-column>
+          </el-table>
 <div class="my-flex my-flex-end" style="margin-top: 20px">
             <el-pagination
               v-model:currentPage="state.pageInput.CurrentPage"
@@ -101,6 +120,9 @@
   import eventBus from "/@/utils/mitt";
   import { PageInput,encodercontrolsDto } from "/@/api/admin/reportManagement/displayControl/displayControldto";
   import {Api} from "/@/api/admin/reportManagement/displayControl/displayControlapi";
+  import StatusBox from "/@/components/StatusBox.vue";
+
+
 /**数据对象*/
   const state = reactive({
     /**加载显示 */
@@ -116,11 +138,15 @@
 /**绑定加油机厂商 */
         BindingDispenserManufacturer: "",
 /**安全装置状态 */
-        DeviceStatus: "",
+        deviceStatus: "",
 /**安装时间 */
         FixTime: "",
 /**出厂时间 */
-        SoldTime: "",},
+        SoldTime: "",
+        startDate:null,
+        endDate:null,
+        createTimeRange: [],
+      },
   /**表格信息 */
 tableModel: [] as encodercontrolsDto,
     /**动态表头 */
@@ -128,13 +154,13 @@ tableModel: [] as encodercontrolsDto,
 { prop: 'oilCompanyName', label: '石油公司' },
 { prop: 'stationName', label: '加油站名称' },
 { prop: 'serialNumber', label: '显示屏编号' },
-{ prop: 'bindingDispenserManufacturer', label: '绑定加油机厂商' },
 { prop: 'dispenserNumber', label: '油机号' },
 { prop: 'nozzleNumber', label: '油枪号' },
 { prop: 'deviceStatus', label: '显示屏状态' },
 { prop: 'onlineStatus', label: '在线状态' },
 { prop: 'fixTime', label: '安装时间' },
-{ prop: 'soldTime', label: '出厂时间' },],
+{ prop: 'soldTime', label: '出厂时间' },
+{ prop: 'bindingDispenserManufacturer', label: '绑定加油机厂商' },],
 /**分页标识 */
     pageInput:{
       currentPage: 1,
@@ -143,6 +169,24 @@ tableModel: [] as encodercontrolsDto,
     /**分页总数 */
     total: 0,
 })
+
+/**在线状态*/
+enum OnlineStatus {
+  online = '在线',
+  offline = '离线'
+}
+
+/**设备状态*/
+enum FuelDispenserEnum {
+  unregister="未备案",
+  produce="已生产",
+  register="已备案",
+  bind="已绑定油机",
+  factory="已出厂注册",
+  enable="已启用",
+  disable="维修中"
+}
+
   onMounted(() => {
     init()
     eventBus.off('refreshView')
@@ -166,7 +210,18 @@ const onCurrentChange = () =>{
   /**
   * 监听变换
   */
-  watch(() => {})
+  watch(
+  () => state.filter.createTimeRange,
+  (newVal) => {
+    if (newVal && newVal.length === 2) {
+      state.filter.startDate = newVal[0]; // yyyy-MM-dd 格式
+      state.filter.endDate = newVal[1];
+    } else {
+      state.filter.startDate = null;
+      state.filter.endDate = null;
+    }
+  }
+);
 /**条件查询 */
           const onQuery = () => {
           init()
@@ -178,6 +233,8 @@ const res:any = await new Api().getList({...state.pageInput, Filter:state.filter
             state.total = res?.data?.total ?? 0
 state.tableModel = res?.data?.list ?? []
           state.loading = false
+        
+          
         }
 </script>
 <style scoped lang="scss">

admin.ui.plus-master/src/views/admin/statement/encodercontrols/index.vue

@@ -15,14 +15,13 @@
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="安装时间">
                   <el-date-picker
-                     v-model="value1"
+                     v-model="state.dateRange"
                      format="YYYY-MM-DD"
+                      value-format="YYYY-MM-DD"
                      type="daterange"
                      start-placeholder="开始时间"
                      end-placeholder="结束时间"
                      :clearable="false"
-                     :shortcuts="shortcuts"
-                     @change="change"
                    ></el-date-picker>
                  </el-form-item>
                </el-col>   
@@ -80,10 +79,31 @@
 <!--表格-->
       <el-col  :xs="24" >
         <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-<el-table v-loading="state.loading" stripe :data="state.tableModel" row-key="id" style="width: 100%">
-        <el-table-column v-for="column in state.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label"  >
-        </el-table-column>
-</el-table>
+<el-table 
+            ref="multipleTableRef" 
+            v-loading="state.loading" 
+            stripe 
+            :data="state.tableModel" 
+            row-key="id" 
+            style="width: 100%">
+            <el-table-column 
+              v-for="column in state.dynamicColumns" 
+              :key="column.prop" 
+              :prop="column.prop" 
+              :label="column.label">
+              <template #default="{ row }">
+                <template v-if="column.prop === 'onlineStatus'">
+                  <StatusBox :status="row.onlineStatus" />
+                </template>
+                <template v-else-if="column.prop === 'deviceStatus'">
+                  <StatusBox :status="row.deviceStatus" />
+                </template>
+                <template v-else>
+                  {{ row[column.prop] }}
+                </template>
+              </template>
+            </el-table-column>
+          </el-table>
 <div class="my-flex my-flex-end" style="margin-top: 20px">
             <el-pagination
               v-model:currentPage="state.pageInput.CurrentPage"
@@ -107,16 +127,19 @@
   import eventBus from "/@/utils/mitt";
   import { PageInput,encodercontrolsDto } from "/@/api/admin/reportManagement/encodercontrols/encodercontrolsdto";
   import {Api} from "/@/api/admin/reportManagement/encodercontrols/encodercontrolsapi";
+  import StatusBox from "/@/components/StatusBox.vue";
 
-// 安装日期假数据
-const value1 = ref('')
 
 /**数据对象*/
   const state = reactive({
+    dateRange: [] as unknown as [string, string], // 用于存储日期范围
     /**加载显示 */
     loading: false,
     /**条件查询模块 */
       filter: {
+        startDate:"",
+        endDate:"",
+
 /**石油公司 */
         OilCompanyName: "",
 /**序列号 */
@@ -127,6 +150,8 @@ const value1 = ref('')
         DeviceStatus: "",
 /**安装时间 */
         FixTime: "",
+// 在线状态
+        onlineStatus:"",
 /**出厂时间 */
         SoldTime: "",},
   /**表格信息 */
@@ -174,19 +199,31 @@ const onCurrentChange = () =>{
   /**
   * 监听变换
   */
-  watch(() => {})
+  watch(
+  () => state.dateRange,
+  (newVal) => {
+    if (newVal && newVal.length === 2) {
+      state.filter.startDate = newVal[0]; // 开始时间
+      state.filter.endDate = newVal[1];   // 结束时间
+    } else {
+      state.filter.startDate = "";
+      state.filter.endDate = "";
+    }
+  }
+);
 /**条件查询 */
           const onQuery = () => {
           init()
         }
         /**初始化 */
         const init = async () => {
-          state.loading = true
-const res:any = await new Api().getList({...state.pageInput, Filter:state.filter})
-            state.total = res?.data?.total ?? 0
-state.tableModel = res?.data?.list ?? []
-          state.loading = false
-        }
+  state.loading = true;
+  console.log("Request Payload:", { ...state.pageInput, Filter: state.filter });
+  const res: any = await new Api().getList({ ...state.pageInput, Filter: state.filter });
+  state.total = res?.data?.total ?? 0;
+  state.tableModel = res?.data?.list ?? [];
+  state.loading = false;
+};
 </script>
 <style scoped lang="scss">
 

admin.ui.plus-master/src/views/admin/statement/gasStationManagement/index.vue

@@ -18,15 +18,17 @@
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="油站类型">
-                  <el-select placeholder="请选择油站类型">
-                    <el-option/>
+                  <el-select v-model="Data.Filter.type" placeholder="请选择油站类型">
+                    <el-option label="所有" :value="''"></el-option>
+                    <el-option v-for="(value, key) in type" :key="key" :label="value" :value="key" />
+                    
                   </el-select>
                 </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="选择时间">
                   <el-date-picker
-                    v-model="value1"
+                  v-model="Data.Filter.createTimeRange"
                     type="datetimerange"
                     value-format="YYYY-MM-DD HH:mm:ss"
                     range-separator="To"
@@ -56,6 +58,11 @@
             style="width: 100%">
             <el-table-column v-for="column in Data.dynamicColumns" :key="column.prop" :prop="column.prop"
               :label="column.label" />
+              <el-table-column label="站长及联系方式">
+  <template #default="scope">
+    {{ scope.row.contact }}{{ scope.row.phone }}
+  </template>
+</el-table-column>
           </el-table>
           <div class="my-flex my-flex-end" style="margin-top: 20px">
             <el-pagination v-model:currentPage="Data.pageInput.currentPage" v-model:page-size="Data.pageInput.pageSize"
@@ -70,7 +77,7 @@
 </template>
 
 <script setup lang="ts" name="authorize/fuelingsdk">
-import { onMounted, reactive, ref } from "vue";
+import { onMounted, reactive, ref, watch } from "vue";
 import { ElTable } from 'element-plus'
 import { gasStationFilterModel_SearchFilter, gasStationFilterModel, PageInputgasStationFilterModel } from "/@/api/admin/reportManagement/gasStation/gasStationDto";
 import { gasStationApi } from "/@/api/admin/reportManagement/gasStation/gasStationApi";
@@ -86,24 +93,31 @@ const Data = reactive({
   loading: false,
   /**条件查询模块 */
   Filter: {
+    city:"",
+    contact:"",
+    phone:"",
+    alarmTime:"",
     /**省份 */
     province: "",
     /**加油站名称 */
     name: "",
+    // 油站类型
+    type:"",
+    startDate:null,
+    endDate:null,
   } as gasStationFilterModel_SearchFilter,
   /**表格信息 */
   tableModel: [] as Array<gasStationFilterModel>,
   /**动态表头 */
   dynamicColumns: [
-    { prop: '', label: '省份' },
-    { prop: '', label: '城市' },
+    { prop: 'province', label: '省份' },
+    { prop: 'city', label: '城市' },
     { prop: 'name', label: '油站名称' },
     { prop: 'type', label: '油站类型' },
     { prop: 'address', label: '油站地址' },
-    { prop: '', label: '站长及联系方式' },
     { prop: 'dispensersTotal', label: '油机数量' },
     { prop: 'nozzleControlsTotal', label: '油枪数量' },
-    { prop: '', label: '启用时间(安装时间)' },
+    { prop: 'alarmTime', label: '启用时间(安装时间)' },
   ],
   /**分页标识 */
   pageInput: {
@@ -114,6 +128,13 @@ const Data = reactive({
   total: 0,
 })
 
+// 油站类型
+enum type {
+  中石油="中石油",
+  中石化="中石化",
+  社会站="社会站"
+}
+
 /**初始化 */
 const init = async () => {
   Data.loading = true
@@ -146,6 +167,7 @@ const onReset = () => {
   init()
 }
 
+
 /**
 * 页条变化
 * @param val
@@ -162,8 +184,20 @@ const onSizeChange = (val: number) => {
 const onCurrentChange = (val: number) => {
   Data.pageInput.currentPage = val
   init()
-}
-
+} 
+
+watch(
+  () => Data.Filter.createTimeRange,
+  (newVal) => {
+    if (newVal && newVal.length === 2) {
+      Data.Filter.startDate = newVal[0]; // yyyy-MM-dd 格式
+      Data.Filter.endDate = newVal[1];
+    } else {
+      Data.Filter.startDate = null;
+      Data.Filter.endDate = null;
+    }
+  }
+);
 </script>
 
 <style scoped lang="scss">

admin.ui.plus-master/src/views/admin/statement/listOfOilEngines/index.vue

@@ -24,6 +24,7 @@
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="设备状态">
                   <el-select v-model="oilEngineData.filterModel.deviceStatus" placeholder="请输入设备状态">
+                    <el-option label="所有" :value="''"></el-option>
                     <el-option v-for="(value, key) in FuelDispenserEnum" :key="key" :label="value" :value="key" />
                   </el-select>
                   <!-- <el-input v-model="oilEngineData.filterModel.deviceStatus" placeholder="请输入设备状态" clearable></el-input> -->
@@ -32,6 +33,7 @@
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="在线状态">
                   <el-select v-model="oilEngineData.filterModel.onlineStatus" placeholder="请输入在线状态">
+                    <el-option label="所有" :value="''"></el-option>
                     <el-option v-for="(value, key) in OnlineStatus" :key="key" :label="value" :value="key" />
                   </el-select>
                   <!-- <el-input v-model="oilEngineData.filterModel.onlineStatus" placeholder="请输入在线状态" clearable></el-input> -->
@@ -39,20 +41,19 @@
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="序列号">
-                  <el-input placeholder="请输入序列号" clearable></el-input>
+                  <el-input v-model="oilEngineData.filterModel.serialNumber" placeholder="请输入序列号" clearable></el-input>
                 </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="安装时间">
                   <el-date-picker
-                     v-model="value1"
-                     format="YYYY-MM-DD"
+                  v-model="oilEngineData.filterModel.createTimeRange"
+                  value-format="YYYY-MM-DD"
                      type="daterange"
+                     range-separator="To"
                      start-placeholder="开始时间"
                      end-placeholder="结束时间"
                      :clearable="false"
-                     :shortcuts="shortcuts"
-                     @change="change"
                    ></el-date-picker>
                  </el-form-item>
                </el-col>   
@@ -128,14 +129,15 @@
 
 <script setup lang="ts">
 
-import { onBeforeMount, onMounted, reactive, ref } from "vue";
+import { onBeforeMount, onMounted, reactive, ref, watch } from "vue";
 import { ListOfOilEnginesApi } from "/@/api/admin/reportManagement/listOfOilEngines/listOfOilEnginesApi";
 import { FuelDispenserDto_SearchFilter, PageInputFuelDispenserDto, FuelDispenserDto } from "/@/api/admin/reportManagement/listOfOilEngines/listOfOilEnginesDto";
 import eventBus from "/@/utils/mitt";
 import { useGlobalCacheStore } from "/@/stores/globalCacheStore";
 import router from "/@/router";
 import StatusBox from "../../../../components/StatusBox.vue";
-
+import { BoardListApi } from '/@/api/admin/PCBA/boardListApi';
+import dayjs from 'dayjs';
 
 
 /**获取全局缓存*/
@@ -145,26 +147,35 @@ const globalCacheStore = useGlobalCacheStore()
 /**油机列表 - 列表设备状态、在线状态 */
 const oilEngineStatus = ref(globalCacheStore.getGlobalStore().get('oilEngineStatus'))
 
-// 安装日期假数据
-const value1 = ref('')
 
 
 /**
  * 油机列表数据对象
  */
 const oilEngineData = reactive({
+  time:'',
   loading: false,
   filterModel: {
     /**油机号*/
     name: "",
+    oilCompany:"",
     /**加油站*/
     gasStation: "",
+    createTimeRange: [], // 新增属性，用于存储时间范围
     /**加油机机型*/
     model: "",
     /**设备状态*/
     deviceStatus: "",
     /**在线状态*/
     onlineStatus: "",
+    /**序列号*/
+    serialNumber: "",
+    /**开始时间*/
+    startDate: null,
+    /**结束时间*/
+    endDate:null,
+    installationDate:"",
+    startupDate:"",
   } as FuelDispenserDto_SearchFilter,
   total: 0,
   pageInput: {
@@ -203,6 +214,11 @@ const flattenObject = (obj, parentKey = '') => {
   return result;
 }
 
+/** 导出 */
+const exportDataToExcel = async () => {
+  const res: any = await new ListOfOilEnginesApi().onExportExcel({ ...oilEngineData.pageInput, filter: oilEngineData.filterModel })
+}
+
 /**重置 */
 const onReset = () => {
   resetQuery()
@@ -225,6 +241,22 @@ const toPage = (row) => {
   router.push({ path: `/statement/${row.fuelId}` })
 }
 
+/**
+ * 监听时间变换
+ */
+ watch(
+  () => oilEngineData.filterModel.createTimeRange,
+  (newVal) => {
+    if (newVal && newVal.length === 2) {
+      oilEngineData.filterModel.startDate = newVal[0]; // yyyy-MM-dd 格式
+      oilEngineData.filterModel.endDate = newVal[1];
+    } else {
+      oilEngineData.filterModel.startDate = null;
+      oilEngineData.filterModel.endDate = null;
+    }
+  }
+);
+
 // /**油机列表 - 列表状态 */
 // const getOilEngineStatusType = (val) => {
 //   val = String(val)
@@ -259,6 +291,11 @@ const resetQuery = () => {
   oilEngineData.filterModel.model = ''
   oilEngineData.filterModel.deviceStatus = ''
   oilEngineData.filterModel.onlineStatus = ''
+  oilEngineData.filterModel.installationDate = ''
+  oilEngineData.filterModel.serialNumber = ''
+  oilEngineData.filterModel.createTimeRange = null
+
+  
 }
 
 //设置不同设备状态、在线状态字体颜色
@@ -295,6 +332,8 @@ onBeforeMount(() => {
   eventBus.off('refreshView')
 })
 
+
+
 </script>
 
 <style scoped lang="scss">

admin.ui.plus-master/src/views/admin/statement/partsManagement/encScreen/index.vue

@@ -94,14 +94,14 @@ const Data = reactive({
     { prop: 'sn', label: '序列号' },
     { prop: 'companyName', label: '石油公司' },
     { prop: 'stationName', label: '加油站名称' },
-    { prop: 'supplierName', label: '加油机厂商' },
-    { prop: 'manufacturerName', label: '加密显示屏厂商' },
     { prop: 'nozzleconName', label: '油枪号' },
     { prop: 'uuid', label: '加密显示屏编号' },
     { prop: 'deviceStatus', label: '加密显示屏状态' },
     { prop: 'onlineStatus', label: '在线状态' },
     { prop: 'soldTime', label: '安装时间' },
     { prop: 'productTime', label: '出厂时间' },
+    { prop: 'supplierName', label: '加油机厂商' },
+    { prop: 'manufacturerName', label: '加密显示屏厂商' },
   ],
   /**分页标识 */
   pageInput: {

admin.ui.plus-master/src/views/admin/statement/partsManagement/encoder/index.vue

@@ -14,6 +14,7 @@
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="在线状态">
                   <el-select v-model="Data.Filter.onlineStatus" placeholder="请选择在线状态">
+                    <el-option label="所有" :value="''"></el-option>
                     <el-option v-for="(value, key) in selectList.Online" :key="key" :label="value" :value="key" />
                   </el-select>
                 </el-form-item>
@@ -21,6 +22,7 @@
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="设备状态">
                   <el-select v-model="Data.Filter.deviceStatus" placeholder="请选择设备状态">
+                    <el-option label="所有" :value="''"></el-option>
                     <el-option v-for="(value, key) in selectList.Device" :key="key" :label="value" :value="key" />
                   </el-select>
                 </el-form-item>
@@ -28,10 +30,24 @@
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="报警级别">
                   <el-select v-model="Data.Filter.deviceAlarmLevel" placeholder="请选择报警级别">
+                    <el-option label="所有" :value="''"></el-option>
                     <el-option v-for="(value, key) in selectList.Level" :key="key" :label="value" :value="key" />
                   </el-select>
                 </el-form-item>
               </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
+                <el-form-item label="安装时间">
+                  <el-date-picker
+                  v-model="Data.Filter.createTimeRange"
+                  value-format="YYYY-MM-DD"
+                     type="daterange"
+                     range-separator="To"
+                     start-placeholder="开始时间"
+                     end-placeholder="结束时间"
+                     :clearable="false"
+                   ></el-date-picker>
+                 </el-form-item>
+               </el-col>   
             </el-form-item>
           </el-form>
 
@@ -87,8 +103,12 @@ const Data = reactive({
     /**序列号 */
     sn: "",
     /**设备报警级别 */
-    deviceAlarmLevel: ""
-  } as encoderFilterModel_SearchFilter,
+    deviceAlarmLevel: "",
+    /**开始时间*/
+    startDate: null,
+    /**结束时间*/
+    endDate: null
+  } as unknown as encoderFilterModel_SearchFilter,
 
   /**表格信息 */
   tableModel: [] as Array<encoderFilterModel>,
@@ -180,15 +200,18 @@ const onCurrentChange = (val: number) => {
 /**
  * 监听时间变换
  */
-// watch(() => [Data.time1,Data.time2], (newVal ) => {
-//   if(newVal.length === 0){
-//     return
-//   }
-//   Data.Filter.OutBeginTime = newVal?.[0]?.[0]
-//   Data.Filter.OutEndTime = newVal?.[0]?.[1]
-//   Data.Filter.CreateBeginTime = newVal?.[1]?.[0]
-//   Data.Filter.CreateEndTime = newVal?.[1]?.[0]
-// })
+ watch(
+  () => Data.Filter.createTimeRange,
+  (newVal) => {
+    if (newVal && newVal.length === 2) {
+      Data.Filter.startDate = newVal[0]; // yyyy-MM-dd 格式
+      Data.Filter.endDate = newVal[1];
+    } else {
+      Data.Filter.startDate = null;
+      Data.Filter.endDate = null;
+    }
+  }
+);
 
 </script>
 

admin.ui.plus-master/src/views/admin/statement/partsManagement/oilGun/index.vue

@@ -51,10 +51,33 @@
       <!--表格-->
       <el-col :xs="24">
         <el-card class="my-fill mt8" shadow="hover">
-          <el-table ref="multipleTableRef" v-loading="Data.loading" stripe :data="Data.tableModel" row-key="id"
+          <el-table 
+            ref="multipleTableRef" 
+            v-loading="Data.loading" 
+            stripe 
+            :data="Data.tableModel" 
+            row-key="id" 
             style="width: 100%">
-            <el-table-column v-for="column in Data.dynamicColumns" :key="column.prop" :prop="column.prop"
-              :label="column.label" />
+            <el-table-column 
+              v-for="column in Data.dynamicColumns" 
+              :key="column.prop" 
+              :prop="column.prop" 
+              :label="column.label">
+              <template #default="{ row }">
+                <template v-if="column.prop === 'onlineStatus'">
+                  <StatusBox :status="row.onlineStatus" />
+                </template>
+                <template v-else-if="column.prop === 'cheatStatus'">
+                  <StatusBox :status="row.cheatStatus" />
+                </template>
+                <template v-else-if="column.prop === 'alarming'">
+                  <StatusBox :status="row.alarming" />
+                </template>
+                <template v-else>
+                  {{ row[column.prop] }}
+                </template>
+              </template>
+            </el-table-column>
           </el-table>
           <div class="my-flex my-flex-end" style="margin-top: 20px">
             <el-pagination v-model:currentPage="Data.pageInput.currentPage" v-model:page-size="Data.pageInput.pageSize"
@@ -72,6 +95,7 @@
 import { onMounted, reactive, watch } from "vue";
 import { oilGunFilterModel_SearchFilter, oilGunFilterModel, PageInputoilGunFilterModel } from "/@/api/admin/reportManagement/oilGun/oilGunDto";
 import { OilGunApi } from "/@/api/admin/reportManagement/oilGun/oilGunApi";
+import StatusBox from "/@/components/StatusBox.vue";
 
 
 /**页面对象 */
@@ -96,6 +120,10 @@ const Data = reactive({
     OutBeginTime: "",
     /**出厂结束的时间 */
     OutEndTime: "",
+    // 作弊状态
+    cheatStatus:"",
+    // 自锁状态
+    alarming:""
   } as oilGunFilterModel_SearchFilter,
   /**表格信息 */
   tableModel: [] as Array<oilGunFilterModel>,
@@ -108,7 +136,6 @@ const Data = reactive({
     { prop: 'code', label: '编码' },
     { prop: 'alarming', label: '自锁' },
     { prop: 'fuelId', label: '油机号' },
-    { prop: 'supplierName', label: '加油机厂商' },
     { prop: 'onlineStatus', label: '在线状态' },
     { prop: 'cheatStatus', label: '作弊状态' },
     { prop: 'monitoringUUID', label: '监控微处理器编号' },
@@ -116,6 +143,7 @@ const Data = reactive({
     { prop: 'encoderControlsUUID', label: '编码器编号' },
     { prop: 'productTime', label: '出厂时间' },
     { prop: 'soldTime', label: '安装时间' },
+    { prop: 'supplierName', label: '加油机厂商' },
   ],
   /**分页总数 */
   total: 0,

admin.ui.plus-master/src/views/admin/statement/taxcontrol/index.vue

@@ -47,22 +47,22 @@
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="编码器状态">
-                  <el-select  placeholder="请选择状态">
-                                   <el-option label="所有" :value="''"></el-option>
-                                   <el-option label="启用" :value="''"></el-option>
-                                   <el-option label="未知" :value="''"></el-option>
-                                 </el-select>                </el-form-item>
+                  <el-select v-model="state.filter.DeviceStatus" placeholder="请选择状态">
+                       <el-option label="所有" :value="''"></el-option>
+                        <el-option v-for="(value, key) in DeviceStatus" :key="key" :label="value" :value="key" />
+                  </el-select>                
+                </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="在线状态">
-                  <el-select  placeholder="请选择状态">
+                  <el-select v-model="state.filter.onlineStatus"  placeholder="请选择状态">
                                    <el-option label="所有" :value="''"></el-option>
-                                   <el-option label="在线" :value="''"></el-option>
-                                   <el-option label="离线" :value="''"></el-option>
+                                   <el-option v-for="(value, key) in OnlineStatus" :key="key" :label="value" :value="key" />
+
                                  </el-select>                </el-form-item>
               </el-col>
-              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
-                <el-form-item label="选择时间">
+              <el-col :xs="24" :sm="16" :md="12" :lg="12" :xl="10" class="mb20" >
+                <el-form-item label="选择安装时间">
                   <el-date-picker
                     v-model="state.filter.SoldTime"
                     type="datetimerange"
@@ -84,10 +84,31 @@
 <!--表格-->
       <el-col  :xs="24" >
         <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-<el-table v-loading="state.loading" stripe :data="state.tableModel" row-key="id" style="width: 100%">
-        <el-table-column v-for="column in state.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label"  >
-        </el-table-column>
-</el-table>
+<el-table 
+            ref="multipleTableRef" 
+            v-loading="state.loading" 
+            stripe 
+            :data="state.tableModel" 
+            row-key="id" 
+            style="width: 100%">
+            <el-table-column 
+              v-for="column in state.dynamicColumns" 
+              :key="column.prop" 
+              :prop="column.prop" 
+              :label="column.label">
+              <template #default="{ row }">
+                <template v-if="column.prop === 'onlineStatus'">
+                  <StatusBox :status="row.onlineStatus" />
+                </template>
+                <template v-else-if="column.prop === 'deviceStatus'">
+                  <StatusBox :status="row.deviceStatus" />
+                </template>
+                <template v-else>
+                  {{ row[column.prop] }}
+                </template>
+              </template>
+            </el-table-column>
+          </el-table>
 <div class="my-flex my-flex-end" style="margin-top: 20px">
             <el-pagination
               v-model:currentPage="state.pageInput.CurrentPage"
@@ -111,6 +132,9 @@
   import eventBus from "/@/utils/mitt";
   import { PageInput,encodercontrolsDto } from "/@/api/admin/reportManagement/taxcontrol/taxcontroldto";
   import {Api} from "/@/api/admin/reportManagement/taxcontrol/taxcontrolapi";
+  import StatusBox from "/@/components/StatusBox.vue";
+
+
 /**数据对象*/
   const state = reactive({
     /**加载显示 */
@@ -155,6 +179,23 @@ tableModel: [] as encodercontrolsDto,
     /**分页总数 */
     total: 0,
 })
+
+enum DeviceStatus {
+  unregister="未备案",
+produce="已生产",
+register="已备案",
+bind="已绑定油机",
+factory="已出厂注册",
+enable="已启用",
+disable="维修中"
+}
+
+/**在线状态*/
+enum OnlineStatus {
+  online = '在线',
+  offline = '离线'
+}
+
   onMounted(() => {
     init()
     eventBus.off('refreshView')