按钮权限代码优化

src/views/alarmManage/alarmTotal.vue

@@ -1,8 +1,11 @@
 <template>
   <div class="app-container">
-    <!-- 返回start -->
-    <div class="siteTitle">
-      <el-button class="goBack" @click="goBack">返回</el-button>
+    <div class="filter-container" style="justify-content: left">
+      <div class="filter-item">
+        <el-button class="goBack" @click="goBack">返回</el-button>
+      </div>
+    </div>
+    <div class="mb-20" style="width: 100%;font-size: 16px;text-align: center;">
       站点【{{ alarmGradeList.siteName }}】{{
         alarmGradeList.type == 0
         ? '总数'
@@ -15,7 +18,6 @@
               : ''
       }}
     </div>
-    <!-- 返回end -->
 
     <!-- 表格start -->
     <el-table :data="tableData" border stripe>

src/views/monthReport/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="monthReport">
+  <div class="app-container page-nesting flex">
     <div class="monthContent1" v-if="modleBool">
       <div style="display: flex">
         <el-input placeholder="输入站点名称或关键字" v-model="filterText" class="attContentInput" clearable>
@@ -104,43 +104,54 @@ watch(
 </script>
 
 <style lang="scss">
-.monthReport {
-  display: flex;
-  height: calc(100vh - 130px);
-
-  // padding: 30px;
-  // margin-top: 50px;
-  .monthContent1 {
-    background-color: #fff;
-    width: 15%;
-    height: 100%;
-    margin-right: 25px;
-    padding: 20px;
-    min-width: 200px;
-
-    .monthSwitch {
-      margin-top: 20px;
+.monthContent1 {
+  background-color: #fff;
+  width: 15%;
+  height: 100%;
+  margin-right: 20px;
+  padding: 20px;
+  min-width: 200px;
+
+  .monthSwitch {
+    margin-top: 20px;
+    width: 100%;
+    height: calc(100% - 52px);
+    cursor: pointer;
+
+    .el-tree {
       width: 100%;
-      height: 20px;
-      cursor: pointer;
+      overflow: hidden;
+      height: 100%;
+      overflow-y: auto;
+
+      &-node {
+        .el-text {
+          width: 170px;
+        }
+      }
+
+      &::-webkit-scrollbar {
+        display: none;
+      }
     }
   }
+}
 
-  .monthContent2 {
-    background-color: #fff;
-    width: 85%;
-    min-width: 845px;
-    height: 100%;
-
-    .basicHeader {
-      margin-left: 15px;
-      margin-top: 15px;
-      margin-bottom: 15px;
-      overflow: hidden;
-    }
+.monthContent2 {
+  background-color: #fff;
+  width: 85%;
+  min-width: 845px;
+  height: 100%;
+
+  .basicHeader {
+    margin-left: 15px;
+    margin-top: 15px;
+    margin-bottom: 15px;
+    overflow: hidden;
   }
 }
 
+
 // tab重置样式
 .tabsSizeColor>.el-tabs__header .el-tabs__item {
   line-height: 50px;
@@ -161,16 +172,4 @@ watch(
 .el-tabs--card>.el-tabs__header .el-tabs__nav {
   border: none;
 }
-</style>
-<style>
-.monthTree {
-  width: 100%;
-  overflow: hidden;
-  height: 76vh;
-  overflow-y: auto;
-}
-
-.monthTree::-webkit-scrollbar {
-  display: none;
-}
 </style>

src/views/operManage/siteAchives/checkVideo.vue

@@ -1,19 +1,8 @@
 <template>
   <transition name="dialog-fade">
-    <el-dialog
-      v-if="showDialog"
-      :title="dialogTitle"
-      class="dialog-component"
-      v-model="showDialog"
-      width="800px"
-      @close="closeDialog(0)"
-    >
-      <el-form
-        ref="formInfo"
-        class="demo-form-inline alarmStatusDialog"
-        label-width="130px"
-  
-      >
+    <el-dialog v-if="showDialog" :title="dialogTitle" class="dialog-component" v-model="showDialog" width="800px"
+      @close="closeDialog(0)">
+      <el-form ref="formInfo" class="demo-form-inline" label-width="130px">
         <div class="topInfo underline">
           <el-row :gutter="20">
             <el-col :span="12">
@@ -85,16 +74,16 @@
                   配置不足（绝缘体）：
                 </el-radio>
               </div>
-              <div  class="mb-10">
+              <div class="mb-10">
                 <el-radio v-model="radio1" label="1">
                   缺少接地线与存放位置编号：
                 </el-radio>
               </div>
               <div>
                 备注:
-              
-                  <el-input v-model="formInfo.remark" style="width:160px"></el-input>
-               
+
+                <el-input v-model="formInfo.remark" style="width:160px"></el-input>
+
               </div>
             </div>
           </el-col>
@@ -237,6 +226,7 @@ export default {
 .el-form-item__label {
   width: 150px;
 }
+
 .el-form-item__content {
   margin-left: 150px;
 }

src/views/operManage/siteAchives/index.vue

@@ -55,9 +55,8 @@
       </el-table-column>
       <el-table-column fixed="right" label="操作" width="180">
         <template #default="scope">
-          <el-button @click="checkVideo(scope.$index, scope.row)" type="text" size="small"
-            class="delete-text">查看</el-button>
-          <el-button type="text" size="small" @click.prevent="editRow(scope.row)">编辑</el-button>
+          <el-button @click="checkVideo(scope.$index, scope.row)" type="danger" size="small" link>查看</el-button>
+          <el-button type="primary" size="small" @click.prevent="editRow(scope.row)" link>编辑</el-button>
         </template>
       </el-table-column>
     </el-table>

src/views/operManage/workManage/index.vue

@@ -95,10 +95,10 @@
 
       <el-table-column fixed="right" label="操作" width="">
         <template #default="scope">
-          <el-button type="text" size="small" @click.prevent="editRow(scope.row)">
+          <el-button type="primary" size="small" @click.prevent="editRow(scope.row)" link>
             编辑
           </el-button>
-          <el-button @click="goDhandlePage()" type="text" size="small" class="delete-text">
+          <el-button @click="goDhandlePage()" type="danger" size="small" link>
             待您处理
           </el-button>
         </template>

src/views/powerQuality/asseReport/loopReport.vue

@@ -71,19 +71,9 @@
                     </div>
                   </el-col>
                 </el-row>
-                <el-button class="banlanceBtn" round :type="getData.uaStatus == true
-                  ? 'primary'
-                  : getData.uaStatus == false
-                    ? 'danger'
-                    : 'warning'
-                  ">
-                  {{
-                    getData.uaStatus == true
-                    ? '合格'
-                    : getData.uaStatus == false
-                      ? '不合格'
-                      : '暂无结论'
-                  }}
+                <el-button class="banlanceBtn" round
+                  :type="getData.uaStatus == true ? 'primary' : getData.uaStatus == false ? 'danger' : 'warning'">
+                  {{ getData.uaStatus == true ? '合格' : getData.uaStatus == false ? '不合格' : '暂无结论' }}
                 </el-button>
                 <ul>
                   <li>
@@ -750,4 +740,15 @@ onMounted(() => {
 .el-col {
   border-radius: 4px;
 }
+
+.banlanceBtn {
+  max-width: 80%;
+  // margin: 0 auto 20px;
+  height: 40px;
+  // line-height: 40px;
+  width: 236px;
+  font-size: 16px !important;
+  // background: #6dc6ff;
+  // color: #fff
+}
 </style>

src/views/powerQuality/asseReport/scoreReport/component/radarChart.vue

@@ -3,172 +3,158 @@
     <div class="height260" id="radarChart" ref="radarChart" />
   </div>
 </template>
-<script>
-import {  defineComponent, onMounted, ref,watch } from 'vue'
+<script setup>
+/*----------------------------------依赖引入-----------------------------------*/
 import * as echarts from 'echarts'
+import { ElMessage, ElNotification } from 'element-plus'
+import { ref, onMounted, watch, getCurrentInstance, reactive, toRefs, } from 'vue'
+/*----------------------------------接口引入-----------------------------------*/
+/*----------------------------------组件引入-----------------------------------*/
+/*----------------------------------store引入-----------------------------------*/
+/*----------------------------------公共方法引入-----------------------------------*/
+/*----------------------------------公共变量-----------------------------------*/
+const props = defineProps({
+  getTableData: Object,
+}) //数据双向绑定
+const emit = defineEmits([])
+const { proxy } = getCurrentInstance()
+/*----------------------------------变量声明-----------------------------------*/
+// 读取数据 func
+const loading = ref(true)
+const getData = async () => {
+  loading.value = false
+}
 
-export default defineComponent({
-  name: 'RadarChart',
-  props:{
-    getTableData:Object,
-  },
-  setup(props) {
-
-    // 读取数据 func
-    const loading = ref(true)
-    const getData = async () => {
-
-      // loading.value = true;
-      // await store.dispatch("Home/queryWorksChartData");
-      loading.value = false
-    }
-    function echarts2(){
-       let myChart = echarts.init(document.getElementById('radarChart'))
-      // 绘制图表
-      myChart.setOption({
-        backgroundColor: '#FFF',
-        tooltip: {},
-        grid: {
-          left: '20',
-          right: '40',
-          top: '-20',
-          bottom: '0',
-          containLabel: true,
+function echarts2() {
+  let myChart = echarts.init(document.getElementById('radarChart'))
+  // 绘制图表
+  myChart.setOption({
+    backgroundColor: '#FFF',
+    tooltip: {},
+    grid: {
+      left: '20',
+      right: '40',
+      top: '-20',
+      bottom: '0',
+      containLabel: true,
+    },
+    radar: {
+      radius: '60%',
+      center: ['50%', '55%'],
+      splitNumber: 5,
+      nameGap: '15',
+      name: {
+        textStyle: {
+          color: '#a8a8a8',
         },
-        radar: {
-          radius: '60%',
-          center: ['50%', '55%'],
-          splitNumber: 5,
-          nameGap: '15',
-          name: {
-            textStyle: {
-              color: '#a8a8a8',
-            },
-          },
-          axisLine: {
-            lineStyle: {
-              color: '#ebebeb',
-            },
-          },
-          splitLine: {
-            lineStyle: {
-              width: 1,
-              color: '#ebebeb',
-            },
-          },
-          splitArea: {
-            areaStyle: {
-              color: ['#f8f8f8', '#fff'].reverse(),
-            },
-          },
-          indicator: [
-            {
-              name: '电压平衡度',
-              max: 20,
-            },
-            {
-              name: '电流平衡度',
-              max: 20,
-            },
-            {
-              name: '功率因数',
-              max: 20,
-            },
-            {
-              name: '电压合格率',
-              max: 20,
-            },
-            {
-              name: '负载率',
-              max: 20,
-            },
-          ],
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#ebebeb',
+        },
+      },
+      splitLine: {
+        lineStyle: {
+          width: 1,
+          color: '#ebebeb',
+        },
+      },
+      splitArea: {
+        areaStyle: {
+          color: ['#f8f8f8', '#fff'].reverse(),
         },
-        series: [
+      },
+      indicator: [
+        {
+          name: '电压平衡度',
+          max: 20,
+        },
+        {
+          name: '电流平衡度',
+          max: 20,
+        },
+        {
+          name: '功率因数',
+          max: 20,
+        },
+        {
+          name: '电压合格率',
+          max: 20,
+        },
+        {
+          name: '负载率',
+          max: 20,
+        },
+      ],
+    },
+    series: [
+      {
+        name: 'Title✍',
+        type: 'radar',
+        symbolSize: 12,
+        itemStyle: {
+          borderColor: '#ebebeb',
+          borderWidth: 2,
+        },
+        areaStyle: {
+          opacity: 0.3,
+        },
+        data: [
           {
-            name: 'Title✍',
-            type: 'radar',
-            symbolSize: 12,
             itemStyle: {
-              borderColor: '#ebebeb',
-              borderWidth: 2,
-            },
-            areaStyle: {
-              opacity: 0.3,
+              color: '#5eb6db',
             },
-            data: [
-              {
-                itemStyle: {
-                  color: '#5eb6db',
-                },
-                value: [props.getTableData.vtBalunQ?20:0,props.getTableData.elBalunQ?20:0, props.getTableData.cosQ?20:0, props.getTableData.uq?20:0, props.getTableData.iloadQ?20:0],
-              },
-            ],
+            value: [props.getTableData.vtBalunQ ? 20 : 0, props.getTableData.elBalunQ ? 20 : 0, props.getTableData.cosQ ? 20 : 0, props.getTableData.uq ? 20 : 0, props.getTableData.iloadQ ? 20 : 0],
           },
         ],
-      })
-      window.addEventListener('resize', () => {
-        myChart.resize()
-      })
-
-    }
-
-    const writeValue = (val) => {
-    
-      val
-
-      getData()
-      echarts2()
-    }
-
-    //监听变化
-    watch(
-      () => props.getTableData,
-      (newVal, oldVal, clear) => {
-        // 执行异步任务，并得到关闭异步任务的 id
-        // console.log(newVal)
-        let id = writeValue(newVal, oldVal)
-        // 如果 watch 监听被重复执行了，则会先清除上次未完成的异步任务
-        clear(() => clearTimeout(id))
       },
-      { lazy: true }
-    )
-
-    onMounted(() => {
-      getData()
-      echarts2()
+    ],
+  })
+  window.addEventListener('resize', () => {
+    myChart.resize()
+  })
 
-     
-    })
+}
 
-    return {
-      loading,
-   
-      getData,
-      echarts2
-    }
+//监听变化
+watch(
+  () => props.getTableData,
+  (newVal, oldVal, clear) => {
+    getData()
+    echarts2()
   },
+  { lazy: true }
+)
+
+onMounted(() => {
+  getData()
+  echarts2()
 })
 </script>
 <style lang="scss" scoped>
 .homeBoxCard {
   margin-bottom: 24px;
+
   ::v-deep(.el-card__header) {
     padding-left: 12px;
     padding-right: 12px;
   }
+
   ::v-deep(.el-card__body) {
     padding: 12px;
     font-size: 14px;
     line-height: 1.5715;
   }
+
   ::v-deep(.el-divider) {
     margin: 8px 0;
   }
+
   .num {
     font-size: 30px;
     color: #515a6e;
   }
+
   .height260 {
     height: 260px;
   }

src/views/powerQuality/asseReport/scoreReport/index.vue

@@ -42,20 +42,10 @@
 
           <radar-chart :getTableData="getData[0]" v-if="getData[0]" v-loading="loading"></radar-chart>
           <div class="totalScore">
-            总评分：{{ getData[0].score ? getData[0].score : 0 }}
-            <el-button :type="getData[0].score > 80
-              ? 'success'
-              : getData[0].score >= 60
-                ? 'warning'
-                : 'danger'
-              ">
-              {{
-                getData[0].score > 80
-                ? '优秀'
-                : getData[0].score >= 60
-                  ? '合格'
-                  : '不合格'
-              }}
+            <div class="title">总评分：{{ getData[0].score ? getData[0].score : 0 }}</div>
+            <el-button :type="getData[0].score > 80 ? 'success' : getData[0].score >= 60 ? 'warning' : 'danger'"
+              size="small">
+              {{ getData[0].score > 80 ? '优秀' : getData[0].score >= 60 ? '合格' : '不合格' }}
             </el-button>
           </div>
         </div>

src/views/powerQuality/realTimeMonitoring/realScore/index.vue

@@ -41,20 +41,12 @@
             <span>评分</span>
           </div>
           <radar-chart :getTableData="getData[0]" v-loading="loading"></radar-chart>
+
           <div class="totalScore">
-            总评分：{{ getData[0].score }}
-            <el-button :type="getData[0].score > 80
-              ? 'success'
-              : getData[0].score >= 60
-                ? 'warning'
-                : 'danger'">
-              {{
-                getData[0].score > 80
-                ? '优秀'
-                : getData[0].score >= 60
-                  ? '合格'
-                  : '不合格'
-              }}
+            <div class="title">总评分：{{ getData[0].score ? getData[0].score : 0 }}</div>
+            <el-button :type="getData[0].score > 80 ? 'success' : getData[0].score >= 60 ? 'warning' : 'danger'"
+              size="small">
+              {{ getData[0].score > 80 ? '优秀' : getData[0].score >= 60 ? '合格' : '不合格' }}
             </el-button>
           </div>
         </div>

src/views/siteManage/camera/index.vue

@@ -52,15 +52,14 @@
 
       <el-table-column fixed="right" label="操作" width="140">
         <template #default="scope">
-          <el-button type="text" size="small" @click.prevent="editRow(scope.row)"
-            :disabled="store.state.authorities.indexOf('修改') == -1">
+          <el-button type="primary" size="small" @click.prevent="editRow(scope.row)"
+            :disabled="store.state.authorities.indexOf('修改') == -1" link>
             编辑
           </el-button>
           <el-popconfirm confirm-button-text="是" cancel-button-text="否" icon="el-icon-info" icon-color="red" title="确定删除?"
             @confirm="handleDelete(scope.row)" @cancel="cancelEvent">
             <template #reference>
-              <el-button type="text" size="small" class="delete-text"
-                :disabled="store.state.authorities.indexOf('删除') == -1">
+              <el-button type="danger" size="small" :disabled="store.state.authorities.indexOf('删除') == -1" link>
                 删除
               </el-button>
             </template>

src/views/siteManage/watchDog/index.vue

@@ -42,15 +42,14 @@
       <el-table-column prop="qualityAnalysis" label="电能质量分析" align="center" width=""></el-table-column>
       <el-table-column fixed="right" label="操作" width="140">
         <template #default="scope">
-          <el-button type="text" size="small" @click.prevent="editRow(scope.row)"
-            :disabled="store.state.authorities.indexOf('修改') == -1">
+          <el-button type="primary" size="small" @click.prevent="editRow(scope.row)"
+            :disabled="store.state.authorities.indexOf('修改') == -1" link>
             编辑
           </el-button>
           <el-popconfirm confirm-button-text="是" cancel-button-text="否" icon="el-icon-info" icon-color="red" title="确定删除?"
             @confirm="handleDelete(scope.row)" @cancel="cancelEvent">
             <template #reference>
-              <el-button type="text" size="small" class="delete-text"
-                :disabled="store.state.authorities.indexOf('删除') == -1">
+              <el-button type="danger" size="small" :disabled="store.state.authorities.indexOf('删除') == -1" link>
                 删除
               </el-button>
             </template>

src/views/stationManage/siteList.vue

@@ -1,10 +1,11 @@
 <template>
   <div class="app-container">
-    <div class="siteTitle">
-      <el-button class="goBack" @click="goBack">返回</el-button>
-      台区1-站点列表
+    <div class="filter-container" style="justify-content: left">
+      <div class="filter-item">
+        <el-button class="goBack" @click="goBack">返回</el-button>
+      </div>
     </div>
-
+    <div class="mb-20" style="width: 100%;font-size: 16px;text-align: center;">台区1-站点列表</div>
     <!-- 表格start -->
     <el-table :data="tableData" border stripe>
       <el-table-column prop="siteName" label="站点名称" width="" fixed></el-table-column>