各模块样式等布局优化，运行分析接口联调

2026-05-27 18:59:26 +08:00 · 2025-09-12 16:27:06 +08:00
parent 1a66c87a5a
commit 52f016d3ea
28 changed files with 442 additions and 526 deletions
--- a/web/src/views/system/permission.vue
+++ b/web/src/views/system/permission.vue
@@ -1,10 +1,6 @@
 <template>
  <div class="permission">
-    <searchBox
-      :btn-option-list="btnOptionList"
-      @onSearch="onSearch"
-      @operateForm="operateForm"
-    ></searchBox>
+    <!-- <searchBox :btn-option-list="btnOptionList" @operateForm="operateForm"></searchBox> -->

    <div class="content-table">
      <TreeTable
@@ -31,7 +27,13 @@
        </template>
      </TreeTable>
    </div>
-    <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
+    <a-modal
+      v-model:open="formModal"
+      width="750px"
+      style="top: 20px"
+      :footer="null"
+      :destroy-on-close="true"
+    >
      <!-- action:edit add -->
      <EditCom
        :record="record"
@@ -64,7 +66,10 @@ export default {
        page: 1
      },
      btnOptionList: [],
-      paramsDate: {}
+      paramsDate: {},
+      tableOption: {
+        select: false
+      }
    }
  },
  computed: {},
@@ -125,10 +130,7 @@ export default {
    operateForm(type, record = {}) {
      this.formStatus = type
      switch (type) {
-      
-
      case 'del':
-
        break

      case 'back':
@@ -196,10 +198,9 @@ export default {
 <style lang="scss" scoped>
 .permission {
  height: 100%;
-
+ padding: 20px 20px 0 20px; 
  .content-table {
-    height: calc(100% - 70px);
-    padding: 10px;
+    height: calc(100% - 92px);
  }
 }
 </style>
--- a/web/src/views/system/role.vue
+++ b/web/src/views/system/role.vue
@@ -1,10 +1,6 @@
 <template>
  <div class="role">
-    <searchBox
-      :btn-option-list="btnOptionList"
-      @onSearch="onSearch"
-      @operateForm="operateForm"
-    ></searchBox>
+    <searchBox :btn-option-list="btnOptionList" @operateForm="operateForm"></searchBox>

    <div class="content-table">
      <ComTable
@@ -16,7 +12,7 @@
        :page-option="pageOption"
      >
        <template #is_open="record">
-           <!-- 0:禁用; 1:启用 -->
+          <!-- 0:禁用; 1:启用 -->
          <a-tag :color="record.is_open == 0 ? 'red' : 'green'">{{
            record.is_open == 0 ? '禁用' : '启用'
          }}</a-tag>
@@ -31,7 +27,13 @@
        </template>
      </ComTable>
    </div>
-    <a-modal v-model:open="formModal" width="950px" style="top: 20px" :footer="null" :destroy-on-close="true">
+    <a-modal
+      v-model:open="formModal"
+      width="950px"
+      style="top: 20px"
+      :footer="null"
+      :destroy-on-close="true"
+    >
      <!-- action:edit add -->
      <EditCom
        :show-flag="formModal"
@@ -75,8 +77,8 @@ export default {
      btnOptionList: [],
      paramsDate: {},
      tableOption: {
-        select:false
-      },
+        select: false
+      }
    }
  },
  computed: {},
@@ -143,9 +145,9 @@ export default {
            ...item,
            key: item.permission_id,
            is_add: Boolean(+item.is_add) || false,
-            is_del: Boolean(+item.is_del )|| false,
-            is_edit: Boolean(+item.is_edit )|| false,
-            is_view: Boolean(+item.is_view )|| false,
+            is_del: Boolean(+item.is_del) || false,
+            is_edit: Boolean(+item.is_edit) || false,
+            is_view: Boolean(+item.is_view) || false,
            // 确保子权限容器存在
            children: item.children ? [...item.children] : []
          }
@@ -194,10 +196,10 @@ export default {
    },
    calculateParentPermissions(node) {
      if (node.children?.length) {
-        node.is_view = node.children.some((child) => child.is_view === '1') ? true:false
-        node.is_add = node.children.some((child) => child.is_add === '1') ? true:false
-        node.is_edit = node.children.some((child) => child.is_edit === '1') ? true:false
-        node.is_del = node.children.some((child) => child.is_del === '1') ? true:false
+        node.is_view = node.children.some((child) => child.is_view === '1') ? true : false
+        node.is_add = node.children.some((child) => child.is_add === '1') ? true : false
+        node.is_edit = node.children.some((child) => child.is_edit === '1') ? true : false
+        node.is_del = node.children.some((child) => child.is_del === '1') ? true : false
      }
    },
    async getPermissionList() {
@@ -243,7 +245,7 @@ export default {
        is_add: data ? Boolean(+data.is_add) : false,
        is_del: data ? Boolean(+data.is_del) : false,
        is_edit: data ? Boolean(+data.is_edit) : false,
-        is_view: data ? Boolean(+data.is_view ): false
+        is_view: data ? Boolean(+data.is_view) : false
      }
    },
    operateForm(type, record = {}) {
@@ -295,13 +297,11 @@ export default {
            callback()
          }
        },
-        onCancel() {
-        },
+        onCancel() {},
        class: 'test'
      })
    },
    async getRuleFormInfo(record) {
-      
      function getInfo(data, url) {
        return new Promise((reslove, reject) => {
          getReq(data, url).then((res) => {
@@ -320,16 +320,16 @@ export default {
        perList,
        record && record.permission.length ? record.permission : []
      )
-      const newData=JSON.parse(JSON.stringify( this.processedData))
-      
+      const newData = JSON.parse(JSON.stringify(this.processedData))
+
      roleOptions.forEach((e, index) => {
        e.list.forEach((i) => {
          if (i.key == 'permission') {
            i.tableData = newData
-            if(record&&record.role_id){
-              i.selectTableData=this.extractAllIds( record.permission)
-            }else {
-              i.selectTableData=[]
+            if (record && record.role_id) {
+              i.selectTableData = this.extractAllIds(record.permission)
+            } else {
+              i.selectTableData = []
            }
          } else {
            e.ruleForm[i.key] = row ? row[i.key] : ''
@@ -340,25 +340,25 @@ export default {
    },
    // 定义提取所有ID的函数
    extractAllIds(treeData) {
-      const idSet = new Set();
- 
+      const idSet = new Set()
+
      // 递归遍历函数
      const traverse = (node) => {
        // 添加当前节点ID
        if (node.permission_id) {
-          idSet.add(node.permission_id);
+          idSet.add(node.permission_id)
        }
- 
+
        // 递归处理子节点
        if (node.children && node.children.length > 0) {
-          node.children.forEach((child) => traverse(child));
+          node.children.forEach((child) => traverse(child))
        }
-      };
- 
+      }
+
      // 处理所有根节点
-      treeData.forEach((node) => traverse(node));
- 
-      return Array.from(idSet);
+      treeData.forEach((node) => traverse(node))
+
+      return Array.from(idSet)
    },
    handlePagesizeChange(pageOption) {
      this.pageOption.pageSize = pageOption.pageSize
@@ -373,9 +373,9 @@ export default {
 .role {
  height: 100%;

+  padding: 0 20px;
  .content-table {
-    height: calc(100% - 70px);
-    padding: 10px;
+    height: calc(100% - 92px);
  }
 }
 </style>
--- a/web/src/views/system/service.vue
+++ b/web/src/views/system/service.vue
@@ -1,10 +1,6 @@
 <template>
  <div class="service">
-    <searchBox
-      :btn-option-list="btnOptionList"
-      @onSearch="onSearch"
-      @operateForm="operateForm"
-    ></searchBox>
+    <searchBox :btn-option-list="btnOptionList" @operateForm="operateForm"></searchBox>

    <div class="content-table">
      <ComTable
@@ -16,19 +12,24 @@
        :page-option="pageOption"
      >
        <template #is_open="record">
-           <!-- 0:禁用; 1:启用 -->
+          <!-- 0:禁用; 1:启用 -->
          <a-tag :color="record.is_open == 0 ? 'red' : 'green'">{{
            record.is_open == 0 ? '禁用' : '启用'
          }}</a-tag>
        </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">
+    <a-modal
+      v-model:open="formModal"
+      width="750px"
+      style="top: 20px"
+      :footer="null"
+      :destroy-on-close="true"
+    >
      <!-- action:edit add -->
      <EditCom
        :record="record"
@@ -52,13 +53,13 @@ export default {
  name: '',
  components: {
    searchBox,
-    EditCom,
+    EditCom
  },
  props: {},
  data() {
    return {
      tableOption: {
-        select:false
+        select: false
      },
      formModal: false,
      formState: {},
@@ -69,33 +70,33 @@ export default {
      },
      btnOptionList: [],
      paramsDate: {},
-      workModeList:[
+      workModeList: [
        {
-          label:'最优经济化',
-          value:1
+          label: '最优经济化',
+          value: 1
        },
        {
-          label:'支撑电网稳定',
-          value:2
+          label: '支撑电网稳定',
+          value: 2
        },
        {
-          label:'自定义',
-          value:3
-        },
+          label: '自定义',
+          value: 3
+        }
      ],
-      policyList:[
+      policyList: [
        {
-          label:'削峰套利',
-          value:1
+          label: '削峰套利',
+          value: 1
        },
        {
-          label:'需求响应',
-          value:2
+          label: '需求响应',
+          value: 2
        },
        {
-          label:'自发自用',
-          value:3
-        },
+          label: '自发自用',
+          value: 3
+        }
      ]
    }
  },
@@ -148,7 +149,6 @@ export default {
      } catch (error) {
        //统一处理报错提示
        this.$refs.comTable.loading = false
-
      }
    },
    operateForm(type, record = {}) {
@@ -166,9 +166,9 @@ export default {
        this.formState = record
        this.getRuleFormInfo(record)
        break
-    
+
      case 'del':
-        this.handleDelete([record.api_id],this.getList)
+        this.handleDelete([record.api_id], this.getList)

        break

@@ -182,7 +182,7 @@ export default {
      }
    },
    //  删除操作
-    async handleDelete(id,callback) {
+    async handleDelete(id, callback) {
      const that = this
      Modal.confirm({
        title: '你确认删除数据吗?',
@@ -190,10 +190,10 @@ export default {

        async onOk() {
          try {
-            const res = await getReq('/deleteServiceApi',{api_id:id})
+            const res = await getReq('/deleteServiceApi', { api_id: id })
            if (res.errcode === 0) {
              this.$message.success(res.errmsg)
-              this.pageOption.page=1
+              this.pageOption.page = 1
              callback()
            } else {
              throw res
@@ -202,8 +202,7 @@ export default {
            callback()
          }
        },
-        onCancel() {
-        },
+        onCancel() {},
        class: 'test'
      })
    },
@@ -225,7 +224,6 @@ export default {
      }
      serviceApiOptions.forEach((e, index) => {
        e.list.forEach((i) => {
-          
          e.ruleForm[i.key] = row ? row[i.key] : ''
          e.ruleForm.id = row.id
        })
--- a/web/src/views/system/station.vue
+++ b/web/src/views/system/station.vue
@@ -1,10 +1,6 @@
 <template>
  <div class="station">
-    <searchBox
-      :btn-option-list="btnOptionList"
-      @onSearch="onSearch"
-      @operateForm="operateForm"
-    ></searchBox>
+    <searchBox :btn-option-list="btnOptionList" @operateForm="operateForm"></searchBox>

    <div class="content-table">
      <ComTable
@@ -22,19 +18,20 @@
          <span>{{}}</span>
        </template>
        <template #work_mode="record">
-          <span>{{ workModeList.find((item) => record.value == item.value)?.label || '' }}</span>
+          <span>{{ workModeList.find((item) => record.work_mode == item.value)?.label || '' }}</span>
        </template>
        <template #policy_id="record">
-          <span>{{ policyList.find((item) => record.value == item.value)?.label || '' }}</span>
+          <span>{{ policyList.find((item) => record.policy_id == item.value)?.label || '' }}</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">
+    <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null"  :destroy-on-close="true">
      <!-- action:edit add -->
      <EditCom
+        ref="EditCom"
        :record="record"
        @operateForm="operateForm"
        type="station"
@@ -217,8 +214,7 @@ export default {
            callback()
          }
        },
-        onCancel() {
-        },
+        onCancel() {},
        class: 'test'
      })
    },
@@ -240,8 +236,27 @@ export default {
      }
      stationOptions.forEach((e, index) => {
        e.list.forEach((i) => {
-          e.ruleForm[i.key] = row ? row[i.key] : ''
-          e.ruleForm.id = row.id
+          if (i.key == 'work_mode') {
+            console.log(row[i.key], 'rrrrrrrrr')
+            switch (row[i.key]) {
+            case '1':
+            case '5':
+              e.ruleForm[i.key] =row[i.key] 
+              // this.$refs.EditCom.workModeIdSelect = row[i.key]
+              e.ruleForm['policy_id'] = row ? row['policy_id'] : ''
+              stationOptions[0].list[stationOptions[0].list.length - 1].type = 'select'
+              break
+            default:
+              e.ruleForm[i.key] =row[i.key] 
+
+              console.log('1245')
+              stationOptions[0].list[stationOptions[0].list.length - 1].type = 'unshow'
+
+              break
+            }
+          } else {
+            e.ruleForm[i.key] = row ? row[i.key] : ''
+          }
        })
      })
    },
@@ -258,9 +273,9 @@ export default {
 .station {
  height: 100%;

+   padding: 0 20px;
  .content-table {
-    height: calc(100% - 70px);
-    padding: 10px;
+    height: calc(100% - 92px);
  }
 }
 </style>
--- a/web/src/views/system/user.vue
+++ b/web/src/views/system/user.vue
@@ -1,11 +1,6 @@
 <template>
  <div class="user">
-    <searchBox
-      :btn-option-list="btnOptionList"
-      @onSearch="onSearch"
-      :search-options="searchOptions"
-      @operateForm="operateForm"
-    ></searchBox>
+    <searchBox :btn-option-list="btnOptionList" @operateForm="operateForm"></searchBox>

    <div class="content-table">
      <ComTable
@@ -26,7 +21,13 @@
        </template>
      </ComTable>
    </div>
-    <a-modal v-model:open="formModal" width="750px" style="top: 20px" :footer="null">
+    <a-modal
+      v-model:open="formModal"
+      width="750px"
+      style="top: 20px"
+      :footer="null"
+      :destroy-on-close="true"
+    >
      <!-- action:edit add -->
      <EditCom
        :record="record"
@@ -48,13 +49,13 @@ import { createVNode } from 'vue'
 export default {
  name: '',
  components: {
-    EditCom,
+    EditCom
  },
  props: {},
  data() {
    return {
      tableOption: {
-        select:false
+        select: false
      },
      formModal: false,
      formState: {},
@@ -134,9 +135,9 @@ export default {
        this.formState = record
        this.getRuleFormInfo(record)
        break
-    
+
      case 'del':
-        this.handleDelete([record.user_id],this.getList)
+        this.handleDelete([record.user_id], this.getList)

        break

@@ -150,7 +151,7 @@ export default {
      }
    },
    //  删除操作
-    async handleDelete(id,callback) {
+    async handleDelete(id, callback) {
      const that = this
      this.$Modal.confirm({
        title: '你确认删除数据吗?',
@@ -158,10 +159,10 @@ export default {

        async onOk() {
          try {
-            const res = await getReq('/deleteUser',{user_id:id})
+            const res = await getReq('/deleteUser', { user_id: id })
            if (res.errcode === 0) {
              this.$message.success(res.errmsg)
-              this.pageOption.page=1
+              this.pageOption.page = 1
              callback()
            } else {
              throw res
@@ -170,8 +171,7 @@ export default {
            callback()
          }
        },
-        onCancel() {
-        },
+        onCancel() {},
        class: 'test'
      })
    },
@@ -193,7 +193,6 @@ export default {
      }
      userOptions.forEach((e, index) => {
        e.list.forEach((i) => {
-          
          e.ruleForm[i.key] = row ? row[i.key] : ''
          e.ruleForm.id = row.id
        })
@@ -211,10 +210,9 @@ export default {
 <style lang="scss" scoped>
 .user {
  height: 100%;
-
+  padding: 0 20px;
  .content-table {
-    height: calc(100% - 70px);
-    padding: 10px;
+    height: calc(100% - 92px);
  }
 }
 </style>