From 013a2245f58c58311fb564b0393ca03d32c5ac3a Mon Sep 17 00:00:00 2001
From: ym1026 <1539963735@qq.com>
Date: Fri, 5 Sep 2025 09:26:14 +0800
Subject: [PATCH] =?UTF-8?q?store+=E7=BB=9F=E8=AE=A1=E5=88=86=E6=9E=90+?=
 =?UTF-8?q?=E7=94=A8=E6=88=B7=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/public/config/columnList.js               | 342 ++++++++++++++++++
 web/src/components/ComTable.vue               |  14 +-
 web/src/components/Home/Map.vue               |   2 +-
 web/src/components/Home/Modal.vue             |  27 +-
 web/src/components/Home/Modal/PrefabCabin.vue |  49 ++-
 .../components/Home/Modal/StatisticalInfo.vue |   4 +-
 web/src/components/OperateCom.vue             | 107 ++++++
 web/src/main.js                               |   4 +
 web/src/store/index.js                        |   7 +-
 web/src/store/systemUser.js                   |  17 +
 web/src/utils/btnList.js                      |  54 +++
 web/src/utils/column.js                       |  93 +++++
 web/src/views/MainView.vue                    |   2 +-
 web/src/views/sub/Home.vue                    | 261 ++-----------
 web/src/views/system/user.vue                 | 206 +++++++++--
 15 files changed, 911 insertions(+), 278 deletions(-)
 create mode 100644 web/public/config/columnList.js
 create mode 100644 web/src/components/OperateCom.vue
 create mode 100644 web/src/store/systemUser.js
 create mode 100644 web/src/utils/btnList.js
 create mode 100644 web/src/utils/column.js

diff --git a/web/public/config/columnList.js b/web/public/config/columnList.js
new file mode 100644
index 0000000..124b3ed
--- /dev/null
+++ b/web/public/config/columnList.js
@@ -0,0 +1,342 @@
+export const columnList = [
+  {
+    page: 'user',
+    columns: [
+      {
+        title: '用户ID',
+        dataIndex: 'user_id',
+        key: 'user_id',
+        ellipsis: true,
+        filterable: true,
+        fixed: 'left'
+      },
+      {
+        title: '用户名',
+        dataIndex: 'account',
+        key: 'account',
+        filterable: true
+      },
+      {
+        title: '姓名',
+        dataIndex: 'name',
+        key: 'name',
+        ellipsis: true,
+        filterable: true
+      },
+      {
+        title: '性别',
+        dataIndex: 'gender',
+        key: 'gender',
+        filterable: true,
+        scopedSlots: { customRender: 'gender' }
+      },
+      {
+        title: '年龄',
+        dataIndex: 'age',
+        key: 'age',
+        filterable: true
+      },
+      {
+        title: '手机号',
+        dataIndex: 'phone',
+        key: 'phone',
+        filterable: true
+      },
+      {
+        title: '邮箱',
+        dataIndex: 'email',
+        key: 'email',
+        filterable: true
+      },
+      {
+        title: '角色ID',
+        dataIndex: 'role_id',
+        key: 'role_id',
+        filterable: true
+      },
+      {
+        title: '角色名称',
+        dataIndex: 'role_name',
+        key: 'role_name',
+        filterable: true
+      },
+      {
+        title: '操作',
+        dataIndex: 'operate',
+        key: 'operate',
+        scopedSlots: { customRender: 'action' }
+      }
+    ]
+  },
+  {
+    page: 'menu',
+    columns: [
+      {
+        title: '菜单名称',
+        dataIndex: 'name',
+        key: 'name',
+        ellipsis: true,
+        filterable: true,
+        fixed: 'left'
+      },
+      {
+        title: '菜单路由',
+        dataIndex: 'route',
+        key: 'route',
+        filterable: true
+      },
+      {
+        title: '顺序',
+        dataIndex: 'seq',
+        align: 'center',
+        key: 'seq',
+        ellipsis: true,
+        width: 120,
+
+        filterable: true
+      },
+      {
+        title: '图标',
+        dataIndex: 'icon',
+        align: 'center',
+        key: 'icon',
+        width: 120,
+        scopedSlots: { customRender: 'icon' }
+      },
+      {
+        title: '创建时间',
+        dataIndex: 'createTime',
+        key: 'createTime',
+        align: 'center',
+        ellipsis: true,
+        filterable: true,
+        width: 180
+      },
+      {
+        title: '更新时间',
+        dataIndex: 'updateTime',
+        key: 'updateTime',
+        align: 'center',
+        ellipsis: true,
+        filterable: true,
+        width: 180
+      },
+      {
+        title: '操作',
+        dataIndex: 'operate',
+        key: 'operate',
+        scopedSlots: { customRender: 'action' }
+      }
+    ]
+  },
+  {
+    page: 'role',
+    columns: [
+      {
+        title: '角色名称',
+        dataIndex: 'name',
+        key: 'name',
+        ellipsis: true,
+        filterable: true,
+        width: 180,
+
+        fixed: 'left'
+      },
+      {
+        title: '角色类型',
+        dataIndex: 'type',
+        key: 'type',
+        width: 120,
+
+        scopedSlots: { customRender: 'type' }
+      },
+      {
+        title: '描述',
+        dataIndex: 'desc',
+        align: 'center',
+        key: 'desc',
+        ellipsis: true
+      },
+      {
+        title: '权限名称',
+        dataIndex: 'permissions',
+        align: 'center',
+        key: 'permissions',
+        width: 180,
+
+        ellipsis: true,
+        scopedSlots: { customRender: 'permissions' }
+      },
+      {
+        title: '创建时间',
+        dataIndex: 'createTime',
+        key: 'createTime',
+        align: 'center',
+        ellipsis: true,
+        filterable: true,
+        width: 180
+      },
+      {
+        title: '更新时间',
+        dataIndex: 'updateTime',
+        key: 'updateTime',
+        align: 'center',
+        ellipsis: true,
+        filterable: true,
+        width: 180
+      },
+
+      {
+        title: '操作',
+        dataIndex: 'operate',
+        scopedSlots: { customRender: 'action' }
+      }
+    ]
+  },
+  {
+    page: 'permission',
+    columns: [
+      {
+        title: '权限名称',
+        dataIndex: 'name',
+        key: 'name',
+        ellipsis: true,
+        filterable: true,
+        fixed: 'left',
+        width: 180
+      },
+      {
+        title: '描述',
+        dataIndex: 'desc',
+        key: 'desc'
+      },
+      {
+        title: '是否可查询',
+        dataIndex: 'isQuery',
+        key: 'isQuery',
+        align: 'center',
+        width: 120,
+        scopedSlots: { customRender: 'isQuery' }
+      },
+      {
+        title: '是否可编辑',
+        dataIndex: 'isControl',
+        align: 'center',
+        key: 'isEdit',
+        width: 120,
+        scopedSlots: { customRender: 'isEdit' }
+      },
+      {
+        title: '是否可控制',
+        dataIndex: 'isEdit',
+        align: 'center',
+        key: 'isEdit',
+        key: 'isControl',
+        width: 120,
+        scopedSlots: { customRender: 'isControl' }
+      },
+
+      {
+        title: '创建时间',
+        dataIndex: 'createTime',
+        key: 'createTime',
+        align: 'center',
+        ellipsis: true,
+        filterable: true,
+        width: 180
+      },
+      {
+        title: '更新时间',
+        dataIndex: 'updateTime',
+        key: 'updateTime',
+        align: 'center',
+        ellipsis: true,
+        filterable: true,
+        width: 180
+      },
+
+      {
+        title: '操作',
+        dataIndex: 'operate',
+        scopedSlots: { customRender: 'action' }
+      }
+    ]
+  }
+]
+
+export const options = [
+  {
+    title: '基础信息',
+    icon: 'icon-xinxi',
+    list: [
+      {
+        label: '名称',
+        value: '',
+        key: 'name',
+        type: 'input'
+      },
+      {
+        label: '账户类型',
+        value: undefined,
+        // dataIndex: 'type',
+        key: 'type',
+        type: 'select',
+        list: [
+          {
+            label: '虚拟账户',
+            value: 0
+          },
+          {
+            label: '卡账户',
+            value: 1
+          }
+        ]
+      },
+
+      {
+        label: '账号',
+        value: [],
+        key: 'code',
+        type: 'input'
+      },
+      {
+        label: '用户',
+        value: undefined,
+        // dataIndex: 'userId',
+        key: 'userId',
+        type: 'select',
+        list: []
+      },
+      {
+        label: '余额',
+        value: '',
+        key: 'money',
+        type: 'input',
+        inputType: 'number'
+      },
+      {
+        label: '账户状态',
+        value: '',
+        key: 'status',
+        type: 'select',
+        list: [
+          {
+            label: '正常',
+            value: 0
+          },
+          {
+            label: '注销',
+            value: 1
+          },
+          {
+            label: '异常',
+            value: 9
+          }
+        ]
+      }
+    ],
+    ruleForm: {
+      // selectTableData: [],
+    }
+  }
+]
diff --git a/web/src/components/ComTable.vue b/web/src/components/ComTable.vue
index 3d9794d..2c3e035 100644
--- a/web/src/components/ComTable.vue
+++ b/web/src/components/ComTable.vue
@@ -53,8 +53,8 @@
 
     <div class="pagination" v-if="data.newTableOpt.page">
       <a-pagination
-        v-model:current="data.newPageOption.current"
-        :total="data.newPageOption.total"
+        v-model:current="data.newPageOption.page"
+        :total="data.newPageOption.count"
         :page-size="data.newPageOption.pageSize"
         @change="onChange"
         show-size-changer
@@ -64,9 +64,9 @@
       </a-pagination>
       <div style="color: #7f8fa4; height: 30px; line-height: 30px; margin: 0 10px">
         共<span style="color: aqua; font-size: 18px; margin: 0 2px">{{
-          data.newPageOption.total
+          data.newPageOption.count
         }}</span
-        >页
+        >条
       </div>
     </div>
   </div>
@@ -107,9 +107,9 @@ const props = defineProps({
     type: Object,
     default: () => {
       return {
-        current: 1,
+        count: 1,
         pageSize: 10,
-        total: 1
+        page: 1
       }
     }
   },
@@ -206,7 +206,7 @@ function rowClassName(record, index) {
 }
 function expandIcon(props) {}
 function onChange(page, pageSize) {
-  data.newPageOption.current = page
+  data.newPageOption.page = page
   data.newPageOption.pageSize = pageSize
   emit('handlePagesizeChange', data.newPageOption)
 }
diff --git a/web/src/components/Home/Map.vue b/web/src/components/Home/Map.vue
index 91b334f..faec418 100644
--- a/web/src/components/Home/Map.vue
+++ b/web/src/components/Home/Map.vue
@@ -41,7 +41,7 @@ export default {
       showCtrModal: false,
       testVal: {
         name: '场站211',
-        id: '124563'
+        id: '2'
       },
       changeStationId:''
     }
diff --git a/web/src/components/Home/Modal.vue b/web/src/components/Home/Modal.vue
index 67da635..fd7f99f 100644
--- a/web/src/components/Home/Modal.vue
+++ b/web/src/components/Home/Modal.vue
@@ -9,7 +9,7 @@
         </div>
         <component
           :is="item.componentId"
-          :props-total="modalInfo.allTotal"
+          :props-total="item.infoKey=='prefab'? modalInfo.prefabTotal: modalInfo.allTotal"
           :props-info="modalInfo[item.infoKey]"
         ></component>
       </div>
@@ -59,7 +59,7 @@ export default {
           title: '预制舱信息',
           class: '',
           componentId: PrefabCabin,
-          infoKey: ''
+          infoKey: 'prefab'
         },
         {
           title: '储能充放电量',
@@ -114,6 +114,7 @@ export default {
   async mounted() {
     await Promise.all([
       this.getStatTotalList(),
+      this.queryStationInfo(),
       this.getStatDayList(1),
     ])
   },
@@ -128,7 +129,7 @@ export default {
         // category:类别，1:储能设备,2:充电设备,3:光伏设备,为0或不传查询所有类别总计
         const query = {
           date: getDateDaysAgo(0),
-          stationId: this.stationId,
+          station_id: this.stationId,
           category: 0
         }
         const res = await getReq('/api/queryStatTotal', query)
@@ -144,6 +145,24 @@ export default {
         this.modalInfo.allTotal = {}
       }
     },
+    // 查询场站信息
+    async queryStationInfo() {
+      try {
+        // station_id：场站ID
+
+        const query = {
+          station_id: this.stationId,
+        }
+        const res = await getReq('/api//queryStationInfo', query)
+        if (res.errcode === 0) {
+          this.modalInfo.prefabTotal = res.data
+        } else {
+          throw res
+        }
+      } catch (error) {
+        this.modalInfo.allTotal = {}
+      }
+    },
     // 查询场站日统计信息
     async getStatDayList(category) {
       try {
@@ -152,7 +171,7 @@ export default {
         // start_date：开始日期，格式：yyyy-mm-dd
         // end_date：结束日期，格式：yyyy-mm-dd
         const query = {
-          stationId: this.stationId,
+          station_id: this.stationId,
           category,
           start_date: getDateDaysAgo(7 - 1),
           end_date: getDateDaysAgo(0)
diff --git a/web/src/components/Home/Modal/PrefabCabin.vue b/web/src/components/Home/Modal/PrefabCabin.vue
index 370ba11..a734b5c 100644
--- a/web/src/components/Home/Modal/PrefabCabin.vue
+++ b/web/src/components/Home/Modal/PrefabCabin.vue
@@ -44,42 +44,68 @@ export default {
       curStatus: '充电',
       list: [
         {
-          key: 'tianshu',
+          key: 'batttey_type',
           value: '磷酸铁锂电池',
           d: '',
           label: '电池类型',
           class: 'item-1'
         },
         {
-          key: 'shouyi',
+          key: 'cooling_type',
           value: '风冷',
           d: '',
           label: '冷却方式',
           class: 'item-2'
         },
         {
-          key: 'shuliang',
+          key: 'voltage_rated',
           value: 20,
           d: 'V',
           label: '电池额定总电压',
           class: 'item-3'
         },
         {
-          key: 'shuliang',
+          key: 'work_mode',
           value: '最优经济化运行模式',
           d: '',
           label: '运行模式',
-          class: 'item-4'
+          class: 'item-4',
+          list:[
+            {
+              label:'手动',
+              value:0
+            },
+            {
+              label:'峰谷套利',
+              value:1
+            },
+            {
+              label:'增网配容',
+              value:2
+            },
+            {
+              label:'应急供电',
+              value:3
+            },
+            {
+              label:'并网保电',
+              value:4
+            },
+            {
+              label:'自定时段',
+              value:5
+            },
+          ]
         },
         {
-          key: 'fadianliang',
+          key: 'capacity',
           value: 20,
           d: 'Wh',
           label: '电池储能容量',
           class: 'item-5'
         },
         {
-          key: 'rongliang',
+          key: 'power_rated',
           value: 100,
           d: 'Kw',
           label: 'PCS额定功率',
@@ -100,8 +126,15 @@ export default {
     propsTotal: {
       handler(newVal, oldVal) {
         if (newVal !== oldVal) {
+          // 0正常 1故障
+          this.curStatus=['正常','故障'][this.propsTotal.status]
           this.list.forEach((item) => {
-            item.value = this.propsTotal[item.key]
+            if(item.key=='work_mode'){
+              item.value =item.list.map((item)=>this.propsTotal[item.key]==item.value)[0].label
+            }else {
+              item.value = this.propsTotal[item.key]
+
+            }
           })
         }
       }
diff --git a/web/src/components/Home/Modal/StatisticalInfo.vue b/web/src/components/Home/Modal/StatisticalInfo.vue
index 8850454..ebb641a 100644
--- a/web/src/components/Home/Modal/StatisticalInfo.vue
+++ b/web/src/components/Home/Modal/StatisticalInfo.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="onLine">
+  <div class="statistical">
     <div class="content">
       <div v-for="item in list" :key="item.key" :class="`item ${item.class}`">
         <span>{{ item.value ? item.value : 0 }} {{ item.d }}</span>
@@ -96,7 +96,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.onLine {
+.statistical {
   height: calc(100% - 45px);
   display: flex;
   justify-content: center;
diff --git a/web/src/components/OperateCom.vue b/web/src/components/OperateCom.vue
new file mode 100644
index 0000000..05670d9
--- /dev/null
+++ b/web/src/components/OperateCom.vue
@@ -0,0 +1,107 @@
+<template>
+  <div class="operate">
+
+    <template v-if="operateList.length < 4">
+      <a-button
+        v-for="item in operateList"
+        :key="item.type"
+        type="primary"
+        style="margin-right: 5px"
+        :class="['operateCol', item.type]"
+        :disabled="item.disabled"
+        @click="munuClick(item.type)"
+        >{{ item.label }}
+      </a-button>
+    </template>
+   
+
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'OperateCom',
+  components: {  },
+  props: {
+    operateList: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    },
+    record: {
+      type: Object,
+      default:()=>{}
+    },
+    flag: {
+      type: String,
+      default:''
+    }
+  },
+
+  data() {
+    return {}
+  },
+  watch: {
+    operateList: {
+      handler(n, o) {},
+      deep: true,
+      immediate: true
+    }
+  },
+  mounted() {},
+  methods: {
+    munuClick(type) {
+      this.$emit('operateForm', type, { ...this.record })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.moreIcon{
+  color:#fff !important
+}
+:deep(.ant-btn) {
+  padding: 0px 7px !important;
+  height: 24px !important;
+  font-size: 13px !important;
+  letter-spacing: -1px;
+  border-radius: 4px;
+  & > span + .anticon {
+    margin-inline-start: 4px;
+  }
+}
+:deep(.ant-btn-primary) {
+  box-shadow: none !important;
+  background: var(--theme-btn3);
+}
+:deep(.ant-btn,.ant-btn-primary){
+  &:hover{
+    opacity: 0.9;
+  }
+  &:disabled{
+    color: rgba(255,255,255,0.5);
+  }
+  }
+.operate{
+  display: flex;
+  justify-content: center;
+}
+.operateCol {
+  background: var(--theme-btn3);
+
+  &.more {
+    background: var(--theme-btn1);
+  }
+
+  &.del {
+    background: var(--theme-btn2);
+  }
+
+}
+.ant-dropdown .ant-dropdown-menu{
+  background-color:var(--theme-opert-bg)!important;
+}
+
+</style>
diff --git a/web/src/main.js b/web/src/main.js
index 3126b87..95d1d9a 100644
--- a/web/src/main.js
+++ b/web/src/main.js
@@ -8,9 +8,13 @@ import 'ant-design-vue/dist/reset.css'
 import '@/style/index.scss'
 // import '@/assets/iconfont/iconfont.css'
 import * as echarts from 'echarts'
+import { setWidth } from '@/utils/column'
+import { getBtns } from '@/utils/btnList'
 import VueTianditu from 'vue-tianditu'
 
 const app = createApp(App)
 app.config.globalProperties.$echarts = echarts // 挂载到全局属性
+app.config.globalProperties.$setWidth = setWidth // 挂载到全局属性
+app.config.globalProperties.$getBtns = getBtns
 
 app.use(store).use(router).use(Antd).use(VueTianditu).mount('#app')
diff --git a/web/src/store/index.js b/web/src/store/index.js
index 100073a..0fc07f8 100644
--- a/web/src/store/index.js
+++ b/web/src/store/index.js
@@ -1,9 +1,10 @@
-import { createStore } from "vuex";
+import { createStore } from 'vuex'
+import systemUser from './systemUser'
 
 export default createStore({
   state: {},
   getters: {},
   mutations: {},
   actions: {},
-  modules: {},
-});
+  modules: { systemUser }
+})
diff --git a/web/src/store/systemUser.js b/web/src/store/systemUser.js
new file mode 100644
index 0000000..6d8706f
--- /dev/null
+++ b/web/src/store/systemUser.js
@@ -0,0 +1,17 @@
+export default {
+  namespaced: true,
+  tate: {
+    page: 'main', //main or detail
+    detailType: 'add', //  add or edit  or view
+    title: '新增', //    新增  or 查看
+    type: 'user' //  menu  or authority   role
+  },
+  mutations: {
+    updateState(state, playload) {
+      Object.entries(playload).forEach((item) => {
+        const [key, value] = item
+        state[key] = value
+      })
+    }
+  }
+}
diff --git a/web/src/utils/btnList.js b/web/src/utils/btnList.js
new file mode 100644
index 0000000..2d4440c
--- /dev/null
+++ b/web/src/utils/btnList.js
@@ -0,0 +1,54 @@
+const btnList = [
+  { label: '', type: '', disFlag: '' },
+  { label: '新增', type: 'add', disFlag: 'isEdit', icon: 'icon-add' },
+  { label: '更新', type: 'edit', disFlag: 'isEdit' },
+  { label: '查看', type: 'detail', disFlag: 'isQuery' },
+  { label: '编辑', type: 'edit', disFlag: 'isEdit' },
+  { label: '删除', type: 'del', disFlag: 'isEdit', icon: 'icon-del' },
+  { label: '批量删除', type: 'del', disFlag: 'isEdit', icon: 'icon-del' },
+  { label: '导入', type: 'upload', disFlag: 'isEdit', icon: 'icon-import' },
+  { label: '导出', type: 'download', disFlag: 'isEdit', icon: 'icon-export' },
+  { label: '上传', type: 'upload', disFlag: 'isEdit', icon: 'icon-upload' },
+  { label: '下载', type: 'download', disFlag: 'isEdit', icon: 'icon-download' },
+  { label: '下发', type: 'xf', disFlag: 'isControl' },
+  { label: '批量下载', type: 'download', disFlag: 'isEdit', icon: 'icon-download' },
+  { label: '下载模版', type: 'downTemplate', disFlag: 'isControl', icon: 'icon-download' },
+  { label: '重置密码', type: 'reset', disFlag: 'isEdit' },
+  { label: '派发', type: 'distribute', disFlag: 'isControl' },
+  { label: '处理', type: 'dealWith', disFlag: 'isControl' },
+  { label: '审核', type: 'audit', disFlag: 'isControl' },
+  { label: '标记为已读', type: 'setTagR', disFlag: 'isControl', icon: 'icon-chulizhuangtai' },
+  { label: '标记为已处理', type: 'setTagD', disFlag: 'isControl' },
+  { label: '启动', type: 'start', disFlag: 'isControl' },
+  { label: '停止', type: 'stop', disFlag: 'isControl' },
+  { label: '重启', type: 'restart', disFlag: 'isControl' },
+  { label: '批量启动', type: 'start', disFlag: 'isControl' },
+  { label: '批量停止', type: 'stop', disFlag: 'isControl' },
+  { label: '批量重启', type: 'restart', disFlag: 'isControl' },
+  { label: '监控日志', type: 'log', disFlag: 'isControl' },
+  { label: '新建备份', type: 'backups', disFlag: 'isEdit', icon: 'icon-add' },
+  { label: '导入备份', type: 'importBackups', disFlag: 'isEdit', icon: 'icon-import' },
+  { label: '还原', type: 'restore', disFlag: 'isEdit' },
+  { label: '批量启用', type: 'enable', disFlag: 'isControl', icon: 'icon-a-qiyong' },
+  { label: '批量禁用', type: 'disable', disFlag: 'isControl', icon: 'icon-a-jinyong' }
+]
+
+// arr:按钮数组
+// permissions:{
+//  isControl: true;
+//  isEdit: true;
+//  isQuery: true;
+// }
+function getBtns(arr) {
+  const permissions =
+    JSON.parse(localStorage.getItem('user')).userExtend.role.permissionList[0] || {}
+  const btns = []
+  btnList.forEach((item) => {
+    if (arr.includes(item.label)) {
+      item.disabled = !Boolean(permissions[item.disFlag])
+      btns.push(item)
+    }
+  })
+  return btns
+}
+export { btnList, getBtns }
diff --git a/web/src/utils/column.js b/web/src/utils/column.js
new file mode 100644
index 0000000..d5afe8b
--- /dev/null
+++ b/web/src/utils/column.js
@@ -0,0 +1,93 @@
+const colWidth = [
+  {
+    label: '用户',
+    width: 120,
+    align: 'left'
+  },
+  {
+    label: '名称',
+    width: 200,
+    align: 'left',
+    sorter: (a, b) => {
+      return a.name.localeCompare(b.name)
+    },
+    sortDirections: ['ascend', 'descend']
+  },
+  {
+    label: '所属',
+    width: 150,
+    align: 'left'
+  },
+  {
+    label: '类型',
+    width: 120,
+    align: 'left'
+  },
+  {
+    label: 'ip',
+    width: 120,
+    align: 'left'
+  },
+  {
+    label: '状态',
+    width: 120,
+    align: 'center'
+  },
+  {
+    label: '是否',
+    width: 120,
+    align: 'center'
+  },
+  {
+    label: '服务',
+    width: 120,
+    align: 'left'
+  },
+  {
+    label: '手机号',
+    width: 200,
+    align: 'left'
+  },
+  {
+    label: '时间',
+    width: 200,
+    align: 'center'
+  },
+  {
+    label: '文件路径',
+    width: 400
+  },
+  {
+    label: '内容',
+    width: 350
+  },
+  {
+    label: '通知方式',
+    width: 240,
+    align: 'center'
+  },
+  {
+    label: '操作',
+    align: 'center',
+    width: 130,
+    fixed: 'right',
+    resizable: false
+  }
+]
+
+function setWidth(val) {
+  let info = {}
+  const Item = colWidth.find((item) => val.title.search(item.label) !== -1) || null
+  if (Item) {
+    if (val.title == '操作') {
+      info = { ...Item, ...val, resizable: true }
+    } else {
+      info = { ...val, ...Item, resizable: true, ellipsis: true }
+    }
+  } else {
+    info = { ...val, align: 'left', ellipsis: true, resizable: true, width: 150 }
+  }
+  return info
+}
+
+export { colWidth, setWidth }
diff --git a/web/src/views/MainView.vue b/web/src/views/MainView.vue
index 192319e..3cf142d 100644
--- a/web/src/views/MainView.vue
+++ b/web/src/views/MainView.vue
@@ -143,7 +143,7 @@ export default {
 .subMenu {
   display: flex;
   color: #fff;
-  margin-left: 10px;
+  // margin-left: 10px;
   padding-bottom: 20px;
   .subItem {
     width: 96px;
diff --git a/web/src/views/sub/Home.vue b/web/src/views/sub/Home.vue
index 9536932..29a1e54 100644
--- a/web/src/views/sub/Home.vue
+++ b/web/src/views/sub/Home.vue
@@ -1,12 +1,7 @@
 <template>
   <div class="Home">
     <div class="content-left">
-      <div
-        v-for="item in leftList"
-        :key="item.componentId"
-        :class="`grid-item ${item.class}`"
-      
-      >
+      <div v-for="item in leftList" :key="item.componentId" :class="`grid-item ${item.class}`">
         <div class="tool">
           <div class="title">
             <i class="iconfont icon-hebing linear-text"></i>
@@ -26,12 +21,7 @@
       <Map @changeStation="getCurrentStation"></Map>
     </div>
     <div class="content-right">
-      <div
-        v-for="item in rightList"
-        :key="item.componentId"
-        :class="`grid-item ${item.class}`"
-      
-      >
+      <div v-for="item in rightList" :key="item.componentId" :class="`grid-item ${item.class}`">
         <div class="tool">
           <div class="title">
             <i class="iconfont icon-hebing linear-text"></i>
@@ -57,7 +47,7 @@ import Pv from '@/components/Home/Pv.vue'
 import Alarm from '@/components/Home/Alarm.vue'
 import Map from '@/components/Home/Map.vue'
 import { getReq, postReq } from '@/request/api'
-import {getRunDays,getDateDaysAgo} from '@/utils/dealWithData'
+import { getRunDays, getDateDaysAgo } from '@/utils/dealWithData'
 
 export default {
   name: 'Home',
@@ -122,220 +112,6 @@ export default {
   },
   async mounted() {
     await Promise.all([
-      // (this.deviceInfo = {
-      //   alarm: [
-      //     {
-      //       date: '2025-08-30',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-29',
-      //       key1: 8,
-      //       key2: 5,
-      //       key3: 5,
-      //       key4: 7
-      //     },
-      //     {
-      //       date: '2025-08-28',
-      //       key1: 0,
-      //       key2: 10,
-      //       key3: 20,
-      //       key4: 4
-      //     },
-      //     {
-      //       date: '2025-08-27',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-26',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-25',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-24',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-23',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-22',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-21',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-20',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-19',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-18',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     },
-      //     {
-      //       date: '2025-08-17',
-      //       key1: 10,
-      //       key2: 0,
-      //       key3: 15,
-      //       key4: 5
-      //     }
-      //   ],
-      //   energy: [
-      //     {
-      //       date: '2025-08-30',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-29',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-28',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-27',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-26',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-25',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-24',
-      //       key1: '2',
-      //       key2: '2'
-      //     }
-      //   ],
-      //   charge: [
-      //     {
-      //       date: '2025-08-30',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-29',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-28',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-27',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-26',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-25',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-24',
-      //       key1: '2',
-      //       key2: '2'
-      //     }
-      //   ],
-      //   pv: [
-      //     {
-      //       date: '2025-08-30',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-29',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-28',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-27',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-26',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-25',
-      //       key1: '2',
-      //       key2: '2'
-      //     },
-      //     {
-      //       date: '2025-08-24',
-      //       key1: '2',
-      //       key2: '2'
-      //     }
-      //   ],
-      //   allTotal: {}
-      // }),
       this.getOnLineList(),
       this.getStatTotalList(),
       this.getStatDayList(1),
@@ -409,7 +185,6 @@ export default {
           this.deviceInfo.allTotal.incomeCharge + this.deviceInfo.allTotal.incomeElect
       }
     },
-  
 
     // 示例：获取7天前的日期
     // 查询场站日统计信息
@@ -430,6 +205,18 @@ export default {
         if (res.errcode === 0) {
           this.list.forEach((item) => {
             this.deviceInfo[arr[category]] = res.data
+            if (
+              this.deviceInfo.energy.length &&
+              this.deviceInfo.charge.length &&
+              this.deviceInfo.pv.length
+            ) {
+              const newArr = this.mergedArray(
+                this.deviceInfo.energy,
+                this.deviceInfo.charge,
+                this.deviceInfo.pv
+              )
+              this.deviceInfo.alarm = newArr
+            }
           })
         } else {
           throw res
@@ -437,6 +224,24 @@ export default {
       } catch (error) {
         console.log(error)
       }
+    },
+    // 整合三个数组
+    mergedArray(arr1, arr2, arr3) {
+      const newArr = []
+      arr1.forEach((item1, index) => {
+        // 获取对应索引的 arr2 和 arr3 的对象
+        const item2 = arr2[index] || {}
+        const item3 = arr3[index] || {}
+
+        // 返回整合后的对象
+        newArr.push({
+          storage_num_err: item1.storage_num_err || '',
+          solar_num_err: item2.solar_num_err || '',
+          charge_num_err: item3.charge_num_err || '',
+          dt: item1.dt
+        })
+      })
+      return newArr
     }
   }
 }
diff --git a/web/src/views/system/user.vue b/web/src/views/system/user.vue
index 4459358..3a951fe 100644
--- a/web/src/views/system/user.vue
+++ b/web/src/views/system/user.vue
@@ -1,38 +1,196 @@
-   <template>
-     <div  class="user">
-      <SearchBox></SearchBox>
+<template>
+  <div class="user">
+    <searchBox
+      :btn-option-list="btnOptionList"
+      @onSearch="onSearch"
+      :search-options="searchOptions"
+      @operateForm="operateForm"
+    ></searchBox>
 
-      <div class="table-content">
+    <div class="content-table">
+      <ComTable
+        :columns="columns"
+        :table-data="tableData"
+        @handlePagesizeChange="handlePagesizeChange"
+        ref="comTable"
+        :table-option="tableOption"
+        :page-option="pageOption"
+        :table-h="tableH"
+      >
+       <template #gender="record">
+        <!-- 0:女; 1:男 -->
+          <span>{{ ['女', '男'][record.gender] }}</span>
+        </template>
+    
+        <template #action="record">
+          <OperateCom :record="record" :operate-list="operateList" @operateForm="operateForm" />
+        </template>
+    </ComTable>
+    </div>
 
-      </div>
+    </div>
+</template>
 
-      
-     </div>
-   </template>
-   
 <script>
-import SearchBox from '@/components/SearchBox.vue'
+import { columnList } from '../../../public/config/columnList'
+import { mapState } from 'vuex'
+import { getReq, postReq } from '@/request/api.js'
+import ComTable from '@/components/ComTable'
+import OperateCom from '@/components/OperateCom'
+
+import searchBox from '@/components/SearchBox.vue'
 export default {
   name: '',
-  components:{
-    SearchBox
+  components: {
+    searchBox,
+    ComTable,
+    OperateCom
   },
-  props: {
-   
-  },
-  data() { 
+  props: {},
+  data() {
     return {
-   
+      pageOption:{},
+      btnOptionList: [],
+      paramsDate:{
+       
+      }
     }
   },
+  computed: {
+    ...mapState(['page', 'detailType', 'type'])
+  },
+  created() {
+    let info = []
+    let col = columnList.find((i) => i.page == 'user').columns
+    if (col.length) {
+      col.forEach((item) => {
+        info.push(this.$setWidth(item))
+      })
+    }
+    this.columns = info
+  },
+ 
   mounted() {
-   
-  },
-  methods:{
-   
+    this.operateList = this.$getBtns(['查看', '编辑', '删除'])
+    this.btnOptionList = this.$getBtns(['新增', '批量删除'])
+    this.getList()
   },
+
+  methods: {
+    async getList() {
+      this.$refs.comTable.loading = true
+
+      const { page, pageSize } = this.pageOption
+
+      const params = {
+        ...this.paramsDate,
+        page_size: pageSize,
+        page
+      }
+
+      try {
+        const res = await getReq('/api/queryUserList',params)
+        if (res.errcode === 0) {
+          this.$refs.comTable.loading = false
+
+          this.tableData = res.data
+
+          this.pageOption = {
+            page: res.page,
+            pageSize: res.page_size,
+            count: res.count
+          }
+        } else {
+          const err = { tip: res.errmsg }
+          throw err
+        }
+      } catch (error) {
+        //统一处理报错提示
+      }
+    },
+    operateForm(type, record = {}) {
+      switch (type) {
+      case 'detail':
+        this.$store.commit('updateState', {
+          detailType: 'edit', //edit or view
+          page: 'detail',
+          title: '查看',
+          type: 'user'
+        })
+
+       
+
+        this.getRuleFormInfo(record)
+        break
+
+      case 'back':
+        this.$store.commit('updateState', {
+          page: 'main'
+        })
+        this.isShowFlag = false
+        this.getList()
+        break
+
+      default:
+        break
+      }
+    },
+    async getRuleFormInfo(record) {
+      function getInfo(data, url) {
+        return new Promise((reslove, reject) => {
+          getReq(data, url).then((res) => {
+            reslove(res.data)
+          })
+        })
+      }
+
+      let row = {}
+      if (record.id) {
+        row = await getInfo({ id: record.id }, this.apiMethods[0].get)
+        this.record = row
+        this.$store.commit('updateState', {
+          // 配电柜-集中器-查看
+          title:
+            (row.cabinetName ? row.cabinetName + '-' : '') +
+            (row.name.split('集中器')[0] ? row.name.split('集中器')[0] : '') +
+            '集中器-查看'
+        })
+      }
+      let connectorType
+      cabinetOptions.forEach((e, index) => {
+        e.list.forEach((i) => {
+          if (index == 1) {
+            // 集中器状态
+            if (i.key == 'ctrMode' || i.key == 'powerStatus') {
+              e.ruleForm[i.key] = row.deviceStatus.lightStatus[i.key]
+            } else {
+              e.ruleForm[i.key] = row.deviceStatus[i.key]
+            }
+          } else if (i.key == 'connectorType') {
+            connectorType = row.deviceExtend[i.key]
+            e.ruleForm[i.key] = row.deviceExtend[i.key]
+          } else {
+            e.ruleForm[i.key] = row ? row[i.key] : ''
+            e.ruleForm.id = row.id
+          }
+        })
+      })
+
+      // C型控制器，手自动状态和故障状态显示为“无”
+      if (connectorType == 1) {
+        cabinetOptions[1].ruleForm.status = 5
+        cabinetOptions[1].ruleForm.ctrMode = 5
+      }
+      this.isShowFlag = true
+    },
+    handlePagesizeChange(pageOption) {
+      this.pageOption.pageSize = pageOption.pageSize
+      this.pageOption.page = pageOption.page
+
+      this.getList()
+    }
+  }
 }
 </script>
-   
-   <style lang="scss" scoped>
-   </style>
\ No newline at end of file
+
+<style lang="scss" scoped></style>