feat(油机详情页面部件信息图、报警规则):新增油机详情页面部件信息图、报警规则、推送模板页面。修改表格样式。

admin.ui.plus-master/src/api/admin/AlarmService/alarmRulesApi.ts

@@ -0,0 +1,29 @@
+import { AxiosResponse } from 'axios'
+import {ContentType, HttpClient, RequestParams} from "/@/api/admin/http-client";
+import {alarmRluesFilterModel} from "/@/api/admin/AlarmService/alarmRulesDto";
+
+export class alarmRulesApi<SecurityDataType = unknown> extends HttpClient<SecurityDataType> {
+
+  /**
+   * No description
+   *
+   * @tags
+   * @name updateForm
+   * @summary 新建规则
+   * @request POST:
+   * @secure
+   */
+  addForm = (data: alarmRluesFilterModel, params: RequestParams = {}) =>
+      this.request<AxiosResponse, any>({
+          path: '/api/app/push/upload-push-rule',
+          method: 'POST',
+          body: data,
+          secure: true,
+          type: ContentType.Json,
+          format: 'json',
+          ...params
+      })
+
+
+}
+

admin.ui.plus-master/src/api/admin/AlarmService/alarmRulesDto.ts

@@ -0,0 +1,36 @@
+/**
+ *  报警服务 -- 新建报警规则
+ *  数据对象的Dto
+ * */
+
+/**
+ * 数据信息
+ */
+export  interface alarmRluesFilterModel{
+    /**规则名称*/
+    ruleName?: string,
+    /**角色 */
+    roleMappingId?:Array<number>, 
+    /**备注*/
+    remark?: string,
+    /**推送方式 */
+    pushMethod?:string,
+    /**模板 */
+    pushTemplateMappingID?:Array<number>, 
+    /**正则表达式 */
+    regular?:string,
+    /**是否互斥 */
+    isExclusive?:boolean,
+    /**优先级 */
+    taskPriority?:number, 
+    /**触发方式 */
+   triggerMethod?:string,
+    /**规则条件 */
+    conditionsJson?:string,
+    /**推送用户中间表id */
+    pushUserid?:Array<number>
+  }
+
+
+
+

admin.ui.plus-master/src/api/admin/AlarmService/pushTemplateApi.ts

@@ -0,0 +1,47 @@
+import { ContentType, HttpClient, RequestParams, } from "/@/api/admin/http-client";
+import { pushTemplateModel, TemplateFilterDtoResult, TemplateFilterDto } from "/@/api/admin/AlarmService/pushTemplateDto";
+import { AxiosResponse } from "axios/index";
+
+export class pushTemplateApi<SecurityDataType = unknown> extends HttpClient<SecurityDataType> {
+
+    /**
+     * No description
+     *
+     * @tags
+     * @name updateForm
+     * @summary 上传模板
+     * @request POST:
+     * @secure
+     */
+    addForm = (data: pushTemplateModel, params: RequestParams = {}) =>
+        this.request<AxiosResponse, any>({
+            path: '/api/app/push/upload-template',
+            method: 'POST',
+            body: data,
+            secure: true,
+            type: ContentType.Json,
+            format: 'json',
+            ...params
+        }
+        )
+
+    /**
+    * No description
+    *
+    * @tags
+    * @name getPageData
+    * @summary 查询
+    * @request GET:
+    * @secure
+    */
+    getData = (data?: TemplateFilterDto, params: RequestParams = {}) =>
+        this.request<TemplateFilterDtoResult, any>({
+            path: '/api/app/push/get-push-template',
+            method: 'POST',
+            secure: true,
+            type: ContentType.Json,
+            format: 'json',
+            body:data,
+            ...params
+        })
+}

admin.ui.plus-master/src/api/admin/AlarmService/pushTemplateDto.ts

@@ -0,0 +1,58 @@
+/**
+ *  报警服务 -- 模板推送
+ *  数据对象的Dto
+ * */
+
+/**
+ * 数据信息
+ */
+export  interface pushTemplateModel{
+    /**模板ID */
+    id?:number,
+    /**模板名称*/
+    templateName?: string,
+    /**模板类型*/
+    templateType?: string,
+    /**模板内容 */
+    templateContent?:string,
+  }
+
+/** 查询信息输入 */
+export interface TemplateFilterDto {
+   /**
+   * 当前页标
+   * @format int32
+   */
+   CurrentPage?: number
+   /**
+    * 每页大小
+    * @format int32
+    */
+   PageSize?: number
+   Filter?: pushTemplateModel
+}
+
+/** 信息输出*/
+export interface TemplateFilterDtoOutput{
+  /**
+   * 数据总数
+   * @format int64
+   */
+  total?: number
+  /** 数据 */
+  list?: pushTemplateModel[] | null
+}
+
+/**结果输出*/
+export interface TemplateFilterDtoResult {
+  /** 是否成功标记 */
+  success?: boolean
+  /** 编码 */
+  code?: string | null
+  /** 消息 */
+  msg?: string | null
+  /** 信息输出 */
+  data?: TemplateFilterDtoOutput
+}
+  
+

admin.ui.plus-master/src/api/admin/reportManagement/partInformation/partInformationApi.ts

@@ -0,0 +1,26 @@
+import { AxiosResponse } from 'axios'
+import { ContentType, HttpClient, RequestParams } from "/@/api/admin/http-client";
+import { ResultOutputPartsFilterModel } from "/@/api/admin/reportManagement/partInformation/partInformationDto";
+
+export class partInformationApi<SecurityDataType = unknown> extends HttpClient<SecurityDataType> {
+    timer = 500
+    /**
+     * No description
+     *
+     * @tags
+     * @name getData
+     * @summary 部件详情信息查询
+     * @request GET:
+     * @secure
+     */
+
+    getData = (query?: {id?: string},params: RequestParams = {})  => 
+        this.request<ResultOutputPartsFilterModel,any>({
+            path:'/api/app/fuel-dispenser/get-component-info',
+            method: 'GET',
+            query:query,
+            secure: true,
+            format: 'json',
+            ...params
+          })
+}

admin.ui.plus-master/src/api/admin/reportManagement/partInformation/partInformationDto.ts

@@ -0,0 +1,109 @@
+/**
+ *  部件详情信息
+ *  数据对象的Dto
+ * */
+/**
+ * 查询信息
+ */
+export interface partsFilterModel {
+    /**计控主板 */
+    calculatorMainboard: {
+        /**在线状态*/
+        onlineStatus?: string | null,
+        /**校验1D*/
+        uuid?: string | null,
+        /**数字签名 */
+        signature?: string | null,
+        /**制造商*/
+        description?: string | null,
+        /**程序版本 */
+        swv?: string | null,
+        /**法制软件 */
+        Legalswv?: string | null,
+        /**法制软件标识 */
+        LegalSwvldentification?: string | null
+    },
+    /**编码器 */
+    encoderControls: {
+        /**在线状态*/
+        onlineStatus?: string | null,
+        /**校验id*/
+        uuid?: string | null,
+        /**数字签名 */
+        signature?: string | null,
+        /**制造商*/
+        description?: string | null,
+        /**程序版本 */
+        swv?: string | null,
+        /**序列号 */
+        sn?: string | null,
+        /**法制软件 */
+        Legalswv?: string | null,
+        /**法制软件标识 */
+        LegalSwvldentification?: string | null
+    },
+    /**加密显示屏 */
+    displayControls: {
+        /**在线状态*/
+        onlineStatus?: string | null,
+        /**序列号*/
+        uuid?: string | null,
+        /**制造商*/
+        description?: string | null
+    },
+    /**油气回收控制主板 */
+    vaporRecoveryControl: {
+        /**在线状态*/
+        onlineStatus?: string | null,
+        /**校验id*/
+        uuid?: string | null,
+        /**数字签名 */
+        signature?:string | null,
+        /**制造商*/
+        description?: string | null,
+        /**程序版本 */
+        swv?: string | null
+    },
+    /**安全装置 */
+    blackBox: {
+        /**二维码*/
+        qrCode?: string | null,
+        /**版本*/
+        swv?: string | null
+    },
+    /**计量器 */
+    meter: {
+        /**序列号*/
+        uuid?: string | null,
+        /**制造商*/
+        description?: string | null
+    },
+}
+
+
+/** 分页信息输出*/
+export interface PageOutputPartsFilterModel {
+    /**
+     * 数据总数
+     * @format int64
+     */
+    total?: number
+    /** 数据 */
+    list?: partsFilterModel[] | null
+}
+
+/**结果输出*/
+export interface ResultOutputPartsFilterModel {
+    /** 是否成功标记 */
+    success?: boolean
+    /** 编码 */
+    code?: string | null
+    /** 消息 */
+    msg?: string | null
+    /** 分页信息输出 */
+    data?: PageOutputPartsFilterModel
+}
+
+
+
+

admin.ui.plus-master/src/theme/tableStyle.scss

@@ -0,0 +1,42 @@
+/**
+*   表格统一样式
+*/
+
+.el-input,
+.el-select {
+    width: 240px;
+}
+
+/* 输入框间距 */
+.el-form .el-col.mb20 .el-form-item {
+    padding-bottom: 20px;
+}
+
+.el-form .el-col.mb20 {
+    margin: 0 !important;
+}
+
+/* 输入框标签固定四个字符宽度 */
+::v-deep .el-form-item__label {
+    // 字体大小14，4个字符，12px右间距
+    width: 14*4px+12px;
+    justify-content: start;
+}
+
+/* 数据表头 设置灰色样式 */
+::v-deep .el-table th.el-table__cell {
+    background-color: #F6F6F6;
+}
+
+/* 输入框和按钮间横线样式*/
+hr {
+    /* 移除默认的边框样式 */
+    border: none;
+    height: 2px;
+    background-color: #ccc;
+}
+
+/* 横线和按钮的间距*/
+.submit-button {
+    margin-top: 10px;
+}

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

@@ -1,14 +1,14 @@
 <template>
-  <div class="layout-pd" >
+  <div class="layout-pd">
     <el-row>
       <!--操作-->
-      <el-col :xs="24" >
-        <el-card class="mt8"  shadow="hover" >
-          <el-form :model="sdkData.Filter" :inline="true" @submit.stop.prevent>
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="sdkData.Filter" @submit.stop.prevent>
             <el-form-item prop="name" style="width: 100%">
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
                 <el-form-item label="油站名称">
-                  <el-input v-model="sdkData.Filter.OilStation"  placeholder="单行输入" clearable></el-input>
+                  <el-input v-model="sdkData.Filter.OilStation" placeholder="单行输入" clearable></el-input>
                 </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
@@ -28,57 +28,44 @@
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
                 <el-form-item label="失效时间">
-                  <el-date-picker
-                    v-model="sdkData.time"
-                    type="datetimerange"
-                    value-format="YYYY-MM-DD HH:mm:ss"
-                    range-separator="To"
-                    start-placeholder="Start date"
-                    end-placeholder="End date"
-                  />
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                <el-form-item>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                <el-form-item>
-                  <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                  <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+                  <el-date-picker v-model="sdkData.time" type="datetimerange" value-format="YYYY-MM-DD HH:mm:ss"
+                    range-separator="To" start-placeholder="Start date" end-placeholder="End date" />
                 </el-form-item>
               </el-col>
             </el-form-item>
           </el-form>
-          <div class="my-flex my-flex-end" >
-            <el-button  type="primary" icon="ele-CirclePlus" @click="onAdd"> 添加 </el-button>
-            <el-button type="primary" icon="ele-Tickets" @click="onAuditRecord()"> 审核 </el-button>
-            <el-button type="primary" icon="ele-UploadFilled" @click="uploadFiles"> 批量导入 </el-button>
-            <el-button type="primary" icon="ele-Document" @click="exportTable(sdkData.tableModel,sdkData.dynamicColumns)"> 导出表格 </el-button>
-          </div>
+
+          <hr>
+
+          <!-- 按钮  -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+            <el-row>
+              <el-button type="primary" icon="ele-CirclePlus" @click="onAdd"> 添加 </el-button>
+              <el-button type="primary" icon="ele-Tickets" @click="onAuditRecord()"> 审核 </el-button>
+              <el-button type="primary" icon="ele-UploadFilled" @click="uploadFiles"> 批量导入 </el-button>
+              <el-button type="primary" icon="ele-Document"
+                @click="exportTable(sdkData.tableModel, sdkData.dynamicColumns)"> 导出表格 </el-button>
+            </el-row>
+          </el-row>
         </el-card>
       </el-col>
       <!--表格-->
-      <el-col  :xs="24" >
+      <el-col :xs="24">
         <el-card style="height: 70vh" 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 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">
+            <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" 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)"
@@ -93,17 +80,10 @@
             </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"
-              :page-sizes="[10000, 20000, 50000, 100000]"
-              small
-              background
-              @size-change="onSizeChange"
-              @current-change="onCurrentChange"
-              layout="total, sizes, prev, pager, next, jumper"
-            />
+            <el-pagination v-model:currentPage="sdkData.pageInput.CurrentPage"
+              v-model:page-size="sdkData.pageInput.PageSize" :total="sdkData.total"
+              :page-sizes="[10000, 20000, 50000, 100000]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
           </div>
         </el-card>
       </el-col>
@@ -115,10 +95,10 @@
 </template>
 
 <script setup lang="ts" name="authorize/fuelingsdk">
-import {defineAsyncComponent, onMounted, reactive, ref, watch, onBeforeMount,getCurrentInstance} from "vue";
-import {OilSdkAuthorDto, oilSdkFilterModel, oilSdkTableModel,oilSdkAuthorPageOutput,FueilingSdkAuthInput} from "/@/api/admin/deviceAuthorization/oilSdkAuthorDto";
-import {OilSdkAuthorAPI} from "/@/api/admin/deviceAuthorization/oilSdkAuthor";
-import type {pageInput} from "/@/api/admin/shareDto/shareDto";
+import { defineAsyncComponent, onMounted, reactive, ref, watch, onBeforeMount, getCurrentInstance } from "vue";
+import { OilSdkAuthorDto, oilSdkFilterModel, oilSdkTableModel, oilSdkAuthorPageOutput, FueilingSdkAuthInput } from "/@/api/admin/deviceAuthorization/oilSdkAuthorDto";
+import { OilSdkAuthorAPI } from "/@/api/admin/deviceAuthorization/oilSdkAuthor";
+import type { pageInput } from "/@/api/admin/shareDto/shareDto";
 import eventBus from "/@/utils/mitt";
 import * as ExcelJS from 'exceljs';
 import * as FileSaver from 'file-saver';
@@ -130,12 +110,12 @@ const AuditDialog = defineAsyncComponent(() => import('/src/views/admin/authoriz
 const editDialogRef = ref()
 const auditDialogRef = ref()
 
-const multipleTableRef=ref<InstanceType<typeof ElTable>>()
+const multipleTableRef = ref<InstanceType<typeof ElTable>>()
 const { proxy } = getCurrentInstance() as any
 
 /**sdk授权页面对象 */
 const sdkData = reactive({
-  time:'',
+  time: '',
   /**加载显示 */
   loading: false,
   /**条件查询模块 */
@@ -167,7 +147,7 @@ const sdkData = reactive({
     { prop: 'remark', label: '备注' },
   ],
   /**分页标识 */
-  pageInput:{
+  pageInput: {
     CurrentPage: 1,
     PageSize: 10000,
   } as pageInput,
@@ -178,8 +158,8 @@ const sdkData = reactive({
 /**初始化 */
 const init = async () => {
   sdkData.loading = true
-  const query = flattenObject({ Filter: sdkData.Filter})
-  const res:any = await new OilSdkAuthorAPI().getPageData({...sdkData.pageInput, ...query}).catch(() => {
+  const query = flattenObject({ Filter: sdkData.Filter })
+  const res: any = await new OilSdkAuthorAPI().getPageData({ ...sdkData.pageInput, ...query }).catch(() => {
     sdkData.loading = false
   })
   sdkData.tableModel = res?.data?.list ?? []
@@ -202,8 +182,8 @@ onBeforeMount(() => {
 /**
  * 监听时间变换
  */
-watch(() => sdkData.time, (newVal ) => {
-  if(newVal.length === 0){
+watch(() => sdkData.time, (newVal) => {
+  if (newVal.length === 0) {
     return
   }
   sdkData.Filter.BeginTime = newVal?.[0].toString()
@@ -221,7 +201,7 @@ const resetQuery = () => {
   sdkData.Filter.Project = ''
   sdkData.Filter.SN = ''
   sdkData.Filter.Key = ''
-  sdkData.Filter.BeginTime =  ''
+  sdkData.Filter.BeginTime = ''
   sdkData.Filter.EndTime = ''
   sdkData.time = ''
   sdkData.pageInput.CurrentPage = 1
@@ -244,22 +224,22 @@ const onSizeChange = () => {
 }
 
 /**页数变化*/
-const onCurrentChange = () =>{
+const onCurrentChange = () => {
   init()
 }
 
 /**批量导入*/
-const uploadFiles = () =>{
+const uploadFiles = () => {
 
 }
 
 /**导出表格*/
-const exportTable = async(data:any[],columns:{ prop: string, label: string }[]) =>{
+const exportTable = async (data: any[], columns: { prop: string, label: string }[]) => {
   // 创建一个新的工作簿
   const workbook = new ExcelJS.Workbook();
   const worksheet = workbook.addWorksheet('Sheet1');
 
-// 添加表头（不包括名为 "guid" 的表头列）
+  // 添加表头（不包括名为 "guid" 的表头列）
   const headers = columns
     .filter(column => column.prop !== 'guid')  // 过滤掉名为 "guid" 的表头列
     .map(column => column.label);
@@ -273,7 +253,7 @@ const exportTable = async(data:any[],columns:{ prop: string, label: string }[])
     worksheet.addRow(row);
   });
 
-// 设置数据行样式
+  // 设置数据行样式
   worksheet.eachRow({ includeEmpty: true }, row => {
     row.eachCell(cell => {
       // 设置单元格样式
@@ -295,7 +275,7 @@ const exportTable = async(data:any[],columns:{ prop: string, label: string }[])
         // 设置表头单元格的边框为细线
         cell.border = { left: { style: 'thin' }, right: { style: 'thin' }, top: { style: 'thin' }, bottom: { style: 'thin' } };
         // 设置表头单元格背景颜色
-        cell.fill={type: 'pattern',pattern: 'solid',fgColor: { argb: '409eff' }}
+        cell.fill = { type: 'pattern', pattern: 'solid', fgColor: { argb: '409eff' } }
       } else {
         // 设置数据行单元格的边框为细线
         cell.border = { left: { style: 'thin' }, right: { style: 'thin' }, bottom: { style: 'thin' } };
@@ -340,19 +320,19 @@ const editTableData = (row) => {
   editDialogRef.value.openDialog(row)
 }
 /**审核弹窗 */
-const onAuditRecord=()=>{
+const onAuditRecord = () => {
   const selectionRows = multipleTableRef.value!.getSelectionRows() as FueilingSdkAuthInput
   //console.log(selectionRows)
 
   if (!((selectionRows.length as number) > 0)) {
     proxy.$modal.msgWarning('请选择要审核的数据')
     return
-  }else{
+  } else {
     auditDialogRef.value.openDialog(selectionRows)
   }
 
 }
-const onOilSdkRowClick=(row: FueilingSdkAuthInput)=> {
+const onOilSdkRowClick = (row: FueilingSdkAuthInput) => {
   // TODO: improvement typing when refactor table
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
   // @ts-expect-error
@@ -361,13 +341,6 @@ const onOilSdkRowClick=(row: FueilingSdkAuthInput)=> {
 </script>
 
 <style scoped lang="scss">
-.my-el-link {
-  font-size: 14px;
-}
-.el-form .el-col.mb20 {
-  margin: 0 !important;
-}
-.el-input, .el-select {
-  width: 240px;
-}
+@import '/@/theme/tableStyle.scss';
+
 </style>

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

@@ -2,14 +2,15 @@
   <div class="layout-pd">
     <el-row>
       <!--操作-->
-      <el-col :xs="24" >
-        <el-card class="mt8"  shadow="hover" >
-          <el-form :model="softwareData.Filter" :inline="true" @submit.stop.prevent>
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="softwareData.Filter" @submit.stop.prevent>
             <el-form-item prop="name" style="width: 100%">
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
                 <el-form-item label="软件类型">
-                  <el-select  v-model="softwareData.Filter.softwareType" placeholder="请选择软件类型" style="width: 200px;" >
-                    <el-option v-for="(value, key) in softwareType" :key="key" :label="value[1].name"  :value="Number(value[1].value)" />
+                  <el-select v-model="softwareData.Filter.softwareType" placeholder="请选择软件类型" style="width: 200px;">
+                    <el-option v-for="(value, key) in softwareType" :key="key" :label="value[1].name"
+                      :value="Number(value[1].value)" />
                   </el-select>
                 </el-form-item>
               </el-col>
@@ -25,114 +26,70 @@
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
                 <el-form-item label="设备类型">
-                  <el-select  v-model="softwareData.Filter.equipmentType" placeholder="请选择设备类型" style="width: 200px;">
-                    <el-option v-for="(value, key) in equipmentType" :key="key" :label="value[1].name"  :value="Number(value[1].value)" />
+                  <el-select v-model="softwareData.Filter.equipmentType" placeholder="请选择设备类型" style="width: 200px;">
+                    <el-option v-for="(value, key) in equipmentType" :key="key" :label="value[1].name"
+                      :value="Number(value[1].value)" />
                   </el-select>
                 </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
                 <el-form-item label="选择时间">
-                  <el-date-picker
-                    v-model="softwareData.time"
-                    type="datetimerange"
-                    value-format="YYYY-MM-DD HH:mm:ss"
-                    range-separator="To"
-                    start-placeholder="Start date"
-                    end-placeholder="End date"
-                  />
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                <el-form-item>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                <el-form-item>
-                  <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                  <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+                  <el-date-picker v-model="softwareData.time" type="datetimerange" value-format="YYYY-MM-DD HH:mm:ss"
+                    range-separator="To" start-placeholder="Start date" end-placeholder="End date" />
                 </el-form-item>
               </el-col>
             </el-form-item>
           </el-form>
-          <div class="my-flex my-flex-start" >
-            <el-button  type="primary" icon="ele-CirclePlus" @click="onAdd"> 上传软件包 </el-button>
-          </div>
+
+          <hr>
+
+          <!-- 按钮  -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+            <el-row>
+              <el-button type="primary" icon="ele-CirclePlus" @click="onAdd"> 上传软件包 </el-button>
+            </el-row>
+          </el-row>
         </el-card>
       </el-col>
       <!--表格-->
-      <el-col  :xs="24" >
+      <el-col :xs="24">
         <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-          <el-table v-loading="softwareData.loading" stripe :data="softwareData.tableModel" row-key="id" style="width: 100%">
-            <el-table-column v-for="column in softwareData.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label"  >
+          <el-table v-loading="softwareData.loading" stripe :data="softwareData.tableModel" row-key="id"
+            style="width: 100%">
+            <el-table-column v-for="column in softwareData.dynamicColumns" :key="column.prop" :prop="column.prop"
+              :label="column.label">
               <template #default="{ row }">
-                <span :style="getColor(column.prop,row)">
-                  {{getProp(column.prop,row)}}
+                <span :style="getColor(column.prop, row)">
+                  {{ getProp(column.prop, row) }}
                 </span>
               </template>
             </el-table-column>
-            <el-table-column label="操作"  fixed="right" header-align="center" align="center" class="right-operation" width="140">
-
-              <template #default="{ row }" >
-                <el-link
-                  class="my-el-link mr12 ml12"
-                  v-if="row.state === 0"
-                  type="primary"
-                  icon="ele-Upload"
-                  @click="onRelease(row)"
-                  :underline="false"
-                  target="_blank"
-                >发布</el-link>
-                <el-link
-                  class="my-el-link mr12 ml12"
-                  v-if="row.state === 0"
-                  type="primary"
-                  icon="ele-Edit"
-                  @click="editTableData(row)"
-                  :underline="false"
-                  target="_blank"
-                >编辑</el-link>
-                <el-link
-                  class="my-el-link mr12 ml12"
-                  v-if="row.state === 1"
-                  type="primary"
-                  icon="ele-Download"
-                  @click="onDownload(row)"
-                  :underline="false"
-                  target="_blank"
-                >下载</el-link>
-                <el-link
-                  class="my-el-link mr12 ml12"
-                  v-if="row.state === 1"
-                  type="primary"
-                  icon="ele-WarningFilled"
-                  @click="onFailure(row)"
-                  :underline="false"
-                  target="_blank"
-                >失效</el-link>
-                <el-link
-                  class="my-el-link mr12 ml12"
-                  v-if="row.state !== 0"
-                  type="primary"
-                  icon="ele-Tickets"
-                  @click="onDownloadRecord(row.guid)"
-                  :underline="false"
-                  target="_blank"
-                >下载记录</el-link>
+            <el-table-column label="操作" fixed="right" header-align="center" align="center" class="right-operation"
+              width="140">
+
+              <template #default="{ row }">
+                <el-link class="my-el-link mr12 ml12" v-if="row.state === 0" type="primary" icon="ele-Upload"
+                  @click="onRelease(row)" :underline="false" target="_blank">发布</el-link>
+                <el-link class="my-el-link mr12 ml12" v-if="row.state === 0" type="primary" icon="ele-Edit"
+                  @click="editTableData(row)" :underline="false" target="_blank">编辑</el-link>
+                <el-link class="my-el-link mr12 ml12" v-if="row.state === 1" type="primary" icon="ele-Download"
+                  @click="onDownload(row)" :underline="false" target="_blank">下载</el-link>
+                <el-link class="my-el-link mr12 ml12" v-if="row.state === 1" type="primary" icon="ele-WarningFilled"
+                  @click="onFailure(row)" :underline="false" target="_blank">失效</el-link>
+                <el-link class="my-el-link mr12 ml12" v-if="row.state !== 0" type="primary" icon="ele-Tickets"
+                  @click="onDownloadRecord(row.guid)" :underline="false" target="_blank">下载记录</el-link>
               </template>
             </el-table-column>
           </el-table>
           <div class="my-flex my-flex-end" style="margin-top: 20px">
-            <el-pagination
-              v-model:currentPage="softwareData.pageInput.CurrentPage"
-              v-model:page-size="softwareData.pageInput.PageSize"
-              :total="softwareData.total"
-              :page-sizes="[10, 20, 50, 100]"
-              small
-              background
-              @size-change="onSizeChange"
-              @current-change="onCurrentChange"
-              layout="total, sizes, prev, pager, next, jumper"
-            />
+            <el-pagination v-model:currentPage="softwareData.pageInput.CurrentPage"
+              v-model:page-size="softwareData.pageInput.PageSize" :total="softwareData.total"
+              :page-sizes="[10, 20, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
           </div>
           <template>
             <a ref="downloadLink" style="display: none;"></a>
@@ -147,16 +104,16 @@
 
 <script setup lang="ts">
 
-import {defineAsyncComponent, onBeforeMount, onMounted, reactive, ref, watch} from "vue";
-import {useGlobalCacheStore} from "/@/stores/globalCacheStore";
+import { defineAsyncComponent, onBeforeMount, onMounted, reactive, ref, watch } from "vue";
+import { useGlobalCacheStore } from "/@/stores/globalCacheStore";
 import {
   softwarePackageManagement_AllDto,
   softwarePackageManagement_SearchFilter,
   softwarePackageManagement_TableData
 } from "/@/api/admin/deviceAuthorization/softwarePackageManagementDto";
-import type {pageInput} from "/@/api/admin/shareDto/shareDto";
+import type { pageInput } from "/@/api/admin/shareDto/shareDto";
 import eventBus from "/@/utils/mitt";
-import {SoftwarePackageManagementApi} from "/@/api/admin/deviceAuthorization/softwarePackageManagementApi";
+import { SoftwarePackageManagementApi } from "/@/api/admin/deviceAuthorization/softwarePackageManagementApi";
 import { storeToRefs } from 'pinia'
 import { useUserInfo } from '/@/stores/userInfo'
 
@@ -165,7 +122,7 @@ const EditDialog = defineAsyncComponent(() => import('./components/form-edit.vue
 const DownloadDialog = defineAsyncComponent(() => import('./components/table-download.vue'))
 // import {pageInput} from "/@/api/admin/shareDto/shareDto";
 const editDialogRef = ref()
-const downloadDialogRef=ref()
+const downloadDialogRef = ref()
 
 
 /**获取全局缓存*/
@@ -179,7 +136,7 @@ const softwarePackageStatus = ref(globalCacheStore.getGlobalStore().get('softwar
 
 /**软件包管理对象*/
 const softwareData = reactive({
-  time:'',
+  time: '',
   /**加载显示 */
   loading: false,
   /**条件查询模块 */
@@ -215,7 +172,7 @@ const softwareData = reactive({
     { prop: 'digitalSignature', label: '数字签名' },
   ],
   /**分页标识 */
-  pageInput:{
+  pageInput: {
     CurrentPage: 1,
     PageSize: 10,
   } as pageInput,
@@ -250,9 +207,9 @@ const flattenObject = (obj, parentKey = '') => {
 /**初始化 */
 const init = async () => {
   softwareData.loading = true
-  const query = flattenObject({ Filter: softwareData.Filter})
+  const query = flattenObject({ Filter: softwareData.Filter })
   debugger
-  const res:any = await new SoftwarePackageManagementApi().getPageData({...softwareData.pageInput, Filter:softwareData.Filter})
+  const res: any = await new SoftwarePackageManagementApi().getPageData({ ...softwareData.pageInput, Filter: softwareData.Filter })
   softwareData.tableModel = res?.data?.list ?? []
   softwareData.total = res?.data?.total ?? 0
   softwareData.loading = false
@@ -274,8 +231,8 @@ onBeforeMount(() => {
 /**
  * 监听时间变换
  */
-watch(() => softwareData.time, (newVal ) => {
-  if(newVal.length === 0){
+watch(() => softwareData.time, (newVal) => {
+  if (newVal.length === 0) {
     return
   }
   softwareData.Filter.BeginTime = newVal?.[0].toString()
@@ -288,7 +245,7 @@ const resetQuery = () => {
   softwareData.Filter.softwareName = ''
   softwareData.Filter.version = ''
   softwareData.Filter.equipmentType = ''
-  softwareData.Filter.BeginTime =  ''
+  softwareData.Filter.BeginTime = ''
   softwareData.Filter.EndTime = ''
   softwareData.time = ''
   softwareData.pageInput.CurrentPage = 1
@@ -315,59 +272,59 @@ const onRelease = (row) => {
   debugger
   //downloadUrl
   softwareData.loading = true;
-   (row  as softwarePackageManagement_TableData).state = 1
-  var RowData =  JSON.parse(JSON.stringify(row))
-  var res =  new SoftwarePackageManagementApi().addData(RowData as softwarePackageManagement_TableData)
+  (row as softwarePackageManagement_TableData).state = 1
+  var RowData = JSON.parse(JSON.stringify(row))
+  var res = new SoftwarePackageManagementApi().addData(RowData as softwarePackageManagement_TableData)
   softwareData.loading = false
 }
 
 /**下载*/
 const onDownload = (row) => {
-  softwareData.loading = true;
-  var RowData = JSON.parse(JSON.stringify(row))
-  const params = RowData as softwarePackageManagement_TableData
-  //const link = downloadLink.value;
-  //const url = `http://localhost:8000/api/app/software/download-file`;
-  //link.href = url;
-  //link.click();
-  const filename = params.fileName?.toString();
-  const { userInfos } = storeToRefs(useUserInfo());
-  const accessToken = userInfos.value.token
-  const token = `Bearer ${accessToken}`
-  var myHeaders = new Headers();
-myHeaders.append("Authorization", token);
-
-const requestOptions: RequestInit = {
-  method: 'GET',
-  headers: myHeaders,
-  redirect: 'follow', // 此处使用枚举值 'follow'
-};
-
-  /* var res =  new SoftwarePackageManagementApi().DownloadFile(row as softwarePackageManagement_TableData) */
-  const fileUrl = import.meta.env.VITE_API_URL +'/api/app/software/download-file?guid='+params.guid; // 替换为实际文件URL
-                    fetch(fileUrl,requestOptions)
-                        .then(response => response.blob())
-                        .then(blob => {
-                            const link = document.createElement('a');
-                            link.href = URL.createObjectURL(blob);
-                            link.download = filename;
-                            link.click();
-                            softwareData.loading = false
-                        })
-                        .catch(error => {
-                            console.error('下载失败：', error);
-                            softwareData.loading = false
-                        });
- // var res =  new SoftwarePackageManagementApi().DownloadFile(RowData as softwarePackageManagement_TableData)
- 
+  softwareData.loading = true;
+  var RowData = JSON.parse(JSON.stringify(row))
+  const params = RowData as softwarePackageManagement_TableData
+  //const link = downloadLink.value;
+  //const url = `http://localhost:8000/api/app/software/download-file`;
+  //link.href = url;
+  //link.click();
+  const filename = params.fileName?.toString();
+  const { userInfos } = storeToRefs(useUserInfo());
+  const accessToken = userInfos.value.token
+  const token = `Bearer ${accessToken}`
+  var myHeaders = new Headers();
+  myHeaders.append("Authorization", token);
+
+  const requestOptions: RequestInit = {
+    method: 'GET',
+    headers: myHeaders,
+    redirect: 'follow', // 此处使用枚举值 'follow'
+  };
+
+  /* var res =  new SoftwarePackageManagementApi().DownloadFile(row as softwarePackageManagement_TableData) */
+  const fileUrl = import.meta.env.VITE_API_URL + '/api/app/software/download-file?guid=' + params.guid; // 替换为实际文件URL
+  fetch(fileUrl, requestOptions)
+    .then(response => response.blob())
+    .then(blob => {
+      const link = document.createElement('a');
+      link.href = URL.createObjectURL(blob);
+      link.download = filename;
+      link.click();
+      softwareData.loading = false
+    })
+    .catch(error => {
+      console.error('下载失败：', error);
+      softwareData.loading = false
+    });
+  // var res =  new SoftwarePackageManagementApi().DownloadFile(RowData as softwarePackageManagement_TableData)
+
 }
 
 /**失效*/
 const onFailure = (row) => {
   softwareData.loading = true;
-   (row  as softwarePackageManagement_TableData).state = 2
-  var RowData =  JSON.parse(JSON.stringify(row))
-  var res =  new SoftwarePackageManagementApi().addData(RowData as softwarePackageManagement_TableData)
+  (row as softwarePackageManagement_TableData).state = 2
+  var RowData = JSON.parse(JSON.stringify(row))
+  var res = new SoftwarePackageManagementApi().addData(RowData as softwarePackageManagement_TableData)
   softwareData.loading = false
 }
 
@@ -383,35 +340,36 @@ const onSizeChange = () => {
 }
 
 /**页数变化*/
-const onCurrentChange = () =>{
+const onCurrentChange = () => {
   init()
 }
 
 /**过滤数字的属性*/
-const getProp = (val,row) => {
- //debugger
+const getProp = (val, row) => {
+  //debugger
   // var sss = row[val];
   // var fdsdfsd = String(row[val]);
   //if(!row[val]) return null
-  if(val === 'softwareType') return softwareType.value.get(String(row[val])).name
-  if(val === 'equipmentType') return equipmentType.value.get(String(row[val])).name
-  if(val === 'state') return softwarePackageStatus.value.get(String(row[val])).name
+  if (val === 'softwareType') return softwareType.value.get(String(row[val])).name
+  if (val === 'equipmentType') return equipmentType.value.get(String(row[val])).name
+  if (val === 'state') return softwarePackageStatus.value.get(String(row[val])).name
   return row[val]
 }
 
-const getColor = (val,row) => {
-  if(val === 'state') {
+const getColor = (val, row) => {
+  if (val === 'state') {
     const code = softwarePackageStatus.value.get(String(row[val])).code.split('_')
-    return {color:code[1]}
+    return { color: code[1] }
   }
   return {}
 }
 
-
 </script>
 
 <style scoped lang="scss">
-.el-link{
+@import '/@/theme/tableStyle.scss';
+.el-link {
   padding: 5px;
 }
+
 </style>

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

@@ -3,7 +3,7 @@
     <el-row>
       <el-col >
         <el-card class="mt8" shadow="hover" >
-          <el-form :model="groupLogoKeyOnQuery.filter" :inline="true" @submit.stop.prevent>
+          <el-form :model="groupLogoKeyOnQuery.filter" @submit.stop.prevent>
             <el-form-item prop="name" style="width:100%">
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
                 <el-form-item label="GUID">
@@ -29,14 +29,19 @@
                   <el-input v-model="groupLogoKeyOnQuery.filter.manufacturer" placeholder="请输入厂商" clearable></el-input>
                 </el-form-item>
               </el-col>
-              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                <el-form-item>
-                  <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                  <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                </el-form-item>
-              </el-col>
             </el-form-item>
           </el-form>
+
+          <hr>
+
+          <!-- 按钮 -->
+           <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+           </el-row>
+           
         </el-card>
       </el-col>
       <el-col :xs="24">
@@ -193,7 +198,6 @@ const onReset = () => {
 </script>
 
 <style scoped lang="scss">
-.el-input, .el-select {
-  width: 220px;
-}
+@import '/@/theme/tableStyle.scss';
+
 </style>

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

@@ -4,87 +4,88 @@
             <!-- 操作 -->
             <el-col :xs="24">
                 <el-card class="mt8" shadow="hover">
-                    <el-form :model="qrBookData.Filter" :inline="true" @submit.stop.prevent>
+                    <el-form :model="qrBookData.Filter" @submit.stop.prevent>
                         <el-form-item prop="name" style="width: 100%;">
                             <el-col :xs="15" :sm="6" :md="5" :lg="5" class="mb20">
                                 <el-form-item label="上传人">
-                                    <el-input v-model="qrBookData.Filter.Author" placeholder="单行输入" clearable></el-input>
+                                    <el-input v-model="qrBookData.Filter.Author" placeholder="单行输入"
+                                        clearable></el-input>
                                 </el-form-item>
                             </el-col>
-                        
+
                             <el-col :xs="24" :sm="12" :md="8" :lg="8" class="mb20">
-                                <el-form-item label="说明书名称">
-                                    <el-input v-model="qrBookData.Filter.FileName" placeholder="单行输入" clearable></el-input>
+                                <el-form-item label="文件名">
+                                    <el-input v-model="qrBookData.Filter.FileName" placeholder="单行输入"
+                                        clearable></el-input>
                                 </el-form-item>
                             </el-col>
 
                             <el-col :xs="24" :md="8" :lg="8" :xl="4" class="mb20">
                                 <el-form-item label="选择时间">
-                                    <el-date-picker
-                                        v-model="qrBookData.time"
-                                        type="datetimerange"
-                                        value-format="YYYY-MM-DD HH:mm:ss"
-                                        range-separator="To"
-                                        start-placeholder="Start date"
-                                        end-placeholder="End date" />
-                                </el-form-item>
-                            </el-col>
-
-                            <el-col :xs="24" :md="8" :lg="8" :xl="4" class="mb20">
-                                <el-form-item>
-                                    <el-button type="primary" icon="ele-Search" @click="getData()">查询</el-button>
-                                    <el-button type="primary" plain icon="ele-RefreshRight" @click="clear()">清空</el-button>
+                                    <el-date-picker v-model="qrBookData.time" type="datetimerange"
+                                        value-format="YYYY-MM-DD HH:mm:ss" range-separator="To"
+                                        start-placeholder="Start date" end-placeholder="End date" />
                                 </el-form-item>
                             </el-col>
                         </el-form-item>
-                        
-                        <div class="my-flex my-flex-end">
-                            <el-button type="primary" icon="ele-CirclePlus" @click="uploadDialog">上传说明书</el-button>
-                        </div>
                     </el-form>
+
+                    <hr>
+
+                    <!-- 按钮 -->
+                    <el-row justify="space-between" class="submit-button">
+                        <el-row>
+                            <el-button type="primary" icon="ele-Search" @click="getData()">查询</el-button>
+                            <el-button type="primary" plain icon="ele-RefreshRight" @click="clear()">清空</el-button>
+                        </el-row>
+                        <el-row>
+                            <el-button type="primary" icon="ele-CirclePlus" @click="uploadDialog">上传说明书</el-button>
+                        </el-row>
+                    </el-row>
+
                 </el-card>
             </el-col>
 
             <!-- 表格 -->
-             <el-col :xs="24">
+            <el-col :xs="24">
                 <el-card style="height: 70vh;" 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">
-                            <template #default="{row}">
-                                <span :style="getColor(column.prop,row)">
-                                    {{getName(column.prop,row)}}
+                    <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">
+                            <template #default="{ row }">
+                                <span :style="getColor(column.prop, row)">
+                                    {{ getName(column.prop, row) }}
                                 </span>
                             </template>
                         </el-table-column>
-                        <el-table-column label="操作" fixed="right" align="center" header-align="center" class="right-operation" width="140">
-                            <template #default="{row}">
-                                <el-link class="my-el-link mr12 ml12" type="primary" :underline="false" target="_blank" icon="ele-Edit" @click="editDialog(row)">编辑</el-link>
-                                <el-link class="my-el-link mr12 ml12"  type="primary" :underline="false" target="_blank" icon="ele-Download" @click="download(row,0)">下载文件</el-link>
-                                <el-link class="my-el-link mr12 ml12"  type="primary" :underline="false" target="_blank" icon="ele-Download" @click="download(row,1)">下载二维码</el-link>
+                        <el-table-column label="操作" fixed="right" align="center" header-align="center"
+                            class="right-operation" width="140">
+                            <template #default="{ row }">
+                                <el-link class="my-el-link mr12 ml12" type="primary" :underline="false" target="_blank"
+                                    icon="ele-Edit" @click="editDialog(row)">编辑</el-link>
+                                <el-link class="my-el-link mr12 ml12" type="primary" :underline="false" target="_blank"
+                                    icon="ele-Download" @click="download(row, 0)">下载文件</el-link>
+                                <el-link class="my-el-link mr12 ml12" type="primary" :underline="false" target="_blank"
+                                    icon="ele-Download" @click="download(row, 1)">下载二维码</el-link>
                             </template>
                         </el-table-column>
                     </el-table>
                     <div class="my-flex my-flex-end" style="margin-top: 20px">
-                        <el-pagination
-                            v-model:currentPage="qrBookData.PageInput.CurrentPage"
-                            v-model:page-size="qrBookData.PageInput.PageSize"
-                            :total="qrBookData.total"
-                            :page-sizes="[10, 20, 50, 100]"
-                            small
-                            background
-                            @size-change="onSizeChange"
-                            @current-change="onCurrentChange"
-                            layout="total, sizes, prev, pager, next, jumper"/>
+                        <el-pagination v-model:currentPage="qrBookData.PageInput.CurrentPage"
+                            v-model:page-size="qrBookData.PageInput.PageSize" :total="qrBookData.total"
+                            :page-sizes="[10, 20, 50, 100]" small background @size-change="onSizeChange"
+                            @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
                     </div>
                     <template>
                         <a ref="downloadLink" style="display: none;"></a>
                     </template>
                 </el-card>
-             </el-col>
+            </el-col>
         </el-row>
         <FileEditDialog ref="fileEditRef"></FileEditDialog>
     </div>
-    
+
 </template>
 
 <script setup lang="ts">
@@ -101,24 +102,24 @@ const fileEditRef = ref()
 
 /** 获取全局缓存 */
 const globalCacheStore = useGlobalCacheStore()
-  /** 获取文件状态 */
-  const statusType = ref(globalCacheStore.getGlobalStore().get('qrBookFileStatus'))
+/** 获取文件状态 */
+const statusType = ref(globalCacheStore.getGlobalStore().get('qrBookFileStatus'))
 
 const downloadLink = ref()
 
 const qrBookData = reactive({
     // 是否加载
-    loading : false,
-    time:'',
+    loading: false,
+    time: '',
     // 查询条件
-    Filter:{
-        Author:"",
-        FileName:"",
+    Filter: {
+        Author: "",
+        FileName: "",
         StartTime: null,
         EndTime: null
     } as QRBookFilter,
     // 表数据
-    tableModel:[] as QRBookPageSearchResponse[],
+    tableModel: [] as QRBookPageSearchResponse[],
     // 表头
     dynamicColumns: [
         { prop: 'fileName', label: '说明书文件名' },
@@ -129,12 +130,12 @@ const qrBookData = reactive({
         { prop: 'remark', label: '备注' }
     ],
     /**分页标识 */
-    PageInput:{
+    PageInput: {
         CurrentPage: 1,
         PageSize: 10,
-  } as pageInput,
-  /**分页总数 */
-  total: 0
+    } as pageInput,
+    /**分页总数 */
+    total: 0
 })
 
 //获取数据
@@ -142,10 +143,10 @@ const getData = async () => {
     qrBookData.loading = true
     let res = await new QRBookApi().getPage({
         ...qrBookData.PageInput,
-        "Filter.Author":qrBookData.Filter.Author,
-        "Filter.FileName":qrBookData.Filter.FileName,
-        "Filter.StartTime":qrBookData.Filter.StartTime,
-        "Filter.EndTime":qrBookData.Filter.EndTime
+        "Filter.Author": qrBookData.Filter.Author,
+        "Filter.FileName": qrBookData.Filter.FileName,
+        "Filter.StartTime": qrBookData.Filter.StartTime,
+        "Filter.EndTime": qrBookData.Filter.EndTime
     })
     qrBookData.tableModel = res?.data?.list ?? []
     qrBookData.total = res?.data?.total ?? 0
@@ -155,8 +156,8 @@ const getData = async () => {
 //清除查询条件
 const clear = () => {
     qrBookData.Filter = {
-        author:"",
-        fileName:"",
+        author: "",
+        fileName: "",
         startTime: null,
         endTime: null
     } as QRBookFilter
@@ -164,9 +165,9 @@ const clear = () => {
 }
 
 //下载
-const download = async (row,type) => {
+const download = async (row, type) => {
     let fileName = ""
-    switch(type) {
+    switch (type) {
         case 0:
             fileName = removeExtension(row.fileName) + row.extension
             break
@@ -174,18 +175,18 @@ const download = async (row,type) => {
             fileName = removeExtension(row.fileName) + ".PNG"
             break
     }
-    let res = await new QRBookApi().donwloadFile(row.id,type,fileName)
-    
+    let res = await new QRBookApi().donwloadFile(row.id, type, fileName)
+
 }
 //去除文件名后缀
-const removeExtension = (filename:string) => {
-    const dotIndex = filename.lastIndexOf('.');  
-    if (dotIndex < 0) {  
+const removeExtension = (filename: string) => {
+    const dotIndex = filename.lastIndexOf('.');
+    if (dotIndex < 0) {
         // 如果没有找到'.'，则返回原始文件名  
-        return filename;  
-    }  
+        return filename;
+    }
     // 返回去除最后一个'.'及其之后的所有字符的字符串  
-    return filename.slice(0, dotIndex);  
+    return filename.slice(0, dotIndex);
 }
 
 //打开上传文件弹窗
@@ -206,19 +207,19 @@ const onCurrentChange = () => {
 }
 
 //获取颜色值
-const getColor = (val,row) => {
-    if(val === "status") return {color: statusType.value.get(String(row[val])).color}
+const getColor = (val, row) => {
+    if (val === "status") return { color: statusType.value.get(String(row[val])).color }
     return {}
 }
 
 //获取名称值
-const getName = (val,row) => {
-    if(val === "status") return statusType.value.get(String(row[val])).name
+const getName = (val, row) => {
+    if (val === "status") return statusType.value.get(String(row[val])).name
     return row[val]
 }
 
-watch(() => qrBookData.time,(val) => {
-    if(val?.length === 0) return
+watch(() => qrBookData.time, (val) => {
+    if (val?.length === 0) return
     qrBookData.Filter.StartTime = val?.[0].toString()
     qrBookData.Filter.EndTime = val?.[1].toString()
 })
@@ -235,4 +236,7 @@ onBeforeMount(() => {
     eventBus.off('refreshView')
 })
 
-</script>
+</script>
+<style scoped lang="scss">
+@import '/@/theme/tableStyle.scss';
+</style>

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

@@ -3,9 +3,9 @@
     <!--部件电子档案-->
     <el-row>
       <!--操作-->
-      <el-col :xs="24" >
-        <el-card class="mt8" shadow="hover" >
-          <el-form :model="bomModel.filterModel" :inline="true" @submit.stop.prevent>
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="bomModel.filterModel" @submit.stop.prevent>
             <el-form-item class="form_item" prop="name" style="width:100%">
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="物料号">
@@ -24,8 +24,9 @@
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="部件类型">
-                  <el-select  v-model="bomModel.filterModel.bomType" placeholder="请选择部件类型" >
-                    <el-option v-for="(value, key) in componentType" :key="key" :label="value[1].name"  :value="Number(value[1].value)" />
+                  <el-select v-model="bomModel.filterModel.bomType" placeholder="请选择部件类型">
+                    <el-option v-for="(value, key) in componentType" :key="key" :label="value[1].name"
+                      :value="Number(value[1].value)" />
                   </el-select>
                 </el-form-item>
               </el-col>
@@ -41,35 +42,38 @@
                   <el-input v-model="bomModel.filterModel.barcode" 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>
-                  <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                  <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                </el-form-item>
-              </el-col>
             </el-form-item>
           </el-form>
-          <div class="my-flex my-flex-end">
-            <el-button v-auth="'api:admin:file:upload-file'" type="primary" icon="ele-Upload" @click="onUpload"> 上传 </el-button>
-          </div>
+
+          <hr>
+          
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+            <el-button v-auth="'api:admin:file:upload-file'" type="primary" icon="ele-Upload" @click="onUpload"> 上传
+            </el-button>
+          </el-row>
+
         </el-card>
       </el-col>
       <!--表格-->
       <el-col :xs="24">
         <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
           <el-table v-loading="bomModel.loading" stripe :data="bomModel.bomListData" row-key="id" style="width: 100%">
-            <el-table-column prop="guid" label="序号"  />
-            <el-table-column prop="manufacturer" label="厂商"  />
-            <el-table-column prop="bomName" label="部件名称"  />
-            <el-table-column prop="bomNo" label="物料号"  />
-            <el-table-column prop="bomProNo" label="生产编号"  />
-            <el-table-column prop="barCode" label="条码"  />
-            <el-table-column prop="software_v" label="软件版本"  />
-            <el-table-column prop="status"  label="状态" width="120" >
+            <el-table-column prop="guid" label="序号" />
+            <el-table-column prop="manufacturer" label="厂商" />
+            <el-table-column prop="bomName" label="部件名称" />
+            <el-table-column prop="bomNo" label="物料号" />
+            <el-table-column prop="bomProNo" label="生产编号" />
+            <el-table-column prop="barCode" label="条码" />
+            <el-table-column prop="software_v" label="软件版本" />
+            <el-table-column prop="status" label="状态" width="120">
               <template #default="{ row }">
-                <div :style="{color:getComponentStatusType(row.status).color} " class="bold-font">
-                  {{getComponentStatusType(row.status).name}}
+                <div :style="{ color: getComponentStatusType(row.status).color }" class="bold-font">
+                  {{ getComponentStatusType(row.status).name }}
                 </div>
               </template>
             </el-table-column>
@@ -80,24 +84,24 @@
                 </div>
               </template>
             </el-table-column> -->
-            <el-table-column prop="tqcKeyState" label="团标状态" >
+            <el-table-column prop="tqcKeyState" label="团标状态">
               <template #default="{ row }">
                 <!-- <div :style="{color:getComponentStatus(row.key_name).color}" class="bold-font"> -->
-                  <div :style="{color:getColor(getComponentStatus(row.tqcKeyState).name)}" class="bold-font">
-                  {{getComponentStatus(row.tqcKeyState).name}}
+                <div :style="{ color: getColor(getComponentStatus(row.tqcKeyState).name) }" class="bold-font">
+                  {{ getComponentStatus(row.tqcKeyState).name }}
                 </div>
               </template>
             </el-table-column>
-            <el-table-column prop="ecvrKeyState" label="油气回收" >
+            <el-table-column prop="ecvrKeyState" label="油气回收">
               <template #default="{ row }">
                 <!-- <div :style="{color:getComponentStatus(row.key_name).color}" class="bold-font"> -->
-                <div :style="{color:getColor(getComponentStatus(row.ecvrKeyState).name)}" class="bold-font">
-                  {{getComponentStatus(row.ecvrKeyState).name}}
+                <div :style="{ color: getColor(getComponentStatus(row.ecvrKeyState).name) }" class="bold-font">
+                  {{ getComponentStatus(row.ecvrKeyState).name }}
                 </div>
               </template>
             </el-table-column>
-            <el-table-column prop="createTime" label="创建时间"  />
-            <el-table-column prop="remark" label="备注" >
+            <el-table-column prop="createTime" label="创建时间" />
+            <el-table-column prop="remark" label="备注">
               <!-- <template #default="{ row }">
                 <div class="my-flex">
                   <el-image
@@ -118,12 +122,13 @@
               </template> -->
             </el-table-column>
 
-<!--            <el-table-column prop="createdTime" label="更新时间" >-->
-<!--              <template #default="{ row }">-->
-<!--                {{ formatterTime(row.modifiedTime || row.createdTime || '') }}-->
-<!--              </template>-->
-<!--            </el-table-column>-->
-            <el-table-column label="操作"  fixed="right" header-align="center" align="center" class="right-operation" width="100">
+            <!--            <el-table-column prop="createdTime" label="更新时间" >-->
+            <!--              <template #default="{ row }">-->
+            <!--                {{ formatterTime(row.modifiedTime || row.createdTime || '') }}-->
+            <!--              </template>-->
+            <!--            </el-table-column>-->
+            <el-table-column label="操作" fixed="right" header-align="center" align="center" class="right-operation"
+              width="100">
               <template #default="{ row }">
                 <!-- <el-popover :width="220">
                   <p>{{ row.linkUrl }}</p>
@@ -133,41 +138,21 @@
                   <template #reference>
                     <el-button size="small" text type="primary">地址</el-button>
                   </template>
-                </el-popover>
-                <el-link
-                  class="my-el-link mr12 ml12"
-                  :href="row.linkUrl"
-                  type="primary"
-                  icon="ele-Download"
-                  size="small"
-                  :underline="false"
-                  target="_blank"
-                  >下载</el-link
-                >
-                <el-button v-auth="'api:admin:file:delete'" icon="ele-Delete" size="small" text type="danger" @click="onDelete(row)">删除</el-button> -->
-                <el-link
-                  class="my-el-link mr12 ml12"
-                  @click="toPage(row)"
-                  type="primary"
-                  icon="ele-Tickets"
-                  :underline="false"
-                  target="_blank"
-                >详情</el-link>
+  </el-popover>
+  <el-link class="my-el-link mr12 ml12" :href="row.linkUrl" type="primary" icon="ele-Download" size="small"
+    :underline="false" target="_blank">下载</el-link>
+  <el-button v-auth="'api:admin:file:delete'" icon="ele-Delete" size="small" text type="danger"
+    @click="onDelete(row)">删除</el-button> -->
+                <el-link class="my-el-link mr12 ml12" @click="toPage(row)" type="primary" icon="ele-Tickets"
+                  :underline="false" target="_blank">详情</el-link>
               </template>
             </el-table-column>
           </el-table>
           <div class="my-flex my-flex-end" style="margin-top: 20px">
-            <el-pagination
-              v-model:currentPage="bomModel.pageInput.currentPage"
-              v-model:page-size="bomModel.pageInput.pageSize"
-              :total="bomModel.total"
-              :page-sizes="[10, 20, 50, 100]"
-              small
-              background
-              @size-change="onSizeChange"
-              @current-change="onCurrentChange"
-              layout="total, sizes, prev, pager, next, jumper"
-            />
+            <el-pagination v-model:currentPage="bomModel.pageInput.currentPage"
+              v-model:page-size="bomModel.pageInput.pageSize" :total="bomModel.total" :page-sizes="[10, 20, 50, 100]"
+              small background @size-change="onSizeChange" @current-change="onCurrentChange"
+              layout="total, sizes, prev, pager, next, jumper" />
           </div>
         </el-card>
       </el-col>
@@ -175,15 +160,15 @@
   </div>
 </template>
 <script lang="ts" setup name="admin/Component">
-import {onMounted, reactive, ref} from 'vue' //computed, getCurrentInstance
-import {ComponentApi} from '/@/api/admin/productionManagement/Component'
+import { onMounted, reactive, ref } from 'vue' //computed, getCurrentInstance
+import { ComponentApi } from '/@/api/admin/productionManagement/Component'
 // import dayjs from 'dayjs'
 // import eventBus from '/@/utils/mitt'
-import {PageInputFileGetPageDto} from "/@/api/admin/productionManagement/ComopnentDto";
-import {ComponentGetPageOutPut} from "/@/api/admin/productionManagement/CommunalDto";
+import { PageInputFileGetPageDto } from "/@/api/admin/productionManagement/ComopnentDto";
+import { ComponentGetPageOutPut } from "/@/api/admin/productionManagement/CommunalDto";
 import router from "/@/router";
 
-import {useGlobalCacheStore} from "/@/stores/globalCacheStore";
+import { useGlobalCacheStore } from "/@/stores/globalCacheStore";
 
 /**获取全局缓存*/
 const globalCacheStore = useGlobalCacheStore()
@@ -206,8 +191,8 @@ const bomModel = reactive({
     bomName: '',
     bomProNo: '',
     bomMateNo: '',
-    manufacturer:'',
-    barcode:''
+    manufacturer: '',
+    barcode: ''
   },
   total: 0,
   pageInput: {
@@ -221,9 +206,9 @@ const bomModel = reactive({
 /**部件电子档案 - 列表状态 */
 const getComponentStatusType = (val) => {
   val = String(val)
-  if(componentStatusType.value?.has(val)){
+  if (componentStatusType.value?.has(val)) {
     return componentStatusType.value.get(val)
-  }else {
+  } else {
     return val
   }
 }
@@ -231,9 +216,9 @@ const getComponentStatusType = (val) => {
 /**部件电子档案 - 列表中化密钥、团标密钥 */
 const getComponentStatus = (val) => {
   val = String(val)
-  if(componentStatus.value.has(val)){
+  if (componentStatus.value.has(val)) {
     return componentStatus.value.get(val)
-  }else {
+  } else {
     return val
   }
 }
@@ -243,7 +228,7 @@ const getColor = (value: string): string => {
   if (value === '已备案') {
     return '#41b584';
   } else if (value === '灌注') {
-      return '#409eff';
+    return '#409eff';
   } else {
     return '#E6A23C';
   }
@@ -329,7 +314,7 @@ const onUpload = () => {
 }
 
 const toPage = (row) => {
-  router.push({path:`/product/${row.guid}`})
+  router.push({ path: `/product/${row.guid}` })
 }
 
 //const onDelete = (row: FileGetPageOutput) => {
@@ -344,15 +329,8 @@ const toPage = (row) => {
 </script>
 
 <style scoped lang="scss">
-.my-el-link {
-  font-size: 14px;
-}
-.el-form .el-col.mb20 {
-  margin: 0 !important;
-}
-.el-input, .el-select {
-  width: 240px;
-}
+@import '/@/theme/tableStyle.scss';
+
 .bold-font {
   font-weight: bold;
 }

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

@@ -3,9 +3,9 @@
     <!--部件类型-->
     <el-row>
       <!--操作-->
-      <el-col :xs="24" >
-        <el-card class="mt8" shadow="hover" >
-          <el-form :model="state.filterModel" :inline="true" @submit.stop.prevent>
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="state.filterModel" @submit.stop.prevent>
             <el-form-item prop="name" style="width:100%">
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
                 <el-form-item label="物料编号">
@@ -19,76 +19,78 @@
               </el-col>
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
                 <el-form-item label="部件类型">
-                  <el-select  v-model="state.filterModel.bomType" placeholder="请选择部件类型" >
-                    <el-option v-for="(value, key) in componentType" :key="key" :label="value[1].name"  :value="Number(value[1].value)" />
+                  <el-select v-model="state.filterModel.bomType" placeholder="请选择部件类型">
+                    <el-option v-for="(value, key) in componentType" :key="key" :label="value[1].name"
+                      :value="Number(value[1].value)" />
                   </el-select>
-                  </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                <el-form-item>
-                  <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                  <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
                 </el-form-item>
               </el-col>
             </el-form-item>
           </el-form>
-            <div class="my-flex my-flex-end">
-              <el-button  type="primary" icon="ele-CirclePlus" @click="onAdd"> 添加 </el-button>
+
+          <hr>
+
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+            <el-row>
+              <el-button type="primary" icon="ele-CirclePlus" @click="onAdd"> 添加 </el-button>
               <el-button type="primary" icon="ele-UploadFilled" @click="uploadFiles"> 批量导入 </el-button>
               <el-button type="primary" icon="ele-Document" @click="exportTable"> 导出表格 </el-button>
-            </div>
+            </el-row>
+
+          </el-row>
         </el-card>
       </el-col>
+
       <!--表格-->
-      <el-col :xs="24" >
+      <el-col :xs="24">
         <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
           <el-table v-loading="state.loading" stripe :data="state.bomListData" row-key="id" style="width: 100%">
-            <el-table-column prop="guid" label="序号"  />
-            <el-table-column prop="type" label="部件类型"  >
+            <el-table-column prop="guid" label="序号" />
+            <el-table-column prop="type" label="部件类型">
               <template #default="{ row }">
-                {{ getComponentType(row.type)}}
+                {{ getComponentType(row.type) }}
               </template>
             </el-table-column>
-            <el-table-column prop="bomName" label="部件名称"  />
-            <el-table-column prop="bomNo" label="物料号"  />
-            <el-table-column prop="status" label="状态"  >
-              <template #default="{ row }" >
-                <div :style="{color:getComponentState(row.status).color}"  class="bold-font">
-                  {{getComponentState(row.status).name}}
+            <el-table-column prop="bomName" label="部件名称" />
+            <el-table-column prop="bomNo" label="物料号" />
+            <el-table-column prop="status" label="状态">
+              <template #default="{ row }">
+                <div :style="{ color: getComponentState(row.status).color }" class="bold-font">
+                  {{ getComponentState(row.status).name }}
                 </div>
               </template>
             </el-table-column>
             <el-table-column prop="remark" label="备注" />
-            <el-table-column prop="bom_Image" label="部件图片"  >
+            <el-table-column prop="bom_Image" label="部件图片">
               <template #default="{ row }">
                 <div class="my-flex" @click="showBigPic(row.img)">
-                  <el-image
-                    :src="getImg(row.img)"
-                    :lazy="true"
-                    class="img"
-                    :hide-on-click-modal="true"
-                    fit="contain"
-                    preview-teleported
-                  >
+                  <el-image :src="getImg(row.img)" :lazy="true" class="img" :hide-on-click-modal="true" fit="contain"
+                    preview-teleported>
                     <template #error>
                       <div class="image-slot">
                         <el-icon><icon-picture /></el-icon>
                       </div>
                     </template>
                   </el-image>
-<!--                  <div class="ml10 my-flex-fill my-flex-y-center">-->
-<!--                    <div>{{ (row.fileName || '') + (row.extension || '') }}</div>-->
-<!--                  </div>-->
+                  <!--                  <div class="ml10 my-flex-fill my-flex-y-center">-->
+                  <!--                    <div>{{ (row.fileName || '') + (row.extension || '') }}</div>-->
+                  <!--                  </div>-->
                 </div>
               </template>
             </el-table-column>
 
-<!--            <el-table-column prop="createdTime" label="更新时间" >-->
-<!--              <template #default="{ row }">-->
-<!--                {{ formatterTime(row.modifiedTime || row.createdTime || '') }}-->
-<!--              </template>-->
-<!--            </el-table-column>-->
-            <el-table-column label="操作"  fixed="right" header-align="center" align="center" class="right-operation" width="100">
+            <!--            <el-table-column prop="createdTime" label="更新时间" >-->
+            <!--              <template #default="{ row }">-->
+            <!--                {{ formatterTime(row.modifiedTime || row.createdTime || '') }}-->
+            <!--              </template>-->
+            <!--            </el-table-column>-->
+            <el-table-column label="操作" fixed="right" header-align="center" align="center" class="right-operation"
+              width="100">
               <template #default="{ row }">
                 <!-- <el-popover :width="220">
                   <p>{{ row.linkUrl }}</p>
@@ -98,70 +100,41 @@
                   <template #reference>
                     <el-button size="small" text type="primary">地址</el-button>
                   </template>
-                </el-popover>
-                <el-link
-                  class="my-el-link mr12 ml12"
-                  :href="row.linkUrl"
-                  type="primary"
-                  icon="ele-Download"
-                  size="small"
-                  :underline="false"
-                  target="_blank"
-                  >下载</el-link
-                >
-                <el-button v-auth="'api:admin:file:delete'" icon="ele-Delete" size="small" text type="danger" @click="onDelete(row)">删除</el-button> -->
-                <el-link
-                  class="my-el-link mr12 ml12"
-                  @click="editTableData(row)"
-                  type="primary"
-                  icon="ele-Edit"
-                  :underline="false"
-                  target="_blank"
-                >编辑</el-link>
+  </el-popover>
+  <el-link class="my-el-link mr12 ml12" :href="row.linkUrl" type="primary" icon="ele-Download" size="small"
+    :underline="false" target="_blank">下载</el-link>
+  <el-button v-auth="'api:admin:file:delete'" icon="ele-Delete" size="small" text type="danger"
+    @click="onDelete(row)">删除</el-button> -->
+                <el-link class="my-el-link mr12 ml12" @click="editTableData(row)" type="primary" icon="ele-Edit"
+                  :underline="false" target="_blank">编辑</el-link>
               </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"
-              v-model:page-size="state.pageInput.pageSize"
-              :total="state.total"
-              :default-page-size="5"
-              :page-sizes="[5, 10, 20, 50, 100]"
-              small
-              background
-              @size-change="onSizeChange"
-              @current-change="onCurrentChange"
-              layout="total, sizes, prev, pager, next, jumper"
-            />
+            <el-pagination v-model:currentPage="state.pageInput.currentPage"
+              v-model:page-size="state.pageInput.pageSize" :total="state.total" :default-page-size="5"
+              :page-sizes="[5, 10, 20, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
           </div>
         </el-card>
       </el-col>
     </el-row>
-    <el-dialog
-      v-model="state.showBig"
-      :close-on-click-modal="true"
-      :show-close="false"
-      width="80%"
-    >
-      <img
-        :src="getImg(state.imageUrl)"
-        class="fullscreen-image"
-        alt="放大的图片"/>
+    <el-dialog v-model="state.showBig" :close-on-click-modal="true" :show-close="false" width="80%">
+      <img :src="getImg(state.imageUrl)" class="fullscreen-image" alt="放大的图片" />
     </el-dialog>
     <EditDialog ref="editDialogRef" />
   </div>
 </template>
 
 <script lang="ts" setup name="admin/product/bom">
-import {defineAsyncComponent, onBeforeMount, onMounted, reactive, ref} from 'vue'
-import {ComponentTypeApi} from '/@/api/admin/productionManagement/ComponentType'
+import { defineAsyncComponent, onBeforeMount, onMounted, reactive, ref } from 'vue'
+import { ComponentTypeApi } from '/@/api/admin/productionManagement/ComponentType'
 import eventBus from '/@/utils/mitt'
-import {FileGetPageOutput} from "/@/api/admin/data-contracts";
-import {PageInputFileGetPageDto} from "/@/api/admin/productionManagement/ComopnentDto";
-import {ComponentGetPageDto} from "/@/api/admin/productionManagement/ComponentTypeDto";
-import {Picture as IconPicture} from '@element-plus/icons-vue'
-import {useGlobalCacheStore} from "/@/stores/globalCacheStore";
+import { FileGetPageOutput } from "/@/api/admin/data-contracts";
+import { PageInputFileGetPageDto } from "/@/api/admin/productionManagement/ComopnentDto";
+import { ComponentGetPageDto } from "/@/api/admin/productionManagement/ComponentTypeDto";
+import { Picture as IconPicture } from '@element-plus/icons-vue'
+import { useGlobalCacheStore } from "/@/stores/globalCacheStore";
 
 
 
@@ -231,11 +204,11 @@ const showBigPic = (val) => {
 }
 
 /**返回部件类型*/
-const getComponentType = (type) =>{
+const getComponentType = (type) => {
   type = String(type)
-  if(componentType.value?.has(type)){
+  if (componentType.value?.has(type)) {
     return componentType.value.get(type).name
-  }else {
+  } else {
     return type
   }
 }
@@ -246,9 +219,9 @@ const getComponentType = (type) =>{
  */
 const getComponentState = (state) => {
   state = String(state)
-  if(componentTypeListStatus.value.has(state)){
+  if (componentTypeListStatus.value.has(state)) {
     return componentTypeListStatus.value.get(state)
-  }else {
+  } else {
     return state
   }
 }
@@ -258,9 +231,9 @@ const getComponentState = (state) => {
  * @param url
  */
 const getImg = (url) => {
-  if(url){
-    return baseUrl +'/' +url
-  }else {
+  if (url) {
+    return baseUrl + '/' + url
+  } else {
     return ''
   }
 }
@@ -268,7 +241,7 @@ const getImg = (url) => {
 /**查询*/
 const onQuery = async () => {
   state.loading = true
-  const {data} = await new ComponentTypeApi().getPage({ ...state.pageInput, filter: state.filterModel }).catch(() => {
+  const { data } = await new ComponentTypeApi().getPage({ ...state.pageInput, filter: state.filterModel }).catch(() => {
     state.loading = false
   })
   state.bomListData = data?.list ?? []
@@ -368,17 +341,14 @@ onBeforeMount(() => {
 </script>
 
 <style scoped lang="scss">
-.my-el-link {
-  font-size: 14px;
-}
-.el-form .el-col.mb20 {
-  margin: 0 !important;
-}
+@import '/@/theme/tableStyle.scss';
+
 .img {
   width: 100px;
   height: 80px;
   cursor: pointer;
 }
+
 .image-slot {
   display: flex;
   justify-content: center;
@@ -389,17 +359,17 @@ onBeforeMount(() => {
   color: var(--el-text-color-secondary);
   font-size: 30px;
 }
+
 .image-slot .el-icon {
   font-size: 30px;
 }
+
 .fullscreen-image {
   width: 100%;
   max-height: 80vh;
   object-fit: contain;
 }
-.el-input, .el-select {
-  width: 240px;
-}
+
 .bold-font {
   font-weight: bold;
 }

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

@@ -1,235 +1,222 @@
 <template>
-    <div class="layout-pd" >
-      <el-row>
-        <!--操作-->
-        <el-col :xs="24" >
-          <el-card class="mt8"  shadow="hover" >
-            <el-form :model="Data.Filter" :inline="true" @submit.stop.prevent>
-              <el-form-item prop="name" style="width: 100%">
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="油机ID">
-                    <el-input v-model="Data.Filter.fuelld"  placeholder="请输入油机ID" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="加油站">
-                    <el-input v-model="Data.Filter.gasStation"  placeholder="请输入加油站" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="油机号">
-                    <el-input v-model="Data.Filter.name" placeholder="请输入油机号" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="序列号">
-                    <el-input v-model="Data.Filter.serialNumber" placeholder="请输入序列号" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="报警来源">
-                    <el-input v-model="Data.Filter.alarmSource" placeholder="请输入报警来源" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="报警类型">
-                    <el-input v-model="Data.Filter.alarmType" placeholder="请输入报警类型" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="报警描述">
-                    <el-input v-model="Data.Filter.alarmDescription" placeholder="请输入报警描述" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="报警设备">
-                    <el-input v-model="Data.Filter.alarmDevice" placeholder="请输入报警设备" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="油枪">
-                    <el-input v-model="Data.Filter.nozzleControlName" placeholder="请输入油枪" clearable></el-input>
-                  </el-form-item>
-                </el-col>
+  <div class="layout-pd">
+    <el-row>
+      <!--操作-->
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="Data.Filter" @submit.stop.prevent>
+            <el-form-item prop="name" style="width: 100%">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="油机ID">
+                  <el-input v-model="Data.Filter.fuelld" placeholder="请输入油机ID" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="加油站">
+                  <el-input v-model="Data.Filter.gasStation" placeholder="请输入加油站" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="油机号">
+                  <el-input v-model="Data.Filter.name" placeholder="请输入油机号" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="序列号">
+                  <el-input v-model="Data.Filter.serialNumber" placeholder="请输入序列号" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="报警来源">
+                  <el-input v-model="Data.Filter.alarmSource" placeholder="请输入报警来源" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="报警类型">
+                  <el-input v-model="Data.Filter.alarmType" placeholder="请输入报警类型" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="报警描述">
+                  <el-input v-model="Data.Filter.alarmDescription" placeholder="请输入报警描述" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="报警设备">
+                  <el-input v-model="Data.Filter.alarmDevice" placeholder="请输入报警设备" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="油枪">
+                  <el-input v-model="Data.Filter.nozzleControlName" placeholder="请输入油枪" clearable></el-input>
+                </el-form-item>
+              </el-col>
 
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="创建时间">
-                    <el-date-picker
-                      v-model="Data.time"
-                      type="datetimerange"
-                      value-format="YYYY-MM-DD HH:mm:ss"
-                      range-separator="To"
-                      start-placeholder="Start date"
-                      end-placeholder="End date"
-                    />
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item>
-                    <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                    <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                  </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-form>
-          </el-card>
-        </el-col>
-        <!--表格-->
-        <el-col  :xs="24" >
-          <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-            <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>
-            <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"
-                :total="Data.total"
-                :page-sizes="[1000, 2000, 5000, 10000]"
-                small
-                background
-                @size-change="onSizeChange"
-                @current-change="onCurrentChange"
-                layout="total, sizes, prev, pager, next, jumper"
-              />
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <EditDialog ref="editDialogRef" />
-      <AuditDialog ref="auditDialogRef" />
-    </div>
-  
-  </template>
-  
-  <script setup lang="ts" name="authorize/fuelingsdk">
-  import {onMounted, reactive, watch} from "vue";
-  import {ElTable } from 'element-plus'
-  import {alarmFilterModel_SearchFilter, alarmFilterModel, PageInputAlarmFilterModel} from "/@/api/admin/reportManagement/alarm/alarmDto";
-  import {AlarmApi} from "/@/api/admin/reportManagement/alarm/alarmApi";
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="创建时间">
+                  <el-date-picker v-model="Data.time" type="datetimerange" value-format="YYYY-MM-DD HH:mm:ss"
+                    range-separator="To" start-placeholder="Start date" end-placeholder="End date" />
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item>
+                </el-form-item>
+              </el-col>
+            </el-form-item>
+          </el-form>
 
-  
-  /**页面对象 */
-  const Data = reactive({
-    time:'',
-    /**加载显示 */
-    loading: false,
-    /**条件查询模块 */
-    Filter: {
-      /**油机id */
-      fuelld: "",
-      /**加油站 */
-      gasStation: "",
-      /**油机号*/
-      name: "",
-      /**序列号*/
-      serialNumber: "",
-      /**报警来源 */
-      alarmSource: "",
-      /**报警类型 */
-      alarmType:"",
-      /**报警描述 */
-      alarmDescription:"",
-      /**报警设备	 */
-      alarmDevice:"",
-      /** 油枪*/
-      nozzleControlName:"",
-      /**创建开始的时间 */
-      CreateBeginTime: "",
-      /**创建结束的时间 */
-      CreateEndTime: "",
-    } as alarmFilterModel_SearchFilter,
-    /**表格信息 */
-    tableModel: [] as Array<alarmFilterModel>,
-    /**动态表头 */
-    dynamicColumns: [
-      { prop: 'fuelld', label: '油机id' },
-      { prop: 'gasStation', label: '加油站名称' },
-      { prop: 'name', label: '油机号' },
-      { prop: 'serialNumber', label: '序列号' },
-      { prop: 'alarmSource', label: '报警来源' },
-      { prop: 'alarmType', label: '报警类型' },
-      { prop: 'alarmDescription', label: '报警描述' },
-      { prop: 'alarmDevice', label: '报警设备' },
-      { prop: 'nozzleControlName', label: '油枪' },
-      { prop: 'createdDate', label: '创建时间' },
-      { prop: 'alarmHistoryID', label: '报警历史ID' },
-    ],
-    /**分页标识 */
-    pageInput:{
-      currentPage: 1,
-      pageSize: 10000,
-    } as PageInputAlarmFilterModel,
-    /**分页总数 */
-    total: 0,
-  } )
-  
-  /**初始化 */
-  const init = async () => {
-    Data.loading = true
-    const res:any = await new AlarmApi().getPage({...Data.pageInput, filter:Data.Filter})
-    Data.tableModel = res?.data?.list ?? []
-    Data.total = res?.data?.total ?? 0
-    Data.loading = false
-  }
-  
-  onMounted(() => {
-    init()
-  })
-  
-  
-  /**
-   * 监听时间变换
-   */
-  watch(() => Data.time, (newVal ) => {
-    if(newVal.length === 0){
-      return
-    }
-    Data.Filter.CreateBeginTime = newVal?.[0].toString()
-    Data.Filter.CreateEndTime = newVal?.[1].toString()
-  })
-  
-  /**条件查询 */
-  const onQuery = () => {
-    init()
-  }
-  
-  /**重置查询条件 */
-  const resetQuery = () => {
-    Data.Filter.fuelld = ''
-    Data.Filter.gasStation = ''
-    Data.Filter.name = ''
-    Data.Filter.serialNumber = ''
-    Data.Filter.alarmSource =  ''
-    Data.Filter.alarmType = ''
-    Data.Filter.alarmDescription = ''
-    Data.Filter.alarmDevice = ''
-    Data.Filter.nozzleControlName = ''
-    Data.Filter.CreateBeginTime = ''
-    Data.Filter.CreateEndTime = ''
-    Data.time = ''
-    Data.pageInput.currentPage = 1
-    Data.pageInput.pageSize = 10000
-  }
-  
-  /**重置 */
-  const onReset = () => {
-    resetQuery()
-    init()
-  }
+          <hr>
 
-   /**
- * 页条变化
- * @param val
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+          </el-row>
+        </el-card>
+      </el-col>
+      <!--表格-->
+      <el-col :xs="24">
+        <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
+          <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>
+          <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"
+              :total="Data.total" :page-sizes="[5, 15, 25, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+
+  </div>
+
+</template>
+
+<script setup lang="ts" name="authorize/fuelingsdk">
+import { onMounted, reactive, watch } from "vue";
+import { ElTable } from 'element-plus'
+import { alarmFilterModel_SearchFilter, alarmFilterModel, PageInputAlarmFilterModel } from "/@/api/admin/reportManagement/alarm/alarmDto";
+import { AlarmApi } from "/@/api/admin/reportManagement/alarm/alarmApi";
+
+
+/**页面对象 */
+const Data = reactive({
+  time: '',
+  /**加载显示 */
+  loading: false,
+  /**条件查询模块 */
+  Filter: {
+    /**油机id */
+    fuelld: "",
+    /**加油站 */
+    gasStation: "",
+    /**油机号*/
+    name: "",
+    /**序列号*/
+    serialNumber: "",
+    /**报警来源 */
+    alarmSource: "",
+    /**报警类型 */
+    alarmType: "",
+    /**报警描述 */
+    alarmDescription: "",
+    /**报警设备	 */
+    alarmDevice: "",
+    /** 油枪*/
+    nozzleControlName: "",
+    /**创建开始的时间 */
+    CreateBeginTime: "",
+    /**创建结束的时间 */
+    CreateEndTime: "",
+  } as alarmFilterModel_SearchFilter,
+  /**表格信息 */
+  tableModel: [] as Array<alarmFilterModel>,
+  /**动态表头 */
+  dynamicColumns: [
+    { prop: 'fuelld', label: '油机id' },
+    { prop: 'gasStation', label: '加油站名称' },
+    { prop: 'name', label: '油机号' },
+    { prop: 'serialNumber', label: '序列号' },
+    { prop: 'alarmSource', label: '报警来源' },
+    { prop: 'alarmType', label: '报警类型' },
+    { prop: 'alarmDescription', label: '报警描述' },
+    { prop: 'alarmDevice', label: '报警设备' },
+    { prop: 'nozzleControlName', label: '油枪' },
+    { prop: 'createdDate', label: '创建时间' },
+    { prop: 'alarmHistoryID', label: '报警历史ID' },
+  ],
+  /**分页标识 */
+  pageInput: {
+    currentPage: 1,
+    pageSize: 15,
+  } as PageInputAlarmFilterModel,
+  /**分页总数 */
+  total: 0,
+})
+
+/**初始化 */
+const init = async () => {
+  Data.loading = true
+  const res: any = await new AlarmApi().getPage({ ...Data.pageInput, filter: Data.Filter })
+  Data.tableModel = res?.data?.list ?? []
+  Data.total = res?.data?.total ?? 0
+  Data.loading = false
+}
+
+onMounted(() => {
+  init()
+})
+
+
+/**
+ * 监听时间变换
  */
+watch(() => Data.time, (newVal) => {
+  if (newVal.length === 0) {
+    return
+  }
+  Data.Filter.CreateBeginTime = newVal?.[0].toString()
+  Data.Filter.CreateEndTime = newVal?.[1].toString()
+})
+
+/**条件查询 */
+const onQuery = () => {
+  init()
+}
+
+/**重置查询条件 */
+const resetQuery = () => {
+  Data.Filter.fuelld = ''
+  Data.Filter.gasStation = ''
+  Data.Filter.name = ''
+  Data.Filter.serialNumber = ''
+  Data.Filter.alarmSource = ''
+  Data.Filter.alarmType = ''
+  Data.Filter.alarmDescription = ''
+  Data.Filter.alarmDevice = ''
+  Data.Filter.nozzleControlName = ''
+  Data.Filter.CreateBeginTime = ''
+  Data.Filter.CreateEndTime = ''
+  Data.time = ''
+  Data.pageInput.currentPage = 1
+  Data.pageInput.pageSize = 10000
+}
+
+/**重置 */
+const onReset = () => {
+  resetQuery()
+  init()
+}
+
+/**
+* 页条变化
+* @param val
+*/
 const onSizeChange = (val: number) => {
   Data.pageInput.pageSize = val
   init()
@@ -243,20 +230,12 @@ const onCurrentChange = (val: number) => {
   Data.pageInput.currentPage = val
   init()
 }
-  
 
-  
-  </script>
-  
-  <style scoped lang="scss">
-  .my-el-link {
-    font-size: 14px;
-  }
-  .el-form .el-col.mb20 {
-    margin: 0 !important;
-  }
-  .el-input, .el-select {
-    width: 240px;
-  }
-  </style>
-  
+
+
+</script>
+
+<style scoped lang="scss">
+@import '/@/theme/tableStyle.scss';
+
+</style>

admin.ui.plus-master/src/views/admin/statement/alarmRules/components/form-add.vue

@@ -1,250 +0,0 @@
-<template>
-    <div class="admin-authorize-editInfo">
-      <!-- 添加表单的标题  --  （:title 为 添加规则） -->
-      <el-dialog :title="formData.titleText" v-model="formData.isShowDialog" draggable width="769px">
-        <!-- :model将 父组件的值传递给子组件（由于前一个表中分编辑和添加，那么此位置，是否可以不设置:model？？？） -->
-        <!-- :rules设置是否可以为空等表单输入规则 -->
-        <!-- ref提交表单进行的校验？？？--校验什么（点击提交时，会先对表单的值进行校验判断，校验通过后，再进行后续操作。） -->
-        <el-form :model="formData.editData"
-                 :rules="rules"
-                 ref="formRef"
-                 v-loading="formData.loading"
-                 size="default"
-                 label-width="95px">
-          <el-row :gutter="35">
-            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-                <!--  校验prop需要与v-model对应 --（prop中的值应该与v-model进行对应）-- 根据数据接口文件进行修改-->
-              <el-form-item label="规则名称" prop="oilStation">
-                <el-input v-model="formData.editData.oilStation" placeholder="请输入规则名称" clearable></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-              <el-form-item label="状态" prop="projectName">
-                <el-select v-model="formData.editData.options" class="m-2" placeholder="选择状态" >
-                  <el-option
-                    v-for="item in formData.options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value"
-                  />
-                </el-select>
-              </el-form-item>
-            </el-col>
-            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-              <el-form-item label="匹配关键字" prop="sn">
-                <el-input v-model="formData.editData.sn" placeholder="请输入匹配关键字" clearable></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-              <el-form-item label="发送名单" prop="key">
-                <el-input v-model="formData.editData.key" placeholder="请输入发送名单" clearable></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-              <el-form-item label="启用时间" prop="expiedTime">
-                <el-date-picker
-                  v-model="formData.editData.expiedTime"
-                  type="datetime"
-                  value-format="YYYY-MM-DD HH:mm:ss"
-                  placeholder="选择启用时间"
-                />
-              </el-form-item>
-            </el-col>
-            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-              <el-form-item label="发送记录" prop="projectName">
-                <el-input v-model="formData.editData.projectName" placeholder="请输入发送记录" clearable></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-              <el-form-item label="停用时间" prop="expiedTime">
-                <el-date-picker
-                  v-model="formData.editData.expiedTime"
-                  type="datetime"
-                  value-format="YYYY-MM-DD HH:mm:ss"
-                  placeholder="选择停用时间"
-                />
-              </el-form-item>
-            </el-col>
-            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-              <el-form-item label="备注" prop="remark">
-                <el-input v-model="formData.editData.remark" placeholder="请输入备注" rows="6" clearable type="textarea"></el-input>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </el-form>
-        <template #footer>
-          <span class="dialog-footer">
-            <el-button @click="onCancel" icon="ele-CircleClose" size="default">取 消</el-button>
-            <!-- 表单的确认提交按钮 -->
-            <el-button type="primary" :icon="formData.editIcon" @click="onSubmit" size="default">确定</el-button>
-            <!--{{formData.buttonText}}  -->
-          </span>
-        </template>
-      </el-dialog>
-    </div>
-  </template>
-  
-  <script setup lang="ts">
-  import {reactive, ref, watch} from "vue";
-//   import {oilSdkTableModel} from "/src/api/admin/deviceAuthorization/oilSdkAuthorDto";
-//   import {OilSdkAuthorAPI} from "/src/api/admin/deviceAuthorization/oilSdkAuthor";
-//   import eventBus from "/src/utils/mitt";
-  import {FormRules} from "element-plus";
-  
-  enum Form {
-    ADD,
-    UPDATE
-  }
-  
-  /**数据对象 */
-  const formData = reactive({
-    loading: false,
-    formType: Form,
-    titleText:'',
-    editIcon:'',
-    buttonText:'',
-    isShowDialog: false,
-    editData:{}, 
-    // as oilSdkTableModel,  // -- 数据文件的数据类型
-    // /**动态表头 */
-    // dynamicColumns: [
-    //   { prop: 'ruleName', label: '规则名称' },
-    //   { prop: 'state', label: '状态' },
-    //   { prop: 'keyWord', label: '匹配关键字' },
-    //   { prop: 'sendList', label: '发送名单' },
-    //   { prop: 'startTime', label: '启用时间' },
-    //   { prop: 'send', label: '发送记录' },
-    //   { prop: 'endTime', label: '停用时间' },
-    //   { prop: 'remark', label: '备注' },
-    // ],
-    options:[
-      {label:'启用',value:'启用'},
-      {label:'停用',value:'停用'},
-      {label:'失效',value:'失效'},
-      {label:'删除',value:'删除'},
-    ]
-  })
-  
-  /**有效时间选择校验*/
-  const validateDate = (rule: any, value: any, callback: any) => {
-    if(new Date(value).getTime() > Date.now()){
-      callback()
-    }else{
-      callback(new Error('选择的时间已失效'))
-    }
-  }
-  
-  /**表单校验*/
-  const rules = reactive<FormRules>({
-    oilStation: [
-      { required: true, message: '请输入规则名称', trigger: 'blur' },
-    ],
-    projectName: [
-      { required: true, message: '请输入状态', trigger: 'blur' },
-    ],
-    sn: [
-      { required: true, message: '请输入匹配关键字', trigger: 'blur' },
-    ],
-    key: [
-      { required: true, message: '请输入发送名单', trigger: 'blur' },
-    ],
-    key1: [
-      { required: true, message: '请输入发生记录', trigger: 'blur' },
-    ],
-    key2: [
-      { type: 'date',required: true, message: '请输入启用时间', trigger: 'blur' },
-      { validator: validateDate, trigger: 'blur' }
-    ],
-    key3: [
-      { type: 'date',required: true, message: '请输入停用时间', trigger: 'blur' },
-      { validator: validateDate, trigger: 'blur' }
-    ],
-    state: [
-      { required: true, message: '请输入备注', trigger: 'blur' },
-    ],
-  })
-  
-  
-  const formRef = ref()
-  
-//   const openDialog = (val) => {
-//     if(val){
-//       formData.editData = JSON.parse(JSON.stringify(val))
-//       formData.titleText = '更新授权'
-//       formData.buttonText = '更新'
-//       //更新操作
-//       formData.formType = Form.UPDATE
-//       formData.editIcon = 'ele-Refresh'
-//     }else {
-//       formData.editData = {} as oilSdkTableModel
-//       formData.titleText = '添加授权'
-//       formData.buttonText = '添加'
-//       //添加操作
-//       formData.formType = Form.ADD
-//       formData.editIcon = 'ele-CirclePlus'
-//     }
-//     formData.isShowDialog = true
-//     formData.isShowDialog = true
-//   }
-  
-//   const onCancel = () => {
-//     formData.editData = {} as oilSdkTableModel
-//     formData.isShowDialog = false
-//   }
-  
-//   /***监听弹窗关   闭表单验证*/
-//   watch(() => formData.isShowDialog,(newVal) => {
-//     if(newVal) formRef.value?.resetFields()
-//   })
-  
-//   const onSubmit =  () => {
-//     formRef.value.validate(async (valid: boolean) =>{
-//       if(!valid) return
-  
-//       formData.loading = true
-//       // eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
-//       const { projectName, state, ...newData} = formData.editData
-//       let res = {} as any
-//       if(formData.formType === Form.UPDATE){
-//         res = await new OilSdkAuthorAPI().updateForm({project: formData.editData.projectName, state: formData.editData.state === '正常' ? 1 : 0 ?? 0,  ...newData},{ showSuccessMessage: true }).catch(() => {
-//           formData.loading = false
-//         })
-//       }else if(formData.formType === Form.ADD){
-//         res = await new OilSdkAuthorAPI().addForm({project: formData.editData.projectName, state: formData.editData.state === '正常' ? 1 : 0 ?? 0,  ...newData},{ showSuccessMessage: true }).catch(() => {
-//           formData.loading = false
-//         })
-//       }else {
-//         formData.loading = false
-//         return
-//       }
-  
-//       if(res?.success){
-//         console.log('2')
-//         eventBus.emit('refreshView')
-//         formData.isShowDialog = false
-//         formData.editData = {} as oilSdkTableModel
-//       }
-  
-//       
-//     })
-//   }
-  
-//   defineExpose({
-//     openDialog,
-//   })
-
-const openDialog = ()=>{
-  console.log(111)
-  formData.isShowDialog = true
-}
-defineExpose({
-  openDialog,
-})
-  </script>
-  <style scoped lang="scss">
-  ::v-deep .el-form-item__label {
-    display: inline;
-    text-align-last: left;
-  }
-  </style>
-  

admin.ui.plus-master/src/views/admin/statement/alarmRules/components/pushTemplate.vue

@@ -0,0 +1,105 @@
+<template>
+  <div class="layout-pd">
+    <el-row style="height: auto;">
+      <!--操作-->
+      <el-col :xs="24">
+        <el-card class="my-fill mt8" shadow="never" :body-style="{ paddingBottom: '0' }" style="height: 88vh">
+          <div style="width: 100%;display: flex;justify-content: left;align-items: center;">
+            <h1 style="margin-bottom: 10px;font-size: 30px;">推送模板：</h1>
+          </div>
+          <hr style="margin: 10px;" />
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent style="width: 60%;">
+              <el-form-item label="模板名称：" style="width: 100%;">
+                <el-input v-model="Data.templateName" style="width: 100%;" placeholder="请输入" />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent style="width: 60%;">
+              <el-form-item label="模板类型：" style="width: 100%;">
+                <el-select v-model="Data.templateType" placeholder="请选择">
+                  <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id" />
+                </el-select>
+              </el-form-item>
+            </el-form>
+          </div>
+          <!-- 能不能通过调节距离的方式进行高度调节？？？ -->
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent style="width: 60%;">
+              <el-form-item style="width: 100%;">
+              </el-form-item>
+              <el-form-item style="width: 100%;">
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent style="width: 60%;">
+              <el-form-item label="模&#8195;&#8195;板：" style="width: 100%;">
+                <el-input type="textarea" rows="12" v-model="Data.templateContent" style="width: 100%;"
+                  placeholder="请输入" />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent style="width: 60%;">
+              <el-row justify="end" style="margin-top: 30px;">
+                <el-button type="primary" @click="toSave">保存</el-button>
+              </el-row>
+            </el-form>
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+
+</template>
+
+<script setup lang="ts" name="">
+import { reactive } from 'vue';
+import { pushTemplateModel } from "/@/api/admin/AlarmService/pushTemplateDto";
+import { pushTemplateApi } from "/@/api/admin/AlarmService/pushTemplateApi";
+
+const Data = reactive({
+  id:0,
+  templateName: '',
+  templateType: '',
+  templateContent: ''
+} as pushTemplateModel)
+
+const typeList = [
+  {name:"微信公众号",id:"wx"},
+  {name:"邮件",id:"email"}
+]
+
+const toSave = async() => {
+  Data.id = Number(new Date()),
+  console.log(Data)
+  const res = await new pushTemplateApi().addForm(Data)
+  console.log(res)
+  Data.templateName= '',
+  Data.templateType= '',
+  Data.templateContent= ''
+}
+
+</script>
+
+<style scoped lang="scss">
+.el-form .el-col.mb20 {
+  margin: 0 !important;
+}
+
+.el-input {
+  width: 240px;
+}
+
+.el-form-item__label {
+  text-align: justify;
+  height: 50px;
+}
+
+.el-card {
+  height: 100%;
+  padding: 0;
+}
+</style>

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

@@ -1,159 +1,378 @@
 <template>
-    <div class="layout-pd" >
-      <el-row>
-        <el-col :xs="24">
-            <el-card>
-              <div class="my-flex my-flex-end" >
-                <el-button  type="primary" icon="ele-CirclePlus" @click="onAdd"> 添加 </el-button>
-              </div>
-            </el-card>
-        </el-col>
-        <!--表格-->
-        <el-col  :xs="24" >
-          <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-            <el-table ref="multipleTableRef"
-              v-loading="sdkData.loading"
-              stripe :data="sdkData.tableModel"
-              row-key="id"
-              style="width: 100%" >
-              <el-table-column v-for="column in sdkData.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label" />
-            </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"
-                :page-sizes="[10000, 20000, 50000, 100000]"
-                small
-                background
-                @size-change="1"
-                @current-change="1"
-                layout="total, sizes, prev, pager, next, jumper"
-              />
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <AddDialog ref="addDialogRef" />
-    </div>
-  
-  </template>
-  
-  <script setup lang="ts" name="authorize/fuelingsdk">
-  import {defineAsyncComponent, onMounted, reactive, ref, watch, onBeforeMount,getCurrentInstance} from "vue";
-  import { ElTable } from 'element-plus'
-  /**引入组件*/
-  const AddDialog = defineAsyncComponent(() => import('/src/views/admin/statement/alarmRules/components/form-add.vue'))
- 
-  const addDialogRef = ref()
-  
-  /**sdk授权页面对象 */
-  const sdkData = reactive({
-    time:'',
-    /**加载显示 */
-    loading: false,
-
-    /**表格信息 */
-    tableModel: [] ,
-    /**动态表头 */
-    dynamicColumns: [
-      { prop: 'ruleId', label: '规则ID' },
-      { prop: 'ruleName', label: '规则名称' },
-      { prop: 'state', label: '状态' },
-      { prop: 'keyWord', label: '匹配关键字' },
-      { prop: 'sendList', label: '发送名单' },
-      { prop: 'startTime', label: '启用时间' },
-      { prop: 'send', label: '发送记录' },
-      { prop: 'endTime', label: '停用时间' },
-      { prop: 'remark', label: '备注' },
-    ],
-    /**分页标识 */
-    pageInput:{
-      CurrentPage: 1,
-      PageSize: 10000,
-    } ,
-    /**分页总数 */
-    total: 0,
-  } )
-  
-//   /**初始化 */
-//   const init = async () => {
-//     sdkData.loading = true
-//     const query = flattenObject({ Filter: sdkData.Filter})
-//     const res:any = await new OilSdkAuthorAPI().getPageData({...sdkData.pageInput, ...query}).catch(() => {
-//       sdkData.loading = false
-//     })
-//     sdkData.tableModel = res?.data?.list ?? []
-//     sdkData.total = res?.data?.total ?? 0
-//     sdkData.loading = false
-//   }
-  
-//   onMounted(() => {
-//     init()
-//     eventBus.off('refreshView')
-//     eventBus.on('refreshView', async () => {
-//       init()
-//     })
-//   })
-  
-//   onBeforeMount(() => {
-//     eventBus.off('refreshView')
-//   })
-  
-//   /**
-//    * 监听时间变换
-//    */
-//   watch(() => sdkData.time, (newVal ) => {
-//     if(newVal.length === 0){
-//       return
-//     }
-//     sdkData.Filter.BeginTime = newVal?.[0].toString()
-//     sdkData.Filter.EndTime = newVal?.[1].toString()
-//   })
-  
-//   /**条件查询 */
-//   const onQuery = () => {
-//     init()
-//   }
-  
-  /**重置查询条件 */
-//   const resetQuery = () => {
-//     sdkData.Filter.OilCompanies = ''
-//     sdkData.Filter.AntiCheatingState = ''
-//     sdkData.Filter.OilGunState = ''
-//     sdkData.Filter.SiteAddress = ''
-//     sdkData.Filter.Manufacturer =  ''
-//     sdkData.Filter.OutBeginTime = ''
-//     sdkData.Filter.OutEndTime = ''
-//     sdkData.Filter.CreateBeginTime = ''
-//     sdkData.Filter.CreateEndTime = ''
-//     sdkData.time = ''
-//     sdkData.pageInput.CurrentPage = 1
-//   }
-  
-//   /**重置 */
-//   const onReset = () => {
-//     resetQuery()
-//     init()
-//   }
-    /**添加 */ 
-    const onAdd = ()=>{
-      addDialogRef.value.openDialog()
+  <div class="layout-pd">
+    <el-row>
+      <!--操作-->
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="never" :body-style="{ paddingBottom: '0' }" style="padding-bottom: 20px;">
+          <div style="width: 100%;display: flex;justify-content: left;align-items: center;">
+            <h1 style="margin-bottom: 10px;font-size: 30px;">报警推送规则</h1>
+          </div>
+          <div style="margin-bottom: 10px ;">
+            <hr />
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="规则名称：" style="width: 100%;">
+                <el-input v-model="Data.Filter.ruleName" style="width: 100%;" placeholder="请输入" />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="角&#8195;&#8195;色：" style="width: 100%;">
+                <el-select v-model="Data.Filter.roleMappingId" multiple placeholder="请选择角色">
+                  <el-option v-for="item in Data.roleList" :key="item.id" :label="item.name" :value="item.id" />
+                </el-select>
+              </el-form-item>
+            </el-form>
+          </div>
+          <!-- 能不能通过调节距离的方式进行高度调节？？？ -->
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item style="width: 100%;">
+              </el-form-item>
+            </el-form>
+          </div>
+
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="备&#8195;&#8195;注：" style="width: 100%;">
+                <el-input type="textarea" rows="5" v-model="Data.Filter.remark" style="width: 100%;"
+                  placeholder="请输入" />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="推送方式：" style="width: 100%;">
+                <el-row style="width: 40%;">
+                  微信公众号<el-switch v-model="Data.radioValue1" style="margin-left: 3%;" @change="radioChange" />
+                </el-row>
+                <el-row style="width: 40%;">
+                  邮箱<el-switch v-model="Data.radioValue2" style="margin-left: 3%;" @change="radioChange" />
+                </el-row>
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="模&#8195;&#8195;板：" style="width: 40%;" prop="mode1">
+                <el-select v-model="Data.mode1" class="m-2" placeholder="Select" v-if="Data.radioValue1"
+                  @change="modeChange">
+                  <el-option v-for="item in templateData.wxList" :key="item.id" :label="item.templateName"
+                    :value="item.id" />
+                </el-select>
+              </el-form-item>
+              <el-form-item style="width: 30%;">
+                <el-select v-model="Data.mode2" class="m-2" placeholder="Select" v-if="Data.radioValue2"
+                  @change="modeChange">
+                  <el-option v-for="item in templateData.emailList" :key="item.id" :label="item.name"
+                    :value="item.id" />
+                </el-select>
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="正则匹配：" style="width: 100%;">
+                <el-input type="textarea" rows="5" v-model="Data.Filter.regular" style="width: 100%;"
+                  placeholder="请输入" />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="互&#8195;&#8195;斥：" style="width: 100%;">
+                <el-switch v-model="Data.Filter.isExclusive" />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="优先&#8195;级:" style="width: 100%;">
+                <el-input-number v-model="Data.Filter.taskPriority" :controls="false" :min=1 :max=9 />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="触发方式:" style="width: 100%;">
+                <el-radio-group v-model="Data.Filter.triggerMethod">
+                  <el-radio :label="0">其中之一条件满足即触</el-radio>
+                  <el-radio :label="1">全部满足时触</el-radio>
+                </el-radio-group>
+              </el-form-item>
+            </el-form>
+          </div>
+          <div v-for="(index) in Data.num" :key="index"
+            style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent>
+              <el-form-item label="条&#8195;&#8195;件:" style="width: 100%;">
+                <el-select v-model="Data.selectValue1[index]" class="m-2" placeholder="Select" style="width: 20%;">
+                  <el-option v-for="item in Data.condition" :key="item" :label="item" :value="item"
+                    @click="selectChange(Data.selectValue1[index])" />
+                </el-select>
+                <!-- 符号 -->
+                <el-select class="sign" style="width: 7%;" suffix-icon="" v-model="Data.seDefault">
+                  <el-option v-for="(item, index) in Data.selectList" :key="index" :value="item" selectd />
+                </el-select>
+                <el-select v-model="Data.selectValue2[index]" class="m-2" placeholder="Select" style="width: 20%;">
+                  <el-option v-for="item in Data.selectCondition" :key="item" :label="item" :value="item" />
+                </el-select>
+                <label style="margin-left: 5%;">报警等级</label>
+                <!-- 符号 -->
+                <el-select class="sign" style="width: 7%;" suffix-icon="" v-model="Data.seDefault">
+                  <el-option v-for="(item, index) in Data.selectList" :key="index" :value="item" selectd />
+                </el-select>
+                <el-select v-model="Data.selectValue3[index]" class="m-2" placeholder="Select" style="width: 20%;">
+                  <el-option v-for="item in Data.alarmLevel" :key="item" :label="item" :value="item" />
+                </el-select>
+              </el-form-item>
+            </el-form>
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-button :icon="CirclePlusFilled" style="font-size: large" @click="add" />
+          </div>
+          <div style="width: 100%;display: flex;justify-content: center;align-items: center;">
+            <el-form :inline="true" @submit.stop.prevent style="width: 60%;">
+              <el-row justify="end" style="margin-top: 30px;">
+                <el-button type="primary" @click="toSave">保存</el-button>
+              </el-row>
+            </el-form>
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+
+</template>
+
+<script setup lang="ts" name="">
+import { onMounted, reactive, ref, watch } from 'vue';
+import { CirclePlusFilled } from '@element-plus/icons-vue'
+import { alarmRluesFilterModel } from "/@/api/admin/AlarmService/alarmRulesDto";
+import { alarmRulesApi } from "/@/api/admin/AlarmService/alarmRulesApi";
+import { RoleApi } from '/@/api/admin/Role'
+import { pushTemplateApi } from "/@/api/admin/AlarmService/pushTemplateApi";
+import { TemplateFilterDto } from "/@/api/admin/AlarmService/pushTemplateDto";
+
+
+const Data = reactive({
+  Filter: {
+    /**规则名称*/
+    ruleName: '',
+    /**角色 */
+    roleMappingId: [],
+    /**备注*/
+    remark: '',
+    /**推送方式 */
+    pushMethod: '',
+    /**模板 */
+    pushTemplateMappingID: [],
+    /**正则表达式 */
+    regular: '',
+    /**是否互斥 */
+    isExclusive: false,
+    /**优先级 */
+    taskPriority: 1,
+    /**触发方式 */
+    triggerMethod: '',
+    /**规则条件 */
+    conditionsJson: '' as any,
+    pushUserid: []
+  } as alarmRluesFilterModel,
+  selectList: [">", "<", "="],
+  /** 角色列表 */
+  roleList: [] as any,
+  /** 推送方式绑定数据 */
+  radioValue1: false,
+  radioValue2: false,
+  num: 0,
+  seDefault: '=',
+  /** 条件列表 */
+  selectValue1: [],
+  selectValue2: [],
+  selectValue3: [],
+  /** 模板绑定数据 */
+  mode1: '',
+  mode2: '',
+  /** 条件选择 */
+  selectCondition: [] as Array<string>,
+  condition: ['报警设备', '报警类型', '报警来源'],
+  alarmEquipment: ['加油枪', '编码器', '加密显示屏', '监控微处理器'],
+  alarmType: ['绑定错误'],
+  alarmSource: ['云平台', '安全监督装置'],
+  alarmLevel: [1, 2],
+
+})
+
+const templateData = reactive({
+  Filter: {
+    currentPage: 0,
+    pageSize: 0,
+    filter: {
+      templateName: "",
+      templateType: "",
+      templateContent: "",
+      id: 0
+    }
+  } as TemplateFilterDto,
+  wxList: [] as any,
+  emailList: [] as any
+})
+
+// 数量增加 - 实现dom节点的增加
+const add = (() => {
+  Data.num += 1
+
+})
+
+const radioChange = (() => {
+  if (Data.radioValue1 == true) {
+    Data.Filter.pushMethod = 'wx'
+    if (Data.radioValue2 == true) {
+      Data.Filter.pushMethod += ',email'
+    }
+  } else {
+    if (Data.radioValue2 == true) {
+      Data.Filter.pushMethod = 'email'
     }
-  
-
-  
-  </script>
-  
-  <style scoped lang="scss">
-  .my-el-link {
-    font-size: 14px;
   }
-  .el-form .el-col.mb20 {
-    margin: 0 !important;
+})
+
+const selectChange = ((key: any) => {
+  if (key == '报警设备') {
+    Data.selectCondition = Data.alarmEquipment
+  } else if (key == '报警类型') {
+    Data.selectCondition = Data.alarmType
+  } else if (key == '报警来源') {
+    Data.selectCondition = Data.alarmSource
   }
-  .el-input, .el-select {
-    width: 240px;
+})
+
+// 获取角色列表
+const getRole = async () => {
+  const res = await new RoleApi().getList()
+  Data.roleList = res.data?.map(item => {
+    return { 'id': item.id, 'name': item.name }
+  })
+}
+
+// 查询模板信息
+const funSelect = async () => {
+  const res = await new pushTemplateApi().getData(templateData.Filter)
+  const data = res?.data
+  templateData.wxList = (data as any)?.filter((item: any) => {
+    if (item.templateType == "wx") {
+      return { 'id': item.id, 'name': item.templateName }
+    }
+  })
+  templateData.emailList = (data as any)?.filter((item: any) => {
+    if (item.templateType == "email") {
+      return { 'id': item.id, 'name': item.templateName }
+    }
+  })
+}
+
+// 获取模板元素id
+const modeChange = (() => {
+  Data.Filter.pushTemplateMappingID = []
+  if (Data.Filter.pushTemplateMappingID.includes(Number(Data.mode1)) == false && Data.mode1 != '') {
+    Data.Filter.pushTemplateMappingID?.push(Number(Data.mode1))
   }
-  </style>
-  
+  if (Data.Filter.pushTemplateMappingID.includes(Number(Data.mode2)) == false && Data.mode2 != '') {
+    Data.Filter.pushTemplateMappingID?.push(Number(Data.mode2))
+  }
+})
+
+// 钩子函数 -- 挂载后
+onMounted(() => {
+  getRole()
+  funSelect()
+})
+
+// 条件数据，事件监听 -- num改变，json数据添加
+watch([() => [...Data.selectValue1], () => [...Data.selectValue2], () => [...Data.selectValue3]], (newVal) => {
+  const second = {} as any
+  for (var i = 1; i < Data.num + 1; i++) {
+    const first = [Data.selectValue1[i], Data.selectValue2[i], Data.selectValue3[i]]
+    second[i] = first
+  }
+  Data.Filter.conditionsJson = JSON.stringify(second)
+})
+
+
+
+// 保存提交内容
+const toSave = async () => {
+  const res = await new alarmRulesApi().addForm(Data.Filter)
+  console.log(Data.Filter)
+  console.log(res)
+  reset()
+}
+
+// 重置
+const reset = (() => {
+  /**规则名称*/
+  Data.Filter.ruleName = '',
+    /**角色 */
+    Data.Filter.roleMappingId = [],
+    /**备注*/
+    Data.Filter.remark = '',
+    /**推送方式 */
+    Data.Filter.pushMethod = '',
+    Data.radioValue1 = false,
+    Data.radioValue2 = false,
+    /**模板 */
+    Data.Filter.pushTemplateMappingID = [],
+    Data.mode1 = '',
+    Data.mode2 = '',
+    /**正则表达式 */
+    Data.Filter.regular = '',
+    /**是否互斥 */
+    Data.Filter.isExclusive = false,
+    /**优先级 */
+    Data.Filter.taskPriority = 1,
+    /**触发方式 */
+    Data.Filter.triggerMethod = '',
+    /**规则条件 */
+    Data.Filter.conditionsJson = '',
+    Data.num = 0
+})
+
+</script>
+
+<style scoped lang="scss">
+.my-el-link {
+  font-size: 12px;
+}
+
+.el-form {
+  width: 60%;
+}
+
+.el-form .el-col.mb20 {
+  margin: 0 !important;
+}
+
+.el-input {
+  width: 240px;
+}
+
+.el-select .el-input {
+  width: 500px;
+}
+
+.sign {
+  border: 0;
+}
+
+:deep(.sign .el-input__wrapper) {
+  // 去除选择框边框
+  box-shadow: none !important;
+}
+
+.el-select-dropdown__item {
+  text-align: center;
+}
+</style>

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

@@ -1,131 +1,125 @@
 <template>
-    <div class="layout-pd" >
-      <el-row>
-        <!--操作-->
-        <el-col :xs="24" >
-          <el-card class="mt8"  shadow="hover" >
-            <el-form :model="Data.Filter" :inline="true" @submit.stop.prevent>
-              <el-form-item prop="name" style="width: 100%">
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="用户名">
-                    <el-input v-model="Data.Filter.name"  placeholder="用户名" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item>
-                    <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                    <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                  </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-form>
-          </el-card>
-        </el-col>
-        <!--表格-->
-        <el-col  :xs="24" >
-          <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-            <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>
-            <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"
-                :total="Data.total"
-                :page-sizes="[10, 20, 50, 100]"
-                small
-                background
-                @size-change="onSizeChange"
-                @current-change="onCurrentChange"
-                layout="total, sizes, prev, pager, next, jumper"
-              />
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <EditDialog ref="editDialogRef" />
-      <AuditDialog ref="auditDialogRef" />
-    </div>
-  
-  </template>
-  
-  <script setup lang="ts" name="authorize/fuelingsdk">
-  import {onMounted, reactive} from "vue";
-  import { ElTable } from 'element-plus'
-  import {associationFilterModel_SearchFilter, associationFilterModel, PageInputAssociationFilterModel} from "/@/api/admin/reportManagement/association/associationDto";
-  import {AssociationApi} from "/@/api/admin/reportManagement/association/associationApi";
-  
-  /**页面对象 */
-  const Data = reactive({
-    time:'',
-    /**加载显示 */
-    loading: false,
-    /**条件查询模块 */
-    Filter: {
-      name: "",
-    } as associationFilterModel_SearchFilter,
-    /**表格信息 */
-    tableModel: [] as Array<associationFilterModel>,
-    /**动态表头 */
-    dynamicColumns: [
-      { prop: 'name', label: '用户名' },
-      { prop: 'email', label: '邮箱' },
-      { prop: 'mobile', label: '手机号码' },
-      { prop: 'createdDate', label: '创建时间' },
-      { prop: 'modifiedDate', label: '修改时间' },
-      { prop: 'disable', label: '是否启用用户' },
-      { prop: 'isLock', label: '账户是否锁定' },
-    ],
-    /**分页标识 */
-    pageInput:{
-      currentPage: 1,
-      pageSize: 10,
-    } as PageInputAssociationFilterModel,
-    /**分页总数 */
-    total: 0,
-  } )
-  
-  /**初始化 */
-  const init = async () => {
-    Data.loading = true
-    const res:any = await new AssociationApi().getPage({...Data.pageInput, filter:Data.Filter})
-    console.log(Data.Filter)
-    Data.tableModel = res?.data?? []
-    Data.total = res?.length ?? 0
-    Data.loading = false
-  }
-  
-  onMounted(() => {
-    init()
-  })
-  
-  /**条件查询 */
-  const onQuery = () => {
-    init()
-  }
-  
-  /**重置查询条件 */
-  const resetQuery = () => {
-    Data.Filter.name = ''
-    Data.pageInput.currentPage = 1
-    Data.pageInput.pageSize = 10
-  }
-  
-  /**重置 */
-  const onReset = () => {
-    resetQuery()
-    init()
-  }
+  <div class="layout-pd">
+    <el-row>
+      <!--操作-->
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="Data.Filter" @submit.stop.prevent>
+            <el-form-item prop="name" style="width: 100%">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="用户名">
+                  <el-input v-model="Data.Filter.name" placeholder="用户名" clearable></el-input>
+                </el-form-item>
+              </el-col>
+            </el-form-item>
+          </el-form>
 
-  /**
- * 页条变化
- * @param val
- */
- const onSizeChange = (val: number) => {
+          <hr>
+
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+          </el-row>
+        </el-card>
+      </el-col>
+      <!--表格-->
+      <el-col :xs="24">
+        <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
+          <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>
+          <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"
+              :total="Data.total" :page-sizes="[10, 20, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+    <EditDialog ref="editDialogRef" />
+    <AuditDialog ref="auditDialogRef" />
+  </div>
+
+</template>
+
+<script setup lang="ts" name="authorize/fuelingsdk">
+import { onMounted, reactive } from "vue";
+import { ElTable } from 'element-plus'
+import { associationFilterModel_SearchFilter, associationFilterModel, PageInputAssociationFilterModel } from "/@/api/admin/reportManagement/association/associationDto";
+import { AssociationApi } from "/@/api/admin/reportManagement/association/associationApi";
+
+/**页面对象 */
+const Data = reactive({
+  time: '',
+  /**加载显示 */
+  loading: false,
+  /**条件查询模块 */
+  Filter: {
+    name: "",
+  } as associationFilterModel_SearchFilter,
+  /**表格信息 */
+  tableModel: [] as Array<associationFilterModel>,
+  /**动态表头 */
+  dynamicColumns: [
+    { prop: 'name', label: '用户名' },
+    { prop: 'email', label: '邮箱' },
+    { prop: 'mobile', label: '手机号码' },
+    { prop: 'createdDate', label: '创建时间' },
+    { prop: 'modifiedDate', label: '修改时间' },
+    { prop: 'disable', label: '是否启用用户' },
+    { prop: 'isLock', label: '账户是否锁定' },
+  ],
+  /**分页标识 */
+  pageInput: {
+    currentPage: 1,
+    pageSize: 10,
+  } as PageInputAssociationFilterModel,
+  /**分页总数 */
+  total: 0,
+})
+
+/**初始化 */
+const init = async () => {
+  Data.loading = true
+  const res: any = await new AssociationApi().getPage({ ...Data.pageInput, filter: Data.Filter })
+  console.log(Data.Filter)
+  Data.tableModel = res?.data ?? []
+  Data.total = res?.length ?? 0
+  Data.loading = false
+}
+
+onMounted(() => {
+  init()
+})
+
+/**条件查询 */
+const onQuery = () => {
+  init()
+}
+
+/**重置查询条件 */
+const resetQuery = () => {
+  Data.Filter.name = ''
+  Data.pageInput.currentPage = 1
+  Data.pageInput.pageSize = 10
+}
+
+/**重置 */
+const onReset = () => {
+  resetQuery()
+  init()
+}
+
+/**
+* 页条变化
+* @param val
+*/
+const onSizeChange = (val: number) => {
   Data.pageInput.pageSize = val
   init()
 }
@@ -138,18 +132,10 @@ const onCurrentChange = (val: number) => {
   Data.pageInput.currentPage = val
   init()
 }
-  
-  </script>
-  
-  <style scoped lang="scss">
-  .my-el-link {
-    font-size: 14px;
-  }
-  .el-form .el-col.mb20 {
-    margin: 0 !important;
-  }
-  .el-input, .el-select {
-    width: 240px;
-  }
-  </style>
-  
+
+</script>
+
+<style scoped lang="scss">
+@import '/@/theme/tableStyle.scss';
+
+</style>

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

@@ -1,135 +1,129 @@
 <template>
-    <div class="layout-pd" >
-      <el-row>
-        <!--操作-->
-        <el-col :xs="24" >
-          <el-card class="mt8"  shadow="hover" >
-            <el-form :model="Data.Filter" :inline="true" @submit.stop.prevent>
-              <el-form-item prop="name" style="width: 100%">
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="省份">
-                    <el-input v-model="Data.Filter.province"  placeholder="请输入省份" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="加油站名称">
-                    <el-input v-model="Data.Filter.name"  placeholder="请输入加油站名称" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item>
-                    <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                    <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                  </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-form>
-          </el-card>
-        </el-col>
-        <!--表格-->
-        <el-col  :xs="24" >
-          <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-            <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>
-            <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"
-                :total="Data.total"
-                :page-sizes="[10, 20, 50, 100]"
-                small
-                background
-                @size-change="onSizeChange"
-                @current-change="onCurrentChange"
-                layout="total, sizes, prev, pager, next, jumper"
-              />
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </div>
-  
-  </template>
-  
-  <script setup lang="ts" name="authorize/fuelingsdk">
-  import {onMounted, reactive} 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";
-  /**引入组件*/
-  
-  /**页面对象 */
-  const Data = reactive({
-    time:'',
-    /**加载显示 */
-    loading: false,
-    /**条件查询模块 */
-    Filter: {
-      /**省份 */
-      province: "",
-      /**加油站名称 */
-      name: "",
-    } as gasStationFilterModel_SearchFilter,
-    /**表格信息 */
-    tableModel: [] as Array<gasStationFilterModel>,
-    /**动态表头 */
-    dynamicColumns: [
-      { prop: 'name', label: '油站名称' },
-      { prop: 'type', label: '油站类型' },
-      { prop: 'address', label: '油站地址' },
-      { prop: 'dispensersTotal', label: '油机数量' },
-      { prop: 'nozzleControlsTotal', label: '油枪数量' },
-    ],
-    /**分页标识 */
-    pageInput:{
-      currentPage: 1,
-      pageSize: 10,
-    } as PageInputgasStationFilterModel,
-    /**分页总数 */
-    total: 0,
-  } )
-  
-  /**初始化 */
-  const init = async () => {
-    Data.loading = true
-    const res:any = await new gasStationApi().getPage({...Data.pageInput, filter:Data.Filter})
-    Data.tableModel = res?.data ?? []
-    Data.total = res?.length ?? 0
-    Data.loading = false
-  }
-  
-  onMounted(() => {
-    init()
-  })
-  
-  /**条件查询 */
-  const onQuery = () => {
-    init()
-  }
-  
-  /**重置查询条件 */
-  const resetQuery = () => {
-    Data.Filter.name = ''
-    Data.Filter.province = ''
-    Data.pageInput.pageSize = 10
-    Data.pageInput.currentPage = 1
-  }
-  
-  /**重置 */
-  const onReset = () => {
-    resetQuery()
-    init()
-  }
+  <div class="layout-pd">
+    <el-row>
+      <!--操作-->
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="Data.Filter" @submit.stop.prevent>
+            <el-form-item prop="name" style="width: 100%">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="省份">
+                  <el-input v-model="Data.Filter.province" placeholder="请输入省份" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="油站名称">
+                  <el-input v-model="Data.Filter.name" placeholder="请输入加油站名称" clearable></el-input>
+                </el-form-item>
+              </el-col>
+            </el-form-item>
+          </el-form>
 
-    /**
- * 页条变化
- * @param val
- */
+          <hr>
+
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+          </el-row>
+        </el-card>
+      </el-col>
+      <!--表格-->
+      <el-col :xs="24">
+        <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
+          <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>
+          <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"
+              :total="Data.total" :page-sizes="[10, 20, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+
+</template>
+
+<script setup lang="ts" name="authorize/fuelingsdk">
+import { onMounted, reactive } 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";
+/**引入组件*/
+
+/**页面对象 */
+const Data = reactive({
+  time: '',
+  /**加载显示 */
+  loading: false,
+  /**条件查询模块 */
+  Filter: {
+    /**省份 */
+    province: "",
+    /**加油站名称 */
+    name: "",
+  } as gasStationFilterModel_SearchFilter,
+  /**表格信息 */
+  tableModel: [] as Array<gasStationFilterModel>,
+  /**动态表头 */
+  dynamicColumns: [
+    { prop: 'name', label: '油站名称' },
+    { prop: 'type', label: '油站类型' },
+    { prop: 'address', label: '油站地址' },
+    { prop: 'dispensersTotal', label: '油机数量' },
+    { prop: 'nozzleControlsTotal', label: '油枪数量' },
+  ],
+  /**分页标识 */
+  pageInput: {
+    currentPage: 1,
+    pageSize: 10,
+  } as PageInputgasStationFilterModel,
+  /**分页总数 */
+  total: 0,
+})
+
+/**初始化 */
+const init = async () => {
+  Data.loading = true
+  const res: any = await new gasStationApi().getPage({ ...Data.pageInput, filter: Data.Filter })
+  Data.tableModel = res?.data ?? []
+  Data.total = res?.length ?? 0
+  Data.loading = false
+}
+
+onMounted(() => {
+  init()
+})
+
+/**条件查询 */
+const onQuery = () => {
+  init()
+}
+
+/**重置查询条件 */
+const resetQuery = () => {
+  Data.Filter.name = ''
+  Data.Filter.province = ''
+  Data.pageInput.pageSize = 10
+  Data.pageInput.currentPage = 1
+}
+
+/**重置 */
+const onReset = () => {
+  resetQuery()
+  init()
+}
+
+/**
+* 页条变化
+* @param val
+*/
 const onSizeChange = (val: number) => {
   Data.pageInput.pageSize = val
   init()
@@ -143,18 +137,10 @@ const onCurrentChange = (val: number) => {
   Data.pageInput.currentPage = val
   init()
 }
-  
-  </script>
-  
-  <style scoped lang="scss">
-  .my-el-link {
-    font-size: 14px;
-  }
-  .el-form .el-col.mb20 {
-    margin: 0 !important;
-  }
-  .el-input, .el-select {
-    width: 240px;
-  }
-  </style>
-  
+
+</script>
+
+<style scoped lang="scss">
+@import '/@/theme/tableStyle.scss';
+
+</style>

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

@@ -4,7 +4,7 @@
       <!--操作-->
       <el-col :xs="24">
         <el-card class="mt8" shadow="hover">
-          <el-form :model="oilEngineData.filterModel" :inline="true" @submit.stop.prevent>
+          <el-form :model="oilEngineData.filterModel" @submit.stop.prevent>
             <el-form-item prop="name" style="width:100%">
               <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
                 <el-form-item label="油机号">
@@ -37,14 +37,18 @@
                   <!-- <el-input v-model="oilEngineData.filterModel.onlineStatus" placeholder="请输入在线状态" clearable></el-input> -->
                 </el-form-item>
               </el-col>
-              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                <el-form-item>
-                  <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                  <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                </el-form-item>
-              </el-col>
             </el-form-item>
           </el-form>
+
+          <hr>
+
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+                  <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+          </el-row>
         </el-card>
       </el-col>
       <!--列表-->
@@ -271,7 +275,5 @@ onBeforeMount(() => {
 </script>
 
 <style scoped lang="scss">
-.el-input, .el-select {
-  width: 240px;
-}
+@import '/@/theme/tableStyle.scss';
 </style>

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

@@ -90,10 +90,10 @@
                     </el-table>
                   </el-card>
                 </div>
-                <div class="bomConR-rig" style="padding-right: 0;">
+                <div class="bomConR-rig" style="padding-right: 0;"  >
                   <el-row :gutter="12">
                     <el-col :span="12" v-for="(item,index) in oilListData.list" v-bind:key="index" >
-                      <el-card v-loading="oilListData.loading" style="margin-bottom: 10px;width: 100%;">
+                      <el-card v-loading="oilListData.loading" style="margin-bottom: 10px;width: 100%;" @click="toParts(item.name,item.mainBoard_NozzleNo,item.onlineStatus,item.fuelName,item.alarming,item.code)">
                         <div class="oilInfo-con" style="padding: 0;">
                           <div class="oilInfo-item oilInfo-item-two">
                           <span>{{item.name}}</span>
@@ -300,6 +300,20 @@ onMounted(() => {
   init()
 })
 
+// 路由跳转 -- 部件信息图
+const toParts = ((name:any,NozzleNo:any,status:any,fuelName:any,alarming:any,code:any)=>{
+  router.push({
+    path:`/statement/partInformation`,
+    query:{
+      name:name,
+      NozzleNo:NozzleNo,
+      status:status,
+      fuelName:fuelName,
+      alarming:alarming,
+      code:code
+    }
+  })
+})
 /**********************************初始化***********************************/
 
 

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

@@ -0,0 +1,332 @@
+<template>
+    <div class="container">
+        <el-col class="main" :span="4">
+            <el-row justify="space-between">
+                <text>1、{{ parameter.status }}</text>
+                <text>2、{{ parameter.NozzleNo }}</text>
+            </el-row>
+            <el-row>
+                <text>油品：{{ parameter.fuelName }}</text>
+                <text>自锁功能: {{ parameter.alarming }}</text>
+                <text>ECQS编码: {{ parameter.code }}</text>
+            </el-row>
+        </el-col>
+        <el-col class="top" :span="5">
+            <el-row>
+                <text class="title">安全装置</text>
+            </el-row>
+            <el-row>
+                <text>二维码：{{ Data.partDetails.blackBox.qrCode }}</text>
+            </el-row>
+            <el-row>
+                <text>版本：{{ Data.partDetails.blackBox.swv }}</text>
+            </el-row>
+        </el-col>
+        <el-col class="bottom" :span="5">
+            <el-row>
+                <text class="title">计量器</text>
+            </el-row>
+            <el-row>
+                <text>序列号:</text>
+                <text>{{ Data.partDetails.meter.uuid }}</text>
+            </el-row>
+            <el-row>
+                <text>制造商:{{ Data.partDetails.meter.description }}</text>
+            </el-row>
+        </el-col>
+        <el-col class="left-top" :span="5">
+            <el-row>
+                <text class="title">计控主板</text>
+                <text class="statusBox">{{ Data.partDetails.calculatorMainboard.onlineStatus }}</text>
+            </el-row>
+            <el-row>
+                <text>校验ID:{{ Data.partDetails.calculatorMainboard.uuid }}</text>
+            </el-row>
+            <el-row>
+                <text>数字签名:{{ Data.partDetails.calculatorMainboard.signature }}</text>
+            </el-row>
+            <el-row>
+                <text>制造商:{{ Data.partDetails.calculatorMainboard.description }}</text>
+            </el-row>
+            <el-row>
+                <text>程序版本:{{ Data.partDetails.calculatorMainboard.swv }}</text>
+            </el-row>
+            <el-row>
+                <text>法制软件版本:{{ Data.partDetails.calculatorMainboard.Legalswv }}</text>
+            </el-row>
+            <el-row>
+                <text>法制软件标识:{{ Data.partDetails.calculatorMainboard.LegalSwvldentification }}</text>
+            </el-row>
+
+
+        </el-col>
+        <el-col class="left-bottom" :span="5">
+            <el-row>
+                <text class="title">油气回收控制主板</text>
+                <text class="statusBox">{{ Data.partDetails.vaporRecoveryControl.onlineStatus }}</text>
+            </el-row>
+            <el-row>
+                <text>校验ID:{{ Data.partDetails.vaporRecoveryControl.uuid }}</text>
+
+            </el-row>
+            <el-row>
+                <text>数字签名:{{ Data.partDetails.vaporRecoveryControl.signature }}</text>
+            </el-row>
+            <el-row>
+                <text>制造商:{{ Data.partDetails.vaporRecoveryControl.description }}</text>
+            </el-row>
+            <el-row>
+                <text>程序版本:{{ Data.partDetails.vaporRecoveryControl.swv }}</text>
+            </el-row>
+        </el-col>
+        <el-col class="right-top" :span="5">
+            <el-row>
+                <text class="title">监控微处理器</text>
+                <text class="statusBox">{{ 1 }}</text>
+            </el-row>
+            <el-row>
+                <text>校验ID:{{ 2 }}</text>
+            </el-row>
+            <el-row>
+                <text>数字签名:{{ 3 }}</text>
+            </el-row>
+            <el-row>
+                <text>制造商:{{ 4 }}</text>
+            </el-row>
+            <el-row>
+                <text>程序版本:{{ 5 }}</text>
+            </el-row>
+            <el-row>
+                <text>序列号:{{ 6 }}</text>
+            </el-row>
+            <el-row>
+                <text>法制软件版本:{{ 7 }}</text>
+            </el-row>
+            <el-row>
+                <text>法制软件标识:{{ 8 }}</text>
+            </el-row>
+        </el-col>
+        <el-col class="right" :span="5">
+            <el-row>
+                <text class="title">编码器</text>
+                <text class="statusBox">{{ Data.partDetails.encoderControls.onlineStatus }}</text>
+            </el-row>
+            <el-row>
+                <text>校验ID:{{ Data.partDetails.encoderControls.uuid }}</text>
+            </el-row>
+            <el-row>
+                <text>数字签名:{{ Data.partDetails.encoderControls.signature }}</text>
+            </el-row>
+            <el-row>
+                <text>制造商:{{ Data.partDetails.encoderControls.description }}</text>
+            </el-row>
+            <el-row>
+                <text>程序版本:{{ Data.partDetails.encoderControls.swv }}</text>
+            </el-row>
+            <el-row>
+                <text>序列号:{{ Data.partDetails.encoderControls.sn }}</text>
+            </el-row>
+            <el-row>
+                <text>法制软件版本:{{ Data.partDetails.encoderControls.Legalswv }}</text>
+            </el-row>
+            <el-row>
+                <text>法制软件标识:{{ Data.partDetails.encoderControls.LegalSwvldentification }}</text>
+            </el-row>
+        </el-col>
+        <el-col class="right-bottom" :span="5">
+            <el-row>
+                <text class="title">加密显示屏</text>
+                <text class="statusBox">{{ Data.partDetails.displayControls.onlineStatus }}</text>
+            </el-row>
+            <el-row>
+                <text>制造商：{{ Data.partDetails.displayControls.description }}</text>
+            </el-row>
+            <el-row>
+                <text>序列号：{{ Data.partDetails.displayControls.uuid }}</text>
+            </el-row>
+        </el-col>
+    </div>
+
+</template>
+
+<script setup lang="ts" name="">
+import { onMounted, reactive, ref } from 'vue';
+import { useRoute } from 'vue-router';
+import { partsFilterModel } from "/@/api/admin/reportManagement/partInformation/partInformationDto";
+import { partInformationApi } from "/@/api/admin/reportManagement/partInformation/partInformationApi";
+
+
+const router = useRoute()
+// 中间内容 - 传值
+const parameter = reactive({
+    name: '',
+    NozzleNo: '',
+    status: '',
+    fuelName: '',
+    alarming: '',
+    code: ''
+} as any)
+parameter.name = router.query.name
+parameter.NozzleNo = router.query.NozzleNo
+parameter.status = router.query.status
+parameter.fuelName = router.query.fuelName
+parameter.alarming = router.query.alarming
+parameter.code = router.query.code
+
+const Data = reactive({
+    partDetails: {
+        calculatorMainboard: {
+            /**在线状态*/
+            onlineStatus: '',
+            /**校验1D*/
+            uuid: '',
+            /**数字签名 */
+            signature: '',
+            /**制造商*/
+            description: '',
+            /**程序版本 */
+            swv: '',
+            /**法制软件 */
+            Legalswv: '',
+            /**法制软件标识 */
+            LegalSwvldentification: ''
+        },
+        /**编码器 */
+        encoderControls: {
+            /**在线状态*/
+            onlineStatus: '',
+            /**校验id*/
+            uuid: '',
+            /**数字签名 */
+            signature: '',
+            /**制造商*/
+            description: '',
+            /**程序版本 */
+            swv: '',
+            /**序列号 */
+            sn: '',
+            /**法制软件 */
+            Legalswv: '',
+            /**法制软件标识 */
+            LegalSwvldentification: ''
+        },
+        /**加密显示屏 */
+        displayControls: {
+            /**在线状态*/
+            onlineStatus: '',
+            /**序列号*/
+            uuid: '',
+            /**制造商*/
+            description: ''
+        },
+        /**油气回收控制主板 */
+        vaporRecoveryControl: {
+            /**在线状态*/
+            onlineStatus: '',
+            /**校验id*/
+            uuid: '',
+            /**数字签名 */
+            signature: '',
+            /**制造商*/
+            description: '',
+            /**程序版本 */
+            swv: ''
+        },
+        /**安全装置 */
+        blackBox: {
+            /**二维码*/
+            qrCode: '',
+            /**版本*/
+            swv: '',
+        },
+        /**计量器 */
+        meter: {
+            /**序列号*/
+            uuid: '',
+            /**制造商*/
+            description: ''
+        },
+    } as partsFilterModel
+})
+
+const init = async () => {
+    const res: any = await new partInformationApi().getData({ "id": parameter.name })
+    Data.partDetails = res?.data??{} as partsFilterModel
+    console.log(Data.partDetails)
+}
+
+onMounted(() => {
+    init()
+})
+
+</script>
+
+<style scoped lang="scss">
+.container {
+    height: 100%;
+    width: 100%;
+    background-image: url('/@/assets/deviceVision/parts.png');
+    background-size: 100% 100%;
+    position: relative;
+    font-size: 18px;
+}
+
+.title {
+    font-weight: 600;
+}
+
+.main {
+    position: absolute;
+    top: 40%;
+    left: 40%;
+}
+
+.top {
+    position: absolute;
+    top: 8%;
+    left: 40%;
+}
+
+.bottom {
+    position: absolute;
+    top: 78%;
+    left: 40%;
+}
+
+.left-top {
+    position: absolute;
+    top: 19%;
+    left: 7%;
+}
+
+.left-bottom {
+    position: absolute;
+    top: 60%;
+    left: 7%;
+}
+
+.right-top {
+    position: absolute;
+    top: 10%;
+    left: 70%;
+}
+
+.right {
+    position: absolute;
+    top: 43%;
+    left: 70%;
+}
+
+.right-bottom {
+    position: absolute;
+    top: 77%;
+    left: 70%;
+}
+.statusBox{
+    margin-left: 10px;
+    color:greenyellow
+}
+.el-row{
+    margin-bottom: 5px;
+}
+</style>

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

@@ -1,175 +1,169 @@
 <template>
-    <div class="layout-pd" >
-      <el-row>
-        <!--操作-->
-        <el-col :xs="24" >
-          <el-card class="mt8"  shadow="hover" >
-            <el-form :model="Data.Filter" :inline="true" @submit.stop.prevent>
-              <el-form-item prop="name" style="width: 100%">
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="序列号">
-                    <el-input v-model="Data.Filter.sn"  placeholder="请输入序列号" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="在线状态">
-                    <el-select  v-model="Data.Filter.onlineStatus" placeholder="请选择在线状态" >
-                        <el-option v-for="(value, key) in selectList.Online" :key="key" :label="value"  :value="key" />
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="设备状态">
-                    <el-select  v-model="Data.Filter.deviceStatus" placeholder="请选择设备状态" >
-                        <el-option v-for="(value, key) in selectList.Device" :key="key" :label="value"  :value="key" />
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="设备报警级别">
-                    <el-select  v-model="Data.Filter.deviceAlarmLevel" placeholder="请选择报警级别" >
-                        <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="4" class="mb20">
-                  <el-form-item>
-                    <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                    <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                  </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-form>
-          </el-card>
-        </el-col>
-        <!--表格-->
-        <el-col  :xs="24" >
-          <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-            <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>
-            <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"
-                :total="Data.total"
-                :page-sizes="[5, 10, 20, 50, 100]"
-                small
-                background
-                @size-change="onSizeChange"
-                @current-change="onCurrentChange"
-                layout="total, sizes, prev, pager, next, jumper"
-              />
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </div>
-  </template>
-  
-  <script setup lang="ts" name="partsManagement/encScreen">
-  import {onMounted, reactive,ref,watch} from "vue";
-  import {encScreenFilterModel_SearchFilter, encScreenFilterModel, PageInputEncScreenFilterModel} from "/@/api/admin/reportManagement/encScreen/encScreenDto";
-  import {encScreenApi} from "/@/api/admin/reportManagement/encScreen/encScreenApi";
-  
-  /** 页面对象 */
-  const Data = reactive({
-    /**加载显示 */
-    loading: false,
-    /**条件查询模块 */
-    Filter:{
-      /**设备类型 */
-      deviceType:"DisplayControls",
-      /**在线状态 */
-      onlineStatus:"",
-      /**设备状态 */
-      deviceStatus:"",
-      /**序列号 */
-      sn:"",
-      /**设备报警级别 */
-      deviceAlarmLevel:""
-    } as encScreenFilterModel_SearchFilter,
-    /**表格信息 */
-    tableModel: [] as Array<encScreenFilterModel>,
-    /**动态表头 */
-    dynamicColumns: [
-      { 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: '出厂时间' },
-    ],
-    /**分页标识 */
-    pageInput:{
-      CurrentPage: 1,
-      PageSize: 10,
-    } as PageInputEncScreenFilterModel,
-    /**分页总数 */
-    total: 0,
-  } )
-
-    /** 选择框列表 */
-  const selectList = reactive({
-  Online : ["在线","离线"],
-  Device : [
-  "启用",
-  "备案",
-  "维修",
-  "出厂注册"],
-  Level :[1,2,3,4,5]
+  <div class="layout-pd">
+    <el-row>
+      <!--操作-->
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="Data.Filter"  @submit.stop.prevent>
+            <el-form-item prop="name" style="width: 100%">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="序列号">
+                  <el-input v-model="Data.Filter.sn" placeholder="请输入序列号" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="在线状态">
+                  <el-select v-model="Data.Filter.onlineStatus" placeholder="请选择在线状态">
+                    <el-option v-for="(value, key) in selectList.Online" :key="key" :label="value" :value="key" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="设备状态">
+                  <el-select v-model="Data.Filter.deviceStatus" placeholder="请选择设备状态">
+                    <el-option v-for="(value, key) in selectList.Device" :key="key" :label="value" :value="key" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="报警级别">
+                  <el-select v-model="Data.Filter.deviceAlarmLevel" placeholder="请选择报警级别">
+                    <el-option v-for="(value, key) in selectList.Level" :key="key" :label="value" :value="key" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-form-item>
+          </el-form>
 
+          <hr>
+
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+          </el-row>
+        </el-card>
+      </el-col>
+      <!--表格-->
+      <el-col :xs="24">
+        <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
+          <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>
+          <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"
+              :total="Data.total" :page-sizes="[5, 10, 20, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup lang="ts" name="partsManagement/encScreen">
+import { onMounted, reactive, ref, watch } from "vue";
+import { encScreenFilterModel_SearchFilter, encScreenFilterModel, PageInputEncScreenFilterModel } from "/@/api/admin/reportManagement/encScreen/encScreenDto";
+import { encScreenApi } from "/@/api/admin/reportManagement/encScreen/encScreenApi";
+
+/** 页面对象 */
+const Data = reactive({
+  /**加载显示 */
+  loading: false,
+  /**条件查询模块 */
+  Filter: {
+    /**设备类型 */
+    deviceType: "DisplayControls",
+    /**在线状态 */
+    onlineStatus: "",
+    /**设备状态 */
+    deviceStatus: "",
+    /**序列号 */
+    sn: "",
+    /**设备报警级别 */
+    deviceAlarmLevel: ""
+  } as encScreenFilterModel_SearchFilter,
+  /**表格信息 */
+  tableModel: [] as Array<encScreenFilterModel>,
+  /**动态表头 */
+  dynamicColumns: [
+    { 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: '出厂时间' },
+  ],
+  /**分页标识 */
+  pageInput: {
+    CurrentPage: 1,
+    PageSize: 10,
+  } as PageInputEncScreenFilterModel,
+  /**分页总数 */
+  total: 0,
 })
-  
-  /**初始化 */
-  const init = async () => {
-    Data.loading = true
-    const res:any = await new encScreenApi().getPage({...Data.pageInput, filter:Data.Filter}).catch(() => {
-      Data.loading = false
-    })
-    Data.tableModel = res?.data ?? []
-    Data.total = res?.data?.length ?? 0
+
+/** 选择框列表 */
+const selectList = reactive({
+  Online: ["在线", "离线"],
+  Device: [
+    "启用",
+    "备案",
+    "维修",
+    "出厂注册"],
+  Level: [1, 2, 3, 4, 5]
+
+})
+
+/**初始化 */
+const init = async () => {
+  Data.loading = true
+  const res: any = await new encScreenApi().getPage({ ...Data.pageInput, filter: Data.Filter }).catch(() => {
     Data.loading = false
-  }
-  
-  onMounted(() => {
-    init()
   })
-  
-  /**条件查询 */
-  const onQuery = () => {
-    init()
-  }
-  
-  /**重置查询条件 */
-  const resetQuery = () => {
-    Data.Filter.onlineStatus = ''
-    Data.Filter.deviceStatus = ''
-    Data.Filter.sn = ''
-    Data.Filter.deviceAlarmLevel = ''
-    Data.pageInput.CurrentPage = 1
-    Data.pageInput.PageSize = 10
-  }
-  
-  /**重置 */
-  const onReset = () => {
-    resetQuery()
-    init()
-  }
-
-    /**
- * 页条变化
- * @param val
- */
+  Data.tableModel = res?.data ?? []
+  Data.total = res?.data?.length ?? 0
+  Data.loading = false
+}
+
+onMounted(() => {
+  init()
+})
+
+/**条件查询 */
+const onQuery = () => {
+  init()
+}
+
+/**重置查询条件 */
+const resetQuery = () => {
+  Data.Filter.onlineStatus = ''
+  Data.Filter.deviceStatus = ''
+  Data.Filter.sn = ''
+  Data.Filter.deviceAlarmLevel = ''
+  Data.pageInput.CurrentPage = 1
+  Data.pageInput.PageSize = 10
+}
+
+/**重置 */
+const onReset = () => {
+  resetQuery()
+  init()
+}
+
+/**
+* 页条变化
+* @param val
+*/
 const onSizeChange = (val: number) => {
   Data.pageInput.PageSize = val
   init()
@@ -183,18 +177,10 @@ const onCurrentChange = (val: number) => {
   Data.pageInput.CurrentPage = val
   init()
 }
- 
-  </script>
-  
-  <style scoped lang="scss">
-  .my-el-link {
-    font-size: 14px;
-  }
-  .el-form .el-col.mb20 {
-    margin: 0 !important;
-  }
-  .el-input, .el-select {
-    width: 240px;
-  }
-  </style>
-  
+
+</script>
+
+<style scoped lang="scss">
+@import '/@/theme/tableStyle.scss';
+
+</style>

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

@@ -1,178 +1,169 @@
 <template>
-    <div class="layout-pd" >
-      <el-row>
-        <!--操作-->
-        <el-col :xs="24" >
-          <el-card class="mt8"  shadow="hover" >
-            <el-form :model="Data.Filter" :inline="true" @submit.stop.prevent>
-              <el-form-item prop="name" style="width: 100%">
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="序列号">
-                    <el-input v-model="Data.Filter.sn"  placeholder="请输入序列号" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="在线状态">
-                    <el-select  v-model="Data.Filter.onlineStatus" placeholder="请选择在线状态" >
-                        <el-option v-for="(value, key) in selectList.Online" :key="key" :label="value"  :value="key" />
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="设备状态">
-                    <el-select  v-model="Data.Filter.deviceStatus" placeholder="请选择设备状态" >
-                        <el-option v-for="(value, key) in selectList.Device" :key="key" :label="value"  :value="key" />
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="设备报警级别">
-                    <el-select  v-model="Data.Filter.deviceAlarmLevel" placeholder="请选择报警级别" >
-                        <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="4" class="mb20">
-                  <el-form-item>
-                    <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                    <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                  </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-form>
-          </el-card>
-        </el-col>
-        <!--表格-->
-        <el-col  :xs="24" >
-          <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-            <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>
-            <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"
-                :total="Data.total"
-                :page-sizes="[5, 10, 20, 50, 100]"
-                small
-                background
-                @size-change="onSizeChange"
-                @current-change="onCurrentChange"
-                layout="total, sizes, prev, pager, next, jumper"
-              />
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </div>
-  
-  </template>
-  
-  <script setup lang="ts" name="partsManagement/encoder">
-  import {onMounted, reactive, ref, watch} from "vue";
-  import {encoderFilterModel_SearchFilter, encoderFilterModel, PageInputEncoderFilterModel} from "/@/api/admin/reportManagement/encoder/encoderDto";
-  import {encoderApi} from "/@/api/admin/reportManagement/encoder/encoderApi";
-
-  /** 页面对象 */
-  const Data = reactive({
-
-    /**加载显示 */
-    loading: false,
-    /**条件查询模块 */
-    Filter:{
-      /**设备类型 */
-      deviceType:"encoderControls",
-      /**在线状态 */
-      onlineStatus:"",
-      /**设备状态 */
-      deviceStatus:"",
-      /**序列号 */
-      sn:"",
-      /**设备报警级别 */
-      deviceAlarmLevel:""
-    } as encoderFilterModel_SearchFilter,
-
-    /**表格信息 */
-    tableModel: [] as Array<encoderFilterModel>,
-    /**动态表头 */
-    dynamicColumns: [
-      { 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: '出厂时间' },
-    ],
-    /**分页标识 */
-    pageInput:{
-      CurrentPage: 1,
-      PageSize: 10,
-    } as PageInputEncoderFilterModel,
-    /**分页总数 */
-    total: 0,
-  } )
+  <div class="layout-pd">
+    <el-row>
+      <!--操作-->
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="Data.Filter" @submit.stop.prevent>
+            <el-form-item prop="name" style="width: 100%">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="序列号">
+                  <el-input v-model="Data.Filter.sn" placeholder="请输入序列号" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="在线状态">
+                  <el-select v-model="Data.Filter.onlineStatus" placeholder="请选择在线状态">
+                    <el-option v-for="(value, key) in selectList.Online" :key="key" :label="value" :value="key" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="设备状态">
+                  <el-select v-model="Data.Filter.deviceStatus" placeholder="请选择设备状态">
+                    <el-option v-for="(value, key) in selectList.Device" :key="key" :label="value" :value="key" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="报警级别">
+                  <el-select v-model="Data.Filter.deviceAlarmLevel" placeholder="请选择报警级别">
+                    <el-option v-for="(value, key) in selectList.Level" :key="key" :label="value" :value="key" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-form-item>
+          </el-form>
+
+          <hr>
+
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+          </el-row>
+        </el-card>
+      </el-col>
+      <!--表格-->
+      <el-col :xs="24">
+        <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
+          <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>
+          <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"
+              :total="Data.total" :page-sizes="[5, 10, 20, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+
+</template>
+
+<script setup lang="ts" name="partsManagement/encoder">
+import { onMounted, reactive, ref, watch } from "vue";
+import { encoderFilterModel_SearchFilter, encoderFilterModel, PageInputEncoderFilterModel } from "/@/api/admin/reportManagement/encoder/encoderDto";
+import { encoderApi } from "/@/api/admin/reportManagement/encoder/encoderApi";
+
+/** 页面对象 */
+const Data = reactive({
+
+  /**加载显示 */
+  loading: false,
+  /**条件查询模块 */
+  Filter: {
+    /**设备类型 */
+    deviceType: "encoderControls",
+    /**在线状态 */
+    onlineStatus: "",
+    /**设备状态 */
+    deviceStatus: "",
+    /**序列号 */
+    sn: "",
+    /**设备报警级别 */
+    deviceAlarmLevel: ""
+  } as encoderFilterModel_SearchFilter,
+
+  /**表格信息 */
+  tableModel: [] as Array<encoderFilterModel>,
+  /**动态表头 */
+  dynamicColumns: [
+    { 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: '出厂时间' },
+  ],
+  /**分页标识 */
+  pageInput: {
+    CurrentPage: 1,
+    PageSize: 10,
+  } as PageInputEncoderFilterModel,
+  /**分页总数 */
+  total: 0,
+})
 /** 选择框列表 */
 const selectList = reactive({
-  Online : ["在线","离线"],
-  Device : [
-  "启用",
-  "备案",
-  "维修",
-  "出厂注册"],
-  Level :[1,2,3,4,5]
+  Online: ["在线", "离线"],
+  Device: [
+    "启用",
+    "备案",
+    "维修",
+    "出厂注册"],
+  Level: [1, 2, 3, 4, 5]
+})
 
+onMounted(() => {
+  init()
 })
 
+/**初始化 */
+const init = async () => {
+  Data.loading = true
+  const res: any = await new encoderApi().getPage({ ...Data.pageInput, filter: Data.Filter })
+  Data.tableModel = res?.data ?? []
+  Data.total = res?.data?.length ?? 0
+  Data.loading = false
 
+}
 
-onMounted(() => {
-    init()
-})
-  
-  /**初始化 */
-  const init = async () => {
-    Data.loading = true
-    const res:any = await new encoderApi().getPage({...Data.pageInput, filter:Data.Filter})
-    Data.tableModel = res?.data ?? []
-    Data.total = res?.data?.length ?? 0
-    Data.loading = false
-
-  }
-
-  /**条件查询 */
-  const onQuery = () => {
-    init()
-  }
-  /**重置查询条件 */
-  const resetQuery = () => {
-    Data.Filter.onlineStatus = ''
-    Data.Filter.deviceStatus = ''
-    Data.Filter.sn = ''
-    Data.Filter.deviceAlarmLevel = ''
-    Data.pageInput.PageSize = 10
-    Data.pageInput.CurrentPage = 1
-  }
-
-  /**重置 */
-  const onReset = () => {
-    resetQuery()
-    init()
-  }
-
-  /**
- * 页条变化
- * @param val
- */
- const onSizeChange = (val: number) => {
+/**条件查询 */
+const onQuery = () => {
+  init()
+}
+/**重置查询条件 */
+const resetQuery = () => {
+  Data.Filter.onlineStatus = ''
+  Data.Filter.deviceStatus = ''
+  Data.Filter.sn = ''
+  Data.Filter.deviceAlarmLevel = ''
+  Data.pageInput.PageSize = 10
+  Data.pageInput.CurrentPage = 1
+}
+
+/**重置 */
+const onReset = () => {
+  resetQuery()
+  init()
+}
+
+/**
+* 页条变化
+* @param val
+*/
+const onSizeChange = (val: number) => {
   Data.pageInput.PageSize = val
   onQuery()
 }
@@ -184,32 +175,24 @@ onMounted(() => {
 const onCurrentChange = (val: number) => {
   Data.pageInput.CurrentPage = val
   onQuery()
-} 
-  
-  /**
-   * 监听时间变换
-   */
-  // 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]
-  // })
-  
-  </script>
-  
-  <style scoped lang="scss">
-  .my-el-link {
-    font-size: 14px;
-  }
-  .el-form .el-col.mb20 {
-    margin: 0 !important;
-  }
-  .el-input, .el-select {
-    width: 240px;
-  }
-  </style>
-  
+}
+
+/**
+ * 监听时间变换
+ */
+// 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]
+// })
+
+</script>
+
+<style scoped lang="scss">
+@import '/@/theme/tableStyle.scss';
+
+</style>

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

@@ -1,204 +1,190 @@
 <template>
-    <div class="layout-pd" >
-      <el-row>
-        <!--操作-->
-        <el-col :xs="24" >
-          <el-card class="mt8"  shadow="hover" >
-            <el-form :model="Data.Filter" :inline="true" @submit.stop.prevent>
-              <el-form-item prop="name" style="width: 100%">
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="序列号">
-                    <el-input v-model="Data.Filter.sn"  placeholder="请输入序列号" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="在线状态">
-                    <el-select  v-model="Data.Filter.onlineStatus" placeholder="请选择在线状态" >
-                        <el-option v-for="(value, key) in selectList.Online" :key="key" :label="value"  :value="key" />
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="设备状态">
-                    <el-select  v-model="Data.Filter.deviceStatus" placeholder="请选择设备状态" >
-                        <el-option v-for="(value, key) in selectList.Device" :key="key" :label="value"  :value="key" />
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="设备报警级别">
-                    <el-select  v-model="Data.Filter.deviceAlarmLevel" placeholder="请选择报警级别" >
-                        <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="4" class="mb20">
-                  <el-form-item>
-                    <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                    <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                  </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-form>
-          </el-card>
-        </el-col>
-        <!--表格-->
-        <el-col  :xs="24" >
-          <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-            <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>
-            <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"
-                :total="Data.total"
-                :page-sizes="[5, 10, 20, 50, 100]"
-                small
-                background
-                @size-change="onSizeChange"
-                @current-change="onCurrentChange"
-                layout="total, sizes, prev, pager, next, jumper"
-              />
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </div>
-  
-  </template>
-  
-  <script setup lang="ts" name="">
-  import {onMounted, reactive,watch} from "vue";
-  import {monitorCpuFilterModel_SearchFilter, monitorCpuFilterModel, PageInputMonitorCpuFilterModel} from "/@/api/admin/reportManagement/monitorCpu/monitorCpuDto";
-  import {monitorCpuApi} from "/@/api/admin/reportManagement/monitorCpu/monitorCpuApi";
-  import { ref } from "vue";
-  
-  /** 对象 */
-  const Data = reactive({
-    /**加载显示 */
-    loading: false,
-    /**条件查询模块 */
-    Filter:{
-      /**设备类型 */
-      deviceType:"monitoring",
-      /**在线状态 */
-      onlineStatus:"",
-      /**设备状态 */
-      deviceStatus:"",
-      /**序列号 */
-      sn:"",
-      /**设备报警级别 */
-      deviceAlarmLevel:""
-    }  as monitorCpuFilterModel_SearchFilter,
-    /**表格信息 */
-    tableModel: [] as Array<monitorCpuFilterModel>,
-    /**动态表头 */
-    dynamicColumns: [
-      { 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: '出厂时间' },
-    ],
-    /**分页标识 */
-    pageInput:{
-      CurrentPage: 1,
-      PageSize: 10,
-    } as PageInputMonitorCpuFilterModel,
-    /**分页总数 */
-    total: 0,
-  } )
-      /** 选择框列表 */
-  const selectList = reactive({
-  Online : ["在线","离线"],
-  Device : [
-  "启用",
-  "备案",
-  "维修",
-  "出厂注册"],
-  Level :[1,2,3,4,5]
+  <div class="layout-pd">
+    <el-row>
+      <!--操作-->
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="Data.Filter" @submit.stop.prevent>
+            <el-form-item prop="name" style="width: 100%">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="序列号">
+                  <el-input v-model="Data.Filter.sn" placeholder="请输入序列号" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="在线状态">
+                  <el-select v-model="Data.Filter.onlineStatus" placeholder="请选择在线状态">
+                    <el-option v-for="(value, key) in selectList.Online" :key="key" :label="value" :value="key" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="设备状态">
+                  <el-select v-model="Data.Filter.deviceStatus" placeholder="请选择设备状态">
+                    <el-option v-for="(value, key) in selectList.Device" :key="key" :label="value" :value="key" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="报警级别">
+                  <el-select v-model="Data.Filter.deviceAlarmLevel" placeholder="请选择报警级别">
+                    <el-option v-for="(value, key) in selectList.Level" :key="key" :label="value" :value="key" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-form-item>
+          </el-form>
 
+          <hr>
+
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+          </el-row>
+        </el-card>
+      </el-col>
+      <!--表格-->
+      <el-col :xs="24">
+        <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
+          <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>
+          <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"
+              :total="Data.total" :page-sizes="[5, 10, 20, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+
+</template>
+
+<script setup lang="ts" name="">
+import { onMounted, reactive, watch } from "vue";
+import { monitorCpuFilterModel_SearchFilter, monitorCpuFilterModel, PageInputMonitorCpuFilterModel } from "/@/api/admin/reportManagement/monitorCpu/monitorCpuDto";
+import { monitorCpuApi } from "/@/api/admin/reportManagement/monitorCpu/monitorCpuApi";
+import { ref } from "vue";
+
+/** 对象 */
+const Data = reactive({
+  /**加载显示 */
+  loading: false,
+  /**条件查询模块 */
+  Filter: {
+    /**设备类型 */
+    deviceType: "monitoring",
+    /**在线状态 */
+    onlineStatus: "",
+    /**设备状态 */
+    deviceStatus: "",
+    /**序列号 */
+    sn: "",
+    /**设备报警级别 */
+    deviceAlarmLevel: ""
+  } as monitorCpuFilterModel_SearchFilter,
+  /**表格信息 */
+  tableModel: [] as Array<monitorCpuFilterModel>,
+  /**动态表头 */
+  dynamicColumns: [
+    { 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: '出厂时间' },
+  ],
+  /**分页标识 */
+  pageInput: {
+    CurrentPage: 1,
+    PageSize: 10,
+  } as PageInputMonitorCpuFilterModel,
+  /**分页总数 */
+  total: 0,
 })
+/** 选择框列表 */
+const selectList = reactive({
+  Online: ["在线", "离线"],
+  Device: [
+    "启用",
+    "备案",
+    "维修",
+    "出厂注册"],
+  Level: [1, 2, 3, 4, 5]
 
+})
 
-  /**初始化 */
-  const init = async () => {
-    Data.loading = true
-    const res:any = await new monitorCpuApi().getPage({...Data.pageInput, filter: Data.Filter}).catch(() => {
-      Data.loading = false
-    })
-    Data.tableModel = res?.data ?? []
-    Data.total = res?.data?.length ?? 0
-    Data.loading = false
 
-  }
-  
-  onMounted(() => {
-    init()
+/**初始化 */
+const init = async () => {
+  Data.loading = true
+  const res: any = await new monitorCpuApi().getPage({ ...Data.pageInput, filter: Data.Filter }).catch(() => {
+    Data.loading = false
   })
+  Data.tableModel = res?.data ?? []
+  Data.total = res?.data?.length ?? 0
+  Data.loading = false
+
+}
+
+onMounted(() => {
+  init()
+})
+
+
+/**条件查询 */
+const onQuery = () => {
+  init()
+}
+
+/**重置查询条件 */
+const resetQuery = () => {
+  Data.Filter.onlineStatus = ''
+  Data.Filter.deviceStatus = ''
+  Data.Filter.sn = ''
+  Data.Filter.deviceAlarmLevel = ''
+  Data.pageInput.CurrentPage = 1
+  Data.pageInput.PageSize = 10
+}
+
+/**重置 */
+const onReset = () => {
+  resetQuery()
+  init()
+}
+
+/**
+ * 页条变化
+ * @param val
+ */
+const onSizeChange = (val: number) => {
+  Data.pageInput.PageSize = val
+  init()
+}
+
+/**
+ * 页数 变化
+ * @param val
+ */
+const onCurrentChange = (val: number) => {
+  Data.pageInput.CurrentPage = val
+  init()
+}
+
+</script>
+
+<style scoped lang="scss">
+@import '/@/theme/tableStyle.scss';
 
-  
-  /**条件查询 */
-  const onQuery = () => {
-    init()
-  }
-  
-  /**重置查询条件 */
-  const resetQuery = () => {
-    Data.Filter.onlineStatus = ''
-    Data.Filter.deviceStatus = ''
-    Data.Filter.sn = ''
-    Data.Filter.deviceAlarmLevel = ''
-    Data.pageInput.CurrentPage = 1
-    Data.pageInput.PageSize = 10
-  }
-  
-  /**重置 */
-  const onReset = () => {
-    resetQuery()
-    init()
-  }
-
-  /**
-   * 页条变化
-   * @param val
-   */
-  const onSizeChange = (val: number) => {
-    Data.pageInput.PageSize = val
-    init()
-  }
-
-  /**
-   * 页数 变化
-   * @param val
-   */
-  const onCurrentChange = (val: number) => {
-    Data.pageInput.CurrentPage = val
-    init()
-  }
-
-  </script>
-  
-  <style scoped lang="scss">
-  .my-el-link {
-    font-size: 14px;
-  }
-  .el-form .el-col.mb20 {
-    margin: 0 !important;
-  }
-  .el-input, .el-select {
-    width: 240px;
-  }
-  </style>
-  
+</style>

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

@@ -1,153 +1,140 @@
 <template>
-    <div class="layout-pd" >
-      <el-row>
-        <!--操作-->
-        <el-col :xs="24" >
-          <el-card class="mt8"  shadow="hover" >
-            <el-form :model="Data.Filter" :inline="true" @submit.stop.prevent>
-              <el-form-item prop="name" style="width: 100%">
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="石油公司">
-                    <el-input v-model="Data.Filter.CompanyName"  placeholder="请输入石油公司" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="油枪号">
-                    <el-input v-model="Data.Filter.name"  placeholder="请输入油枪号" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="加油站名称">
-                    <el-input v-model="Data.Filter.StationName" placeholder="请输入加油站名称" clearable></el-input>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item label="在线状态">
-                    <el-select  v-model="Data.Filter.onlineStatus" placeholder="请选择在线状态" >
-                        <el-option v-for="(value, key) in selectList.Online" :key="key" :label="value"  :value="value" />
-                    </el-select>
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="12" :xl="4" class="mb20">
-                  <el-form-item label="出厂时间">
-                    <el-date-picker
-                      v-model="Data.time1"
-                      type="datetimerange"
-                      value-format="YYYY-MM-DD HH:mm:ss"
-                      range-separator="To"
-                      start-placeholder="Start date"
-                      end-placeholder="End date"
-                    />
-                  </el-form-item>
-                </el-col>
-                <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
-                  <el-form-item>
-                    <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
-                    <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
-                  </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-form>
-          </el-card>
-        </el-col>
-        <!--表格-->
-        <el-col  :xs="24" >
-          <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
-            <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>
-            <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"
-                :total="Data.total"
-                :page-sizes="[5, 10, 20, 50, 100]"
-                small
-                background
-                @size-change="onSizeChange"
-                @current-change="onCurrentChange"
-                layout="total, sizes, prev, pager, next, jumper"
-              />
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </div>
-  
-  </template>
-  
-  <script setup lang="ts" name="partsManagement/oilGun">
-  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";
-
-  
-  /**页面对象 */
-  const Data = reactive({
-    time1:'',
-    /** 选择框列表 */
-    statusList : [] as any,
-    supplierList : [] as any,
-    /**加载显示 */
-    loading: false,
-    /**条件查询模块 */
-    Filter: {
-      /**油枪号 */
-      name:"",
-      /**加油站名称 */
-      StationName: "",
-      /**石油公司 */
-      CompanyName: "",
-      /**在线状态 */
-      onlineStatus:"",
-      /**出厂开始的时间 */
-      OutBeginTime: "",
-      /**出厂结束的时间 */
-      OutEndTime: "",
-    } as oilGunFilterModel_SearchFilter,
-    /**表格信息 */
-    tableModel: [] as Array<oilGunFilterModel>,
-    /**动态表头 */
-    dynamicColumns: [
-      { prop: 'name', label: '油枪号' },
-      { prop: 'companyName', label: '石油公司' },
-      { prop: 'stationName', label: '加油站名称' },
-      { prop: 'fuelName', label: '油品' },
-      { prop: 'code', label: '编码' },
-      { prop: 'alarming', label: '自锁' },
-      { prop: 'fuelId', label: '油机号' },
-      { prop: 'supplierName', label: '加油机厂商' },
-      { prop: 'onlineStatus', label: '在线状态' },
-      { prop: 'cheatStatus', label: '作弊状态' },
-      { prop: 'monitoringUUID', label: '监控微处理器编号' },
-      { prop: 'displayControlsUUID', label: '加密显示屏编号' },
-      { prop: 'encoderControlsUUID', label: '编码器编号' },
-      { prop: 'productTime', label: '出厂时间' },
-      { prop: 'soldTime', label: '安装时间' },
-    ],
-    /**分页总数 */
-    total: 0,
-    /**分页标识 */
-    pageInput:{
-      currentPage: 1,
-      pageSize: 10,
-    } as PageInputoilGunFilterModel,
-    })
+  <div class="layout-pd">
+    <el-row>
+      <!--操作-->
+      <el-col :xs="24">
+        <el-card class="mt8" shadow="hover">
+          <el-form :model="Data.Filter"  @submit.stop.prevent>
+            <el-form-item prop="name" style="width: 100%" >
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="石油公司">
+                  <el-input v-model="Data.Filter.CompanyName" placeholder="请输入石油公司" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="油枪号">
+                  <el-input v-model="Data.Filter.name" placeholder="请输入油枪号" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="加油站">
+                  <el-input v-model="Data.Filter.StationName" placeholder="请输入加油站名称" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="在线状态">
+                  <el-select v-model="Data.Filter.onlineStatus" placeholder="请选择在线状态">
+                    <el-option v-for="(value, key) in selectList.Online" :key="key" :label="value" :value="value" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
+                <el-form-item label="出厂时间">
+                  <el-date-picker v-model="Data.time1" type="datetimerange" value-format="YYYY-MM-DD HH:mm:ss"
+                    range-separator="To" start-placeholder="Start date" end-placeholder="End date" />
+                </el-form-item>
+              </el-col>
+            </el-form-item>
+          </el-form>
+          
+          <hr>
+          
+          <!-- 按钮 -->
+          <el-row justify="space-between" class="submit-button">
+            <el-row>
+              <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
+              <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
+            </el-row>
+          </el-row>
+        </el-card>
+      </el-col>
+      <!--表格-->
+      <el-col :xs="24">
+        <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
+          <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>
+          <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"
+              :total="Data.total" :page-sizes="[5, 10, 20, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+
+</template>
+
+<script setup lang="ts" name="partsManagement/oilGun">
+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";
+
+
+/**页面对象 */
+const Data = reactive({
+  time1: '',
+  /** 选择框列表 */
+  statusList: [] as any,
+  supplierList: [] as any,
+  /**加载显示 */
+  loading: false,
+  /**条件查询模块 */
+  Filter: {
+    /**油枪号 */
+    name: "",
+    /**加油站名称 */
+    StationName: "",
+    /**石油公司 */
+    CompanyName: "",
+    /**在线状态 */
+    onlineStatus: "",
+    /**出厂开始的时间 */
+    OutBeginTime: "",
+    /**出厂结束的时间 */
+    OutEndTime: "",
+  } as oilGunFilterModel_SearchFilter,
+  /**表格信息 */
+  tableModel: [] as Array<oilGunFilterModel>,
+  /**动态表头 */
+  dynamicColumns: [
+    { prop: 'name', label: '油枪号' },
+    { prop: 'companyName', label: '石油公司' },
+    { prop: 'stationName', label: '加油站名称' },
+    { prop: 'fuelName', label: '油品' },
+    { prop: 'code', label: '编码' },
+    { prop: 'alarming', label: '自锁' },
+    { prop: 'fuelId', label: '油机号' },
+    { prop: 'supplierName', label: '加油机厂商' },
+    { prop: 'onlineStatus', label: '在线状态' },
+    { prop: 'cheatStatus', label: '作弊状态' },
+    { prop: 'monitoringUUID', label: '监控微处理器编号' },
+    { prop: 'displayControlsUUID', label: '加密显示屏编号' },
+    { prop: 'encoderControlsUUID', label: '编码器编号' },
+    { prop: 'productTime', label: '出厂时间' },
+    { prop: 'soldTime', label: '安装时间' },
+  ],
+  /**分页总数 */
+  total: 0,
+  /**分页标识 */
+  pageInput: {
+    currentPage: 1,
+    pageSize: 10,
+  } as PageInputoilGunFilterModel,
+})
 
 /** 选择框列表 */
 const selectList = reactive({
-  Online : ["在线","离线"],
-  Device : [
-  "启用",
-  "备案",
-  "维修",
-  "出厂注册"],
-  Level :[1,2,3,4,5]
+  Online: ["在线", "离线"],
+  Device: [
+    "启用",
+    "备案",
+    "维修",
+    "出厂注册"],
+  Level: [1, 2, 3, 4, 5]
 
 })
 
@@ -158,39 +145,39 @@ onMounted(() => {
 // 条件查询
 const init = async () => {
   Data.loading = true
-  const res:any = await new OilGunApi().getPage({...Data.pageInput, filter:Data.Filter})
+  const res: any = await new OilGunApi().getPage({ ...Data.pageInput, filter: Data.Filter })
   console.log(res)
   Data.tableModel = res?.data ?? []
   Data.total = res?.data?.length ?? 0
   Data.loading = false
 }
 
-const onQuery = () =>{
-    init()
+const onQuery = () => {
+  init()
 }
 
-  /**重置查询条件 */
-  const resetQuery = () => {
-    Data.Filter.StationName = ''
-    Data.Filter.CompanyName = ''
-    Data.Filter.onlineStatus = ''
-    Data.Filter.OutBeginTime = ''
-    Data.Filter.OutEndTime = ''
-    Data.Filter.name = ''
-    Data.time1 = ''
-    Data.pageInput.currentPage = 1
-    Data.pageInput.pageSize = 10
-  }
-    /**重置 */
-  const onReset = () => {
-    resetQuery()
-    init()
-  }
+/**重置查询条件 */
+const resetQuery = () => {
+  Data.Filter.StationName = ''
+  Data.Filter.CompanyName = ''
+  Data.Filter.onlineStatus = ''
+  Data.Filter.OutBeginTime = ''
+  Data.Filter.OutEndTime = ''
+  Data.Filter.name = ''
+  Data.time1 = ''
+  Data.pageInput.currentPage = 1
+  Data.pageInput.pageSize = 10
+}
+/**重置 */
+const onReset = () => {
+  resetQuery()
+  init()
+}
 
-  /**
- * 页条变化
- * @param val
- */
+/**
+* 页条变化
+* @param val
+*/
 const onSizeChange = (val: number) => {
   Data.pageInput.pageSize = val
   init()
@@ -204,29 +191,24 @@ const onCurrentChange = (val: number) => {
   Data.pageInput.currentPage = val
   init()
 }
-  
-  /**
-   * 监听时间变换
-   */
-  watch(() => Data.time1, (newVal) => {
-    if(newVal.length === 0){
+
+/**
+ * 监听时间变换
+ */
+watch(() => Data.time1, (newVal) => {
+  if (newVal.length === 0) {
     return
-    }
-    Data.Filter.OutBeginTime = newVal[0]?.[0] ?? ''
-    Data.Filter.OutEndTime = newVal[0]?.[1] ?? ''
-  })
-
-  </script>
-  
-  <style scoped lang="scss">
-  .my-el-link {
-    font-size: 14px;
   }
-  .el-form .el-col.mb20 {
-    margin: 0 !important;
-  }
-  .el-input, .el-select {
-    width: 240px;
-  }
-  </style>
-  
+  Data.Filter.OutBeginTime = newVal[0]?.[0] ?? ''
+  Data.Filter.OutEndTime = newVal[0]?.[1] ?? ''
+})
+
+</script>
+
+<style scoped lang="scss">
+@import '/@/theme/tableStyle.scss';
+
+
+
+
+</style>