Merge branch 'master' of https://gitee.com/js-yhsec/energy_storage

web/.eslintrc.js

@@ -15,6 +15,7 @@ module.exports = {
   },
   plugins: ['react', '@typescript-eslint', 'prettier'], // 添加 prettier 插件
   rules: {
+    camelcase: 'off',
     'vue/require-explicit-emits': 'off', // 关闭 emits 声明检查
     'vue/v-on-event-hyphenation': 'off',
     'prettier/prettier': 'off',

web/public/config/columnList.js

@@ -1,3 +1,4 @@
+import { deviceTypeList, logTypes } from '@/utils/config'
 export const columnList = [
   {
     page: 'user',
@@ -113,6 +114,46 @@ export const columnList = [
       }
     ]
   },
+  {
+    page: 'permission',
+    columns: [
+      {
+        title: '权限ID',
+        dataIndex: 'permission_id',
+        key: 'permission_id',
+        ellipsis: true,
+        // filterable: true,
+        fixed: 'left'
+      },
+      {
+        title: '权限名称',
+        dataIndex: 'name',
+        key: 'name'
+        // filterable: true
+      },
+      {
+        title: '权限描述',
+        dataIndex: 'describe',
+        key: 'describe',
+        ellipsis: true
+        // filterable: true
+      },
+
+      {
+        title: '是否启用',
+        dataIndex: 'is_open',
+        key: 'is_open',
+        scopedSlots: { customRender: 'is_open' }
+      }
+
+      // {
+      //   title: '操作',
+      //   dataIndex: 'operate',
+      //   key: 'operate',
+      //   scopedSlots: { customRender: 'action' }
+      // }
+    ]
+  },
   {
     page: 'station',
     columns: [
@@ -139,16 +180,12 @@ export const columnList = [
       {
         title: '场站经度',
         dataIndex: 'lon',
-        width: 50,
         key: 'lon'
-        // filterable: true
       },
       {
         title: '场站纬度',
         dataIndex: 'lat',
-        width: 50,
         key: 'lat'
-        // filterable: true
       },
       {
         title: '储能容量',
@@ -164,10 +201,9 @@ export const columnList = [
         // filterable: true
       },
       {
-        title: '场站类别',
+        title: '储能容量',
         dataIndex: 'capacity',
-        key: 'capacity',
+        key: 'capacity'
-        scopedSlots: { customRender: 'capacity' }
       },
       {
         title: '场站状态',
@@ -177,9 +213,9 @@ export const columnList = [
       },
       {
         title: '场站运行模式',
-        dataIndex: 'work_mode_id',
+        dataIndex: 'work_mode',
-        key: 'work_mode_id',
+        key: 'work_mode',
-        scopedSlots: { customRender: 'work_mode_id' }
+        scopedSlots: { customRender: 'work_mode' }
       },
       {
         title: '场站运行策略',
@@ -188,6 +224,229 @@ export const columnList = [
         scopedSlots: { customRender: 'policy_id' }
       },
 
+      {
+        title: '操作',
+        dataIndex: 'operate',
+        key: 'operate',
+        scopedSlots: { customRender: 'action' }
+      }
+    ]
+  },
+  {
+    page: 'device',
+    columns: [
+      {
+        title: '设备ID',
+        dataIndex: 'device_id',
+        key: 'device_id',
+        ellipsis: true,
+        fixed: 'left'
+      },
+      {
+        title: '所属场站',
+        dataIndex: 'station_id',
+        key: 'station_id'
+        // filterable: true
+      },
+      {
+        title: '设备类型',
+        dataIndex: 'type',
+        key: 'type',
+        type: 'slot',
+        scopedSlots: { customRender: 'type' }
+      },
+      {
+        title: '设备名称',
+        dataIndex: 'name'
+      },
+      {
+        title: '设备编号',
+        dataIndex: 'code'
+      },
+
+      {
+        title: '厂家信息',
+        dataIndex: 'factory'
+      },
+      {
+        title: '厂家电话',
+        dataIndex: 'factory_tel'
+      },
+      {
+        title: '是否启用',
+        dataIndex: 'is_open',
+        key: 'is_open',
+        align: 'center',
+        scopedSlots: { customRender: 'isEnable' }
+      },
+
+      {
+        title: '属性参数',
+        dataIndex: 'attrs'
+      },
+      {
+        title: '操作',
+        dataIndex: 'operate',
+        key: 'operate',
+        scopedSlots: { customRender: 'action' }
+      }
+    ]
+  },
+  {
+    page: 'alarmLog',
+    columns: [
+      {
+        title: '日志ID',
+        dataIndex: 'log_id'
+      },
+
+      {
+        title: '日志类型',
+        dataIndex: 'type',
+        key: 'type',
+        width: 120,
+        scopedSlots: { customRender: 'type' }
+      },
+      {
+        title: '操作用户',
+        dataIndex: 'user_id',
+        key: 'user_id',
+        width: 120
+      },
+      {
+        title: '设备ID',
+        dataIndex: 'device_id',
+        key: 'device_id'
+      },
+      {
+        title: '日志内容',
+        dataIndex: 'content',
+        key: 'content',
+        ellipsis: true
+      },
+      {
+        title: '记录时间',
+        dataIndex: 'create_time',
+        key: 'create_time',
+        align: 'center',
+        ellipsis: true,
+        width: 180
+      },
+      {
+        title: '状态',
+        dataIndex: 'status',
+        key: 'status',
+        ellipsis: true,
+        scopedSlots: { customRender: 'status' },
+        width: 80,
+        align: 'center'
+      },
+      {
+        title: '操作',
+        dataIndex: 'operate',
+        key: 'operate',
+        scopedSlots: { customRender: 'action' }
+      }
+    ]
+  },
+  {
+    page: 'log',
+    columns: [
+      {
+        title: '用户',
+        dataIndex: 'userName',
+        width: 180
+      },
+
+      {
+        title: '日志类型',
+        dataIndex: 'type',
+        key: 'type',
+        width: 120,
+
+        scopedSlots: { customRender: 'type' }
+      },
+      {
+        title: '操作类型',
+        dataIndex: 'opType',
+        key: 'opType',
+        width: 120,
+
+        scopedSlots: { customRender: 'opType' }
+      },
+      {
+        title: 'ip',
+        dataIndex: 'ip',
+        key: 'ip'
+      },
+      {
+        title: '内容',
+        dataIndex: 'msg',
+        key: 'msg',
+        ellipsis: true
+      },
+      {
+        title: '生成时间',
+        dataIndex: 'createTime',
+        key: 'createTime',
+        align: 'center',
+        ellipsis: true,
+        width: 180
+      },
+      {
+        title: '状态',
+        dataIndex: 'status',
+        key: 'status',
+        ellipsis: true,
+        scopedSlots: { customRender: 'status' },
+        width: 80,
+        align: 'center'
+      },
+      {
+        title: '操作',
+        dataIndex: 'operate',
+        key: 'operate',
+        width: 80,
+        scopedSlots: { customRender: 'action' }
+      }
+    ]
+  },
+  {
+    page: 'serviceApi',
+    columns: [
+      {
+        title: '接口ID',
+        dataIndex: 'api_id',
+        key: 'api_id',
+        ellipsis: true,
+        // filterable: true,
+        fixed: 'left'
+      },
+      {
+        title: '接口名称',
+        dataIndex: 'name',
+        key: 'name'
+        // filterable: true
+      },
+      {
+        title: '接口描述',
+        dataIndex: 'describe',
+        key: 'describe'
+        // filterable: true
+      },
+      {
+        title: '接口参数',
+        dataIndex: 'params',
+        key: 'params'
+      },
+
+      {
+        title: '是否启用',
+        dataIndex: 'is_open',
+        key: 'is_open',
+        scopedSlots: { customRender: 'is_open' }
+      },
+
       {
         title: '操作',
         dataIndex: 'operate',
@@ -277,8 +536,54 @@ export const roleOptions = [
         value: '',
         key: 'permission',
         type: 'slot',
-        slotName: 'permission',
+        slotName: 'treetable',
-        className: 'item-l'
+        className: 'item-l',
+        tableData: [],
+        selectTableData: [],
+        columns: [
+          {
+            title: '名称',
+            dataIndex: 'name',
+            key: 'name',
+            ellipsis: true,
+            filterable: true,
+            fixed: 'left'
+          },
+          {
+            title: '页面路径',
+            dataIndex: 'route',
+            key: 'route'
+            // filterable: true
+          },
+          {
+            title: '是否允许新增操作',
+            dataIndex: 'is_add',
+            key: 'is_add',
+            align: 'center',
+            scopedSlots: { customRender: 'is_add' }
+          },
+          {
+            title: '是否允许删除操作',
+            dataIndex: 'is_del',
+            key: 'is_del',
+            align: 'center',
+            scopedSlots: { customRender: 'is_del' }
+          },
+          {
+            title: '是否允许编辑操作',
+            dataIndex: 'is_edit',
+            key: 'is_edit',
+            align: 'center',
+            scopedSlots: { customRender: 'is_edit' }
+          },
+          {
+            title: '是否允许查看操作',
+            dataIndex: 'is_view',
+            key: 'is_view',
+            align: 'center',
+            scopedSlots: { customRender: 'isQuery' }
+          }
+        ]
       },
       {
         // 0:禁用; 1:启用
@@ -374,7 +679,7 @@ export const stationOptions = [
 
         label: '场站运行模式',
         value: undefined,
-        key: 'work_mode_id',
+        key: 'work_mode',
         type: 'select',
         list: [
           {
@@ -417,6 +722,210 @@ export const stationOptions = [
     ruleForm: {}
   }
 ]
+export const deviceOptions = [
+  {
+    title: '基础信息',
+    icon: 'icon-xinxi',
+    list: [
+      {
+        label: '编号',
+        value: '',
+        key: 'code',
+        type: 'input'
+      },
+      {
+        label: '名称',
+        value: '',
+        key: 'name',
+        type: 'input'
+      },
+      {
+        label: '类型',
+        value: '',
+        key: 'type',
+        type: 'select',
+        list: deviceTypeList,
+        options: {
+          label: 'label',
+          value: 'value'
+        }
+      },
+
+      {
+        label: '所属场站',
+        value: undefined,
+        key: 'station_id',
+        type: 'select',
+        list: [],
+        options: {
+          label: 'name',
+          value: 'station_id'
+        }
+        // slotName: 'searchSelect'
+      },
+      {
+        label: '厂家',
+        value: '',
+        key: 'factory',
+        type: 'input'
+      },
+      {
+        label: '厂家电话',
+        value: '',
+        key: 'factory_tel',
+        type: 'input'
+      },
+      {
+        label: '是否启用',
+        value: '',
+        key: 'is_open',
+        type: 'switch'
+      }
+    ],
+    ruleForm: {}
+  },
+  {
+    title: '设备属性参数',
+    icon: 'icon-xinxi',
+    list: [
+      {
+        label: '额定电压',
+        value: '',
+        key: 'rated_voltage',
+        type: 'input-number'
+      },
+      {
+        label: '额定电流',
+        value: '',
+        key: 'rated_current',
+        type: 'input-number'
+      },
+      {
+        label: '额定功率',
+        value: '',
+        key: 'reted_power',
+        type: 'input-number'
+      },
+
+      {
+        label: '额定容量',
+        value: undefined,
+        key: 'rated_capacity',
+        type: 'input-number'
+      }
+    ],
+    ruleForm: {}
+  }
+]
+// log
+export const alarmlogOptions = [
+  {
+    title: '基础信息',
+    icon: 'icon-xinxi',
+    list: [
+      {
+        label: '日志ID',
+        value: '',
+        key: 'log_id',
+        type: 'input'
+      },
+      {
+        label: '日志类型',
+        value: '',
+        key: 'type',
+        type: 'select',
+        list: logTypes,
+        disabled: true
+      },
+      {
+        label: '操作用户ID',
+        value: '',
+        key: 'user_id',
+        type: 'input',
+        disabled: true
+      },
+      {
+        label: '设备ID',
+        value: '',
+        key: 'device_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'
+      }
+    ],
+    ruleForm: {}
+  }
+]
+export const serviceApiOptions = [
+  {
+    title: '基础信息',
+    icon: 'icon-xinxi',
+    list: [
+      {
+        label: '接口名称',
+        value: '',
+        key: 'name',
+        type: 'input'
+      },
+      {
+        label: '接口参数',
+        value: '',
+        key: 'params',
+        type: 'input'
+      },
+      {
+        label: '接口描述',
+        value: '',
+        key: 'describe',
+        type: 'textarea'
+      },
+
+      {
+        label: '是否启用',
+        value: '',
+        key: 'is_open',
+        type: 'switch',
+        className: 'item-l',
+        list: [
+          {
+            label: '禁用',
+            value: '0'
+          },
+          {
+            label: '启用',
+            value: '1'
+          }
+        ]
+      }
+    ],
+    ruleForm: {}
+  }
+]
 
 export const userFormRules = {
   account: [
@@ -452,3 +961,43 @@ export const stationFormRules = {
     }
   ]
 }
+export const deviceFormRules = {
+  name: [
+    {
+      trigger: 'blur',
+      required: true,
+      message: '请输入设备名称'
+    }
+  ],
+  code: [
+    {
+      trigger: 'blur',
+      required: true,
+      message: '请输入设备编号'
+    }
+  ],
+  type: [
+    {
+      trigger: 'change',
+      required: true,
+      message: '请选择设备类型'
+    }
+  ],
+  station_id: [
+    {
+      trigger: 'change',
+      required: true,
+      message: '请选择场站名称'
+    }
+  ]
+}
+
+export const serviceApiFormRules = {
+  name: [
+    {
+      trigger: 'blur',
+      required: true,
+      message: '请输入接口名称'
+    }
+  ]
+}

web/public/index.html

@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
     <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
     <title><%= htmlWebpackPlugin.options.title %></title>
-    <link rel="stylesheet" href="http://at.alicdn.com/t/c/font_5010233_ev88efo2nou.css" />
+    <link rel="stylesheet" href="http://at.alicdn.com/t/c/font_5010233_6lxuclaoex9.css" />
   </head>
   <body>
     <noscript>

web/src/components/ComTable.vue

@@ -108,7 +108,7 @@ const props = defineProps({
     default: () => {
       return {
         count: 1,
-        pageSize: 10,
+        pageSize: 5,
         page: 1
       }
     }
@@ -152,7 +152,7 @@ const data = reactive({
 
   newPageOption: {},
   newTableOpt: {},
-  pageSizeOptions: ['15', '20', '30', '40', '50', '100'],
+  pageSizeOptions: ['10', '20', '30', '40', '50', '100'],
   mountedScroll
 })
 const loading = ref(false)
@@ -410,30 +410,8 @@ defineExpose({ ...toRefs(data), loading, mountedScroll, scroll: data.scroll })
   background-color: transparent !important;
 }
 
-:deep(
+
-    .ant-table-wrapper
+
-      .ant-table.ant-table-bordered
-      > .ant-table-container
-      > .ant-table-body
-      > table
-      > tbody
-      > tr
-      > .ant-table-cell-fix-right-first::after
-  ) {
-  // border-inline-end: 1px solid var(--theme-bg) !important;
-}
-:deep(
-    .ant-table-wrapper
-      .ant-table.ant-table-bordered
-      > .ant-table-container
-      > .ant-table-header
-      > table
-      > thead
-      > tr
-      > .ant-table-cell-fix-right-first::after
-  ) {
-  // border-inline-end: 1px solid var(--theme-bg) !important;
-}
 
 :deep(.ant-table-wrapper .ant-table-thead th.ant-table-column-has-sorters:hover) {
   background: var(--table-select) !important;

web/src/components/DetailInfo.vue

@@ -1,13 +1,10 @@
 <!-- item.type:xxxx-unshow:表示不显示  items.displayFlag为false表示不展示卡片 -->
 <template>
   <div class="card-content">
-    <a-card
+    <a-card style="margin: 0 0 15px 0; text-align: left">
-      style="margin: 0 0 15px 0; text-align: left"
-    >
       <div :class="['info-title', items.title ? '' : 'title-none']">
         <div class="box">
-          
+          <div>
-          <div >
             {{ items.title ? items.title : '基础信息' }}
           </div>
 
@@ -39,7 +36,7 @@
           layout="horizontal"
           :wrap="true"
           ref="formRef"
-           :rules="props.formRules"
+          :rules="props.formRules"
           name="info-form"
           class="info-form"
           label-align="left"
@@ -138,13 +135,24 @@
                   :disabled="!props.disabled && type ? !!item.disabled : props.disabled"
                   allow-clear
                 >
-                  <a-select-option
+                  <template v-if="item.options">
-                    :value="selectItem.value"
+                    <a-select-option
-                    v-for="selectItem in item.list"
+                      :value="selectItem[item.options.value]"
-                    :key="selectItem.value"
+                      v-for="selectItem in item.list"
-                  >
+                      :key="selectItem[item.options.value]"
-                    {{ selectItem.label }}
+                    >
-                  </a-select-option>
+                      {{ selectItem[item.options.label] }}
+                    </a-select-option>
+                  </template>
+                  <template v-else>
+                    <a-select-option
+                      :value="selectItem.value"
+                      v-for="selectItem in item.list"
+                      :key="selectItem.value"
+                    >
+                      {{ selectItem.label }}
+                    </a-select-option>
+                  </template>
                 </a-select>
                 <!-- 下拉多选 -->
                 <a-select
@@ -548,11 +556,8 @@ defineExpose({
 }
 .card-content {
   margin-top: 15px;
- 
- 
 }
 
-
 :deep(.ant-timeline) {
   color: var(--theme-text-default) !important;
 
@@ -572,14 +577,13 @@ defineExpose({
   margin-bottom: 20px;
 
   .box {
-    color:#fff;
+    color: #fff;
-    width:230px;
+    width: 230px;
     display: flex;
     align-items: center;
     margin-bottom: 10px;
-border-bottom: 5px solid transparent;
+    border-bottom: 5px solid transparent;
-border-image: url('../assets/boxBottom.png') 0 0 100% 0 stretch;
+    border-image: url('../assets/boxBottom.png') 0 0 100% 0 stretch;
-
 
     div:last-child {
       height: 25px;
@@ -603,9 +607,8 @@ border-image: url('../assets/boxBottom.png') 0 0 100% 0 stretch;
 .title-none {
   display: none;
 }
-:deep(.ant-card){
+:deep(.ant-card) {
   background-color: transparent;
-
 }
 :deep(.ant-card-body) {
   padding: 15px;
@@ -629,25 +632,24 @@ border-image: url('../assets/boxBottom.png') 0 0 100% 0 stretch;
   height: calc(100% - 30px);
   .info-form {
     .item-div {
-      
+      width: 45%;
-      width:45%;
 
       display: inline-block;
     }
-    .item-l{
+    .item-l {
-      width:100%;
+      width: 100%;
     }
 
     .form-item {
-      width:320px!important;
+      width: 320px !important;
     }
   }
 }
 
 :deep(.ant-form-item-label) {
-  color:#fff;
+  color: #fff;
   font-size: 16px !important;
-  width:100px;
+  width: 100px;
 }
 
 :deep(.ant-form-item-control-wrapper) {
@@ -678,14 +680,15 @@ border-image: url('../assets/boxBottom.png') 0 0 100% 0 stretch;
   }
 }
 
-
 :deep(.ant-calendar-picker) {
   width: 100% !important;
 }
 :deep(.ant-picker) {
   width: 100% !important;
 }
-
+:deep(.ant-input-number) {
+  width: 100% !important;
+}
 
 :deep(.ant-form-item.form-item) {
   padding: 0px !important;
@@ -702,19 +705,7 @@ border-image: url('../assets/boxBottom.png') 0 0 100% 0 stretch;
   color: var(--theme-text-default) !important;
 }
 
-
 :deep(.ant-checkbox-wrapper) {
   color: var(--theme-text-default);
 }
-
-
-
-
-
-
-
-
-
-
-
 </style>

web/src/components/EditCom.vue

@@ -27,31 +27,28 @@
         </template>
         <template #treetable="item">
           <TreeTable
+            class="treeTable"
             :columns="item.columns"
             :table-data="item.tableData"
             ref="treeTable"
             :transfer-dialog="transferDialog"
-            @handleDetailPagesizeChange="handleDetailPagesizeChange"
             :table-option="{
               checkStrictly: false,
               selectTableData: item.selectTableData,
               scroll: { y: 500 }
             }"
           >
-            <template #isQuery="record">
+            <template #is_add="recordList">
-              <a-tag :color="record.isQuery ? 'green' : 'red'">{{
+              <a-checkbox v-model:checked="recordList.is_add"></a-checkbox>
-                record.isQuery ? '启用' : '禁用'
-              }}</a-tag>
             </template>
-            <template #isEdit="record">
+            <template #is_del="recordList">
-              <a-tag :color="record.isEdit ? 'green' : 'red'">{{
+              <a-checkbox v-model:checked="recordList.is_del"></a-checkbox>
-                record.isEdit ? '启用' : '禁用'
-              }}</a-tag>
             </template>
-            <template #isControl="record">
+            <template #is_edit="recordList">
-              <a-tag :color="record.isControl ? 'green' : 'red'">{{
+              <a-checkbox v-model:checked="recordList.is_edit"></a-checkbox>
-                record.isControl ? '启用' : '禁用'
+            </template>
-              }}</a-tag>
+            <template #isQuery="recordList">
+              <a-checkbox v-model:checked="recordList.isQuery"></a-checkbox>
             </template>
           </TreeTable>
         </template>
@@ -66,10 +63,18 @@
 </template>
 
 <script>
-import { userOptions, userFormRules,
+import {
-  roleOptions,roleFormRules,
+  userOptions,
-  stationOptions,stationFormRules
+  userFormRules,
-
+  roleOptions,
+  roleFormRules,
+  stationOptions,
+  stationFormRules,
+  deviceOptions,
+  deviceFormRules,
+  alarmlogOptions,
+  serviceApiOptions,
+  serviceApiFormRules
 } from '../../public/config/columnList'
 import DetailInfo from './DetailInfo.vue'
 import { postReq, getReq } from '@/request/api'
@@ -111,9 +116,12 @@ export default {
       formRules: {},
       apiMethods: {
         // menu: 'menuConfirm',
-        // permission: 'permissionConfirm',
         user: 'userConfirm',
         role: 'roleConfirm',
+        device: 'deviceConfirm',
+        station: 'stationConfirm',
+        serviceApi: 'serviceApiConfirm',
+        // permission: 'permissionConfirm',
       },
       form: {},
       ObjInfo: {},
@@ -158,6 +166,18 @@ export default {
           this.detailInfos = stationOptions
           this.formRules = stationFormRules
 
+          break
+        case 'device':
+          this.detailInfos = deviceOptions
+          this.formRules = deviceFormRules
+          break
+        case 'alarmLog':
+          this.detailInfos = alarmlogOptions
+          this.formRules = {}
+        case 'serviceApi':
+          this.detailInfos = serviceApiOptions
+          this.formRules = serviceApiFormRules
+
           break
 
         default:
@@ -286,21 +306,24 @@ export default {
           add: '/insertRole',
           edit: '/deleteRole'
         }
+        const { selectedRowKeys } = this.$refs.treeTable[0]
+        console.log(selectedRowKeys, 'selectedRowKeys')
         const paramsDate = {
           ...this.form
         }
-        if (this.action == 'edit') {
-          paramsDate.role_id = this.record.role_id
-        }
 
-        const res = await postReq(menuApi[this.action], paramsDate)
+        // if (this.action == 'edit') {
-        if (res.errcode === 0) {
+        //   paramsDate.role_id = this.record.role_id
-          setTimeout(() => {
+        // }
-            this.handleback()
+
-          }, 1000)
+        // const res = await postReq(menuApi[this.action], paramsDate)
-        } else {
+        // if (res.errcode === 0) {
-          throw res
+        //   setTimeout(() => {
-        }
+        //     this.handleback()
+        //   }, 1000)
+        // } else {
+        //   throw res
+        // }
       } catch (error) {
         console.log(error, 'roleConfirm')
       }
@@ -330,6 +353,62 @@ export default {
         console.log(error, 'stationConfirm')
       }
     },
+    async deviceConfirm() {
+      try {
+        const menuApi = {
+          add: '/insertDevice',
+          edit: '/updateDevice'
+        }
+        const { is_open, rated_capacity, rated_current, rated_voltage, reted_power } = this.form
+        const paramsDate = {
+          ...this.form,
+          is_open: Number(is_open),
+          attrs: JSON.stringify({rated_capacity, rated_current, rated_voltage, reted_power})
+        }
+
+
+        if (this.action == 'edit') {
+          paramsDate.device_id = this.record.device_id
+        }
+
+        const res = await postReq(menuApi[this.action], paramsDate)
+        if (res.errcode === 0) {
+          this.$message.success('添加成功')
+          setTimeout(() => {
+            this.handleback()
+          }, 1000)
+        } else {
+          throw res
+        }
+      } catch (error) {
+        this.$message.error('添加失败')
+      }
+    },
+    async serviceApiConfirm() {
+      try {
+        const menuApi = {
+          add: '/insertServiceApi',
+          edit: '/updateServiceApi'
+        }
+        const paramsDate = {
+          ...this.form
+        }
+        if (this.action == 'edit') {
+          paramsDate.api_id = this.record.api_id
+        }
+
+        const res = await postReq(menuApi[this.action], paramsDate)
+        if (res.errcode === 0) {
+          setTimeout(() => {
+            this.handleback()
+          }, 1000)
+        } else {
+          throw res
+        }
+      } catch (error) {
+        console.log(error, 'stationConfirm')
+      }
+    },
     handleback() {
       this.$emit('operateForm', 'back')
     },
@@ -370,4 +449,8 @@ export default {
 :deep(.ant-picker) {
   color: var(--theme-text-default) !important;
 }
+
+:deep(.treeTable) {
+  width: 550px !important;
+}
 </style>

web/src/components/Home/Map.vue

@@ -1,10 +1,28 @@
 <template>
   <div class="map">
-    <div>
+   
-      <div class="icon1" @click="showModal(testVal)"></div>
+    <div ref="mapContent" class="mapContent" >
-      <div class="icon"></div>
+      <tdt-map
+        ref="tiandituMap"
+        :center="center"
+        :zoom="zoom"
+        @init="init"
+        map-style="black"
+        class="amap-box"
+        :mid="'amap-vue'"
+      >
+        <tdt-marker
+          v-for="marker in markers"
+          :position="[marker.lon, marker.lat]"
+          :key="marker.id"
+          :icon="marker.iconMap"
+          style="width: 20px; height: 20px"
+          @click="clickArrayMarker(marker)"
+          :title="marker.name"
+        >
+        </tdt-marker>
+      </tdt-map>
     </div>
-    <div ref="mapContent"></div>
     <a-modal
       class="modal"
       ref="modal"
@@ -16,10 +34,7 @@
       :mask="true"
     >
       <template #closeIcon>
-        <i
+        <i class="iconfont icon-guanbi" style="font-size: 20px; cursor: pointer; color: #fff" />
-          class="iconfont icon-guanbi"
-          style="font-size:20px; cursor: pointer; color: #fff; "
-        />
       </template>
       <div class="modal-content">
         <div class="home-modal">
@@ -32,39 +47,133 @@
 <script>
 import { getReq, postReq } from '@/request/api'
 import Modal from '@/components/Home/Modal.vue'
+import { loadTMap } from '@/utils/loadTMap'
+import {gcj02ToWgs84} from '@/utils/gcj02ToWgs84'
+import { TdtMap } from 'vue-tianditu'
+
 export default {
   name: 'Map',
-  components: { Modal },
+  components: { Modal, TdtMap },
 
   data() {
     return {
+      center: [],
+      // zoom: 16,
+      zoom: 2,
+      map: null,
+      currentMarker: {},
       showCtrModal: false,
+      markers: [],
+
       testVal: {
         name: '场站211',
         id: '2'
       },
-      changeStationId:''
+      changeStationId: '',
+      targetKey: '98d875e39cf0ebab01e56a0f86c5ed44'
     }
   },
-  mounted() {},
+  mounted() {
+    this.initMap()
+    // this.getMarkList()
+  },
   methods: {
-    async showModal(currentVal) {
+    init(map) {
-      this.changeStationId=currentVal.id
+      this.map = map
-      console.log(currentVal, 'cccccccccccccccccccccc')
+      // console.log(this.map.getCenter(),"this.map.getCenter()")
-      this.showCtrModal = true
+      this.map.centerAndZoom(new T.LngLat(116.404, 39.915), 12);
+      // 监听地图加载完成事件
+      this.map.addEventListener('load', () => {
+        const c= this.map.getCenter()
+        this.center =gcj02ToWgs84(c);
+        console.log('GCJ02坐标:', this.center);
+      });
+      this.getMarkList()
+    },
+    async getMarkList() {
       try {
-        const query = {
+        let query = {
-          // station_id:this.changeStationId
+          role_id: localStorage.getItem('permission')[0].role_id
         }
-        const res = await postReq(query, '')
+        const res = await getReq('/queryStationList', query)
-        if (res.code == 200) {
+        if (res.errcode === 0) {
-          this.modalInfo = res.data.records
+          this.markers = res.data.map((item) => {
+            console.log(gcj02ToWgs84(+item.lon, +item.lat),"gcj02ToWgs84(+item.lon, +item.lat)")
+            let wgs = +item.lat && +item.lon ? gcj02ToWgs84(+item.lon, +item.lat) : [null, null]
+            return {
+              ...item,
+              lon: wgs[0],
+              lat: wgs[1],
+              iconMap: !+item.status
+                ? require('../../assets/home/homeIcon1.png')
+                : require('../../assets/home/homeIcon.png')
+            }
+          })
+          console.log("this.markers ",this.markers )
+        } else {
+          this.markers = []
+          throw res
+        }
+      } catch (error) {
+        console.log(error,'eeeeeeeeeeeeeeee')
+      }
+    },
+    async initMap() {
+      try {
+        const [mapKey] = await Promise.all([this.getSysConfig('map-key')])
+        // const gcj02LngLat=map.getCenter()
+        // console.log(gcj02LngLat.getLng())
+        console.log(mapKey,"mapKey")
+        await loadTMap(mapKey)
+        
+
+        // 创建地图实例（需要HTML中存在id为mapContainer的元素）  
+        // this.map = new T.Map("amap-vue");  
+        // // this.map.centerAndZoom(new T.LngLat(116.404, 39.915), 12); // 初始中心点  
+        
+        // const centerGcj02 = this.map.getCenter();  
+        // console.log("GCJ02坐标:", centerGcj02.getLng(), centerGcj02.getLat());  
+        // const centerWgs84=gcj02ToWgs84(centerGcj02.getLng(),centerGcj02.getLat())
+
+
+
+        // this.center =[]
+      } catch (err) {
+        console.error('天地图加载失败:', err)
+      }
+    },
+    async getSysConfig() {
+      let sysConfig
+      try {
+        const query = {}
+        const res = await getReq('/', query)
+        if (res.errcode === 0) {
+          sysConfig = res.data.value
         } else {
           throw res
         }
-      } catch (err) {
+      } catch (error) {
-        console.log(err, 'eeeeeeeeeeeeeeeerr')
+        sysConfig = this.targetKey
       }
+      return sysConfig
+    },
+    async clickArrayMarker(currentVal) {
+      this.changeStationId = currentVal.station_id
+      console.log(currentVal, 'cccccccccccccccccccccc')
+      this.showCtrModal = true
+      // try {
+      //   const query = {
+      //     // station_id:this.changeStationId
+      //   }
+      //   const res = await postReq(query, '')
+      //   if (res.errcode === 0) {
+      //     this.modalInfo = res.data.records
+      //   } else {
+      //     throw res
+      //   }
+      // } catch (err) {
+      //   console.log(err, 'eeeeeeeeeeeeeeeerr')
+      // }
     }
   }
 }
@@ -73,6 +182,10 @@ export default {
 .map {
   width: 100%;
   height: 100%;
+
+  .mapContent{
+    height:100%;
+  }
   .icon1 {
     width: 32px;
     height: 80px;
@@ -112,11 +225,11 @@ export default {
       margin: auto;
       box-shadow: none;
       background: transparent;
-.ant-modal-close{
+      .ant-modal-close {
-  position: absolute;
+        position: absolute;
-    right: 0;
+        right: 0;
-    top: 3px;
+        top: 3px;
-}
+      }
       .ant-modal-body {
         height: calc(100% - 45px);
         color: #fff;
@@ -148,5 +261,9 @@ export default {
   .home-modal {
     height: 100%;
   }
+
+  :deep(.tdt-marker-icon){
+    height:auto!important;
+  }
 }
 </style>

web/src/components/Home/Modal.vue

@@ -9,8 +9,14 @@
         </div>
         <component
           :is="item.componentId"
-          :props-total="item.infoKey=='prefab'? modalInfo.prefabTotal: modalInfo.allTotal"
           :props-info="modalInfo[item.infoKey]"
+          :props-total="
+            ['prefab', 'dataTotal'].includes(item.infoKey)
+              ? item.key == 'prefab'
+                ? modalInfo.prefabTotal
+                : modalInfo.dataTotal
+              : modalInfo.allTotal
+          "
         ></component>
       </div>
     </div>
@@ -71,7 +77,7 @@ export default {
           title: '运行信息',
           class: 'operation-status',
           componentId: OperationalInfo,
-          infoKey: ''
+          infoKey: 'dataTotal'
         },
         {
           title: '场站收益情况',
@@ -96,11 +102,11 @@ export default {
           title: '环境信息',
           class: 'envInfo',
           componentId: EnvInfo,
-          infoKey: ''
+          infoKey: 'dataTotal'
         }
       ],
       sysName: '',
-      user: JSON.parse(localStorage.getItem('user')) || {}
+      user: JSON.parse(localStorage.getItem('permission')) || {}
     }
   },
   computed: {
@@ -115,7 +121,8 @@ export default {
     await Promise.all([
       this.getStatTotalList(),
       this.queryStationInfo(),
-      this.getStatDayList(1),
+      this.queryStationData(),
+      this.getStatDayList(1)
     ])
   },
 
@@ -145,15 +152,33 @@ export default {
         this.modalInfo.allTotal = {}
       }
     },
+    // 查询场站实时数据
+    async queryStationData() {
+      try {
+        // station_id：场站ID
+
+        const query = {
+          station_id: this.stationId
+        }
+        const res = await getReq('/queryStationData', query)
+        if (res.errcode === 0) {
+          this.modalInfo.dataTotal = res.data
+        } else {
+          throw res
+        }
+      } catch (error) {
+        this.modalInfo.dataTotal = {}
+      }
+    },
     // 查询场站信息
     async queryStationInfo() {
       try {
         // station_id：场站ID
 
         const query = {
-          station_id: this.stationId,
+          station_id: this.stationId
         }
-        const res = await getReq('//queryStationInfo', query)
+        const res = await getReq('/queryStationInfo', query)
         if (res.errcode === 0) {
           this.modalInfo.prefabTotal = res.data
         } else {

web/src/components/Home/Modal/EnvInfo.vue

@@ -30,9 +30,29 @@ export default {
   },
   data() {
     return {
+      coolingList: [
+        {
+          label: '关机',
+          value: '0'
+        },
+        {
+          label: '开机',
+          value: '1'
+        }
+      ],
+      aircList: [
+        {
+          label: '关机',
+          value: '0'
+        },
+        {
+          label: '开机',
+          value: '1'
+        }
+      ],
       list: [
         {
-          key: 'key1',
+          key: 'coolingStatus',
           value: '制冷',
           d: '',
           label: '冷机',
@@ -41,7 +61,7 @@ export default {
           color: '#F69B52'
         },
         {
-          key: 'key2',
+          key: 'aircStatus',
           value: '开机',
           d: '',
           label: '空调',
@@ -50,7 +70,7 @@ export default {
           color: '#9BD801'
         },
         {
-          key: 'key3',
+          key: 'envTemp',
           value: 24,
           d: '℃',
           label: '环境温度',
@@ -59,7 +79,7 @@ export default {
           color: '#3DFEFA'
         },
         {
-          key: 'key4',
+          key: 'envhum',
           value: 26,
           d: '%',
           label: '环境湿度',
@@ -70,20 +90,27 @@ export default {
       ]
     }
   },
-  computed: {
+
-    leftList() {
-      return this.list.filter((_, index) => index % 2 === 0).slice(0, 3) // 左列取前3个偶数索引
-    },
-    rightList() {
-      return this.list.filter((_, index) => index % 2 !== 0).slice(0, 3) // 右列取前3个奇数索引
-    }
-  },
   watch: {
     propsTotal: {
       handler(newVal, oldVal) {
         if (newVal !== oldVal) {
           this.list.forEach((item) => {
-            item.value = this.propsTotal[item.key]
+            console.log(this.propsTotal,this.propsTotal[item.key],"this.propsTotal[item.key]")
+            if (item.key == 'coolingStatus') {
+              console.log(this.coolingList.find(
+                (e) => e.value == this.propsTotal[item.key]
+              ))
+              item.value = this.coolingList.find(
+                (e) => e.value == this.propsTotal[item.key]
+              ).label
+            } else if (item.key == 'aircStatus') {
+              item.value = this.aircList.map(
+                (e) => e.value == this.propsTotal[item.key]
+              ).label
+            } else {
+              item.value = this.propsTotal[item.key]
+            }
           })
         }
       }

web/src/components/Home/Modal/OperationalInfo.vue

@@ -29,24 +29,24 @@ export default {
   data() {
     return {
       list: [
+        // {
+        //   key: 'tianshu',
+        //   value: 26,
+        //   d: '℃',
+        //   label: '舱内温度',
+        //   class: 'item-1',
+        //   iconPath: require('@/assets/home/wendu.png')
+        // },
+        // {
+        //   key: 'shouyi',
+        //   value: 25,
+        //   d: '%',
+        //   label: '舱内湿度',
+        //   class: 'item-2',
+        //   iconPath: require('@/assets/home/shidu.png')
+        // },
         {
-          key: 'tianshu',
+          key: 'voltage',
-          value: 26,
-          d: '℃',
-          label: '舱内温度',
-          class: 'item-1',
-          iconPath: require('@/assets/home/wendu.png')
-        },
-        {
-          key: 'shouyi',
-          value: 25,
-          d: '%',
-          label: '舱内湿度',
-          class: 'item-2',
-          iconPath: require('@/assets/home/shidu.png')
-        },
-        {
-          key: 'shuliang',
           value: 24,
           d: 'V',
           label: '电压',
@@ -54,7 +54,7 @@ export default {
           iconPath: require('@/assets/home/dianya.png')
         },
         {
-          key: 'shuliang',
+          key: 'current',
           value: 26,
           d: 'A',
           label: '电流',
@@ -62,7 +62,7 @@ export default {
           iconPath: require('@/assets/home/dianliu.png')
         },
         {
-          key: 'fadianliang',
+          key: 'power',
           value: 20,
           d: 'w',
           label: '功率',
@@ -70,7 +70,7 @@ export default {
           iconPath: require('@/assets/home/gonglv.png')
         },
         {
-          key: 'rongliang',
+          key: 'powerFactor',
           value: 100,
           d: '',
           label: '功率因数',
@@ -81,12 +81,7 @@ export default {
     }
   },
   computed: {
-    leftList() {
+  
-      return this.list.filter((_, index) => index % 2 === 0).slice(0, 3) // 左列取前3个偶数索引
-    },
-    rightList() {
-      return this.list.filter((_, index) => index % 2 !== 0).slice(0, 3) // 右列取前3个奇数索引
-    }
   },
   watch: {
     propsTotal: {

web/src/components/TreeTable.vue

@@ -0,0 +1,528 @@
+<template>
+  <div class="treetable" ref="treetable">
+    <a-table
+      bordered
+      :loading="loading"
+      :scroll="tableOption.scroll"
+      :columns="columns"
+      :data-source="tableData"
+      :pagination="false"
+      :row-class-name="(record, index) => rowClassName(record, index)"
+      row-key="id"
+      size="middle"
+      :row-selection="rowSelection"
+      :indent-size="30"
+      :check-strictly="false"
+      @resizeColumn="handleResizeColumn"
+    >
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.scopedSlots">
+          <slot
+            v-bind="record"
+            :name="column.scopedSlots ? column.scopedSlots.customRender : ''"
+          ></slot>
+        </template>
+      </template>
+    </a-table>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: {
+    columns: { type: Array },
+    tableData: { type: Array },
+    tableOption: {
+      type: Object,
+      default: () => {
+        return {
+          loading: false,
+          page: true,
+          align: 'center',
+          expand: true,
+          select: true
+          // scroll: { y: 600 },
+        }
+      }
+    },
+    paginationOption: {
+      type: Object,
+      default: () => {
+        return {
+          pageSizeOptions: ['10', '20', '30'],
+          current: 1,
+          pageSize: 10,
+          total: 1
+        }
+      }
+    },
+    selectField: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    },
+
+    rowClick: {
+      default: () => {}
+    }
+  },
+  data() {
+    return {
+      loading: false,
+      newPaginationOption: {},
+      newColumns: [],
+      defPageOpt: {
+        showSizeChanger: true,
+        showQuickJumper: true,
+        current: 1,
+        pageSize: 10,
+        total: 1
+      },
+      newPageOptions: {},
+      selectedRowKeys: [],
+      realColumns: [],
+      realTableData: [],
+      selectedRows: {},
+      defaultTabOpt: {
+        page: true,
+        align: 'center',
+        expand: false,
+        select: true
+      },
+      newTableOpt: {},
+      pageSizeOptions: ['10', '20', '30'],
+      scroll: { y: 100 }
+    }
+  },
+  computed: {
+    rowSelection() {
+      const { selectedRowKeys } = this
+      return {
+        checkStrictly: this.tableOption.checkStrictly,
+        selectedRowKeys,
+        type: this.tableOption.type,
+        onChange: (selectedRowKeys, selectedRows) => {
+          this.onSelectChange(selectedRowKeys, selectedRows)
+        },
+        hideDefaultSelections: true,
+        onSelect: (record, selected) => {
+          this.onSelect(record, selected)
+        }
+      }
+    }
+  },
+  watch: {
+    selectField: {
+      handler(n, o) {
+        this.handlerTableData(n)
+      },
+      immediate: true
+    },
+    paginationOption: {
+      handler(n, o) {
+        this.defPageOpt = { ...this.defPageOpt, ...n }
+      },
+      immediate: true,
+      deep: true
+    },
+    tableOption: {
+      handler(n, o) {
+        this.newTableOpt = { ...this.defaultTabOpt, ...n }
+        if (n.selectTableData && n.selectTableData.length > 0) {
+          this.selectedRowKeys = n.selectTableData
+        }
+      },
+      immediate: true,
+      deep: true
+    }
+  },
+  mounted() {
+    this.scroll.y = this.$refs.treetable.offsetHeight - 70
+  },
+  methods: {
+    handleResizeColumn(w, col) {
+      col.width = w
+    },
+
+    onSelectChange(selectedRowKeys, selectedRows) {
+      this.selectedRowKeys = selectedRowKeys
+      this.selectedRows = selectedRows[selectedRows.length - 1]
+      this.$emit('getSelectedIds', selectedRowKeys)
+    },
+    onSelect(record, selected) {
+      const selectrows = [record.id]
+      //  record.hasOwnProperty("children") &&
+      if (record.children && record.children.length) {
+        const generator = (record) => {
+          record.forEach((item) => {
+            selectrows.push(item.id)
+            if (item.children && item.children.length > 0) {
+              generator(item.children)
+            }
+          })
+        }
+        generator(record.children)
+      }
+      const newselect = this.selectedRowKeys.filter((item) => !selectrows.includes(item))
+
+      selected
+        ? (this.selectedRowKeys = Array.from(new Set([...this.selectedRowKeys, ...selectrows])))
+        : (this.selectedRowKeys = newselect)
+    },
+
+    handlerTableData(n) {
+      if (n.length == 0) {
+        this.newColumns = this.columns
+      } else {
+        this.newColumns = []
+        this.selectField.forEach((i) => {
+          this.columns.forEach((e) => {
+            if (i == e.dataIndex) {
+              this.newColumns.push(e)
+            }
+          })
+        })
+      }
+    },
+    rowClassName(record, index) {
+      return 'table-row'
+    },
+    // expandIcon(props) {
+    //   // if (props.record.descriptions) {
+    //   //   if (props.expanded) {
+    //   //     return (
+    //   //       <a
+    //   //         style="color: 'black',margin-right:0px"
+    //   //         onClick={(e) => {
+    //   //           props.onExpand(props.record, e)
+    //   //         }}
+    //   //       >
+    //   //          <DownOutlined />{' '}
+    //   //       </a>
+    //   //     )
+    //   //   } else {
+    //   //     return (
+    //   //       <span
+    //   //         style="color: 'black' ,margin-right:0px"
+    //   //         onClick={(e) => {
+    //   //           props.onExpand(props.record, e)
+    //   //         }}
+    //   //       >
+    //   //         <a-icon type="right" />
+    //   //       </span>
+    //   //     )
+    //   //   }
+    //   // } else {
+    //   //   return null
+    //   // }
+    // },
+    onSizeChange(current, pageSize) {
+      this.defPageOpt.pageSize = pageSize
+      this.defPageOpt.current = 1
+      this.$emit('handlePagesizeChange', this.defPageOpt)
+    },
+    onChange(pageNumber) {
+      this.defPageOpt.current = pageNumber
+      this.$emit('handlePagesizeChange', this.defPageOpt)
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+:deep(.ant-table-body) {
+  .ant-table-cell {
+    background: var(--theme-bg) !important;
+  }
+  .ant-table-row-selected {
+    td {
+      background-color: var(--table-select) !important;
+    }
+  }
+  .ant-table-cell-fix-right.ant-table-cell-fix-right-first,
+  .ant-table-cell-fix-left {
+    box-shadow: none !important;
+    padding: 8px !important;
+    margin: 0 !important;
+  }
+  .ant-table-row-expand-icon.ant-table-row-expand-icon-collapsed,
+  .ant-table-row-expand-icon.ant-table-row-expand-icon-expanded {
+    background-color: var(--table-header-bg) !important;
+  }
+}
+.treetable {
+  background-color: var(--theme-bg-default);
+  border-radius: 8px;
+  font-size: 14px;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+
+ 
+ .pagination {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 10px;
+    // margin-bottom: 10px;
+    min-width: 420px;
+    height: 32px;
+  }
+
+  :deep(.ant-table) {
+    border-radius:20px 20px 0 0 !important;
+    overflow: hidden; /* 确保圆角生效 */
+  }
+  :deep(.ant-table-wrapper .ant-table.ant-table-bordered >.ant-table-container){
+    border-inline-start:none!important;
+  }
+  :deep(.ant-table-wrapper .ant-table-cell){
+    background:none!important;
+  }
+  :deep(.ant-table-thead ){
+    background: linear-gradient(0deg, rgba(61, 254, 250, 0.2), rgba(61, 254, 250, 0.2)),
+      linear-gradient(
+        90deg,
+        rgba(61, 254, 250, 0) 0%,
+        rgba(0, 255, 251, 0.15) 50.17%,
+        rgba(61, 254, 250, 0) 100%
+      )!important;
+  }
+  :deep(.ant-table-thead > tr > th) {
+    border-inline: 1px solid transparent !important;
+    background: transparent;
+    color: #fff !important;
+    border-bottom: none !important; /* 可选：去除底部边框 */
+  }
+
+:deep(.ant-pagination) {
+  .ant-pagination-item-link {
+    color: #fff !important;
+    height: 100% !important;
+    display: block !important;
+  }
+  .ant-pagination-prev,
+  .ant-pagination-next {
+    background: transparent !important;
+    color: #fff !important;
+    border: 1px solid $page-border;
+    button {
+      box-sizing: border-box;
+    }
+  }
+  .ant-select-selector {
+    border: none !important;
+  }
+  .ant-select-arrow {
+    color: #fff !important;
+  }
+
+  span.ant-input-affix-wrapper,
+  .ant-select,
+  .ant-picker {
+    width: 110px !important;
+  }
+  .ant-select-selection-item {
+    color: #fff !important;
+    border: 1px solid $page-border;
+  }
+  .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
+    background-color: transparent !important;
+  }
+  .ant-pagination-total-text,
+  .ant-pagination-options-quick-jumper {
+    color: #fff !important;
+    margin-inline-end: 9px !important;
+  }
+  .ant-pagination-options-quick-jumper input {
+    background-color: transparent !important;
+    // border: none !important;
+    color: #fff !important;
+  }
+  .ant-pagination-options .ant-pagination-options-size-changer .ant-select-selector {
+    padding: 0px !important;
+    color: #fff !important;
+    background-color: transparent !important;
+
+    .ant-select-selection-item {
+      padding: 0 10px;
+    }
+  }
+  .ant-select-dropdown {
+    top: -210px !important;
+  }
+  .ant-pagination-item {
+    &:not(.ant-pagination-item-active):hover {
+      background: #1c797a !important;
+    }
+    a {
+      color: #fff;
+      border-radius: 2px;
+      background: #1c797a !important;
+    }
+  }
+
+  .ant-pagination-item-active {
+    border: 1px solid transparent;
+    color: #fff;
+    background: #1c797a !important;
+  }
+}
+:deep(
+    .ant-table-wrapper
+      .ant-table.ant-table-bordered
+      > .ant-table-container
+      > .ant-table-header
+      > table
+  ) {
+  border-top: none !important;
+  border-inline-start: none !important;
+}
+:deep(.ant-checkbox-checked .ant-checkbox-inner) {
+  background-color: var(--table-header-bg) !important;
+  border: none !important;
+}
+:deep(.ant-checkbox-indeterminate .ant-checkbox-inner:after) {
+  background-color: var(--table-header-bg) !important;
+}
+  :deep(
+      .ant-table.ant-table-bordered
+        > .ant-table-container
+        > .ant-table-header
+        > table
+        > thead
+        > tr
+        > th
+    ) {
+    &:nth-last-child(2) {
+      border-inline-end: 1px solid var(--table-header-bg) !important;
+      // left: 1px !important;
+    }
+  }
+
+  :deep(.ant-table-wrapper .ant-table.ant-table-bordered > .ant-table-container) {
+    // tr>th:nth-last-child(){
+    border-inline-start: none !important;
+    // }
+  }
+  :deep(.ant-table-wrapper) {
+    .ant-table-cell-scrollbar,
+    .ant-table.ant-table-bordered > .ant-table-container {
+      box-shadow: none !important;
+    }
+
+    // .ant-table {
+    //   background-color: var(--theme-bg) !important;
+    // }
+  }
+
+  ::v-deep .ant-table-thead > tr > th {
+    border-inline-end: 1.5px solid var(--theme-bg) !important;
+    background: var(--table-header-bg);
+    color: var(--theme-text-default);
+    border-bottom: none;
+    &:last-child {
+      border-inline-end: 1.5px solid var(--table-header-bg) !important;
+    }
+    &:nth-last-child(2) {
+      border-inline-end: 1.5px solid var(--table-header-bg) !important;
+    }
+  }
+
+  :deep(.ant-table-container > .ant-table-content > table) {
+    border-inline-start: 1px solid var(--theme-bg) !important;
+  }
+  :deep(.ant-pagination-item-link) {
+    color: var(--theme-text-default) !important;
+
+    height: 100% !important;
+    display: block !important;
+    // border: none !important;
+  }
+  :deep(.ant-table-wrapper .ant-table.ant-table-bordered >.ant-table-container >.ant-table-content >table){
+    border-top:none;
+  }
+  :deep(.ant-table-tbody) {
+    color: #fff!important;
+    > tr {
+      &:hover {
+        > td {
+          background-color: transparent !important;
+        }
+      }
+      td {
+        border: 1px solid transparent !important; /* 第一行单元格边框为红色 */
+      }
+    }
+    td.ant-table-cell.ant-table-cell-row-hover {
+      // background-color: var(--theme-bg) !important;
+    }
+  }
+
+  .pagination {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 10px;
+
+    min-width: 420px;
+    .total {
+      margin-right: 30px;
+    }
+  }
+}
+
+::v-deep .ant-table-thead > tr > th {
+  border-inline-end: 1px solid var(--theme-bg) !important;
+  background: var(--table-header-bg);
+  color: var(--theme-text-default);
+  border-bottom: none;
+  &:last-child {
+    border-inline-end: 1px solid var(--table-header-bg) !important;
+  }
+  &:nth-last-child(2) {
+    border-inline-end: 1px solid var(--table-header-bg) !important;
+  }
+}
+:deep(.ant-table-wrapper .ant-table.ant-table-bordered >.ant-table-container >.ant-table-body >table >tbody>tr>td){
+      border-inline-end: none!important;
+}
+:deep(.ant-table-thead) {
+  background: var(--table-header-bg);
+}
+
+:deep(.ant-table-tbody) {
+  > tr {
+    &:hover {
+      > .ant-table-cell {
+        
+        background-color: transparent !important;
+      }
+    }
+  
+  }
+}
+
+:deep(.ant-table-wrapper) {
+  .ant-table-cell-scrollbar,
+  .ant-table.ant-table-bordered > .ant-table-container {
+    box-shadow: none !important;
+
+&>.ant-table-body >table >tbody>tr>td{
+  border-bottom: none !important;
+}
+  }
+}
+
+:deep(.ant-table-wrapper .ant-table) {
+  background-color: transparent !important;
+}
+
+
+
+
+:deep(.ant-table-wrapper .ant-table-thead th.ant-table-column-has-sorters:hover) {
+  background: var(--table-select) !important;
+}
+</style>

web/src/components/monitor/device.vue

@@ -1,58 +1,89 @@
 <template>
-  <div class="device">
+  <div class="device" ref="device">
     <div class="device-item" v-for="item in deviceList" :key="item">
       <div class="item-header">
         <div style="display: flex; width: 50%">
-          <div class="icon-bg"></div>
+          <div class="icon-bg">
+            <span class="iconfont" :class="getIcongont(item)"></span>
+          </div>
           <div class="title">
-            <span class="number">521245786665412</span>
+            <span class="number">{{ item.device_id }}</span>
-            <span class="name">逆变器1</span>
+            <span class="name">{{ item.name }}</span>
-            <span class="number type">逆变器</span>
+            <span class="number type">{{ item.typename }}</span>
           </div>
         </div>
 
         <div class="status">
           <div class="status-item">
-            <span>在线</span>
+            <span>{{ ['离线', '在线'][item.is_online] }}</span>
             <span class="text">在线状态</span>
           </div>
           <div class="status-item">
-            <span>在线</span>
+            <span>{{ ['正常', '错误'][item.is_error] }}</span>
             <span class="text">故障状态</span>
           </div>
           <div class="status-item">
-            <span>在线</span>
+            <span>{{ ['空闲', '工作'][item.is_running] }}</span>
             <span class="text">工作状态</span>
           </div>
         </div>
       </div>
       <div class="item-content">
-        <div v-for="info in chunengInfo" :key="info.key">
+        <div v-for="info in item.params" :key="info.k" class="item-info">
-          <span class="text">{{ info.label }}：</span>
+          <span class="text">{{ info.k }}：</span>
-          <a-button
+
-            v-if="info.key === 'realTimeData'"
+          <span class="value">{{ info.v }}</span>
-            type="primary"
-            size="small"
-            @click="openModal"
-            >查看</a-button
-          >
-          <span v-else class="value">{{ info.value }}</span>
         </div>
       </div>
+      <div v-if="item.view == 1" class="item-button">
+        <span class="text">实时数据：</span>
+        <a-button type="primary" size="small" @click="openModal(item)">查看</a-button>
+      </div>
     </div>
-    <a-modal v-model:open="modalOpen" @ok="handleOk" width="800px">
+    <a-modal
-      <!-- <p>Some contents...</p>
+      v-model:open="modalOpen"
-      <p>Some contents...</p>
+      @ok="handleOk"
-      <p>Some contents...</p> -->
+      width="90%"
+      class="modal-device"
+      :get-container="() => $refs.device"
+    >
+      <div>
+        <div class="title">
+          <div>电流电压</div>
+          <img src="@/assets/images/titleLine.png" alt="" />
+        </div>
+        <div class="echarts">
+          <predictEcharts
+            :chart-options="chartOptions[0]"
+            :chart-data="chartData"
+            ref="chartRef1"
+          />
+        </div>
+      </div>
+      <div>
+        <div class="title">
+          <div>功率</div>
+          <img src="@/assets/images/titleLine.png" alt="" />
+        </div>
+        <div class="echarts">
+          <predictEcharts
+            :chart-options="chartOptions[1]"
+            :chart-data="chartData"
+            ref="chartRef2"
+          />
+        </div>
+      </div>
     </a-modal>
   </div>
 </template>
 
 <script>
+import predictEcharts from '@/components/predict/predictEcharts.vue'
 import { postReq, getReq } from '@/request/api'
+import { deviceTypeList } from '@/utils/config'
 export default {
   name: '',
-  components: {},
+  components: { predictEcharts },
   props: {
     stationId: {
       type: String,
@@ -79,7 +110,70 @@ export default {
         { label: '实时数据', key: 'realTimeData', value: '0.01kWh' },
         { label: '额定功率', key: 'ratedPower', value: '0.01kW' },
         { label: '冷却方式', key: 'coolingMethod', value: '风冷' }
-      ]
+      ],
+      chartOptions: [
+        {
+          type: 'line',
+          smooth: true,
+          dataKey: 'chargeDischarge',
+          infoKeys: [
+            {
+              key: 'V',
+              label: '电压',
+              seriesOptions: {
+                symbol: 'circle',
+                symbolSize: 8,
+                itemStyle: {
+                  color: '#00FDF9' // 充电电量线条颜色
+                },
+                lineStyle: {
+                  color: '#00FDF9' // 充电电量线条颜色
+                }
+              }
+            },
+            {
+              key: 'I',
+              label: '电流',
+              seriesOptions: {
+                symbol: 'circle',
+                symbolSize: 8,
+                itemStyle: {
+                  color: '#3E7EEF' // 充电电量线条颜色
+                },
+                lineStyle: {
+                  color: '#3E7EEF' // 充电电量线条颜色
+                }
+              }
+            }
+          ]
+        },
+        {
+          type: 'line',
+          smooth: true,
+          dataKey: 'chargeDischarge',
+          infoKeys: [
+            {
+              key: 'P',
+              label: '功率',
+              seriesOptions: {
+                symbol: 'circle',
+                symbolSize: 8,
+                itemStyle: {
+                  color: '#00FDF9' // 充电电量线条颜色
+                },
+                lineStyle: {
+                  color: '#00FDF9' // 充电电量线条颜色
+                }
+              }
+            }
+          ]
+        }
+      ],
+
+      chartData: {
+        xdata: [],
+        ydata: {}
+      }
     }
   },
   watch: {
@@ -99,24 +193,65 @@ export default {
     this.getDeviceList()
   },
   methods: {
-    async getDeviceList() {
+    getIcongont(ele) {
-      const data = {
+      return deviceTypeList.find((item) => item.value == ele.type).iconfont || ''
-        category: this.systemType,
+    },
-        'station_id': this.stationId,
+    generateTimePoints() {
-        page: 0,
+      const timePoints = []
-        'page_size': 1000
+
-      }
+      for (let hour = 0; hour <= 24; hour++) {
-      try {
+        for (let minute = 0; minute < 60; minute += 10) {
-        const res = await getReq('/queryDeviceList', data)
+          // 处理24:00的特殊情况
+          if (hour === 24 && minute === 0) {
+            timePoints.push('24:00')
+            break
+          }
+
+          // 格式化小时和分钟，确保两位数
+          const formattedHour = hour.toString().padStart(2, '0')
+          const formattedMinute = minute.toString().padStart(2, '0')
+
+          timePoints.push(`${formattedHour}:${formattedMinute}`)
+        }
+      }
+
+      return timePoints
+    },
+    //查看实时数据
+    async getDevicCharts(item) {
+      try {
+        const res = await getReq('/queryDevicCharts', {
+          station_id: this.stationId,
+          device_id: item.device_id
+        })
+        this.chartData.ydata = res.data
+        this.chartData.xdata = this.generateTimePoints()
+        this.$refs.chartRef1.initCharts()
+        this.$refs.chartRef2.initCharts()
 
-        console.log(res)
-        this.deviceList = res.data
-        // this.selectStation=this.stations[0]['station_id']
       } catch (error) {
         console.log(error)
       }
     },
-    openModal() {
+
+    //请求运行监控系统设备信息
+    async getDeviceList() {
+      try {
+        const res = await getReq('/queryDevicByCategory', {
+          station_id: this.stationId,
+          category: this.systemType
+        })
+
+        this.deviceList = res.data
+      } catch (error) {
+        this.deviceList = []
+
+        console.log(error)
+      }
+    },
+    async openModal(item) {
+      await this.getDevicCharts(item)
+
       this.modalOpen = true
     },
     handleOk() {
@@ -136,8 +271,6 @@ export default {
   grid-template-columns: 1fr 1fr 1fr;
   overflow-y: auto;
   .device-item {
-    // width: 410px;
-    // height: 340px;
     border-radius: 15px;
 
     background: $bg2-color;
@@ -149,11 +282,16 @@ export default {
       color: #fff;
       justify-content: space-between;
       .icon-bg {
-        width: 76px;
+        width: 66px;
-        height: 72px;
+        height: 66px;
+        text-align: center;
+        line-height: 66px;
         border-radius: 6px;
         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;
+        }
       }
       .title {
         display: flex;
@@ -194,12 +332,20 @@ export default {
       grid-template-columns: 1fr 1fr;
       color: #fff;
       display: grid;
-      line-height: 45px;
+      // line-height: 45px;
       margin-top: 15px;
       padding: 0 10px;
+      height: 120px;
+      overflow-y: auto;
       .value {
         font-weight: 700;
       }
+      .item-info {
+        height: 30px;
+      }
+    }
+    .item-button {
+      padding-left: 10px;
     }
     .text {
       color: $text-color;
@@ -212,4 +358,22 @@ export default {
 .environment {
   width: 200px;
 }
+:deep(.modal-device) {
+  color: #fff;
+  .title {
+    display: flex;
+    font-weight: 700;
+    flex-direction: column;
+
+    img {
+      width: 232px;
+      height: 6px;
+      margin-top: 10px;
+    }
+  }
+  .echarts {
+    width: 100%;
+    height: 280px;
+  }
+}
 </style>

web/src/components/monitor/videos.vue

@@ -32,13 +32,12 @@
     </div>
     <div class="table-content">
       <ComTable
-        :columns="columns"
+        :columns="columns[activeTab]"
-        :table-data="tableData"
+        :table-data="tableDatas[activeTab]"
         @handlePagesizeChange="handlePagesizeChange"
         ref="comTable"
         :table-option="tableOption"
         :page-option="pageOption"
-        :table-h="tableH"
       >
       </ComTable>
     </div>
@@ -46,65 +45,143 @@
 </template>
 
 <script>
+import { postReq, getReq } from '@/request/api'
 export default {
   name: '',
   components: {},
-  props: {},
+  props: {
+    stationId: {
+      type: String,
+      default: ''
+    },
+    systemType: {
+      type: Number,
+      default: 1
+    }
+  },
   data() {
     return {
-      activeTab: '0',
+      activeTab: 'temp_hum',
+      columns: {
+        airc: [
+          {
+            title: '名称',
+            dataIndex: 'pos',
+            key: 'pos',
+            ellipsis: true,
+            align: 'center'
+          },
+          {
+            title: '状态',
+            dataIndex: 'status',
+            key: 'status',
+            ellipsis: true,
+            align: 'center'
+          }
+        ],
+        cooling: [
+          {
+            title: '名称',
+            dataIndex: 'pos',
+            key: 'pos',
+            ellipsis: true,
+            align: 'center'
+          },
+          {
+            title: '状态',
+            dataIndex: 'status',
+            key: 'status',
+            ellipsis: true,
+            align: 'center'
+          }
+        ],
+        fire40: [
+          {
+            title: '点位',
+            dataIndex: 'pos',
+            key: 'pos',
+            ellipsis: true,
+            align: 'center'
+          },
+          {
+            title: '状态',
+            dataIndex: 'status',
+            key: 'status',
+            ellipsis: true,
+            align: 'center'
+          }
+        ],
+        'temp_hum': [
+          {
+            title: '点位',
+            dataIndex: 'pos',
+            key: 'pos',
+            ellipsis: true,
+            align: 'center'
+          },
+          {
+            title: '温度',
+            dataIndex: 'temp',
+            key: 'temp',
+            ellipsis: true,
+            align: 'center'
+          },
+          {
+            title: '湿度',
+            dataIndex: 'hum',
+            key: 'hum',
+            ellipsis: true,
+            align: 'center'
+          }
+        ]
+      },
       tabList: [
         {
-          key: '0',
+          key: 'temp_hum',
           name: '环境温湿度信息'
         },
         {
-          key: '1',
+          key: 'fire40',
           name: '安防信息'
         },
         {
-          key: '2',
+          key: 'airc',
           name: '空调信息'
         },
         {
-          key: '3',
+          key: 'cooling',
           name: '冷机信息'
         }
       ],
-      columns: [
+      tableDatas: {},
-        {
+
-          title: '点位',
-          dataIndex: 'policyId',
-          key: 'policyId',
-          ellipsis: true
-        },
-        {
-          title: '温度',
-          dataIndex: 'name',
-          key: 'name',
-          ellipsis: true
-        },
-        {
-          title: '湿度',
-          dataIndex: 'type',
-          key: 'type',
-          ellipsis: true
-        }
-      ],
       tableOption: {
         select: false,
         page: false
       }
     }
   },
-  mounted() {},
+  mounted() {
-  methods: {}
+    this.getEnvironment()
+  },
+  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) {
+        console.log(error)
+      }
+    }
+  }
 }
 </script>
 
 <style lang="scss" scoped>
 .videos {
-  width: 60%;
+  width: calc(100% - 470px);
   margin-left: 20px;
   display: grid;
   grid-gap: 20px;
@@ -130,7 +207,7 @@ export default {
   }
 }
 .environment {
-  width: calc(40% - 20px);
+  width: 430px;
   margin-left: 20px;
   color: #fff;
 
@@ -187,6 +264,7 @@ export default {
   }
   .table-content {
     margin-top: 20px;
+    height: calc(100% - 60px);
     :deep(.ant-table) {
       border-radius: 10px 10px 0 0 !important;
       overflow: hidden; /* 确保圆角生效 */

web/src/components/predict/predictEcharts.vue

@@ -1,16 +1,17 @@
 <template>
   <div class="echarts">
-    <div class="chart-container">
+    <div class="chart-container" >
-      <div class="content-header">
+      <div class="content-header" v-if="chartOptions.title">
         <div class="verline"></div>
         <span>{{ chartOptions.title }}</span>
       </div>
+      <!-- {{ chartData.ydata }} -->
+
       <div ref="chartContainer" class="echarts-content"></div>
     </div>
   </div>
 </template>
 <script>
-import { postReq } from '@/request/api'
 export default {
   name: 'PredictEcharts',
   props: {
@@ -20,8 +21,8 @@ export default {
       required: false // 非必须
     },
     chartData: {
-      type: Array,
+      type: Object,
-      default: () => ([]), // 默认空对象
+      default: () => ({}), // 默认空对象
       required: false // 非必须
     }
   },
@@ -32,12 +33,11 @@ export default {
   },
   mounted() {
     
-    
+    // this.$nextTick(() => {
-    this.$nextTick(() => {
+    //   // 确保 DOM 完全渲染
-      // 确保 DOM 完全渲染
+    //   this.initCharts()
-      this.initCharts()
+    //   window.addEventListener('resize', this.handleResize)
-      window.addEventListener('resize', this.handleResize)
+    // })
-    })
   },
   beforeUnmount() {
     window.removeEventListener('resize', this.handleResize)
@@ -45,8 +45,7 @@ export default {
   },
   methods: {
     initCharts() {
-    //   this.chartOptions.forEach((option, index) => {
+      const {infoKeys,dataKey,type,smooth}=this.chartOptions
-      const {title,infoKeys,dataKey,type,smooth}=this.chartOptions
       
       const dom = this.$refs.chartContainer
       if (!dom) return
@@ -73,12 +72,29 @@ export default {
         grid: {
           left: '3%',
           right: '3%',
-          bottom: '1%',
+          bottom: '15%',
           containLabel: true
         },
+        dataZoom: [
+          {
+            type: 'slider', // 滑动条型
+            show: true,
+            xAxisIndex: 0, // 控制第一个X轴
+            start: 0,      // 初始显示范围起点（百分比）
+            end: 20,       // 初始显示范围终点（百分比）
+            height: 20,    // 滑动条高度
+            bottom: 10     // 距离底部距离
+          },
+          {
+            type: 'inside', // 内置型（鼠标滚轮/拖拽交互）
+            xAxisIndex: 0,
+            start: 0,
+            end: 20
+          }
+        ],
         xAxis: {
           type: 'category',
-          data: this.chartData.map((item) => item.date),
+          data: this.chartData.xdata,
           axisLine: {
             show: true,
             lineStyle: {
@@ -122,7 +138,7 @@ export default {
             name: info.label,
             smooth: smooth || false,
             type: type,
-            data: this.chartData.map((item) => item[info.key]),
+            data: this.chartData.ydata[info.key],
             ...info.seriesOptions,
           }
         })

web/src/components/system/policyForm.vue

@@ -6,7 +6,7 @@
       <img src="@/assets/images/titleLine.png" alt="" />
     </div>
     <a-form
-      :model="formState"
+      :model="formData"
       layout="inline"
       label-align="left"
       :label-col="{ style: { width: '85px' } }"
@@ -22,7 +22,7 @@
           v-model:value="formData.type"
           placeholder=""
           :disabled="formStatus == 'read'"
-          @change="changePolicy"
+          
         >
           <a-select-option v-for="item in policyTypes" :value="item.value">{{
             item.label
@@ -69,39 +69,44 @@
       <a-form-item label="时段表" class="col1" v-if="formData.type == '1'">
         <a-table
           :columns="columns"
-          :data-source="formData.period"
+          :data-source="formData.period1"
           size="small"
           :scroll="{ y: 500 }"
           :pagination="false"
+          row-class-name="no-hover-row"
+          row-key="month"
         >
           <template #headerCell="{ column }">
             <template v-if="column.key === 'action'">
               <span>
-                <!-- <a-button type="primary" @click="handleAdd" :disabled="formStatus == 'read'">Add</a-button> -->
                 <i
                   class="iconfont icon-add"
                   @click="handleAdd"
-                  :disabled="formStatus == 'read'"
+                  :style="{ cursor: formStatus == 'read' ? 'not-allowed' : 'pointer' }"
-                  style="cursor: pointer"
                 ></i>
               </span>
             </template>
           </template>
-          <template #bodyCell="{ column, record }">
+          <template #bodyCell="{ column, index }">
             <template v-if="column.dataIndex === 'action'">
               <span>
-                <a @click="edit(record.key)">操作</a>
+                <a
+                  @click="delPeriod(index)"
+                  :style="{ cursor: formStatus == 'read' ? 'not-allowed' : 'pointer' }"
+                  >删除</a
+                >
               </span>
             </template>
           </template>
         </a-table>
       </a-form-item>
       <div v-if="formData.type == 5">
-        <a-form-item label="充放策略" class="col1">
+        <a-form-item label="充放策略" class="col1" name="chargePolicy">
           <a-radio-group
             v-model:value="formData.chargePolicy"
             :disabled="formStatus == 'read'"
             name="chargePolicy"
+            @change="changePolicy"
           >
             <a-radio :value="1">一充一放</a-radio>
             <a-radio :value="2">两充两放</a-radio>
@@ -109,58 +114,62 @@
         </a-form-item>
         <a-form-item label="" class="col1">
           <div class="charge">
-            <div class="box" v-for="(item, index) in formData.chargePolicy" :key="index">
+            <div class="box" v-for="(item, index) in formData.period5" :key="index">
               <span>第{{ index == 0 ? '一' : '二' }}次充放过程</span>
               <a-form
-                :ref="'period' + index"
+                :ref="
-                :model="formData.period"
+                  (el) => {
+                    periodFormRefs[index] = el
+                  }
+                "
+                :model="item"
                 layout="inline"
                 label-align="left"
                 :label-col="{ style: { width: '85px' } }"
                 :rules="periodRules"
               >
-                <a-form-item label="充电时间" class="col2" required>
+                <a-form-item label="充电时间" class="col2" name="charge_time">
                   <a-time-range-picker
-                    v-model:value="formData.period[index]['charge_time']"
+                    format="HH:mm"
+                    value-format="HH:mm"
+                    :disabled="formStatus == 'read'"
+                    v-model:value="formData.period5[index]['charge_time']"
+                  />
+                </a-form-item>
+
+                <a-form-item label="放电时间" class="col2" name="discharge_time">
+                  <a-time-range-picker
+                    v-model:value="formData.period5[index]['discharge_time']"
                     format="HH:mm"
                     value-format="HH:mm"
                     :disabled="formStatus == 'read'"
                   />
                 </a-form-item>
 
-                <a-form-item label="放电时间" class="col2" required>
+                <a-form-item label="充电功率" class="col2" name="chargeType">
-                  <a-time-range-picker
-                    v-model:value="formData.period[index]['discharge_time']"
-                    format="HH:mm"
-                    value-format="HH:mm"
-                    :disabled="formStatus == 'read'"
-                  />
-                </a-form-item>
-
-                <a-form-item label="充电功率" class="col2" required>
                   <a-radio-group
-                    v-model:value="formData.period[index].chargeType"
+                    v-model:value="formData.period5[index].chargeType"
-                    :disabled="formStatus == 'read'"
+                   
                   >
                     <a-radio :value="0">自动</a-radio>
                     <a-radio :value="1">自定义</a-radio>
                     <a-input
                       style="width: 60px"
-                      v-model:value="formData.period[index]['charge_power']"
+                      v-model:value="formData.period5[index]['charge_power']"
                     ></a-input>
                   </a-radio-group>
                 </a-form-item>
 
-                <a-form-item label="放电功率" class="col2" required>
+                <a-form-item label="放电功率" class="col2" name="dischargeType">
                   <a-radio-group
-                    v-model:value="formData.period[index].dischargeType"
+                    v-model:value="formData.period5[index].dischargeType"
-                    :disabled="formStatus == 'read'"
+                    
                   >
                     <a-radio :value="0">自动</a-radio>
                     <a-radio :value="1">自定义</a-radio>
                     <a-input
                       style="width: 60px"
-                      v-model:value="formData.period[index]['discharge_power']"
+                      v-model:value="formData.period5[index]['discharge_power']"
                     ></a-input>
                   </a-radio-group>
                 </a-form-item>
@@ -179,20 +188,25 @@
       <a-form-item class="col1">
         <div style="display: flex; justify-content: center; gap: 20px">
           <a-button @click="handleCancel">取消</a-button>
-          <a-button @click="handleOk" type="primary">确认</a-button>
+          <a-button @click="handleOk" type="primary"  :disabled="formStatus == 'read'">确认</a-button>
         </div>
       </a-form-item>
     </a-form>
   </div>
   <a-modal v-model:open="periodModal" @ok="handlePeriodModalOk">
-    <a-form ref="formRef" :model="periodForm" :label-col="{ style: { width: '85px' } }">
+    <a-form
-      <a-form-item ref="name" label="月份" name="month">
+      ref="periodRef"
+      :model="periodForm"
+      :label-col="{ style: { width: '85px' } }"
+      :rules="rules"
+    >
+      <a-form-item ref="name" label="月份" name="month" required>
         <a-input v-model:value="periodForm.month" />
       </a-form-item>
-      <a-form-item label="开始时间" name="time">
+      <a-form-item label="开始时间" name="time" required>
         <a-time-picker v-model:value="periodForm.time" value-format="HH:mm" format="HH:mm" />
       </a-form-item>
-      <a-form-item label="时段类型" name="type">
+      <a-form-item label="时段类型" name="type" required>
         <a-select ref="select" v-model:value="periodForm.type">
           <a-select-option value="尖">尖</a-select-option>
           <a-select-option value="峰">峰</a-select-option>
@@ -230,7 +244,10 @@ export default {
     return {
       data: [],
       policyTypes,
-      formData: {},
+      formData: {
+        period1: [],
+        period5: []
+      },
       columns: [
         {
           title: '月份',
@@ -273,14 +290,17 @@ export default {
             message: '请选择时段',
             trigger: 'change'
           }
-        ]
+        ],
+        month: [{ required: true, message: '请输入名称', trigger: 'change' }],
+        time: [{ required: true, message: '请输入名称', trigger: 'change' }]
       },
       periodRules: {
-        chargeTime: [{ required: true, trigger: 'change' }],
+        charge_time: [{ required: true, trigger: 'change' }],
-        dischargeTime: [{ required: true, trigger: 'change' }],
+        discharge_time: [{ required: true, trigger: 'change' }],
         chargeType: [{ required: true, trigger: 'change' }],
         dischargeType: [{ required: true, trigger: 'change' }]
-      }
+      },
+      periodFormRefs: []
     }
   },
   watch: {
@@ -288,38 +308,32 @@ export default {
       handler(newVal) {
         if (this.formStatus == 'add') {
           this.formData = {
-            type: '1',
+            type: '5',
             name: '测试',
             price: [0, 0, 0, 0],
-            period: [],
+            period1: [],
+            period5: [
+              {
+                charge_time: [],
+                discharge_time: [],
+                charge_power: '',
+                discharge_power: '',
+                chargeType: null,
+                dischargeType: null
+              }
+              // {
+              //   charge_time: [],
+              //   discharge_time: [],
+              //   charge_power: '',
+              //   discharge_power: '',
+              //   chargeType: 1,
+              //   dischargeType:1
+              // }
+            ],
             is_open: false,
             chargePolicy: 1
           }
-          // this.formData = {
+          
-          //   type: '5',
-          //   name: '测试',
-          //   price: [0, 0, 0, 0],
-          //   chargePolicy:1,//1从
-          //   period: [{
-          //     charge_time: [],
-          //     discharge_time: [],
-          //     charge_power: '',
-          //     discharge_power: '',
-          //     chargeType: 1,
-          //     dischargeType:1
-          //   },
-          //   {
-          //     charge_time: [],
-          //     discharge_time: [],
-          //     charge_power: '',
-          //     discharge_power: '',
-          //     chargeType: 1,
-          //     dischargeType:1
-          //   }
-          //   ],
-          //   is_open: false,
-          //   chargePolicy:1
-          // }
         } else {
           this.getFormData(newVal)
         }
@@ -330,46 +344,85 @@ export default {
   },
   mounted() {},
   methods: {
-    changePolicy(val) {
+    changePolicy(e) {
-      console.log(val)
+      const val = e.target.value
       if (val == 1) {
-        this.formData.period = []
+        // const {length} = this.formData.period5
+
+        // this.formData.period5.splice(1,1)
+        this.formData.period1=[]
+
       } else {
-        this.formData.period = [
+        this.formData.period5[1] = 
           {
             charge_time: [],
             discharge_time: [],
             charge_power: '',
             discharge_power: '',
-            powerType: 1
+            chargeType: null,
-          },
+            dischargeType:null
-          {
-            charge_time: [''],
-            discharge_time: [''],
-            charge_power: '',
-            discharge_power: '',
-            powerType: 1
           }
-        ]
+          
       }
     },
     //提交表单
-    handleOk() {
+    async handleOk() {
-      const { name, type, price, is_open, period, chargePolicy } = this.formData
+      const { type, price, is_open, chargePolicy } = this.formData
-      const newForm = { name, type, is_open }
+      const periodKey = `period${type}`
+      const period = this.formData[periodKey] // 正确使用 period
+      const newForm = { ...this.formData, is_open: Number(is_open) }
+
       if (type == 1) {
-        newForm.value = JSON.stringify({
+        const data = {
           period: this.getPeriodJson(type, period),
-          price: price.map((item) => Number(item))
+          price: price.map((item) => Number(item).toFixed(2))
-        })
+        }
+
+        newForm.value = JSON.stringify(data)
+        delete newForm.period1
       } else {
-        newForm.value = JSON.stringify({
+        const data = {
           period: this.getPeriodJson(type, period.slice(0, chargePolicy)),
-          price: price.map((item) => Number(item))
+          price: price.map((item) => Number(item).toFixed(2))
-        })
+        }
+        newForm.value = JSON.stringify(data)
+        delete newForm.period5
       }
-      console.log(newForm, 'this.formData')
+      delete newForm.price
-      this.addPolicy(newForm)
+      // console.log(this.$refs.formRef,'=================');
+
+      //校验表单
+      // const formRefres = await this.validateform('formRef',newForm)
+      // const formRefres = this.validateform(periodKey,newForm)
+      // console.log(formRefres);
+
+      this.validateform(newForm)
+    },
+    async validateform(newForm) {
+      try {
+        await this.$refs.formRef.validateFields()
+        if(newForm.type==5){
+          const validFormRefs = this.periodFormRefs.filter((item) => 
+            item && typeof item.validateFields === 'function'
+          )
+          await Promise.all(
+            validFormRefs.map((item) => item.validateFields())
+          )
+        }
+       
+    
+        if (this.formStatus == 'add') {
+          this.addPolicy(newForm)
+        } else if (this.formStatus == 'edit') {
+          this.updatePolicy(newForm)
+        }
+        
+
+
+      } catch (error) {
+        console.log(error)
+      }
+      
     },
     handleCancel() {
       this.$emit('closeModal')
@@ -377,54 +430,96 @@ export default {
     async addPolicy(newForm) {
       try {
         const res = await postReq('/insertPolicy', newForm)
+        if (res.errcode == 0) {
+          this.$message.success('添加成功')
+          this.$emit('closeModal', true)
+        }
         console.log(res)
       } catch (error) {
         console.log(error)
       }
     },
+    async updatePolicy(newForm) {
+      try {
+        const res = await postReq('/updatePolicy', newForm)
+        if (res.errcode == 0) {
+          this.$message.success('更新成功')
+          this.$emit('closeModal', true)
+        }
+        console.log(res)
+      } catch (error) {
+        console.log(error)
+      }
+    },
+    //时段表删除
+    delPeriod(index) {
+      // console.log(record);
+      this.formData.period1.splice(index, 1)
+    },
 
     //获取编辑的表单
     getFormData(newVal) {
-
       const { value, type } = newVal
-      const { price, period } = JSON.parse(value)
+
+      const jsonValue = JSON.parse(value)
+      const { price, period } = jsonValue
 
       this.formData = {
         ...newVal,
         is_open: Boolean(newVal['is_open']),
-        price,
+        price
-        period: this.getPeriod(type, period)
       }
+      // const periodKey=period[type]
+      this.formData[`period${type}`] = this.getPeriod(type, period)
+      console.log(this.formData)
     },
     handleAdd() {
       this.periodModal = true
       this.periodForm = {}
     },
     handlePeriodModalOk() {
-      this.formData.period.push(this.periodForm)
+      this.$refs.periodRef
-      this.periodModal = false
+        .validateFields()
+        .then((res) => {
+          console.log(this.formData.period1,'=============')
+          const target = this.formData.period1.find((item) => item.month == this.periodForm.month)
+
+          if (target) {
+            target.children.push(this.periodForm) // 如果找到，放入 children
+          }else{
+            this.formData.period1.push(this.periodForm)
+          }
+
+          // this.formData.period1.push(this.periodForm)
+          this.periodModal = false
+        })
+        .catch((err) => {
+          console.log(err)
+        })
     },
-    getPeriod(type, list=[]) {
+    getPeriod(type, list = []) {
       let newValue = []
-      debugger
+
       if (type == 1) {
         list.forEach((arr, index) => {
-          const item = arr[0]
+          if (arr.length == 0) return
+          const item = arr[0] || []
           newValue.push({
             month: index + 1,
-            time: item[0]||'',
+            time: item[0] || '',
-            type: item[1]||'',
+            type: item[1] || '',
             children: []
           })
           for (let i = 1; i < arr.length; i++) {
             const element = arr[i]
             newValue[index].children.push({
-              time: element[0]||'',
+              time: element[0] || '',
-              type: element[1]||''
+              type: element[1] || ''
             })
           }
         })
       } else {
+        this.formData.chargePolicy = list.length
         list.forEach((item, index) => {
           const ele = {
             ...item,
@@ -434,6 +529,8 @@ export default {
           newValue.push(ele)
         })
       }
+      console.log(newValue, '==========')
+
       return newValue
     },
     getPeriodJson(type, period) {
@@ -444,6 +541,11 @@ export default {
         period.forEach((item, index) => {
           const { month, time, type } = item
           newPeriod[month - 1].push([time, type])
+          if (item.children.length > 0) {
+            item.children.forEach((ele) => {
+              newPeriod[month - 1].push([ele.time, ele.type])
+            })
+          }
         })
       } else {
         period.forEach((item, index) => {
@@ -455,7 +557,7 @@ export default {
           newPeriod.push(ele)
         })
       }
-      return JSON.stringify(newPeriod)
+      return newPeriod
     }
   }
 }
@@ -533,7 +635,42 @@ export default {
     }
   }
 }
-:deep(.ant-form-item-row) {
+:deep(.ant-table-wrapper .ant-table-row-expand-icon) {
-  // border: 1px solid red;
+  color: $green !important;
 }
+//表格行悬浮样式
+:deep(.no-hover-row:hover > td) {
+  background-color: transparent !important;
+}
+: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

@@ -10,20 +10,25 @@ import '@/style/index.scss'
 import * as echarts from 'echarts'
 import { setWidth } from '@/utils/column'
 import { getBtns } from '@/utils/btnList'
-import { message } from 'ant-design-vue'
+import { message, Modal } 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'
 
 const app = createApp(App)
 
 app.component('SearchBox', SearchBox)
 app.component('ComTable', ComTable)
+app.component('OperateCom', OperateCom)
+app.component('TreeTable', TreeTable)
 
 app.config.globalProperties.$echarts = echarts // 挂载到全局属性
 app.config.globalProperties.$setWidth = setWidth // 挂载到全局属性
 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')

web/src/router/index.js

@@ -60,7 +60,9 @@ export const routes = [
           {
             name: 'permission',
             path: 'permission',
-            title: '权限管理'
+            title: '权限管理',
+            component: () =>
+              import(/* webpackChunkName: "system" */ '@/views/system/permission.vue')
           },
           {
             name: 'station',
@@ -71,7 +73,8 @@ export const routes = [
           {
             name: 'service',
             path: 'service',
-            title: '服务管理'
+            title: '服务管理',
+            component: () => import(/* webpackChunkName: "system" */ '@/views/system/service.vue')
           },
           {
             path: 'policy',
@@ -82,17 +85,20 @@ export const routes = [
           {
             name: 'device',
             path: 'device',
-            title: '设备管理'
+            title: '设备管理',
+            component: () => import(/* webpackChunkName: "system" */ '@/views/system/device.vue')
           },
           {
-            name: 'log',
+            name: 'alarmLog',
             path: 'log',
-            title: '告警日志'
+            title: '告警日志',
+            component: () => import(/* webpackChunkName: "system" */ '@/views/system/alarmLog.vue')
           },
           {
-            name: 'syslog',
+            name: 'sylog',
             path: 'syslog',
-            title: '系统日志'
+            title: '系统日志',
+            component: () => import(/* webpackChunkName: "system" */ '@/views/system/log.vue')
           }
         ]
       }

web/src/utils/btnList.js

@@ -1,21 +1,17 @@
+import route from 'vue-router'
 const btnList = [
   { label: '', type: '', disFlag: '' },
-  { label: '新增', type: 'add', disFlag: 'isEdit', icon: 'icon-add' },
+  { label: '新增', type: 'add', disFlag: 'is_add', icon: 'icon-add' },
-  { label: '查看', type: 'read', disFlag: 'isQuery' },
+  { label: '查看', type: 'read', disFlag: 'is_view' },
-  { label: '修改', type: 'edit', disFlag: 'isEdit' },
+  { label: '修改', type: 'edit', disFlag: 'is_edit' },
-  { label: '删除', type: 'del', disFlag: 'isEdit', icon: 'icon-del' }
+  { label: '删除', type: 'del', disFlag: 'is_del', icon: 'icon-del' }
-  // { label: '批量删除', type: 'del', disFlag: 'isEdit', icon: 'icon-del' }
 ]
 
-// arr:按钮数组
-// permissions:{
-//  isControl: true;
-//  isEdit: true;
-//  isQuery: true;
-// }
 function getBtns(arr) {
-  const permissions =
+  console.log(this.$route, 'route')
-    JSON.parse(localStorage.getItem('user')).userExtend.role.permissionList[0] || {}
+  // JSON.parse(localStorage.getItem('permission')).find((item)=>item.route==)
+  // const permissions =
+  //   JSON.parse(localStorage.getItem('permission')) || {}
   const btns = []
   btnList.forEach((item) => {
     if (arr.includes(item.label)) {

web/src/utils/column.js

@@ -6,7 +6,7 @@ const colWidth = [
   },
   {
     label: '名称',
-    width: 200,
+    width: 150,
     align: 'left',
     sorter: (a, b) => {
       return a.name.localeCompare(b.name)
@@ -70,7 +70,7 @@ const colWidth = [
     label: '操作',
     align: 'center',
     width: 200,
-    fixed: 'right',
+    // fixed: 'right',
     resizable: false
   }
 ]

web/src/utils/config.js

@@ -13,3 +13,146 @@ export const policyTypes = [
   //   label: '峰谷套利2'
   // }
 ]
+
+export const deviceTypeList = [
+  {
+    value: 1,
+    label: '变压器',
+    iconfont: 'icon-transformer'
+  },
+  {
+    value: 2,
+    label: '配电柜',
+    iconfont: 'icon-dianpingcai'
+  },
+  {
+    value: 3,
+    label: '电表',
+    iconfont: 'icon-dianbiao'
+  },
+  {
+    value: 4,
+    label: '门禁',
+    iconfont: 'icon-menjin'
+  },
+  {
+    value: 5,
+    label: '空调',
+    iconfont: 'icon-kongdiaogongcheng'
+  },
+  {
+    value: 6,
+    label: '照明',
+    iconfont: 'icon-zhaomingdeng'
+  },
+  {
+    value: 7,
+    label: '消防',
+    iconfont: 'icon-xiaofang'
+  },
+  {
+    value: 8,
+    label: '光照监测设备',
+    iconfont: 'icon-guangzhaojianceshebei'
+  },
+  {
+    value: 9,
+    label: '风速监测设备',
+    iconfont: 'icon-fengsujiance'
+  },
+  {
+    value: 10,
+    label: '温湿度监测设备',
+    iconfont: 'icon-wenshidujiance'
+  },
+  {
+    value: 11,
+    label: '烟感监测设备',
+    iconfont: 'icon-yanganjiance'
+  },
+  {
+    value: 12,
+    label: '水浸传感器',
+    iconfont: 'icon-shuijinchuanganqiicon'
+  },
+  {
+    value: 13,
+    label: '视频监控',
+    iconfont: 'icon-shipinjiankong'
+  },
+  {
+    value: 100,
+    label: '储能预制舱',
+    iconfont: 'icon-jizhuangxiang'
+  },
+  {
+    value: 101,
+    label: 'EMS',
+    iconfont: 'icon-quexianguanli'
+  },
+  {
+    value: 102,
+    label: 'PCS',
+    iconfont: 'icon-nengyuanguanli'
+  },
+  {
+    value: 103,
+    label: 'PCU',
+    iconfont: 'icon-bianyaqi'
+  },
+  {
+    value: 104,
+    label: 'BMS',
+    iconfont: 'icon-BMSchunengdianchi'
+  },
+  {
+    value: 105,
+    label: 'BCU',
+    iconfont: 'icon-L-chunengdianchicu'
+  },
+  {
+    value: 106,
+    label: '充电桩',
+    iconfont: 'icon-charging-pile-line'
+  },
+  {
+    value: 107,
+    label: '充电枪',
+    iconfont: 'icon-chongdianqiang'
+  },
+  {
+    value: 108,
+    label: '集中器',
+    iconfont: 'icon-jizhongqi'
+  },
+  {
+    value: 109,
+    label: '光伏板',
+    iconfont: 'icon-guangfuban'
+  },
+  {
+    value: 110,
+    label: '风力发电机光感',
+    iconfont: 'icon-zhuangjirongliang'
+  }
+]
+// 日志类型：0:其它; 1:系统日志; 2:操作日志; 3:设备日志
+
+export const logTypes = [
+  {
+    value: '0',
+    label: '其它'
+  },
+  {
+    value: '1',
+    label: '系统日志'
+  },
+  {
+    value: '2',
+    label: '操作日志'
+  },
+  {
+    value: '3',
+    label: '设备日志'
+  }
+]

web/src/utils/gcj02ToWgs84.js

@@ -1,80 +1,80 @@
-// /**
+/**
-//  * 判断是否在中国境外
+ * 判断是否在中国境外
-//  */
+ */
-// function outOfChina(lng, lat) {
+function outOfChina(lng, lat) {
-//   return !(lng >= 72.004 && lng <= 137.8347 && lat >= 0.8293 && lat <= 55.8271)
+  return !(lng >= 72.004 && lng <= 137.8347 && lat >= 0.8293 && lat <= 55.8271)
-// }
+}
 
-// /**
+/**
-//  * 辅助函数：纬度转换
+ * 辅助函数：纬度转换
-//  */
+ */
-// function _transformLat(x, y) {
+function _transformLat(x, y) {
-//   let ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x))
+  let ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x))
-//   ret += ((20.0 * Math.sin(6.0 * x * Math.PI) + 20.0 * Math.sin(2.0 * x * Math.PI)) * 2.0) / 3.0
+  ret += ((20.0 * Math.sin(6.0 * x * Math.PI) + 20.0 * Math.sin(2.0 * x * Math.PI)) * 2.0) / 3.0
-//   ret += ((20.0 * Math.sin(y * Math.PI) + 40.0 * Math.sin((y / 3.0) * Math.PI)) * 2.0) / 3.0
+  ret += ((20.0 * Math.sin(y * Math.PI) + 40.0 * Math.sin((y / 3.0) * Math.PI)) * 2.0) / 3.0
-//   ret +=
+  ret +=
-//     ((160.0 * Math.sin((y / 12.0) * Math.PI) + 320 * Math.sin((y * Math.PI) / 30.0)) * 2.0) / 3.0
+    ((160.0 * Math.sin((y / 12.0) * Math.PI) + 320 * Math.sin((y * Math.PI) / 30.0)) * 2.0) / 3.0
-//   return ret
+  return ret
-// }
+}
 
-// /**
+/**
-//  * 辅助函数：经度转换
+ * 辅助函数：经度转换
-//  */
+ */
-// function _transformLng(x, y) {
+function _transformLng(x, y) {
-//   let ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x))
+  let ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x))
-//   ret += ((20.0 * Math.sin(6.0 * x * Math.PI) + 20.0 * Math.sin(2.0 * x * Math.PI)) * 2.0) / 3.0
+  ret += ((20.0 * Math.sin(6.0 * x * Math.PI) + 20.0 * Math.sin(2.0 * x * Math.PI)) * 2.0) / 3.0
-//   ret += ((20.0 * Math.sin(x * Math.PI) + 40.0 * Math.sin((x / 3.0) * Math.PI)) * 2.0) / 3.0
+  ret += ((20.0 * Math.sin(x * Math.PI) + 40.0 * Math.sin((x / 3.0) * Math.PI)) * 2.0) / 3.0
-//   ret +=
+  ret +=
-//     ((150.0 * Math.sin((x / 12.0) * Math.PI) + 300.0 * Math.sin((x / 30.0) * Math.PI)) * 2.0) / 3.0
+    ((150.0 * Math.sin((x / 12.0) * Math.PI) + 300.0 * Math.sin((x / 30.0) * Math.PI)) * 2.0) / 3.0
-//   return ret
+  return ret
-// }
+}
 
-// /**
+/**
-//  * GCJ-02 (高德/腾讯坐标系) 转 WGS-84 (GPS原始坐标系)
+ * GCJ-02 (高德/腾讯坐标系) 转 WGS-84 (GPS原始坐标系)
-//  * @param {number} lng GCJ-02经度
+ * @param {number} lng GCJ-02经度
-//  * @param {number} lat GCJ-02纬度
+ * @param {number} lat GCJ-02纬度
-//  * @returns {number[]} [WGS-84经度, WGS-84纬度]
+ * @returns {number[]} [WGS-84经度, WGS-84纬度]
-//  */
+ */
-// export function gcj02ToWgs84(lng, lat) {
+export function gcj02ToWgs84(lng, lat) {
-//   // 判断是否在中国境内（简化版，实际需更完整判断）
+  // 判断是否在中国境内（简化版，实际需更完整判断）
-//   if (outOfChina(lng, lat)) {
+  if (outOfChina(lng, lat)) {
-//     return [lng, lat] // 境外坐标不转换
+    return [lng, lat] // 境外坐标不转换
-//   }
+  }
 
-//   let dlat = _transformLat(lng - 105.0, lat - 35.0)
+  let dlat = _transformLat(lng - 105.0, lat - 35.0)
-//   let dlng = _transformLng(lng - 105.0, lat - 35.0)
+  let dlng = _transformLng(lng - 105.0, lat - 35.0)
 
-//   const radlat = (lat / 180.0) * Math.PI
+  const radlat = (lat / 180.0) * Math.PI
-//   let magic = Math.sin(radlat)
+  let magic = Math.sin(radlat)
-//   magic = 1 - 0.00669342162296594323 * magic * magic
+  magic = 1 - 0.00669342162296594323 * magic * magic
-//   const sqrtmagic = Math.sqrt(magic)
+  const sqrtmagic = Math.sqrt(magic)
 
-//   dlat =
+  dlat =
-//     (dlat * 180.0) / (((6378245.0 * (1 - 0.00669342162296594323)) / (magic * sqrtmagic)) * Math.PI)
+    (dlat * 180.0) / (((6378245.0 * (1 - 0.00669342162296594323)) / (magic * sqrtmagic)) * Math.PI)
-//   dlng = (dlng * 180.0) / ((6378245.0 / sqrtmagic) * Math.cos(radlat) * Math.PI)
+  dlng = (dlng * 180.0) / ((6378245.0 / sqrtmagic) * Math.cos(radlat) * Math.PI)
 
-//   // 初始转换结果（粗略值）
+  // 初始转换结果（粗略值）
-//   let wgsLat = lat - dlat
+  let wgsLat = lat - dlat
-//   let wgsLng = lng - dlng
+  let wgsLng = lng - dlng
 
-//   return [wgsLng, wgsLat]
+  return [wgsLng, wgsLat]
-// }
+}
 
-// /**
+/**
-//  * WGS-84 转 GCJ-02（用于迭代优化）
+ * WGS-84 转 GCJ-02（用于迭代优化）
-//  */
+ */
-// function wgs84ToGcj02(lng, lat) {
+function wgs84ToGcj02(lng, lat) {
-//   if (outOfChina(lng, lat)) {
+  if (outOfChina(lng, lat)) {
-//     return [lng, lat]
+    return [lng, lat]
-//   }
+  }
-//   let dlat = _transformLat(lng - 105.0, lat - 35.0)
+  let dlat = _transformLat(lng - 105.0, lat - 35.0)
-//   let dlng = _transformLng(lng - 105.0, lat - 35.0)
+  let dlng = _transformLng(lng - 105.0, lat - 35.0)
-//   const radlat = (lat / 180.0) * Math.PI
+  const radlat = (lat / 180.0) * Math.PI
-//   let magic = Math.sin(radlat)
+  let magic = Math.sin(radlat)
-//   magic = 1 - 0.00669342162296594323 * magic * magic
+  magic = 1 - 0.00669342162296594323 * magic * magic
-//   const sqrtmagic = Math.sqrt(magic)
+  const sqrtmagic = Math.sqrt(magic)
-//   dlat =
+  dlat =
-//     (dlat * 180.0) / (((6378245.0 * (1 - 0.00669342162296594323)) / (magic * sqrtmagic)) * Math.PI)
+    (dlat * 180.0) / (((6378245.0 * (1 - 0.00669342162296594323)) / (magic * sqrtmagic)) * Math.PI)
-//   dlng = (dlng * 180.0) / ((6378245.0 / sqrtmagic) * Math.cos(radlat) * Math.PI)
+  dlng = (dlng * 180.0) / ((6378245.0 / sqrtmagic) * Math.cos(radlat) * Math.PI)
-//   return [lng + dlng, lat + dlat]
+  return [lng + dlng, lat + dlat]
-// }
+}

web/src/utils/loadTMap.js

@@ -0,0 +1,11 @@
+// utils/loadTMap.js
+export async function loadTMap(tk) {
+  if (window.T) return // 如果已加载，直接返回
+  return new Promise((resolve, reject) => {
+    const script = document.createElement('script')
+    script.src = `https://api.tianditu.gov.cn/api?v=4.0&tk=${tk}`
+    script.onload = () => resolve(window.T)
+    script.onerror = (err) => reject(err)
+    document.head.appendChild(script)
+  })
+}

web/src/views/LoginView.vue

@@ -75,13 +75,17 @@ export default {
         const values = await this.$refs.ruleForm.validateFields()
         const res = await getReq('/login',this.form )
         this.loading = false
+
         console.log(res);
         
-        // if (res.code === 200) {
+        if (res.errcode === 0) {
-        this.$message.success('登录成功')
+          this.$message.success('登录成功')
-        localStorage.setItem('token', res.token)
+          localStorage.setItem('token', res.token)
-        this.$router.push('/')
+          localStorage.setItem('permission',JSON.stringify( res.permission) )
-        // } else {
+          this.$router.push('/')
+
+        } 
+        // else {
         //   this.$message.error(res.message || '登录失败')
         // }
       } catch (error) {

web/src/views/MainView.vue

@@ -15,9 +15,8 @@
         </div>
       </div>
       <div :class="[subMenu.length > 0 ? 'subcontent' : 'content']">
-         <router-view />
+        <router-view />
       </div>
-     
     </div>
     <div class="menu">
       <div
@@ -47,14 +46,13 @@ export default {
       menuList: [
         {
           name: '系统总览',
-          path:'/home'
+          path: '/home'
         },
         {
           name: '运行监控',
           path: '/monitor'
         },
         {
-          
           name: '预测管理',
           path: '/predict'
         },
@@ -93,15 +91,15 @@ export default {
             },
             {
               name: '设备管理',
-              icon: 'icon-rizhiguanli'
+              path: '/device '
             },
             {
               name: '告警日志',
-              icon: 'icon-rizhiguanli'
+              path: '/log'
             },
             {
               name: '系统日志',
-              icon: 'icon-rizhiguanli'
+              path: '/syslog'
             }
           ]
         }
@@ -109,13 +107,58 @@ export default {
       subMenu: []
     }
   },
+  watch: {
+    $route: {
+      handler(n) {
+        console.log(n,"nnnnnnnnnnnnnn")
+        this.subMenu =n.matched[1].children || []
+      },
+      immediate: true
+    }
+  },
+
   mounted() {
     this.initRoute()
   },
   methods: {
+    // 过滤函数：根据权限数据过滤路由并附加权限信息
+    filterRoutes(routes, permissions) {
+      return routes.filter((route) => {
+        let hasViewPermission = false
+        // 查找当前路由对应的权限项
+        const routePermissions = permissions.filter((perm) => perm.route === route.path)
+
+        // 如果有权限项，附加到路由对象
+        if (routePermissions.length > 0) {
+          route.permissions = routePermissions;
+          hasViewPermission = true
+        }
+
+        // 检查是否有查看权限
+        // const hasViewPermission = routePermissions.some((perm) =>
+        //   perm.is_view === '1'
+        // );
+
+        // 递归处理子路由
+        if (route.children && route.children.length) {
+          route.children = this.filterRoutes(route.children, permissions)
+        }
+
+        // 保留有权限的路由或包含有效子路由的父路由
+        return hasViewPermission || (route.children && route.children.length)
+      })
+    },
     initRoute() {
-      console.log(this.$route,this.$router)
+      console.log(localStorage.getItem('permission'), "localStorage.getItem('permission')")
+      // 执行过滤
+      // const filteredRoutes = this.filterRoutes(
+      //   this.menuList,
+      //   JSON.parse(localStorage.getItem('permission'))
+      // )
+      console.log( this.$route.matched, 'filteredRoutes')
       this.subMenu = this.$route.matched[1].children || []
+      // this.menuList= JSON.parse(localStorage.getItem('permission'))
+      // this.subMenu =filteredRoutes[0].children||[]
 
       this.currentKey = '/' + this.$route.fullPath.split('/')[1]
       this.subCurrentKey = this.$route.fullPath.split('/')[2]
@@ -127,8 +170,9 @@ export default {
       this.$router.push(menu.path)
     },
     subMenuClick(subMenu) {
+      console.log(subMenu, subMenu.path)
       this.subCurrentKey = subMenu.path
-      this.$router.push(subMenu.path)
+      this.$router.push('/system'+subMenu.path)
     }
   }
 }
@@ -174,10 +218,10 @@ export default {
   margin: 20px 10px;
   border-radius: 20px;
 }
-.content{
+.content {
   height: 100%;
 }
-.subcontent{
+.subcontent {
   height: calc(100% - 46px);
 }
 .menu {
@@ -198,6 +242,7 @@ export default {
     font-size: 20px;
     font-weight: 700;
     cursor: pointer;
+    margin: 0 35px;
   }
   .active {
     border: 1px solid $border-color;

web/src/views/monitor.vue

@@ -4,7 +4,7 @@
       <div class="left">
         <div class="search-item">
           <span>场站切换</span>
-          <a-select v-model:value="selectStation" style="width: 220px">
+          <a-select v-model:value="selectStationId" style="width: 220px" @change="getStationChange">
             <a-select-option v-for="station in stations" :value="station['station_id']"
               >{{ station.name }}
             </a-select-option>
@@ -14,8 +14,8 @@
       <div class="right">
         <div class="search-item">
           <span>运行模式</span>
-          <a-select v-model:value="value" style="width: 220px">
+          <a-select v-model:value="workMode" style="width: 220px">
-            <a-select-option value="lucy">Lucy</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">
@@ -38,8 +38,8 @@
         </div>
       </div>
       <div class="container">
-        <videos v-if="systemType == 4" />
+        <videos v-if="systemType == 4" :station-id="selectStationId"/>
-        <device v-else :station-id="selectStation" :system-type="systemType"/>
+        <device v-else :station-id="selectStationId" :system-type="systemType"/>
       </div>
     </div>
   </div>
@@ -62,7 +62,7 @@ export default {
       systemType: 1,
       value: [],
       stations: [],
-      selectStation:'',
+      selectStationId:'',
       systems: [
         {
           name: '储能系统',
@@ -91,27 +91,80 @@ export default {
         // {
         //   name: "储能系统4",
         // }
-      ]
+      ],
+      workMode:'',
+      workModes:[
+        // 0：手动，1：峰谷套利，2：增网配容，3：应急供电，4：并网保电，5：自定时段
+        {
+          value:0,
+          label:'手动'
+        },
+        {
+          value:1,
+          label:'峰谷套利'
+        },
+        {
+          value:2,
+          label:'增网配容'
+        },
+        {
+          value:3,
+          label:'应急供电'
+        },
+        {
+          value:4,
+          label:'并网保电'
+        },
+        {
+          value:5,
+          label:'自定时段'
+        }
+       
+      ],
+      deviceGroup:[]
     }
   },
   mounted() {
     this.getStations()
   },
   methods: {
+    //场站切换
+    getStationChange(val){
+      console.log(val);
+      this.getStationAttr()
+      
+    },
     //查询场站列表
     async getStations() {
       try {
         const res = await getReq('/queryStationList', { page: 0, 'page_size': 10000 })
 
-        console.log(res)
         this.stations = res.data
-        this.selectStation=this.stations[0]['station_id']
+        this.selectStationId=this.stations[0]['station_id']
+        this.getStationAttr()
       } catch (error) {
         this.stations = []
-        this.selectStation=''
+        this.selectStationId=''
         this.$message.error(error.message)
       }
     },
+    // 查询场站的参数
+    async getStationAttr(){
+      try {
+        const res = await getReq('/queryStationOverview', { station_id: this.selectStationId })
+
+        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 = []
+        this.workMode=''
+        // this.$message.error(error.errmsg)
+      }
+    },
+
     
     chooseStation(system) {
       this.systemType = system.systemType
@@ -166,6 +219,7 @@ export default {
         width: calc(100% - 30px);
         margin: 0 15px 15px 15px;
         border-radius: 12px;
+        min-width: 150px;
 
         display: flex;
         flex-direction: column;
@@ -189,8 +243,9 @@ export default {
       }
     }
     .container {
-      width: 87%;
+      width: 100%;
       display: flex;
+      justify-content: space-between;
     }
   }
 }

web/src/views/predict.vue

@@ -1,14 +1,14 @@
 <template>
   <div class="predict">
     <div class="top">
-        <predictEcharts :chart-options="chartOptions[0]" :chart-data="chartData"/>
+        <predictEcharts :chart-options="chartOptions[0]" :chart-data="chartData" ref="chartRef1"/>
     </div>
     <div class="bottom">
         <div class="item">
-            <predictEcharts :chart-options="chartOptions[1]" :chart-data="chartData"/>
+            <predictEcharts :chart-options="chartOptions[1]" :chart-data="chartData" ref="chartRef2"/>
         </div>
         <div class="item">
-            <predictEcharts :chart-options="chartOptions[2]" :chart-data="chartData"/>
+            <predictEcharts :chart-options="chartOptions[2]" :chart-data="chartData" ref="chartRef3"/>
         </div>
 
     </div>
@@ -24,240 +24,158 @@ export default {
   props: {},
   data() {
     return {
-      chartOptions:[ {
+      chartOptions:[ 
-        title: '储能充放电预测',
+        {
-        type: 'line',
+          title: '储能充放电预测',
-        smooth:false,
+          type: 'line',
-        dataKey: 'chargeDischarge',
+          smooth:false,
-        infoKeys: [
+          dataKey: 'chargeDischarge',
+          infoKeys: [
      
-          {
+            {
-            key: 'key1',
+              key: 'W_store_in',
-            label: '电压',
+              label: '充电电量',
-            seriesOptions:{
+              seriesOptions:{
-              symbol: 'circle',
+                symbol: 'circle',
-              symbolSize: 8,
+                symbolSize: 8,
-              itemStyle: {
+                itemStyle: {
-                color: '#00FDF9' // 充电电量线条颜色
+                  color: '#00FDF9' // 充电电量线条颜色
-              },
+                },
-              lineStyle: {
+                lineStyle: {
-                color: '#00FDF9' // 充电电量线条颜色
+                  color: '#00FDF9' // 充电电量线条颜色
+                }
+              }
+            
+            },
+            {
+              key: 'W_store_ou',
+              label: '储能放电电量',
+              seriesOptions:{
+                symbol: 'circle',
+                symbolSize: 8,
+                itemStyle: {
+                  color: '#3E7EEF' // 充电电量线条颜色
+                },
+                lineStyle: {
+                  color: '#3E7EEF' // 充电电量线条颜色
+                }
               }
             }
+          ]
+        },
+        {
         
-          },
+          title: '充电负荷预测',
-          {
+          type: 'line',
-            key: 'key2',
+          smooth:false,
-            label: '电流',
+          dataKey: 'chargeDischarge',
+          infoKeys: [
      
-            seriesOptions:{
+            {
-              symbol: 'circle',
+              key: 'W_charge',
-              symbolSize: 8,
+              label: '运行负荷',
-              itemStyle: {
+              seriesOptions:{
-                color: '#3E7EEF' // 充电电量线条颜色
+                symbol: 'circle',
-              },
+                symbolSize: 8,
-              lineStyle: {
+                itemStyle: {
-                color: '#3E7EEF' // 充电电量线条颜色
+                  color: '#00FDF9' // 充电电量线条颜色
+                },
+                lineStyle: {
+                  color: '#00FDF9' // 充电电量线条颜色
+                }
+              }
+            
+            },
+            
+          ]
+        },
+        {
+        
+          title: '光伏发电预测',
+          type: 'line',
+          smooth:false,
+          dataKey: 'chargeDischarge',
+          infoKeys: [
+     
+            {
+              key: 'P_solar',
+              label: '发电功率',
+              seriesOptions:{
+                symbol: 'circle',
+                symbolSize: 8,
+                itemStyle: {
+                  color: '#3F80F2' // 充电电量线条颜色
+                },
+                lineStyle: {
+                  color: '#3F80F2' // 充电电量线条颜色
+                }
+              }
+            
+            },
+            {
+              key: 'W_solar',
+              label: '发电量',
+           
+              seriesOptions:{
+                symbol: 'circle',
+                symbolSize: 8,
+                itemStyle: {
+                  color: '#7747E8' // 充电电量线条颜色
+                },
+                lineStyle: {
+                  color: '#7747E8' // 充电电量线条颜色
+                }
               }
             }
-          }
+          ]
-        ]
+        },
-      },
-      {
-        
-        title: '充电负荷预测',
-        type: 'line',
-        smooth:false,
-        dataKey: 'chargeDischarge',
-        infoKeys: [
-     
-          {
-            key: 'key1',
-            label: '电压',
-            seriesOptions:{
-              symbol: 'circle',
-              symbolSize: 8,
-              itemStyle: {
-                color: '#00FDF9' // 充电电量线条颜色
-              },
-              lineStyle: {
-                color: '#00FDF9' // 充电电量线条颜色
-              }
-            }
-            
-          },
-          {
-            key: 'key2',
-            label: '电流',
-           
-            seriesOptions:{
-              symbol: 'circle',
-              symbolSize: 8,
-              itemStyle: {
-                color: '#3E7EEF' // 充电电量线条颜色
-              },
-              lineStyle: {
-                color: '#3E7EEF' // 充电电量线条颜色
-              }
-            }
-          }
-        ]
-      },
-      {
-        
-        title: '光伏发电预测',
-        type: 'line',
-        smooth:false,
-        dataKey: 'chargeDischarge',
-        infoKeys: [
-     
-          {
-            key: 'key1',
-            label: '电压',
-            seriesOptions:{
-              symbol: 'circle',
-              symbolSize: 8,
-              itemStyle: {
-                color: '#00FDF9' // 充电电量线条颜色
-              },
-              lineStyle: {
-                color: '#00FDF9' // 充电电量线条颜色
-              }
-            }
-            
-          },
-          {
-            key: 'key2',
-            label: '电流',
-           
-            seriesOptions:{
-              symbol: 'circle',
-              symbolSize: 8,
-              itemStyle: {
-                color: '#3E7EEF' // 充电电量线条颜色
-              },
-              lineStyle: {
-                color: '#3E7EEF' // 充电电量线条颜色
-              }
-            }
-          }
-        ]
-      },
       ],
      
-      chartData: [
+      chartData: {
-        {
+        xdata:[],
-          date: '2025-08-30',
+        ydata:{}
-          key1: 10,
+      }
-          key2: 10,
-          key3: 15,
-          key4: 5
-        },
-        {
-          date: '2025-08-29',
-          key1: 8,
-          key2: 5,
-          key3: 5,
-          key4: 7
-        },
-        {
-          date: '2025-08-28',
-          key1: 10,
-          key2: 10,
-          key3: 20,
-          key4: 4
-        },
-        {
-          date: '2025-08-27',
-          key1: 10,
-          key2: 10,
-          key3: 15,
-          key4: 5
-        },
-        {
-          date: '2025-08-26',
-          key1: 10,
-          key2: 5,
-          key3: 15,
-          key4: 5
-        },
-        {
-          date: '2025-08-25',
-          key1: 10,
-          key2: 5,
-          key3: 15,
-          key4: 5
-        },
-        {
-          date: '2025-08-24',
-          key1: 10,
-          key2: 6,
-          key3: 15,
-          key4: 5
-        },
-        {
-          date: '2025-08-23',
-          key1: 10,
-          key2: 7,
-          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
-        }
-      ],
         
       
     }
   },
   mounted() {
-    this.getData()
+    this.$nextTick(() => {
+      this.getData()
+    })
+    
   },
   methods: {
+    generateTimePoints() {
+      const timePoints = []
+
+      for (let hour = 0; hour <= 24; hour++) {
+        for (let minute = 0; minute < 60; minute += 10) {
+          // 处理24:00的特殊情况
+          if (hour === 24 && minute === 0) {
+            timePoints.push('24:00')
+            break
+          }
+
+          // 格式化小时和分钟，确保两位数
+          const formattedHour = hour.toString().padStart(2, '0')
+          const formattedMinute = minute.toString().padStart(2, '0')
+
+          timePoints.push(`${formattedHour}:${formattedMinute}`)
+        }
+      }
+
+      return timePoints
+    },
     async  getData(){
-      const date={}
       try {
-        const res=await getReq('/queryPredictionDay',{date:'2025-09-04'})
+        const res=await getReq('/queryPredictionDetail')
-        console.log(res);
+        this.chartData.ydata=res.data
+        this.chartData.xdata = this.generateTimePoints()
+        
+        this.$refs.chartRef1.initCharts()
+        this.$refs.chartRef2.initCharts()
+        this.$refs.chartRef3.initCharts()
 
       } catch (error) {
         console.log(error);

web/src/views/system/alarmLog.vue

@@ -0,0 +1,209 @@
+<template>
+  <div class="alarmLog">
+    <searchBox
+      :btn-option-list="btnOptionList"
+      @operateForm="operateForm"
+    ></searchBox>
+
+    <div class="content-table">
+      <ComTable
+        :columns="columns"
+        :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'">{{
+                record.status ? '异常' : '正常'
+              }}</a-tag></span>
+        </template>
+
+        <template #action="record">
+          <OperateCom :record="record" :operate-list="operateList" @operateForm="operateForm" />
+        </template>
+      </ComTable>
+    </div>
+  <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
+      <!-- action:edit add -->
+      <EditCom
+        :record="formState"
+        @operateForm="operateForm"
+        type="alarmLog"
+        :action="formStatus"
+      ></EditCom>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import { columnList, alarmlogOptions } from '../../../public/config/columnList'
+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,
+  },
+  props: {},
+  data() {
+    return {
+      formModal: false,
+      formState: {},
+      formStatus: 'add', //表单状态辑状态 add:新增 edit:编辑
+      pageOption: {
+        pageSize: 10,
+        page: 1
+      },
+      btnOptionList: [],
+      paramsDate: {}
+    }
+  },
+  computed: {},
+  created() {
+    let info = []
+    let col = columnList.find((i) => i.page == 'alarmLog').columns
+    if (col.length) {
+      col.forEach((item) => {
+        info.push(this.$setWidth(item))
+      })
+    }
+    this.columns = info
+  },
+
+  mounted() {
+    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('/querySystemLogList', 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) {
+        //统一处理报错提示
+      }
+    },
+    async operateForm(type, record = {}) {
+      this.formStatus = type
+    
+      if(type=='edit'||type=='read'){ 
+        await this.getRuleFormInfo(record)
+
+        this.formModal = true
+        this.formState = record
+      }else if(type=='del'){
+        this.handleDelete([record.device_id],this.getList)
+      }else if(type=='back'){
+        this.formModal = false
+        this.getList()
+      }
+      
+    },
+    //  删除操作
+    async handleDelete(id,callback) {
+      const that = this
+      Modal.confirm({
+        title: '你确认删除数据吗?',
+        icon: createVNode(ExclamationCircleOutlined),
+
+        async onOk() {
+          try {
+            const res = await getReq('/deleteUser',{user_id:id})
+            if (res.errcode === 0) {
+              this.$message.success(res.errmsg)
+              this.pageOption.page=1
+              callback()
+            } else {
+              throw res
+            }
+          } catch (error) {
+            callback()
+          }
+        },
+        onCancel() {
+          // console.log("Cancel");
+        },
+        class: 'test'
+      })
+    },
+    async getRuleFormInfo(record) {
+      
+
+      const row = record || {}
+
+      for (let e of alarmlogOptions) {
+        for (let i of e.list) {
+          e.ruleForm[i.key] = row[i.key] || ''
+          // if (i.key === 'id') {
+          //   e.ruleForm.id = row.id
+          // } else if (i.key === 'is_open') {
+          //   e.ruleForm.is_open = Boolean(row.is_open)
+          // } else {
+          //   e.ruleForm[i.key] = row[i.key] || ''
+          // }
+
+          // if (i.key === 'station_id') {
+          //   i.list =  this.stations
+          // }
+          // if(['rated_capacity', 'rated_current', 'rated_voltage', 'reted_power'].includes(i.key)){
+          //   const attrs=JSON.parse(row.attrs||"{}")
+          //   e.ruleForm[i.key] = attrs[i.key]
+          // }
+          
+
+        }
+      }
+    },
+    handlePagesizeChange(pageOption) {
+      this.pageOption.pageSize = pageOption.pageSize
+      this.pageOption.page = pageOption.page
+      this.getList()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.alarmLog {
+  height: 100%;
+
+  .content-table {
+    height: calc(100% - 70px);
+    padding: 10px;
+  }
+}
+</style>

web/src/views/system/device.vue

@@ -0,0 +1,241 @@
+<template>
+  <div class="device">
+    <searchBox
+      :btn-option-list="btnOptionList"
+      @operateForm="operateForm"
+    ></searchBox>
+
+    <div class="content-table">
+      <ComTable
+        :columns="columns"
+        :table-data="tableData"
+        @handlePagesizeChange="handlePagesizeChange"
+        ref="comTable"
+        :table-option="tableOption"
+        :page-option="pageOption"
+      >
+        <template #type="record">
+          <span>{{ getType(record.type) }}</span>
+        </template>
+         <template #isEnable="record">
+          <span><a-tag :color="record.is_open ? 'green' : 'red'">{{
+                record.is_open ? '启用' : '禁用'
+              }}</a-tag></span>
+        </template>
+
+        <template #action="record">
+          <OperateCom :record="record" :operate-list="operateList" @operateForm="operateForm" />
+        </template>
+      </ComTable>
+    </div>
+    <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
+      <!-- action:edit add -->
+      <EditCom
+        :record="formState"
+        @operateForm="operateForm"
+        type="device"
+        :action="formStatus"
+      ></EditCom>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import { columnList, deviceOptions } 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'
+import {deviceTypeList} from '@/utils/config'
+export default { 
+  name: '',
+  components: {
+    searchBox,
+    EditCom,
+    ComTable,
+    OperateCom
+  },
+  props: {},
+  data() {
+    return {
+      deviceTypeList,
+      formModal: false,
+      formState: {},
+      formStatus: 'add', //表单状态辑状态 add:新增 edit:编辑
+      pageOption: {
+        pageSize: 10,
+        page: 1
+      },
+      btnOptionList: [],
+      paramsDate: {},
+      tableData:[],
+      tableOption:{},
+      stations:[],//场站列表
+    }
+  },
+  computed: {},
+  created() {
+    let info = []
+    let col = columnList.find((i) => i.page == 'device').columns
+    if (col.length) {
+      col.forEach((item) => {
+        info.push(this.$setWidth(item))
+      })
+    }
+    this.columns = info
+  },
+
+  mounted() {
+    this.operateList = this.$getBtns(['查看', '修改', '删除'])
+    this.btnOptionList = this.$getBtns(['新增'])
+    this.getList()
+    this.getStations()
+  },
+
+  methods: {
+    //查询场站列表
+    async getStations() {
+      this.stations=[]
+      try {
+        const res = await getReq('/queryStationList', { page: 0, 'page_size': 10000 })
+
+        this.stations = res.data
+        
+      } catch (error) {
+        this.stations = []
+        
+      }
+      return 
+    },
+    //获取设备类型
+    getType(type){
+      const deviceType = this.deviceTypeList.find((item) => item.value == type).label||''
+      return deviceType
+      
+    },
+    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('/queryDeviceList', 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) {
+        //统一处理报错提示
+      }
+    },
+    async operateForm(type, record = {}) {
+      this.formStatus = type
+      if(type=='add'){
+        this.formModal = true
+        this.formState = {}
+        this.getRuleFormInfo()
+      }else if(type=='edit'||type=='read'){ 
+        await this.getRuleFormInfo(record)
+
+        this.formModal = true
+        this.formState = record
+      }else if(type=='del'){
+        this.handleDelete([record.device_id],this.getList)
+      }else if(type=='back'){
+        this.formModal = false
+        this.getList()
+      }
+      
+    },
+    //  删除操作
+    async handleDelete(id,callback) {
+      const that = this
+      Modal.confirm({
+        title: '你确认删除数据吗?',
+        icon: createVNode(ExclamationCircleOutlined),
+
+        async onOk() {
+          try {
+            const res = await getReq('/deleteDevice',{device_id:id})
+            if (res.errcode === 0) {
+              this.$message.success(res.errmsg)
+              this.pageOption.page=1
+              callback()
+            } else {
+              throw res
+            }
+          } catch (error) {
+            callback()
+          }
+        },
+        onCancel() {
+        },
+        class: 'test'
+      })
+    },
+    async getRuleFormInfo(record) {
+      
+
+      const row = record || {}
+
+      for (let e of deviceOptions) {
+        for (let i of e.list) {
+          if (i.key === 'id') {
+            e.ruleForm.id = row.id
+          } else if (i.key === 'is_open') {
+            e.ruleForm.is_open = Boolean(row.is_open)
+          } else {
+            e.ruleForm[i.key] = row[i.key] || ''
+          }
+
+          if (i.key === 'station_id') {
+            i.list =  this.stations
+          }
+          if(['rated_capacity', 'rated_current', 'rated_voltage', 'reted_power'].includes(i.key)){
+            const attrs=JSON.parse(row.attrs||"{}")
+            e.ruleForm[i.key] = attrs[i.key]
+          }
+          
+
+        }
+      }
+    },
+    handlePagesizeChange(pageOption) {
+      this.pageOption.pageSize = pageOption.pageSize
+      this.pageOption.page = pageOption.page
+      this.getList()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.device {
+  height: 100%;
+
+  .content-table {
+    height: calc(100% - 70px);
+    padding: 10px;
+  }
+}
+</style>

web/src/views/system/log.vue

@@ -0,0 +1,216 @@
+<template>
+  <div class="alarmlog">
+    <searchBox
+      :btn-option-list="btnOptionList"
+      @operateForm="operateForm"
+    ></searchBox>
+
+    <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>
+    <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
+      <!-- action:edit add -->
+      <EditCom
+        :record="record"
+        @operateForm="operateForm"
+        type="user"
+        :action="formStatus"
+      ></EditCom>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import { columnList, userOptions } from '../../../public/config/columnList'
+import { getReq, postReq } from '@/request/api.js'
+
+import EditCom from '@/components/EditCom.vue'
+import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
+import { createVNode } from 'vue'
+
+export default {
+  name: '',
+  components: {
+    EditCom
+  },
+  props: {},
+  data() {
+    return {
+      formModal: false,
+      formState: {},
+      formStatus: 'add', //表单状态辑状态 add:新增 edit:编辑
+      pageOption: {
+        pageSize: 10,
+        page: 1
+      },
+      btnOptionList: [],
+      paramsDate: {}
+    }
+  },
+  computed: {},
+  created() {
+    let info = []
+    let col = columnList.find((i) => i.page == 'alarmlog').columns
+    if (col.length) {
+      col.forEach((item) => {
+        info.push(this.$setWidth(item))
+      })
+    }
+    this.columns = info
+  },
+
+  mounted() {
+    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('/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 = {}) {
+      console.log(record, record.id, 'rrrrrrrrrr')
+      this.formStatus = type
+      switch (type) {
+      case 'add':
+        this.formModal = true
+        this.formState = {}
+        this.getRuleFormInfo()
+
+        break
+      case 'edit':
+      case 'read':
+        this.formModal = true
+        this.formState = record
+        this.getRuleFormInfo(record)
+        break
+
+      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({
+        title: '你确认删除数据吗?',
+        icon: createVNode(ExclamationCircleOutlined),
+
+        async onOk() {
+          try {
+            const res = await getReq('/deleteUser', { user_id: id })
+            if (res.errcode === 0) {
+              this.$message.success(res.errmsg)
+              this.pageOption.page = 1
+              callback()
+            } else {
+              throw res
+            }
+          } catch (error) {
+            callback()
+          }
+        },
+        onCancel() {
+          // console.log("Cancel");
+        },
+        class: 'test'
+      })
+    },
+    async getRuleFormInfo(record) {
+      function getInfo(data, url) {
+        return new Promise((reslove, reject) => {
+          getReq(data, url).then((res) => {
+            reslove(res.data)
+          })
+        })
+      }
+
+      let row = {}
+      if (record && record.user_id) {
+        // row = await getInfo({ id: record.id },'/queryUserList')
+        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
+      this.pageOption.page = pageOption.page
+      this.getList()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.user {
+  height: 100%;
+
+  .content-table {
+    height: calc(100% - 70px);
+    padding: 10px;
+  }
+}
+</style>

web/src/views/system/permission.vue

@@ -0,0 +1,222 @@
+<template>
+  <div class="permission">
+    <searchBox
+      :btn-option-list="btnOptionList"
+      @onSearch="onSearch"
+      :search-options="searchOptions"
+      @operateForm="operateForm"
+    ></searchBox>
+
+    <div class="content-table">
+      <TreeTable
+        :columns="columns"
+        :table-data="tableData"
+        @handlePagesizeChange="handlePagesizeChange"
+        ref="comTable"
+        :table-option="tableOption"
+        :page-option="pageOption"
+        :table-h="tableH"
+      >
+        <template #is_open="record">
+          <!-- 0:禁用; 1:启用 -->
+          <span>{{ ['禁用', '启用'][record.is_open] }}</span>
+        </template>
+        <template #permission="record">
+          <!-- 0:禁用; 1:启用 -->
+          <span>{{record.permission.map(item=>item.name).toString() }}</span>
+        </template>
+
+        <template #action="record">
+          <OperateCom :record="record" :operate-list="operateList" @operateForm="operateForm" />
+        </template>
+      </TreeTable>
+    </div>
+    <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
+      <!-- action:edit add -->
+      <EditCom
+        :record="record"
+        @operateForm="operateForm"
+        type="permission"
+        :action="formStatus"
+      ></EditCom>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import { columnList, permissionOptions } from '../../../public/config/columnList'
+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: {
+  
+  },
+  props: {},
+  data() {
+    return {
+      formModal: false,
+      formState: {},
+      formStatus: 'add', //表单状态辑状态 add:新增 edit:编辑
+      pageOption: {
+        pageSize: 10,
+        page: 1
+      },
+      btnOptionList: [],
+      paramsDate: {}
+    }
+  },
+  computed: {},
+  created() {
+    let info = []
+    let col = columnList.find((i) => i.page == 'permission').columns
+    if (col.length) {
+      col.forEach((item) => {
+        info.push(this.$setWidth(item))
+      })
+    }
+    this.columns = info
+  },
+
+  mounted() {
+    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('/queryPermissionList', 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 = {}) {
+      console.log(record,record.id,'rrrrrrrrrr')
+      this.formStatus = type
+      switch (type) {
+      // case 'add':
+      //   this.formModal = true
+      //   this.formState = {}
+      //   this.getRuleFormInfo()
+
+      //   break
+      // case 'edit':
+      // case 'read':
+      //   this.formModal = true
+      //   this.formState = record
+      //   this.getRuleFormInfo(record)
+      //   break
+    
+      case 'del':
+        // this.handleDelete([record.permission_id],this.getList)
+
+        break
+
+      case 'back':
+        this.formModal = false
+        this.getList()
+        break
+
+      default:
+        break
+      }
+    },
+    //  删除操作
+    async handleDelete(id,callback) {
+      const that = this
+      Modal.confirm({
+        title: '你确认删除数据吗?',
+        icon: createVNode(ExclamationCircleOutlined),
+
+        async onOk() {
+          try {
+            const res = await getReq('/deletepermission',{permission_id:id})
+            if (res.errcode === 0) {
+              this.$message.success(res.errmsg)
+              this.pageOption.page=1
+              callback()
+            } else {
+              throw res
+            }
+          } catch (error) {
+            callback()
+          }
+        },
+        onCancel() {
+          // console.log("Cancel");
+        },
+        class: 'test'
+      })
+    },
+    async getRuleFormInfo(record) {
+      function getInfo(data, url) {
+        return new Promise((reslove, reject) => {
+          getReq(data, url).then((res) => {
+            reslove(res.data)
+          })
+        })
+      }
+
+      let row = {}
+      if (record && record.permission_id) {
+        // row = await getInfo({ id: record.id },'/querypermissionList')
+        this.record = record
+        row = record
+        // this.type='edit'
+      }
+      permissionOptions.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
+      this.pageOption.page = pageOption.page
+      this.getList()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.permission {
+  height: 100%;
+
+  .content-table {
+    height: calc(100% - 70px);
+    padding: 10px;
+  }
+}
+</style>

web/src/views/system/policy.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="policy">
+  <div class="policy" ref="policy">
     <searchBox :btn-option-list="btnOptionList" @onSearch="onSearch" @operateForm="operateForm" />
     <div class="content-table">
       <ComTable
@@ -20,36 +20,20 @@
           }}</a-tag>
         </template>
         <template #action="record">
-          <a-button
+            <OperateCom :record="record" :operate-list="operateList" @operateForm="operateForm" />
-            type="primary"
-            size="small"
-            @click="operateForm('read', record)"
-            style="margin-left: 10px"
-            >查看</a-button
-          >
-          <a-button
-            type="primary"
-            size="small"
-            @click="operateForm('edit', record)"
-            class="btn-edit"
-            style="margin-left: 10px"
-            >修改</a-button
-          >
-          <a-button
-            type="primary"
-            size="small"
-            @click="operateForm('del', record)"
-            class="btn-del"
-            style="margin-left: 10px"
-            >删除</a-button
-          >
         </template>
       </ComTable>
     </div>
   </div>
   <div>
-    <a-modal v-model:open="formModal"  width="70%" style="top: 20px" :footer="null">
+    <a-modal
-      <policyForm :form-state="formState" :form-status="formStatus" @closeModal="closeModal"/>
+      v-model:open="formModal"
+      width="70%"
+      style="top: 20px"
+      :footer="null"
+      :get-container="() => $refs.policy"
+    >
+      <policyForm :form-state="formState" :form-status="formStatus" @closeModal="closeModal" />
     </a-modal>
   </div>
 </template>
@@ -58,6 +42,8 @@
 import policyForm from '@/components/system/policyForm.vue'
 import { getReq } from '@/request/api'
 import { policyTypes } from '@/utils/config'
+import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
+import { createVNode } from 'vue'
 export default {
   name: '',
   components: { policyForm },
@@ -66,8 +52,6 @@ export default {
     return {
       formModal: false,
       btnOptionList: [
-        { label: '新增', icon: 'icon-tianjia', type: 'add' },
-        { label: '删除', icon: 'icon-tianjia', type: 'del' }
       ],
       columns: [
         {
@@ -125,18 +109,23 @@ export default {
         }
       ],
       tableData: [],
-      tableOption: {},
+      tableOption: {
+        select:false
+      },
       pageOption: {
-        page: 0,
+        page: 1,
         pageSize: 10,
-        total: 0
+        count: 0
       },
       tableH: '',
       formState: {},
-      formStatus:'add',//c表单状态辑状态 add:新增 edit:编辑
+      formStatus: 'add', //表单状态辑状态 add:新增 edit:编辑
+      operateList:[]
     }
   },
   mounted() {
+    this.operateList = this.$getBtns(['查看', '修改', '删除'])
+    this.btnOptionList = this.$getBtns(['新增'])
     this.getTableList()
   },
   methods: {
@@ -148,13 +137,12 @@ export default {
         })
         console.log(res)
         this.tableData = res.data
-        this.total = res.count
+        this.pageOption.count = res.count
       } catch (error) {
         console.log(error)
       }
     },
     getPolicyType(type) {
-      
       return policyTypes.find((item) => item.value == type)?.label || ''
     },
 
@@ -162,6 +150,7 @@ export default {
       console.log(data)
     },
     operateForm(type, record = {}) {
+      console.log(type, record)
 
       this.formStatus = type
       switch (type) {
@@ -173,16 +162,71 @@ export default {
         this.formModal = true
         this.formState = record
         break
-
+      case 'del':
+        this.handleDelete(record.policy_id)
+        break
+      case 'edit':
+        this.formModal = true
+        this.formState = record
+        break
       default:
         break
       }
     },
-    closeModal(){
+    // async handleDelete(record) {
+    //   try {
+    //     const res = await getReq('/deletePolicy', {
+    //       policy_id: record['policy_id']
+    //     })
+    //     if (res.errcode == 0) {
+    //       this.$message.success('删除成功')
+    //       this.getTableList()
+    //     }
+    //   } catch (error) {
+    //     this.$message.success(error)
+    //   }
+    // },
+    //  删除操作
+    async handleDelete(id) {
+      const that = this
+      this.$Modal.confirm({
+        title: '你确认删除数据吗?',
+        icon: createVNode(ExclamationCircleOutlined),
+
+        async onOk() {
+          try {
+            const res = await getReq('/deletePolicy', {
+              policy_id: id
+            })
+            if (res.errcode == 0) {
+              that.$message.success('删除成功')
+              that.getTableList()
+            }
+          } catch (error) {
+            that.$message.success(error)
+          }
+        },
+        onCancel() {
+          // console.log("Cancel");
+        },
+        class: 'test'
+      })
+    },
+    closeModal(flag = false) {
       this.formModal = false
+      if (flag) {
+        this.pageOption.page = 1
+        this.getTableList()
+      }
     },
     handlePagesizeChange(data) {
-      console.log(data)
+      if (data.pageSize !== this.pageOption.pageSize) {
+        this.pageOption.page = 1
+      } else {
+        this.pageOption.page = data.page
+      }
+      this.pageOption.pageSize = data.pageSize
+      this.getTableList()
     }
   }
 }
@@ -195,7 +239,7 @@ export default {
   padding: 0 15px;
   .content-table {
     width: 100%;
-    height: calc(100% - 92px);
+    height: calc(100% - 90px);
   }
 }
 </style>

web/src/views/system/role.vue

@@ -23,7 +23,7 @@
         </template>
         <template #permission="record">
           <!-- 0:禁用; 1:启用 -->
-          <span>{{record.permission.map(item=>item.name).toString() }}</span>
+          <span>{{ record.permission.map((item) => item.name).toString() }}</span>
         </template>
 
         <template #action="record">
@@ -34,6 +34,7 @@
     <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
       <!-- action:edit add -->
       <EditCom
+      :show-flag="formModal"
         :record="record"
         @operateForm="operateForm"
         type="role"
@@ -125,25 +126,39 @@ export default {
         //统一处理报错提示
       }
     },
+    async getPermissionList() {
+      let arr = []
+
+      const params = {
+        page_size: 1000,
+        page: 1
+      }
+
+      const res = await getReq('/queryPermissionList', params)
+      if (res.errcode === 0) {
+        arr = res.data
+      } else {
+        arr = []
+      }
+      return arr
+    },
     operateForm(type, record = {}) {
-      console.log(record,record.id,'rrrrrrrrrr')
+      console.log(record, record.id, 'rrrrrrrrrr')
       this.formStatus = type
       switch (type) {
       case 'add':
-        this.formModal = true
         this.formState = {}
         this.getRuleFormInfo()
 
         break
       case 'edit':
       case 'read':
-        this.formModal = true
         this.formState = record
         this.getRuleFormInfo(record)
         break
 
       case 'del':
-        this.handleDelete([record.role_id],this.getList)
+        this.handleDelete([record.role_id], this.getList)
 
         break
 
@@ -157,7 +172,7 @@ export default {
       }
     },
     //  删除操作
-    async handleDelete(id,callback) {
+    async handleDelete(id, callback) {
       const that = this
       Modal.confirm({
         title: '你确认删除数据吗?',
@@ -165,10 +180,10 @@ export default {
 
         async onOk() {
           try {
-            const res = await getReq('/deleteRole',{role_id:id})
+            const res = await getReq('/deleteRole', { role_id: id })
             if (res.errcode === 0) {
               this.$message.success(res.errmsg)
-              this.pageOption.page=1
+              this.pageOption.page = 1
               callback()
             } else {
               throw res
@@ -199,13 +214,37 @@ export default {
         row = record
         // this.type='edit'
       }
+      const perList = await this.getPermissionList()
+      const permissionList=perList.map((item)=>{
+        return{
+          key:+item.permission_id,
+          ...item
+        }
+      })
+      console.log(permissionList, 'permissionList')
+
       roleOptions.forEach((e, index) => {
         e.list.forEach((i) => {
-          
+          if (i.key == 'permission') {
-          e.ruleForm[i.key] = row ? row[i.key] : ''
+            i.tableData=permissionList
-          e.ruleForm.id = row.id
+            //  .forEach((item)=>{
+            //  .push({...item,key:item.permission_id})
+            // })
+            if (record && record.role_id) {
+              i.selectTableData = row.permission
+                ? row.permissionList.map((item) => item.permission_id)
+                : []
+            } else {
+              i.selectTableData = []
+            }
+          } else {
+            e.ruleForm[i.key] = row ? row[i.key] : ''
+          }
         })
       })
+      console.log(permissionList,"permissionList")
+      this.formModal = true
+
     },
     handlePagesizeChange(pageOption) {
       this.pageOption.pageSize = pageOption.pageSize

web/src/views/system/service.vue

@@ -0,0 +1,248 @@
+<template>
+  <div class="service">
+    <searchBox
+      :btn-option-list="btnOptionList"
+      @onSearch="onSearch"
+      :search-options="searchOptions"
+      @operateForm="operateForm"
+    ></searchBox>
+
+    <div class="content-table">
+      <ComTable
+        :columns="columns"
+        :table-data="tableData"
+        @handlePagesizeChange="handlePagesizeChange"
+        ref="comTable"
+        :table-option="tableOption"
+        :page-option="pageOption"
+        :table-h="tableH"
+      >
+        <template #is_open="record">
+          <span>{{ ['禁用', '启用'][record.is_open] }}</span>
+        </template>
+       
+
+        <template #action="record">
+          <OperateCom :record="record" :operate-list="operateList" @operateForm="operateForm" />
+        </template>
+      </ComTable>
+    </div>
+    <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
+      <!-- action:edit add -->
+      <EditCom
+        :record="record"
+        @operateForm="operateForm"
+        type="serviceApi"
+        :action="formStatus"
+      ></EditCom>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import { columnList, serviceApiOptions } from '../../../public/config/columnList'
+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: '',
+  components: {
+    searchBox,
+    EditCom,
+  },
+  props: {},
+  data() {
+    return {
+      formModal: false,
+      formState: {},
+      formStatus: 'add', //表单状态辑状态 add:新增 edit:编辑
+      pageOption: {
+        pageSize: 10,
+        page: 1
+      },
+      btnOptionList: [],
+      paramsDate: {},
+      workModeList:[
+        {
+          label:'最优经济化',
+          value:1
+        },
+        {
+          label:'支撑电网稳定',
+          value:2
+        },
+        {
+          label:'自定义',
+          value:3
+        },
+      ],
+      policyList:[
+        {
+          label:'削峰套利',
+          value:1
+        },
+        {
+          label:'需求响应',
+          value:2
+        },
+        {
+          label:'自发自用',
+          value:3
+        },
+      ]
+    }
+  },
+  computed: {},
+  created() {
+    let info = []
+    let col = columnList.find((i) => i.page == 'serviceApi').columns
+    if (col.length) {
+      col.forEach((item) => {
+        info.push(this.$setWidth(item))
+      })
+    }
+    this.columns = info
+  },
+
+  mounted() {
+    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('/queryServiceApiList', 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 = {}) {
+      console.log(record,record.id,'rrrrrrrrrr')
+      this.formStatus = type
+      switch (type) {
+      case 'add':
+        this.formModal = true
+        this.formState = {}
+        this.getRuleFormInfo()
+
+        break
+      case 'edit':
+      case 'read':
+        this.formModal = true
+        this.formState = record
+        this.getRuleFormInfo(record)
+        break
+    
+      case 'del':
+        this.handleDelete([record.api_id],this.getList)
+
+        break
+
+      case 'back':
+        this.formModal = false
+        this.getList()
+        break
+
+      default:
+        break
+      }
+    },
+    //  删除操作
+    async handleDelete(id,callback) {
+      const that = this
+      Modal.confirm({
+        title: '你确认删除数据吗?',
+        icon: createVNode(ExclamationCircleOutlined),
+
+        async onOk() {
+          try {
+            const res = await getReq('/deleteServiceApi',{api_id:id})
+            if (res.errcode === 0) {
+              this.$message.success(res.errmsg)
+              this.pageOption.page=1
+              callback()
+            } else {
+              throw res
+            }
+          } catch (error) {
+            callback()
+          }
+        },
+        onCancel() {
+          // console.log("Cancel");
+        },
+        class: 'test'
+      })
+    },
+    async getRuleFormInfo(record) {
+      function getInfo(data, url) {
+        return new Promise((reslove, reject) => {
+          getReq(data, url).then((res) => {
+            reslove(res.data)
+          })
+        })
+      }
+
+      let row = {}
+      if (record && record.api_id) {
+        // row = await getInfo({ api_id: record.api_id},'/queryserviceInfo')
+        this.record = record
+        row = record
+        // this.type='edit'
+      }
+      serviceApiOptions.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
+      this.pageOption.page = pageOption.page
+      this.getList()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.service {
+  height: 100%;
+
+  .content-table {
+    height: calc(100% - 70px);
+    padding: 10px;
+  }
+}
+</style>

web/src/views/system/station.vue

@@ -17,13 +17,14 @@
         :page-option="pageOption"
         :table-h="tableH"
       >
-        <template #is_open="record">
+        <template #status="record">
-          <!-- 0:禁用; 1:启用 -->
+          <span>{{ ['未启用', '启用'][record.status] }}</span>
-          <span>{{ ['禁用', '启用'][record.is_open] }}</span>
         </template>
-        <template #permission="record">
+        <template #work_mode="record">
-          <!-- 0:禁用; 1:启用 -->
+          <span>{{workModeList.find(item=>record.value==item.value)?.label|| '' }}</span>
-          <span>{{record.permission.map(item=>item.name).toString() }}</span>
+        </template>
+        <template #policy_id="record">
+          <span>{{policyList.find(item=>record.value==item.value)?.label|| ''}}</span>
         </template>
 
         <template #action="record">
@@ -72,7 +73,35 @@ export default {
         page: 1
       },
       btnOptionList: [],
-      paramsDate: {}
+      paramsDate: {},
+      workModeList:[
+        {
+          label:'最优经济化',
+          value:1
+        },
+        {
+          label:'支撑电网稳定',
+          value:2
+        },
+        {
+          label:'自定义',
+          value:3
+        },
+      ],
+      policyList:[
+        {
+          label:'削峰套利',
+          value:1
+        },
+        {
+          label:'需求响应',
+          value:2
+        },
+        {
+          label:'自发自用',
+          value:3
+        },
+      ]
     }
   },
   computed: {},
@@ -194,7 +223,7 @@ export default {
 
       let row = {}
       if (record && record.station_id) {
-        row = await getInfo({ station_id: record.station_id},'/queryStationInfo')
+        // row = await getInfo({ station_id: record.station_id},'/queryStationInfo')
         this.record = record
         row = record
         // this.type='edit'