feat(system): 优化系统日志页面布局和功能

- 修改系统日志页面的列配置，增加固定列和对齐方式
- 优化表格组件的样式和功能，支持右列固定和自定义样式
- 调整分页配置，统一表格相关属性

web/babel.config.js

@@ -1,3 +1,12 @@
 module.exports = {
-  presets: ["@vue/cli-plugin-babel/preset"],
+  plugins: [
-};
+    [
+      'import',
+      {
+        libraryName: 'ant-design-vue',
+        libraryDirectory: 'es',
+        style: true // 或 true（使用 less）
+      }
+    ]
+  ]
+}

web/public/config/columnList.js

@@ -288,7 +288,9 @@ export const columnList = [
         title: '操作',
         dataIndex: 'operate',
         key: 'operate',
-        scopedSlots: { customRender: 'action' }
+        scopedSlots: { customRender: 'action' },
+        fixed: 'right',
+        align: 'center'
       }
     ]
   },
@@ -350,45 +352,30 @@ export const columnList = [
     ]
   },
   {
-    page: 'log',
+    page: 'syslog',
     columns: [
       {
-        title: '用户',
+        title: '日志ID',
-        dataIndex: 'userName',
+        dataIndex: 'log_id'
-        width: 180
       },
 
       {
-        title: '日志类型',
+        title: '操作用户',
-        dataIndex: 'type',
+        dataIndex: 'user_id',
-        key: 'type',
+        key: 'user_id',
-        width: 120,
+        width: 120
+      },
 
-        scopedSlots: { customRender: 'type' }
-      },
       {
-        title: '操作类型',
+        title: '日志内容',
-        dataIndex: 'opType',
+        dataIndex: 'content',
-        key: 'opType',
+        key: 'content',
-        width: 120,
-
-        scopedSlots: { customRender: 'opType' }
-      },
-      {
-        title: 'ip',
-        dataIndex: 'ip',
-        key: 'ip'
-      },
-      {
-        title: '内容',
-        dataIndex: 'msg',
-        key: 'msg',
         ellipsis: true
       },
       {
-        title: '生成时间',
+        title: '记录时间',
-        dataIndex: 'createTime',
+        dataIndex: 'create_time',
-        key: 'createTime',
+        key: 'create_time',
         align: 'center',
         ellipsis: true,
         width: 180
@@ -406,7 +393,6 @@ export const columnList = [
         title: '操作',
         dataIndex: 'operate',
         key: 'operate',
-        width: 80,
         scopedSlots: { customRender: 'action' }
       }
     ]
@@ -871,8 +857,58 @@ export const alarmlogOptions = [
         label: '状态',
         type: 'select',
         list: [
-          { value: 0, label: '异常' },
+          { value: '0', label: '异常' },
-          { value: 1, label: '正常' }
+          { value: '1', label: '正常' }
+        ],
+        value: [],
+        key: 'status'
+      }
+    ],
+    ruleForm: {}
+  }
+]
+export const syslogOptions = [
+  {
+    title: '基础信息',
+    icon: 'icon-xinxi',
+    list: [
+      {
+        label: '日志ID',
+        value: '',
+        key: 'log_id',
+        type: 'input'
+      },
+
+      {
+        label: '操作用户ID',
+        value: '',
+        key: 'user_id',
+        type: 'input',
+        disabled: true
+      },
+
+      {
+        label: '日志内容',
+        value: '',
+        key: 'content',
+        type: 'textarea',
+        disabled: true,
+        className: 'item-l',
+        rows: 8
+      },
+      {
+        label: '记录时间',
+        value: '',
+        key: 'create_time',
+        type: 'input'
+      },
+
+      {
+        label: '状态',
+        type: 'select',
+        list: [
+          { value: '0', label: '异常' },
+          { value: '1', label: '正常' }
         ],
         value: [],
         key: 'status'

web/src/components/ComTable.vue

@@ -161,8 +161,11 @@ const scroll = ref({})
 onMounted(async () => {
   data.newColumns = [...props.columns]
   data.realTableData = [...props.tableData]
+
   await nextTick()
   // console.log(props.tableH, 'props.tableH');
+  console.log(comtable.value.offsetHeight,'comtable.value.offsetHeight');
+
 
   scroll.value = { y: comtable.value.offsetHeight - 56 }
 })
@@ -220,10 +223,11 @@ defineExpose({ ...toRefs(data), loading, mountedScroll, scroll: data.scroll })
 
 <style lang="scss" scoped>
 .comtable {
-  border-radius: 8px;
-  font-size: 14px;
   width: 100%;
   height: 100%;
+  border-radius: 8px;
+  font-size: 14px;
+
   display: flex;
   flex-direction: column;
   justify-content: space-between;
@@ -261,6 +265,10 @@ defineExpose({ ...toRefs(data), loading, mountedScroll, scroll: data.scroll })
     background: transparent;
     color: #fff !important;
     border-bottom: none !important; /* 可选：去除底部边框 */
+    &.ant-table-cell-fix-right{
+    background: #10687d !important;
+
+    }
   }
 }
 
@@ -339,19 +347,22 @@ defineExpose({ ...toRefs(data), loading, mountedScroll, scroll: data.scroll })
     top: -210px !important;
   }
   .ant-pagination-item {
+    border: 1px solid #fff;
     &:not(.ant-pagination-item-active):hover {
       background: #1c797a !important;
     }
     a {
       color: #fff;
       border-radius: 2px;
-      background: #1c797a !important;
-    }
-  }
       
+    }
+  }
+:deep(.ant-pagination-item-ellipsis){
+  color: rgb(255 255 255 / 25%) !important;
+}
   .ant-pagination-item-active {
-    border: 1px solid transparent;
     color: #fff;
+      border: none !important;
     background: #1c797a !important;
   }
 }
@@ -369,6 +380,12 @@ defineExpose({ ...toRefs(data), loading, mountedScroll, scroll: data.scroll })
     }
   
   }
+
+
+}
+:deep(.ant-table-body .ant-table-cell-fix-right.ant-table-cell-fix-right-first){
+    background: #082e4a  !important;
+
 }
 :deep(.ant-table-body) {
   color:#fff;
@@ -416,4 +433,9 @@ defineExpose({ ...toRefs(data), loading, mountedScroll, scroll: data.scroll })
 :deep(.ant-table-wrapper .ant-table-thead th.ant-table-column-has-sorters:hover) {
   background: var(--table-select) !important;
 }
+:deep(.ant-table-cell-fix-right){
+  &::after{
+    border-inline-end:none !important
+  }
+}
 </style>

web/src/components/DetailInfo.vue

@@ -371,7 +371,7 @@ import {
   onMounted,
   defineExpose
 } from 'vue'
-import { TreeSelect } from 'ant-design-vue'
+
 import iconfonts from '../assets/iconfont/iconfont.json'
 import validateRulesObj from '../utils/decorator'
 
@@ -641,7 +641,7 @@ defineExpose({
     }
 
     .form-item {
-      width: 320px !important;
+      // width: 320px !important;
     }
   }
 }

web/src/components/EditCom.vue

@@ -174,6 +174,7 @@ export default {
         case 'alarmLog':
           this.detailInfos = alarmlogOptions
           this.formRules = {}
+          break
         case 'serviceApi':
           this.detailInfos = serviceApiOptions
           this.formRules = serviceApiFormRules

web/src/components/monitor/device.vue

@@ -35,9 +35,15 @@
           <span class="value">{{ info.v }}</span>
         </div>
       </div>
-      <div v-if="item.view == 1" class="item-button">
+      <div class="item-button">
+        <div v-if="item.view == 1">
           <span class="text">实时数据：</span>
-        <a-button type="primary" size="small" @click="openModal(item)">查看</a-button>
+          <a-button type="primary" size="small" @click="openModal(item, 1)">查看</a-button>
+        </div>
+        <div v-if="item.type == 105">
+          <span class="text">单体信息：</span>
+          <a-button type="primary" size="small" @click="openModal(item, 2)">查看</a-button>
+        </div>
       </div>
     </div>
     <a-modal
@@ -47,6 +53,7 @@
       class="modal-device"
       :get-container="() => $refs.device"
     >
+      <div v-if="modalComponent == 1">
         <div>
           <div class="title">
             <div>电流电压</div>
@@ -73,6 +80,20 @@
             />
           </div>
         </div>
+      </div>
+
+      <div class="content-table" style="height: 600px" v-else>
+        <a-table
+          :columns="columns"
+          :data-source="tableData"
+          size="small"
+          :scroll="{ y: 500 }"
+          :pagination="false"
+          row-class-name="no-hover-row"
+          row-key="id"
+        >
+        </a-table>
+      </div>
     </a-modal>
   </div>
 </template>
@@ -98,19 +119,7 @@ export default {
     return {
       modalOpen: false,
       deviceList: [],
-      chunengInfo: [
+
-        { label: '运行模式', key: 'operationMode', value: '并网运行' },
-        { label: '电池储能容量', key: 'batteryCapacity', value: '100kWh' },
-        { label: '实时电压', key: 'voltage', value: '232.5V' },
-        { label: '功率因数', key: 'powerFactor', value: '0.95' },
-        { label: '实时电流', key: 'current', value: '0.01A' },
-        { label: '额定电压', key: 'ratedVoltage', value: '232.5V' },
-        { label: '实时功率', key: 'power', value: '0.01kW' },
-        { label: '额定电流', key: 'ratedCurrent', value: '0.01A' },
-        { label: '实时数据', key: 'realTimeData', value: '0.01kWh' },
-        { label: '额定功率', key: 'ratedPower', value: '0.01kW' },
-        { label: '冷却方式', key: 'coolingMethod', value: '风冷' }
-      ],
       chartOptions: [
         {
           type: 'line',
@@ -173,6 +182,52 @@ export default {
       chartData: {
         xdata: [],
         ydata: {}
+      },
+      modalComponent: 1,
+      columns: [
+        {
+          title: '序号',
+          dataIndex: 'id',
+          key: 'id',
+          ellipsis: true,
+          fixed: 'left'
+        },
+        {
+          title: '单体SOC（%）',
+          dataIndex: 'SOC',
+          key: 'SOC'
+        },
+        {
+          title: '单体SOH（%）',
+          dataIndex: 'SOH',
+          key: 'SOH'
+        },
+        {
+          title: '单体电压（V）',
+          dataIndex: 'V',
+          key: 'V'
+        },
+        {
+          title: '单体温度（℃）',
+          dataIndex: 'T',
+          key: 'T'
+        },
+        {
+          title: '单体内阻（Ω）',
+          dataIndex: 'R_i',
+          key: 'R_i'
+        }
+      ],
+      tableData: [],
+      pageOption: {
+        // pageSize: 1000,
+        // page: 1
+      },
+      tableOption: {
+        scroll: {
+          y: 500
+        },
+        page: false
       }
     }
   },
@@ -193,6 +248,11 @@ export default {
     this.getDeviceList()
   },
   methods: {
+    handlePagesizeChange(pageOption) {
+      this.pageOption.pageSize = pageOption.pageSize
+      this.pageOption.page = pageOption.page
+      this.getList()
+    },
     getIcongont(ele) {
       return deviceTypeList.find((item) => item.value == ele.type).iconfont || ''
     },
@@ -228,7 +288,22 @@ export default {
         this.chartData.xdata = this.generateTimePoints()
         this.$refs.chartRef1.initCharts()
         this.$refs.chartRef2.initCharts()
+      } catch (error) {
+        console.log(error)
+      }
+    },
+    //查询BCU单体信息
+    async getDeviceBCUDetail(item) {
+      try {
+        const res = await getReq('/queryDeviceBCUDetail', {
+          station_id: this.stationId,
+          device_id: item.device_id
+        })
 
+        this.tableData = res.data.map((item, index) => {
+          item.id = index + 1
+          return item
+        })
       } catch (error) {
         console.log(error)
       }
@@ -249,8 +324,14 @@ export default {
         console.log(error)
       }
     },
-    async openModal(item) {
+    async openModal(item, val) {
+      console.log(item, '=============')
+      this.modalComponent = val
+      if (val == 1) {
         await this.getDevicCharts(item)
+      } else {
+        await this.getDeviceBCUDetail(item)
+      }
 
       this.modalOpen = true
     },
@@ -268,13 +349,16 @@ export default {
   margin-left: 20px;
   display: grid;
   grid-gap: 20px;
-  grid-template-columns: 1fr 1fr 1fr;
   overflow-y: auto;
+  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
   .device-item {
     border-radius: 15px;
-
     background: $bg2-color;
     padding: 15px;
+    min-width: 340px;
+    max-width: 430px;
+    max-height: 230px;
+    flex: 1;
     .item-header {
       display: flex;
       align-items: center;
@@ -290,7 +374,7 @@ export default {
         background: linear-gradient(90deg, #3dfefa 0%, #2a82e4 2.96%, #27a188 100%),
           linear-gradient(90deg, #3dfefa 0%, #01dfef 2.96%, #08a5ff 100%);
         .iconfont {
-          font-size: 50px;
+          font-size: 45px;
         }
       }
       .title {
@@ -332,8 +416,8 @@ export default {
       grid-template-columns: 1fr 1fr;
       color: #fff;
       display: grid;
-      // line-height: 45px;
       margin-top: 15px;
+      margin-bottom: 3px;
       padding: 0 10px;
       height: 120px;
       overflow-y: auto;
@@ -345,7 +429,12 @@ export default {
       }
     }
     .item-button {
+      width: 100%;
       padding-left: 10px;
+      display: flex;
+      div {
+        width: calc(50% - 10px);
+      }
     }
     .text {
       color: $text-color;
@@ -354,26 +443,35 @@ export default {
       margin-top: 10px;
     }
   }
+  .content-table {
+    height: 700px;
+    margin-top: 40px;
+
+    :deep(.ant-table-header tr th) {
+      background: $table-border !important;
+      color: #fff;
+    }
+    :deep(.ant-table-body tr td, .ant-table-cell) {
+      background: $table-bg !important;
+      color: #fff;
+    }
+  }
 }
 .environment {
   width: 200px;
 }
-:deep(.modal-device) {
-  color: #fff;
-  .title {
-    display: flex;
-    font-weight: 700;
-    flex-direction: column;
 
-    img {
+:deep(.ant-modal-body) {
-      width: 232px;
+  :deep(.ant-table-wrapper .ant-table-row-expand-icon) {
-      height: 6px;
+    color: $green !important;
-      margin-top: 10px;
+  }
-    }
+  //表格行悬浮样式
-  }
+  .no-hover-row:hover > td {
-  .echarts {
+    // background-color: transparent !important;
-    width: 100%;
+    background-color: #f0f8ff !important;
-    height: 280px;
   }
 }
+//   .a-modal :deep(.ant-table-thead > tr > th) {
+//   background-color: #f0f8ff !important;
+// }
 </style>

web/src/components/monitor/videos.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="videos">
-    <div class="video-item" v-for="item in 8" :key="item">
+    <div class="video-item" v-for="item in videoList" :key="item">
       <div class="title">
-        <span>xxxxz监控点</span>
+        <span>{{ item.name }}</span>
         <img
           src="@/assets/images/fillScreen.png"
           alt=""
@@ -34,10 +34,9 @@
       <ComTable
         :columns="columns[activeTab]"
         :table-data="tableDatas[activeTab]"
-        @handlePagesizeChange="handlePagesizeChange"
         ref="comTable"
-        :table-option="tableOption"
+        :table-option="{page:false}"
-        :page-option="pageOption"
+
       >
       </ComTable>
     </div>
@@ -53,10 +52,6 @@ export default {
     stationId: {
       type: String,
       default: ''
-    },
-    systemType: {
-      type: Number,
-      default: 1
     }
   },
   data() {
@@ -111,7 +106,7 @@ export default {
             align: 'center'
           }
         ],
-        'temp_hum': [
+        temp_hum: [
           {
             title: '点位',
             dataIndex: 'pos',
@@ -158,20 +153,39 @@ export default {
       tableOption: {
         select: false,
         page: false
-      }
+      },
+      videoList: []
     }
   },
   mounted() {
+    console.log(this.systemType)
+
     this.getEnvironment()
+    this.getDeviceList()
   },
   methods: {
     async getEnvironment() {
       try {
         const res = await getReq('/queryEnvironment', { station_id: this.stationId })
-        console.log(res, '==============')
         this.tableDatas = res.data
-        // this.deviceList=res.data
+        
       } catch (error) {
+        this.tableDatas={}
+        console.log(error)
+      }
+    },
+    //请求运行监控系统设备信息
+    async getDeviceList() {
+      try {
+        const res = await getReq('/queryDevicByCategory', {
+          station_id: this.stationId,
+          category: 4
+        })
+
+        this.videoList = res.data.concat(res.data)
+      } catch (error) {
+        this.videoList = []
+
         console.log(error)
       }
     }
@@ -182,18 +196,18 @@ export default {
 <style lang="scss" scoped>
 .videos {
   width: calc(100% - 470px);
+  height: 100%;
   margin-left: 20px;
   display: grid;
   grid-gap: 20px;
-  grid-template-columns: 1fr 1fr;
   overflow-y: auto;
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
   .video-item {
-    // width: 410px;
-    // height: 340px;
     border-radius: 15px;
-
     background: $bg2-color;
-    padding: 10px;
+    padding: 15px;
+    max-height: 290px;
+    max-width: 400px;
     .title {
       display: flex;
       align-items: center;
@@ -250,6 +264,7 @@ export default {
         cursor: pointer;
         border: 1px solid $tab-border;
         border-radius: 4px;
+        text-align: center;
       }
     }
     .actived {

web/src/components/system/policyForm.vue

@@ -2,7 +2,7 @@
 <template>
   <div class="policyForm">
     <div class="title">
-      <div>基础信息{{ formStatus }}</div>
+      <div>基础信息</div>
       <img src="@/assets/images/titleLine.png" alt="" />
     </div>
     <a-form
@@ -645,32 +645,5 @@ export default {
 :deep(.ant-table-wrapper .ant-table-cell){
     background:none!important;
   }
-// /* 禁用行的 hover 过渡动画 */
-// .ant-table-tbody > tr.ant-table-row {
-//   transition: none !important;
-// }
 
-// /* 确保 hover 背景色完全透明 */
-// .ant-table-tbody > tr.ant-table-row:hover > td {
-//   background-color: transparent !important;
-// }
-// .ant-table-wrapper .ant-table-tbody > tr.ant-table-row:hover > td {
-//   background-color: transparent !important;
-// }
-// :deep(.ant-table-tbody > tr.ant-table-row:hover > td) {
-//   background-color: transparent !important;
-// }
-// :deep(.ant-table-tbody) {
-//   color: var(--theme-text-default) !important;
-
-//   > tr {
-//     &:hover {
-//       > .ant-table-cell {
-
-//         background: none !important;
-//       }
-//     }
-
-//   }
-// }
 </style>

web/src/main.js

@@ -3,21 +3,62 @@ import App from './App.vue'
 
 import router from './router'
 import store from './store'
-import Antd from 'ant-design-vue'
+
-import 'ant-design-vue/dist/reset.css'
 import '@/style/index.scss'
-// import '@/assets/iconfont/iconfont.css'
+
-import * as echarts from 'echarts'
+import * as echarts from 'echarts/core'
+import { BarChart, LineChart } from 'echarts/charts'
+import {
+  TitleComponent,
+  TooltipComponent,
+  GridComponent,
+  DatasetComponent,
+  LegendComponent,
+  TransformComponent,
+  DataZoomComponent
+} from 'echarts/components'
+// 标签自动布局、全局过渡动画等特性
+import { LabelLayout, UniversalTransition } from 'echarts/features'
+// 引入 Canvas 渲染器，注意引入 CanvasRenderer 或者 SVGRenderer 是必须的一步
+import { CanvasRenderer } from 'echarts/renderers'
 import { setWidth } from '@/utils/column'
 import { getBtns } from '@/utils/btnList'
-import { message, Modal } from 'ant-design-vue'
+import {
-
+  message,
+  Modal,
+  Button,
+  Table,
+  Tag,
+  Select,
+  DatePicker,
+  Input,
+  Pagination,
+  ConfigProvider,
+  notification,
+  TreeSelect
+} from 'ant-design-vue'
 import VueTianditu from 'vue-tianditu'
 import SearchBox from '@/components/SearchBox.vue'
 import ComTable from '@/components/ComTable.vue'
 import OperateCom from '@/components/OperateCom'
 import TreeTable from '@/components/TreeTable.vue'
 
+// 注册必须的组件
+echarts.use([
+  TitleComponent,
+  TooltipComponent,
+  GridComponent,
+  DatasetComponent,
+  TransformComponent,
+  DataZoomComponent,
+  BarChart,
+  LineChart,
+  LabelLayout,
+  UniversalTransition,
+  CanvasRenderer,
+  LegendComponent
+])
+
 const app = createApp(App)
 
 app.component('SearchBox', SearchBox)
@@ -31,4 +72,17 @@ app.config.globalProperties.$getBtns = getBtns
 app.config.globalProperties.$message = message
 app.config.globalProperties.$Modal = Modal
 
-app.use(store).use(router).use(Antd).use(VueTianditu).mount('#app')
+app.use(store).use(router)
+app
+  .use(Button)
+  .use(Modal)
+  .use(Table)
+  .use(Tag)
+  .use(Select)
+  .use(DatePicker)
+  .use(Input)
+  .use(Pagination)
+  .use(ConfigProvider)
+  .use(notification)
+  .use(TreeSelect)
+app.use(VueTianditu).mount('#app')

web/src/request/index.js

@@ -1,6 +1,6 @@
 import axios from 'axios'
 import openNotification from '../utils/notification'
-import { message } from 'ant-design-vue'
+// import { message } from 'ant-design-vue'
 
 const service = axios.create({
   baseURL: '/api',

web/src/router/index.js

@@ -89,13 +89,13 @@ export const routes = [
             component: () => import(/* webpackChunkName: "system" */ '@/views/system/device.vue')
           },
           {
-            name: 'alarmLog',
+            name: 'alarmlog',
-            path: 'log',
+            path: 'alarmlog',
             title: '告警日志',
             component: () => import(/* webpackChunkName: "system" */ '@/views/system/alarmLog.vue')
           },
           {
-            name: 'sylog',
+            name: 'syslog',
             path: 'syslog',
             title: '系统日志',
             component: () => import(/* webpackChunkName: "system" */ '@/views/system/log.vue')

web/src/utils/notification.js

@@ -1,4 +1,4 @@
-import { notification } from 'ant-design-vue'
+// import { notification } from 'ant-design-vue'
 import { h } from 'vue'
 import {
   CheckCircleFilled,
@@ -41,7 +41,7 @@ const notiInfo = {
   }
 }
 const openNotification = ({ name, type, status, desc = '' }) => {
-  notification[status]({
+  this.$notification[status]({
     placement: 'bottomRight',
     message: notiInfo[status].iconMessage,
     description: desc || option.names[name] + option.types[type] + option.status[status],

web/src/views/MainView.vue

@@ -95,7 +95,7 @@ export default {
             },
             {
               name: '告警日志',
-              path: '/log'
+              path: '/alarmlog'
             },
             {
               name: '系统日志',
@@ -214,7 +214,7 @@ export default {
 }
 .page {
   width: calc(100% - 20px);
-  height: calc(100% - 70px - 65px - 40px);
+  height: calc(100% - 70px - 60px - 40px);
   margin: 20px 10px;
   border-radius: 20px;
 }
@@ -227,7 +227,8 @@ export default {
 .menu {
   position: absolute;
   width: 100%;
-  bottom: 15px;
+  bottom: 10px;
+  height: 50px;
   // height: 150px;
   display: flex;
   justify-content: center;

web/src/views/monitor.vue

@@ -15,11 +15,13 @@
         <div class="search-item">
           <span>运行模式</span>
           <a-select v-model:value="workMode" style="width: 220px">
-            <a-select-option :value="item.value" v-for="item in workModes">{{ item.label }}</a-select-option>
+            <a-select-option :value="item.value" v-for="item in workModes">{{
+              item.label
+            }}</a-select-option>
           </a-select>
         </div>
         <div class="search-item">
-          <a-button type="primary">下发</a-button>
+          <a-button type="primary" @click="handleDispatch">下发</a-button>
         </div>
       </div>
     </div>
@@ -33,8 +35,9 @@
           :class="systemType == system.systemType ? 'active' : ''"
         >
           <span class="name">{{ system.name }}</span>
-          <span class="des">边缘网关：{{ system.power }} W</span>
+          <span class="des" v-for="title in system.titles" :key="title.v"
-          <span class="des">总有功功率(台区)：{{ system.num }}</span>
+            >{{ title.v }}：{{ system[title.key] }}{{ title.sufix }}
+          </span>
         </div>
       </div>
       <div class="container">
@@ -66,6 +69,10 @@ export default {
       systems: [
         {
           name: '储能系统',
+          titles: [
+            { v: '边缘网关', key: 'num' },
+            { v: '总有功功率(台区)', key: 'power', sufix: 'kW' }
+          ],
           power: 60,
           num: 62,
           systemType: 1
@@ -74,19 +81,31 @@ export default {
           name: '充电系统',
           power: 60,
           num: 62,
-          systemType: 2
+          systemType: 2,
+          titles: [
+            { v: '总功率', key: 'power', sufix: 'kW' },
+            { v: '数量', key: 'num' }
+          ]
         },
         {
           name: '光伏系统',
           power: 60,
           num: 62,
-          systemType: 3
+          systemType: 3,
+          titles: [
+            { v: '总功率', key: 'power', sufix: 'kW' },
+            { v: '数量', key: 'num' }
+          ]
         },
         {
           name: '安防系统',
           power: 60,
           num: 62,
-          systemType: 4
+          systemType: 4,
+          titles: [
+            { v: '总功率', key: 'power', sufix: 'kW' },
+            { v: '数量', key: 'num' }
+          ]
         }
         // {
         //   name: "储能系统4",
@@ -119,7 +138,6 @@ export default {
           value: 5,
           label: '自定时段'
         }
-       
       ],
       deviceGroup: []
     }
@@ -128,16 +146,30 @@ export default {
     this.getStations()
   },
   methods: {
+    //下发
+    async handleDispatch() {
+      console.log(this.workMode)
+      try {
+        const res = await postReq('/updateStation', {
+          station_id: this.selectStationId,
+          work_mode: this.workMode
+        })
+        if (res.errcode == 0) {
+          this.$message.success('下发成功')
+        }
+      } catch (error) {
+        this.$message.error('下发失败')
+      }
+    },
     //场站切换
     getStationChange(val) {
-      console.log(val);
+      console.log(val)
       this.getStationAttr()
-      
     },
     //查询场站列表
     async getStations() {
       try {
-        const res = await getReq('/queryStationList', { page: 0, 'page_size': 10000 })
+        const res = await getReq('/queryStationList', { page: 0, page_size: 10000 })
 
         this.stations = res.data
         this.selectStationId = this.stations[0]['station_id']
@@ -156,7 +188,7 @@ export default {
         res.data.device_group.forEach((Element, index) => {
           this.systems[index].num = Element.count
           this.systems[index].power = Element.power
-        });
+        })
         this.workMode = res.data.work_mode
       } catch (error) {
         this.deviceGroup = []
@@ -165,8 +197,9 @@ export default {
       }
     },
 
-    
     chooseStation(system) {
+      console.log(system, 'system')
+
       this.systemType = system.systemType
     }
   }
@@ -176,8 +209,8 @@ export default {
 <style scoped lang="scss">
 @import url(@/style/color.scss);
 .monitor {
-  width: 100%;
+  // width: 100%;
-  height: 100%;
+  height: calc(100% - 40px);
   padding: 20px;
   background: $bg1-color;
   border-radius: 15px;
@@ -207,24 +240,21 @@ export default {
     display: flex;
     justify-content: space-between;
     .stations {
-      min-width: 155px;
+      display: grid;
-      max-width: 235px;
-      width: 13%;
-      height: 100%;
       border-radius: 12px;
       background: $bg2-color;
-      padding: 15px 0;
+      padding-top: 10px;
-      overflow-y: auto;
+      grid-template-rows: repeat(auto-fit, minmax(140px, 4fr));
       .station-item {
-        width: calc(100% - 30px);
+        flex: 1;
-        margin: 0 15px 15px 15px;
+        width: 100px;
+        margin: 0 10px 10px 10px;
         border-radius: 12px;
-        min-width: 150px;
+        min-width: 160px;
-
         display: flex;
         flex-direction: column;
         color: #fff;
-        padding: 10px 15px;
+        padding: 10px 10px;
         cursor: pointer;
 
         .name {
@@ -236,6 +266,11 @@ export default {
           font-size: 14px;
           font-weight: 600;
           line-height: 40px;
+          display: inline-block;
+          max-width: 160px;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
         }
       }
       .active {
@@ -243,7 +278,7 @@ export default {
       }
     }
     .container {
-      width: 100%;
+      width: calc(100% - 200px);
       display: flex;
       justify-content: space-between;
     }

web/src/views/system/alarmLog.vue

@@ -1,9 +1,6 @@
 <template>
   <div class="alarmLog">
-    <searchBox
+    <searchBox :btn-option-list="btnOptionList" @operateForm="operateForm"></searchBox>
-      :btn-option-list="btnOptionList"
-      @operateForm="operateForm"
-    ></searchBox>
 
     <div class="content-table">
       <ComTable
@@ -11,17 +8,17 @@
         :table-data="tableData"
         @handlePagesizeChange="handlePagesizeChange"
         ref="comTable"
-        :table-option="tableOption"
         :page-option="pageOption"
-        :table-h="tableH"
       >
         <template #type="record">
           <span>{{ ['其它', '系统日志', '操作日志', '设备日志'][record.type] }}</span>
         </template>
         <template #status="record">
-          <span><a-tag :color="record.status ? 'red' : 'green'">{{
+          <span
+            ><a-tag :color="record.status ? 'red' : 'green'">{{
               record.status ? '异常' : '正常'
-              }}</a-tag></span>
+            }}</a-tag></span
+          >
         </template>
 
         <template #action="record">
@@ -47,11 +44,11 @@ import { getReq, postReq } from '@/request/api.js'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 export default {
   name: '',
   components: {
-    EditCom,
+    EditCom
   },
   props: {},
   data() {
@@ -64,7 +61,8 @@ export default {
         page: 1
       },
       btnOptionList: [],
-      paramsDate: {}
+      paramsDate: {},
+      tableData: []
     }
   },
   computed: {},
@@ -80,7 +78,7 @@ export default {
   },
 
   mounted() {
-    this.operateList = this.$getBtns(['查看',  '删除'])
+    this.operateList = this.$getBtns(['查看'])
     // this.btnOptionList = this.$getBtns(['新增'])
     this.getList()
   },
@@ -131,7 +129,6 @@ export default {
         this.formModal = false
         this.getList()
       }
-      
     },
     //  删除操作
     async handleDelete(id, callback) {
@@ -161,8 +158,6 @@ export default {
       })
     },
     async getRuleFormInfo(record) {
-      
-
       const row = record || {}
 
       for (let e of alarmlogOptions) {
@@ -183,8 +178,6 @@ export default {
           //   const attrs=JSON.parse(row.attrs||"{}")
           //   e.ruleForm[i.key] = attrs[i.key]
           // }
-          
-
         }
       }
     },
@@ -202,7 +195,7 @@ export default {
   height: 100%;
 
   .content-table {
-    height: calc(100% - 70px);
+    height: calc(100% - 90px);
     padding: 10px;
   }
 }

web/src/views/system/device.vue

@@ -48,7 +48,7 @@ import OperateCom from '@/components/OperateCom'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 import searchBox from '@/components/SearchBox.vue'
 import {deviceTypeList} from '@/utils/config'
 export default { 
@@ -170,7 +170,7 @@ export default {
     //  删除操作
     async handleDelete(id,callback) {
       const that = this
-      Modal.confirm({
+      this.$Modal.confirm({
         title: '你确认删除数据吗?',
         icon: createVNode(ExclamationCircleOutlined),
 
@@ -234,7 +234,7 @@ export default {
   height: 100%;
 
   .content-table {
-    height: calc(100% - 70px);
+    height: calc(100% - 90px);
     padding: 10px;
   }
 }

web/src/views/system/log.vue

@@ -1,9 +1,6 @@
 <template>
-  <div class="alarmlog">
+  <div class="syslog">
-    <searchBox
+    <searchBox :btn-option-list="btnOptionList" @operateForm="operateForm"></searchBox>
-      :btn-option-list="btnOptionList"
-      @operateForm="operateForm"
-    ></searchBox>
 
     <div class="content-table">
       <ComTable
@@ -11,13 +8,14 @@
         :table-data="tableData"
         @handlePagesizeChange="handlePagesizeChange"
         ref="comTable"
-        :table-option="tableOption"
         :page-option="pageOption"
-        :table-h="tableH"
       >
-        <template #gender="record">
+        <template #status="record">
-          <!-- 0:女; 1:男 -->
+          <span>
-          <span>{{ ['女', '男'][record.gender] }}</span>
+            <a-tag :color="record.status ? 'red' : 'green'">{{
+              record.status ? '异常' : '正常'
+            }}</a-tag>
+            </span>
         </template>
 
         <template #action="record">
@@ -38,7 +36,7 @@
 </template>
 
 <script>
-import { columnList, userOptions } from '../../../public/config/columnList'
+import { columnList, syslogOptions } from '../../../public/config/columnList'
 import { getReq, postReq } from '@/request/api.js'
 
 import EditCom from '@/components/EditCom.vue'
@@ -61,13 +59,14 @@ export default {
         page: 1
       },
       btnOptionList: [],
-      paramsDate: {}
+      paramsDate: {},
+      tableData: []
     }
   },
   computed: {},
   created() {
     let info = []
-    let col = columnList.find((i) => i.page == 'alarmlog').columns
+    let col = columnList.find((i) => i.page == 'syslog').columns
     if (col.length) {
       col.forEach((item) => {
         info.push(this.$setWidth(item))
@@ -77,8 +76,8 @@ export default {
   },
 
   mounted() {
-    this.operateList = this.$getBtns(['查看', '修改', '删除'])
+    this.operateList = this.$getBtns(['查看'])
-    this.btnOptionList = this.$getBtns(['新增'])
+    // this.btnOptionList = this.$getBtns(['新增'])
     this.getList()
   },
 
@@ -95,7 +94,7 @@ export default {
       }
 
       try {
-        const res = await getReq('/queryUserList', params)
+        const res = await getReq('/querySystemLogList', params)
         if (res.errcode === 0) {
           this.$refs.comTable.loading = false
 
@@ -114,41 +113,25 @@ export default {
         //统一处理报错提示
       }
     },
-    operateForm(type, record = {}) {
+    async operateForm(type, record = {}) {
-      console.log(record, record.id, 'rrrrrrrrrr')
       this.formStatus = type
-      switch (type) {
-      case 'add':
-        this.formModal = true
-        this.formState = {}
-        this.getRuleFormInfo()
 
-        break
+      if (type == 'edit' || type == 'read') {
-      case 'edit':
+        await this.getRuleFormInfo(record)
-      case 'read':
+
         this.formModal = true
         this.formState = record
-        this.getRuleFormInfo(record)
+      } else if (type == 'del') {
-        break
+        this.handleDelete([record.device_id], this.getList)
-
+      } else if (type == 'back') {
-      case 'del':
-        this.handleDelete([record.user_id], this.getList)
-
-        break
-
-      case 'back':
         this.formModal = false
         this.getList()
-        break
-
-      default:
-        break
       }
     },
     //  删除操作
     async handleDelete(id, callback) {
       const that = this
-      Modal.confirm({
+      this.$Modal.confirm({
         title: '你确认删除数据吗?',
         icon: createVNode(ExclamationCircleOutlined),
 
@@ -173,27 +156,13 @@ export default {
       })
     },
     async getRuleFormInfo(record) {
-      function getInfo(data, url) {
+      const row = record || {}
-        return new Promise((reslove, reject) => {
-          getReq(data, url).then((res) => {
-            reslove(res.data)
-          })
-        })
-      }
 
-      let row = {}
+      for (let e of syslogOptions) {
-      if (record && record.user_id) {
+        for (let i of e.list) {
-        // row = await getInfo({ id: record.id },'/queryUserList')
+          e.ruleForm[i.key] = row[i.key] || ''
-        this.record = record
+        }
-        row = record
-        // this.type='edit'
       }
-      userOptions.forEach((e, index) => {
-        e.list.forEach((i) => {
-          e.ruleForm[i.key] = row ? row[i.key] : ''
-          e.ruleForm.id = row.id
-        })
-      })
     },
     handlePagesizeChange(pageOption) {
       this.pageOption.pageSize = pageOption.pageSize
@@ -205,11 +174,11 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.user {
+.syslog {
   height: 100%;
 
   .content-table {
-    height: calc(100% - 70px);
+    height: calc(100% - 90px);
     padding: 10px;
   }
 }

web/src/views/system/permission.vue

@@ -49,7 +49,7 @@ import { getReq, postReq } from '@/request/api.js'
 
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 export default {
   name: '',
   components: {

web/src/views/system/policy.vue

@@ -234,7 +234,7 @@ export default {
 
 <style lang="scss" scoped>
 .policy {
-  width: 100%;
+  // width: 100%;
   height: 100%;
   padding: 0 15px;
   .content-table {

web/src/views/system/role.vue

@@ -52,7 +52,7 @@ import OperateCom from '@/components/OperateCom'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 import searchBox from '@/components/SearchBox.vue'
 export default {
   name: '',

web/src/views/system/service.vue

@@ -45,7 +45,7 @@ import { getReq, postReq } from '@/request/api.js'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 import searchBox from '@/components/SearchBox.vue'
 export default {
   name: '',

web/src/views/system/station.vue

@@ -52,7 +52,7 @@ import OperateCom from '@/components/OperateCom'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
+
 import searchBox from '@/components/SearchBox.vue'
 export default {
   name: '',

web/src/views/system/user.vue

@@ -42,20 +42,13 @@
 <script>
 import { columnList, userOptions } from '../../../public/config/columnList'
 import { getReq, postReq } from '@/request/api.js'
-import ComTable from '@/components/ComTable'
-import OperateCom from '@/components/OperateCom'
 import EditCom from '@/components/EditCom.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
 import { createVNode } from 'vue'
-import { Modal } from 'ant-design-vue'
-import searchBox from '@/components/SearchBox.vue'
 export default {
   name: '',
   components: {
-    searchBox,
     EditCom,
-    ComTable,
-    OperateCom
   },
   props: {},
   data() {
@@ -155,7 +148,7 @@ export default {
     //  删除操作
     async handleDelete(id,callback) {
       const that = this
-      Modal.confirm({
+      this.$Modal.confirm({
         title: '你确认删除数据吗?',
         icon: createVNode(ExclamationCircleOutlined),
 

web/vue.config.js

@@ -27,12 +27,18 @@ module.exports = defineConfig({
         @import "@/style/color.scss";
         @import "@/style/antd.scss";
         ` //在每个 .scss 文件顶部自动添加这行代码，无需手动导入
+      },
+      less: {
+        lessOptions: {
+          javascriptEnabled: true // 兼容 Less 3.0+ 的 JavaScript 表达式
+        }
       }
     },
     extract: {
       ignoreOrder: true // 忽略 CSS 顺序警告
     }
   },
+
   // webpack相关配置
   configureWebpack: {
     // 自定义打包入口