feat：自动生成页面优化格式 报警规则用户列表优化 设备管理页面

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

@@ -353,19 +353,29 @@ const getUserList = async () => {
       currentPage: 1, 
       pageSize: 100,
       filter: {
-        // 可选过滤条件（如用户名搜索）
         userName: "",
       },
     });
     
-    // 处理返回数据
-    Data.userList = res.data.list.map((user: UserListItem) => ({
-      id: user.userId,
-      userName: user.userName, // 下拉框显示名称
-      value: user.userId, // 选中值为用户ID
-      nickname: user.nickname,
-      phone: user.userPhone,
-    }));
+    // 去重逻辑
+    const userSet = new Set<number>();
+    const uniqueUsers = res.data.list
+      .map((user: UserListItem) => ({
+        id: user.userId,
+        userName: user.userName,
+        value: user.userId,
+        nickname: user.nickname,
+        phone: user.userPhone,
+      }))
+      .filter((user: { id: number; }) => {
+        if (userSet.has(user.id)) {
+          return false;
+        }
+        userSet.add(user.id);
+        return true;
+      });
+    
+    Data.userList = uniqueUsers;
   } catch (error) {
     console.error("获取用户列表失败:", error);
     ElMessage.error("用户列表加载失败");

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

@@ -87,11 +87,12 @@
 
 <script setup lang="ts" name="partsManagement/oilGun">
 import { defineAsyncComponent, onBeforeMount, onMounted, reactive, ref, watch } from "vue";
-import { alarmRluesFilterModel_SearchFilter, alarmRluesFilterModel, PageInputAlarmRluesFilterModel } from "/@/api/admin/AlarmService/alarmRulesDto";
+import { alarmRluesFilterModel_SearchFilter, alarmRluesFilterModel, PageInputAlarmRluesFilterModel, UserListItem } from "/@/api/admin/AlarmService/alarmRulesDto";
 import { alarmRulesApi } from "/@/api/admin/AlarmService/alarmRulesApi";
 import eventBus from "/@/utils/mitt";
 import StatusBox from '/@/components/StatusBox.vue';
 import { useDynamicPageSize } from "/@/composables/useDynamicPageSize";
+import { ElMessage } from "element-plus";
 
 
 // 使用组合式函数获取分页状态
@@ -111,6 +112,7 @@ const Data = reactive({
     ruleName: "",
     Status:"",
     upload:"",
+    userName:"",
     isActive:undefined
   } as alarmRluesFilterModel_SearchFilter,
   /**表格信息 */
@@ -289,8 +291,30 @@ onMounted(async () => {
   })
 })
 
-
-
+const getUserList = async () => {
+  try {
+    const res = await new alarmRulesApi().getList({
+      currentPage: 1, 
+      pageSize: 100,
+      filter: {
+        // 可选过滤条件（如用户名搜索）
+        userName: "",
+      },
+    });
+    
+    // 处理返回数据
+    Data.userList = res.data.list.map((user: UserListItem) => ({
+      id: user.userId,
+      userName: user.userName, // 下拉框显示名称
+      value: user.userId, // 选中值为用户ID
+      nickname: user.nickname,
+      phone: user.userPhone,
+    }));
+  } catch (error) {
+    console.error("获取用户列表失败:", error);
+    ElMessage.error("用户列表加载失败");
+  }
+};
 </script>
 
 <style scoped lang="scss">

admin.ui.plus-master/src/views/example/application/equipment/index.vue

@@ -5,25 +5,27 @@
       <el-col :xs="24">
         <el-card class="mt8" shadow="hover">
           <el-form :model="state.filter" :inline="true" @submit.stop.prevent style="margin-bottom:-3vh">
-          <el-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="应用">
-              <el-input v-model="state.appName" disabled placeholder="请选择应用" @keyup.enter="onQuery" />
-            </el-form-item>
-           </el-col>
-           <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
+            <el-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="应用">
+                  <el-input v-model="state.appName" disabled placeholder="请选择应用" @keyup.enter="onQuery" />
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="设备sn">
                   <el-input v-model="state.filter.SN" placeholder="请输入设备sn" clearable></el-input>
                 </el-form-item>
               </el-col>
-           <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="登录账户">
                   <el-input v-model="state.filter.Account" placeholder="请输入账号" clearable></el-input>
                 </el-form-item>
               </el-col>
-           <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="设备状态">
-                  <el-input v-model="state.filter.Status" placeholder="请选择设备状态" clearable></el-input>
+                  <el-select v-model="state.filter.Status" placeholder="请选择状态">
+                    <el-option v-for="(label, value) in statusMap" :key="value" :label="label" :value="value" />
+                  </el-select>
                 </el-form-item>
               </el-col>
             </el-form-item>
@@ -32,15 +34,15 @@
           <hr>
 
           <el-row justify="space-between" class="submit-button" style="margin-bottom: -9px;">
-          <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-Plus" @click="onAdd"> 添加 </el-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-Plus" @click="onAdd"> 添加 </el-button>
             </el-row>
           </el-row>
-          </el-card>
+        </el-card>
       </el-col>
       <!--表格-->
       <el-col :xs="24">
@@ -49,15 +51,17 @@
             <el-table-column v-for="column in state.dynamicColumns" :key="column.prop" :prop="column.prop"
               :label="column.label">
               <template #default="{ row }">
-                                <!-- 如果是状态列，使用 StatusBox 组件 -->
-                                <StatusBox 
-                                    v-if="column.prop === 'status'" 
-                                    :status="getStatusInfo(row[column.prop]).name"  />
-                                <!-- 其他列保持原有逻辑 -->
-                                <span v-else>
-                                    {{ row[column.prop] }}
-                                </span>
-                            </template>
+                <!-- 如果是状态列，使用 StatusBox 组件 -->
+                <StatusBox 
+                  v-if="column.prop === 'status'" 
+                  :status="statusMap[row.status] || '未知'" 
+                  :color="statusStyles[row.status]?.color || '#909399'" 
+                />
+                <!-- 其他列保持原有逻辑 -->
+                <span v-else>
+                  {{ row[column.prop] }}
+                </span>
+              </template>
             </el-table-column>
             <el-table-column label="操作" fixed="right" header-align="center" align="center" class="right-operation"
               width="140">
@@ -71,10 +75,9 @@
           </el-table>
           <div class="my-flex my-flex-end" style="margin-top: 20px">
             <el-pagination v-model:currentPage="pageState.pageInput.currentPage"
-                            v-model:page-size="pageState.pageInput.pageSize" :total="state.total"
-                            :page-sizes="[10, 15, 20, 50, 100]" small background @size-change="onSizeChange"
-                            @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
-
+              v-model:page-size="pageState.pageInput.pageSize" :total="state.total"
+              :page-sizes="[10, 15, 20, 50, 100]" small background @size-change="onSizeChange"
+              @current-change="onCurrentChange" layout="total, sizes, prev, pager, next, jumper" />
           </div>
         </el-card>
       </el-col>
@@ -83,6 +86,7 @@
     <EquipmentEditDialog ref="equipmentEditRef"></EquipmentEditDialog>
   </div>
 </template>
+
 <script setup lang="ts">
 import { defineAsyncComponent, onBeforeMount, onMounted, reactive, ref, watch } from "vue";
 import eventBus from "/@/utils/mitt";
@@ -92,8 +96,7 @@ import { PermissionApi } from "/@/api/admin/Permission";
 import router from "/@/router";
 import StatusBox from "/@/components/StatusBox.vue";
 import { useDynamicPageSize } from "/@/composables/useDynamicPageSize";
-
-
+import { ElMessage } from 'element-plus';
 
 // 使用组合式函数获取分页状态
 const pageState = useDynamicPageSize(10, 15);
@@ -106,17 +109,17 @@ const equipmentEditRef = ref()
 const state = reactive({
   /**加载显示 */
   loading: false,
-  appName:"",
+  appName: "",
   /**条件查询模块 */
   filter: {
     /** appid */
-    Appid:"",
+    Appid: "",
     /**设备sn */
     SN: null,
     /**登录账户 */
     Account: null,
     /**设备状态 */
-    Status: null,
+    Status: '', // 默认所有状态
   },
   /**表格信息 */
   tableModel: [] as unknown as EquipmentGetPageOutput,
@@ -126,7 +129,8 @@ const state = reactive({
     { prop: 'account', label: '登录账户' },
     { prop: 'status', label: '设备状态' },
     { prop: 'loginTime', label: '最近一次登录时间' },
-    { prop: 'validityTime', label: '登录有效期' },],
+    { prop: 'validityTime', label: '登录有效期' },
+  ],
   /**分页标识 */
   pageInput: {
     CurrentPage: 1,
@@ -136,19 +140,21 @@ const state = reactive({
   total: 0,
 })
 
-// 状态映射表
+// 状态映射表 - 用于选择框和显示
 const statusMap = {
-  0: { name: "关闭", color: "#F56C6C" }, // 红色表示关闭
-  1: { name: "开启", color: "#67C23A" }, // 绿色表示开启
+  '': '所有',
+  '1': '启用',
+  '0': '禁用',
 };
 
-// 根据 status 值获取映射后的对象
-const getStatusInfo = (status: number) => {
-  return statusMap[status] || { name: "未知状态", color: "#000" };
+// 状态样式映射 - 用于StatusBox组件
+const statusStyles = {
+  '1': { text: "启用", color: "#67C23A" }, // 绿色表示启用
+  '0': { text: "禁用", color: "#F56C6C" }, // 红色表示禁用
 };
 
 onMounted(() => {
-   // 初始化分页大小
+  // 初始化分页大小
   state.pageInput.PageSize = pageState.pageInput.pageSize;
   state.pageInput.CurrentPage = 1; // 初始化时重置为第一页
   init()
@@ -156,60 +162,91 @@ onMounted(() => {
   eventBus.on('refreshView', async () => {
     await init()
   })
-  console.log()
 })
+
 onBeforeMount(() => {
   eventBus.off('refreshView')
 })
-/**
-* 监听变换
-*/
-// watch(() => { })
+
 /**条件查询 */
 const onQuery = async () => {
-  state.loading = true
-  const res: any = await new PermissionApi().getEquipmentList({ 
-    ...state.pageInput, 
-    "Filter.Appid":state.filter.Appid,
-    "Filter.SN":state.filter.SN,
-    "Filter.Account":state.filter.Account,
-    "Filter.Status":state.filter.Status,
-  })
-  state.total = res?.data?.total ?? 0
-  state.tableModel = res?.data?.list ?? []
-  state.loading = false
-}
+  state.loading = true;
+  try {
+    const res: any = await new PermissionApi().getEquipmentList({
+      ...state.pageInput,
+      "Filter.Appid": state.filter.Appid,
+      "Filter.SN": state.filter.SN,
+      "Filter.Account": state.filter.Account,
+      // 确保传递正确的状态值
+      "Filter.Status": state.filter.Status !== '' ? state.filter.Status : null,
+    });
+    
+    state.total = res?.data?.total ?? 0;
+    state.tableModel = res?.data?.list ?? [];
+  } catch (error) {
+    console.error('获取设备列表失败:', error);
+    ElMessage.error('获取设备列表失败');
+  } finally {
+    state.loading = false;
+  }
+};
+
 /**初始化 */
 const init = async () => {
-  state.loading = true
-  const name = router.currentRoute.value.params.id
-  const appData=await new PermissionApi().getApplyInfo({Name:name})
-  state.appName = appData.data[0].name
-  state.filter.Appid = appData.data[0].appid
-  state.loading = false
-  onQuery()
-}
+  state.loading = true;
+  try {
+    const name = router.currentRoute.value.params.id;
+    const appData = await new PermissionApi().getApplyInfo({ Name: name });
+    state.appName = appData.data[0].name;
+    state.filter.Appid = appData.data[0].appid;
+  } catch (error) {
+    console.error('获取应用信息失败:', error);
+    ElMessage.error('获取应用信息失败');
+  } finally {
+    state.loading = false;
+    onQuery();
+  }
+};
+
 /**添加 */
 const onAdd = () => {
-  equipmentEditRef.value.openDialog('add',{appid:state.filter.Appid})
+  equipmentEditRef.value.openDialog('add', { appid: state.filter.Appid })
 }
-/**重置 */
-const onReset = () => { }
+
+/**重置筛选条件 */
+const onReset = () => {
+  state.filter = {
+    Appid: state.filter.Appid, 
+    SN: null,
+    Account: null,
+    Status: '',
+  };
+  onQuery(); 
+};
+
 /**编辑 */
 const onDateUpdate = (row) => {
-  equipmentEditRef.value.openDialog('edit',row)
- }
+  equipmentEditRef.value.openDialog('edit', row)
+}
+
 /**删除 */
 const onDataDelete = (row) => {
-  equipmentEditRef.value.openDialog('delete',row)
- }
-
-const onSizeChange = () => {
+  equipmentEditRef.value.openDialog('delete', row)
 }
 
-const onCurrentChange = () => {
-}
+/**页大小变化 */
+const onSizeChange = (newSize: number) => {
+  state.pageInput.PageSize = newSize;
+  onQuery();
+};
+
+/**页码变化 */
+const onCurrentChange = (newPage: number) => {
+  state.pageInput.CurrentPage = newPage;
+  onQuery();
+};
 </script>
+
 <style scoped lang="scss">
 .el-input,
 .el-select {

admin.ui.plus-master/src/views/example/codeGeneration/index.vue

@@ -29,7 +29,7 @@
           <el-form-item label="查询按钮" style="width: 100%;"></el-form-item>
           <el-form-item label="">
             <el-row :gutter="70">
-              <el-col :xs="6" :sm="4" :md="4" :lg="4" :xl="4" v-for="(v, k) in state.selectBtn" :key="k">
+              <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="4" v-for="(v, k) in state.selectBtn" :key="k">
                 <span style="margin-right: 10px;">{{ v.name }}</span>
                 <el-switch v-model="v.value" @change="change(k)"></el-switch>
               </el-col>
@@ -320,7 +320,7 @@ const onsubmit=()=>{
   let tabVal=state.tableVal.filter(item=>item.value===true)
   //console.log(tabVal)
   let apiCode=`import { AxiosResponse } from 'axios'
-  import { ContentType, HttpClient, RequestParams } from './http-client'
+  import { ContentType, HttpClient, RequestParams } from '/@/api/admin/http-client'
   export class Api<SecurityDataType = unknown> extends HttpClient<SecurityDataType> {
     /**
    * No description
@@ -430,17 +430,17 @@ const onsubmit=()=>{
       <el-col :xs="24" >
         <el-card class="mt8"  shadow="hover" >`
     if(selVal.length>0){
-      indexCode=indexCode+`\n<el-form :model="state.filter" :inline="true" @submit.stop.prevent>
+      indexCode=indexCode+`\n<el-form :model="state.filter" :inline="true" @submit.stop.prevent style="margin-bottom: -3vh;">
             <el-form-item prop="name" style="width: 100%">`
       for(let i=0;i<selVal.length;i++){
         if(selVal[i].type==='interger'){
-          indexCode=indexCode+`\n<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
+          indexCode=indexCode+`\n<el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="${selVal[i].description}">
                   <el-input-number v-model="state.filter.${selVal[i].name}" />
                 </el-form-item>
               </el-col>`
         }else if(selVal[i].isDate===true){
-          indexCode=indexCode+`\n<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
+          indexCode=indexCode+`\n<el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
             <el-form-item label="选择时间">
                   <el-date-picker
                     v-model="state.filter.${selVal[i].name}"
@@ -453,7 +453,7 @@ const onsubmit=()=>{
                 </el-form-item>
               </el-col>`
         }else{
-          indexCode=indexCode+`\n<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
+          indexCode=indexCode+`\n<el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
                 <el-form-item label="${selVal[i].description}">
                   <el-input v-model="state.filter.${selVal[i].name}" placeholder="单行输入" clearable></el-input>
                 </el-form-item>
@@ -464,14 +464,38 @@ const onsubmit=()=>{
           </el-form>`
     }
     if(selBtn.length>0){
-      indexCode=indexCode+`\n<div class="my-flex my-flex-start" >`
+      indexCode=indexCode+`\n<el-row justify="space-between" class="submit-button" style="margin-bottom: -9px;">`
       for(let i=0;i<selBtn.length;i++){
         if(selBtn[i].name.includes('批量')){
           selection=true
         }
         indexCode=indexCode+`\n<el-button  type="primary" icon="ele-CirclePlus" @click="${selBtn[i].method}"> ${selBtn[i].name} </el-button>`
       }
-      indexCode=indexCode+`\n</div>`
+            for(let i=0;i<selBtn.length;i++){
+        if(selBtn[i].name.includes('查询')){
+          selection=true
+        }
+        indexCode=indexCode+`\n<el-button  type="primary" icon="ele-Search" @click="${selBtn[i].method}"> ${selBtn[i].name} </el-button>`
+      }
+            for(let i=0;i<selBtn.length;i++){
+        if(selBtn[i].name.includes('添加')){
+          selection=true
+        }
+        indexCode=indexCode+`\n<el-button  type="primary" icon="ele-Plus" @click="${selBtn[i].method}"> ${selBtn[i].name} </el-button>`
+      }
+            for(let i=0;i<selBtn.length;i++){
+        if(selBtn[i].name.includes('重置')){
+          selection=true
+        }
+        indexCode=indexCode+`\n<el-button  type="primary" icon="ele-RefreshRight" @click="${selBtn[i].method}"> ${selBtn[i].name} </el-button>`
+      }
+            for(let i=0;i<selBtn.length;i++){
+        if(selBtn[i].name.includes('上传')){
+          selection=true
+        }
+        indexCode=indexCode+`\n<el-button  type="primary" icon="ele-Upload" @click="${selBtn[i].method}"> ${selBtn[i].name} </el-button>`
+      }
+      indexCode=indexCode+`\n</el-row>`
     }
     indexCode=indexCode+`\n</el-card>
       </el-col>`
@@ -506,8 +530,8 @@ const onsubmit=()=>{
     if(state.isPage){
       indexCode=indexCode+`\n<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"
+              v-model:currentPage="pageState.pageInput.CurrentPage"
+              v-model:page-size="pageState.pageInput.PageSize"
               :total="state.total"
               :page-sizes="[10, 15, 20, 50, 100]"
               small
@@ -527,7 +551,12 @@ const onsubmit=()=>{
   <script setup lang="ts">
   import {onBeforeMount, onMounted, reactive, ref, watch} from "vue";
   import eventBus from "/@/utils/mitt";
-  import {Api} from "/@/api/code/api";`
+  import {Api} from "/@/api/code/api";
+  import { useDynamicPageSize } from "/@/composables/useDynamicPageSize";
+
+  // 使用组合式函数获取分页状态
+const pageState = useDynamicPageSize(10, 15);`
+
   if(state.isPage&&tabVal.length>0){
     indexCode=indexCode+`\nimport { pageInput,${tabVal[0].belong} } from "/@/api/code/dto";`
   }else if(tabVal.length>0){
@@ -571,6 +600,8 @@ const onsubmit=()=>{
   }
   indexCode=indexCode+`\n})
   onMounted(() => {
+    // 初始化分页大小
+  Data.pageInput.pageSize = pageState.pageInput.pageSize; 
     init()
     eventBus.off('refreshView')
     eventBus.on('refreshView', async () => {
@@ -625,7 +656,43 @@ const onsubmit=()=>{
       const ${tabBtn[i].method}=(row)=>{}`
     }
   }
-  indexCode=indexCode+`\n</`+`script>`+`\n<style scoped lang="scss">
+  indexCode=indexCode+`\n
+  /**
+* 页条变化
+* @param val
+*/
+const onSizeChange = (val: number) => {
+  Data.pageInput.pageSize = val
+  //需按照页面对象修改Data
+  init()
+}
+
+/**
+ * 页数 变化
+ * @param val
+ */
+const onCurrentChange = (val: number) => {
+  Data.pageInput.currentPage = val
+  //需按照页面对象修改Data
+  init()
+}
+  </`+`script>`+`\n<style scoped lang="scss">
+  .el-input,
+.el-select {
+  width: 240px;
+}
+
+/* 输入框标签固定四个字符宽度 */
+::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;
+}
   </style>`
   //console.log(indexCode)
   getCodeFile('api.ts',apiCode)