更新202111010851

public/static/config.js

@@ -1,10 +1,10 @@
 // api 请求路径
 var PLATFROM_CONFIG = {};
 // PLATFROM_CONFIG.baseUrl = "http://172.16.120.104:8010/" //杨强本地
-PLATFROM_CONFIG.baseUrl = "http://172.16.1.196:8010/"  //超博本地
+// PLATFROM_CONFIG.baseUrl = "http://172.16.1.196:8010/"  //超博本地
 
-// PLATFROM_CONFIG.baseUrl = "https://wx.ewoogi.com/api" //线上
-PLATFROM_CONFIG.fileUrl = "https://wx.ewoogi.com/file/" //xlsx文件访问路径
+PLATFROM_CONFIG.baseUrl = "https://qhome.usky.cn/fivapi/" //线上
+// PLATFROM_CONFIG.fileUrl = "https://wx.ewoogi.com/file/" //xlsx文件访问路径
 
 // 本地json文件请求路径
 PLATFROM_CONFIG.Interface = "/vuefiv/InterfaceReturn.json"

src/api/alarmManage/index.js

@@ -0,0 +1,10 @@
+import request from '@/utils/request'
+
+//巡检管理-巡检计划-计划列表查询
+export function alarmGradeCount(params) {
+    return request({
+        url: '/alarmPower/alarmGradeCount',
+        method: 'GET',
+        params,
+    })
+}

src/api/powerQuality/harmonicReport.js

@@ -0,0 +1,24 @@
+import request from '@/utils/request'
+
+//历史电流电压评分
+export function rtRealScore(params) {
+    return request({
+        url: '/htAnalogData/rtRealScore',
+        method: 'GET',
+        params,
+    })
+}
+
+//通信设备列表查询-无分页
+export function deviceListOne(params) {
+    return request({
+        url: '/device/deviceListOne',
+        method: 'GET',
+        params,
+    })
+}
+
+
+
+
+

src/config/default/setting.config.js

@@ -4,7 +4,7 @@
 
 const setting = {
   //开发以及部署时的URL，hash模式时在不确定二级目录名称的情况下建议使用""代表相对路径或者"/二级目录/"，history模式默认使用"/"或者"/二级目录/"
-  publicPath: '',
+  publicPath: './',
   //生产环境构建文件的目录名
   outputDir: 'dist',
   //放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录。
@@ -35,7 +35,7 @@ const setting = {
   //路由模式，可选值为 history 或 hash
   routerMode: 'hash',
   //不经过token校验的路由
-  routesWhiteList: ['/login', '/register', '/callback', '/404', '/403'],
+  routesWhiteList: ['/login', '/register', '/callback', '/404', '/403' , '/401'],
   //加载时显示文字
   loadingText: '正在加载中...',
   //token名称

src/main.js

@@ -23,10 +23,10 @@ import SvgIcon from "@/components/SvgIcon"
  * @author chuzhixin 1204505056@qq.com
  * @description 正式环境默认使用mock，正式项目记得注释后再打包
  */
-if (process.env.NODE_ENV === 'production') {
-  const { mockXHR } = require('@/utils/static')
-  mockXHR()
-}
+// if (process.env.NODE_ENV === 'production') {
+//   const { mockXHR } = require('@/utils/static')
+//   mockXHR()
+// }
 
 var app = createApp(App)
 

src/store/index.js

@@ -22,6 +22,8 @@ export default createStore({
     siteId: 1, //公共api请求参数->siteId
     siteList: [],//公共api站点下拉列表存储->siteId
     deviceList: [],//公共站点下拉列表
+    monthList: [],//公共每月最后一天信息存储
+    dateList: [],//公共每月当天信息存储
 
     timeProcessing: '',
 
@@ -259,7 +261,57 @@ export default createStore({
       const HH = time.getHours(); //时，
       const MM = time.getMinutes(); //分
       const SS = time.getSeconds(); //秒
-      state.timeProcessing = Y + '-' + add0(M+1) + '-' + add0(D) + ' ' + add0(HH) + ':' + add0(MM) + ':' + add0(SS);
+      state.timeProcessing = Y + '-' + add0(M + 1) + '-' + add0(D) + ' ' + add0(HH) + ':' + add0(MM) + ':' + add0(SS);
     },
+    /**
+     * @公共获取某月的第一天和最后一天
+     */
+    getCurrentMonthLast(state, timeAll) {
+      var date1 = timeAll;
+      date1.setDate(1);
+      var month1 = parseInt(date1.getMonth() + 1);
+      var day1 = date1.getDate();
+      if (month1 < 10) {
+        month1 = '0' + month1
+      }
+      if (day1 < 10) {
+        day1 = '0' + day1
+      }
+
+      var date = timeAll;
+      var currentMonth = date.getMonth();
+      var nextMonth = ++currentMonth;
+      var nextMonthFirstDay = new Date(date.getFullYear(), nextMonth, 1);
+      var oneDay = 1000 * 60 * 60 * 24;
+      var lastTime = new Date(nextMonthFirstDay - oneDay);
+      var month = parseInt(lastTime.getMonth() + 1);
+      var day = lastTime.getDate();
+      if (month < 10) {
+        month = '0' + month
+      }
+      if (day < 10) {
+        day = '0' + day
+      }
+      state.monthList = [date1.getFullYear() + '-' + month1 + '-' + day1, date.getFullYear() + '-' + month + '-' + day]
+
+    },
+    /**
+     * @获取当天日期
+     */
+    getNowFormatDate(state, timeAll) {
+      var date = timeAll;
+      var seperator1 = "-";
+      var year = date.getFullYear();
+      var month = date.getMonth() + 1;
+      var strDate = date.getDate();
+      if (month >= 1 && month <= 9) {
+        month = "0" + month;
+      }
+      if (strDate >= 0 && strDate <= 9) {
+        strDate = "0" + strDate;
+      }
+      var currentdate = year + seperator1 + month + seperator1 + strDate;
+      state.dateList = currentdate
+    }
   }
 })

src/views/alarmManage/index.vue

@@ -7,18 +7,23 @@
           <div class="filter-item">
             站点:
             <el-select
-              v-model="region"
+              v-model="store.state.siteId"
               placeholder="请选择"
               style="width: 200px"
+              clearable
             >
-              <el-option label="已执行" value="1"></el-option>
-              <el-option label="未执行" value="2"></el-option>
+              <el-option
+                v-for="item in store.state.siteList"
+                :key="item.id"
+                :label="item.siteName"
+                :value="item.id"
+              ></el-option>
             </el-select>
           </div>
           <div class="filter-item">
             时间：
             <el-date-picker
-              v-model="value1"
+              v-model="dateValue"
               type="datetimerange"
               range-separator="至"
               start-placeholder="开始日期"
@@ -27,7 +32,9 @@
             ></el-date-picker>
           </div>
           <el-button class="search-button">重置</el-button>
-          <el-button type="primary" class="search-button">搜索</el-button>
+          <el-button type="primary" class="search-button" @click="listSelect()">
+            搜索
+          </el-button>
         </div>
       </div>
     </div>
@@ -47,60 +54,63 @@
           <div @click="handleClick(scope.row)">{{ scope.row.siteName }}</div>
         </template>
       </el-table-column>
-      <el-table-column prop="totalNum" label="总数">
+      <el-table-column prop="totalGrade" label="总数">
         <template #default="scope">
           <span
             class="gradualBg total"
-            :class="{ transparent: scope.row.totalNum == 0 }"
+            :class="{ transparent: scope.row.totalGrade == 0 }"
             :style="{
-              width: (scope.row.totalNum / this.allMaxData.totalNumMax) * 100 + '%',
+              width:
+                (scope.row.totalGrade / allMaxData.totalNumMax) * 100 + '%',
             }"
             @click="goAlarmTotal"
           >
-            {{ scope.row.totalNum }}
+            {{ scope.row.totalGrade }}
           </span>
         </template>
       </el-table-column>
-      <el-table-column prop="oneAlarming" label="一级告警" width="">
+      <el-table-column prop="oneGrade" label="一级告警" width="">
         <template #default="scope">
           <span
             class="gradualBg"
-            :class="{ transparent: scope.row.oneAlarming == 0 }"
+            :class="{ transparent: scope.row.oneGrade == 0 }"
             :style="{
-              width: (scope.row.oneAlarming / this.allMaxData.oneAlarmingMax) * 100 + '%',
+              width:
+                (scope.row.oneGrade / allMaxData.oneAlarmingMax) * 100 + '%',
             }"
             @click="goAlarmTotal"
           >
-            {{ scope.row.oneAlarming }}
+            {{ scope.row.oneGrade }}
           </span>
         </template>
       </el-table-column>
-      <el-table-column prop="twoAlarming" label="二级告警" width="">
+      <el-table-column prop="twoGrade" label="二级告警" width="">
         <template #default="scope">
           <span
             class="gradualBg"
-            :class="{ transparent: scope.row.twoAlarming == 0 }"
+            :class="{ transparent: scope.row.twoGrade == 0 }"
             :style="{
-              width: (scope.row.twoAlarming / this.allMaxData.twoAlarmingMax) * 100 + '%',
+              width:
+                (scope.row.twoGrade / allMaxData.twoAlarmingMax) * 100 + '%',
             }"
             @click="goAlarmTotal"
           >
-            {{ scope.row.twoAlarming }}
+            {{ scope.row.twoGrade }}
           </span>
         </template>
       </el-table-column>
       <!-- <el-table-column prop="other" label="其他" width=""></el-table-column> -->
-      <el-table-column prop="other" label="其他" width="">
+      <el-table-column prop="otherGrade" label="其他" width="">
         <template #default="scope">
           <span
             class="gradualBg"
-            :class="{ transparent: scope.row.other == 0 }"
+            :class="{ transparent: scope.row.otherGrade == 0 }"
             :style="{
-              width: (scope.row.other / this.allMaxData.otherMax) * 100 + '%',
+              width: (scope.row.otherGrade / allMaxData.otherMax) * 100 + '%',
             }"
             @click="goAlarmTotal"
           >
-            {{ scope.row.other }}
+            {{ scope.row.otherGrade }}
           </span>
         </template>
       </el-table-column>
@@ -112,11 +122,11 @@
       <el-pagination
         @size-change="handleSizeChange"
         @current-change="handleCurrentChange"
-        :current-page="currentPage4"
-        :page-sizes="[100, 200, 300, 400]"
-        :page-size="100"
+        :current-page="currentPage"
+        :page-sizes="[15, 20, 25, 30]"
+        :page-size="pageSize"
         layout="total, sizes, prev, pager, next, jumper"
-        :total="400"
+        :total="total"
       ></el-pagination>
     </div>
 
@@ -130,165 +140,150 @@
 
 <script>
 import alarmTotal from './alarmTotal'
-export default {
+import { useStore } from 'vuex'
+import { computed, defineComponent, onMounted, ref } from 'vue'
+import * as api from '@/api/alarmManage/index'
+import { ElMessage } from 'element-plus'
+import { useRouter } from 'vue-router'
+export default defineComponent({
   components: { alarmTotal },
   name: 'VariableList',
+  setup() {
+    const store = useStore()
+    const router = useRouter()
 
-  data() {
-    return {
-      pageShow: true,
-      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
-      select: 1,
-      currentPage4: 4,
+    const pageShow = ref(true)
+    const dateValue = ref([
+      new Date(2021, 10, 10, 10, 10),
+      new Date(2021, 10, 11, 10, 10),
+    ])
 
-      showDialog: false,
-      tabPosition: 'one',
+    const total = ref(400)
+    const pageSize = ref(15)
+    const currentPage = ref(1)
+    const tableData = ref([])
 
-      input: '',
-      region: '',
-      tableData: [
-        {
-          other: '10',
-          siteName: '测试站点1',
-          totalNum: '626',
-          oneAlarming: '10',
-          twoAlarming: '10',
-        },
-        {
-          other: '10',
-          siteName: '测试站点1',
-          totalNum: '626',
-          oneAlarming: '10',
-          twoAlarming: '10',
-        },
-        {
-          other: '10',
-          siteName: '测试站点1',
-          totalNum: '626',
-          oneAlarming: '10',
-          twoAlarming: '10',
-        },
-        {
-          other: '10',
-          siteName: '测试站点1',
-          totalNum: '626',
-          oneAlarming: '10',
-          twoAlarming: '10',
-        },
-        {
-          other: '10',
-          siteName: '测试站点1',
-          totalNum: '626',
-          oneAlarming: '10',
-          twoAlarming: '10',
-        },
-        {
-          other: '10',
-          siteName: '测试站点1',
-          totalNum: '66',
-          oneAlarming: '10',
-          twoAlarming: '10',
-        },
-        {
-          other: '0',
-          siteName: '测试站点1',
-          totalNum: '6',
-          oneAlarming: '3',
-          twoAlarming: '10',
-        },
-        {
-          other: '0',
-          siteName: '测试站点1',
-          totalNum: '3',
-          oneAlarming: '3',
-          twoAlarming: '3',
-        },
-        {
-          other: '0',
-          siteName: '测试站点1',
-          totalNum: '1',
-          oneAlarming: '2',
-          twoAlarming: '0',
-        },
-      ],
+    //查询
+    function listSelect() {
+      api
+        .alarmGradeCount({
+          siteId: store.state.siteId,
+          size: pageSize.value,
+          current: currentPage.value,
+        })
+        .then((requset) => {
+          if (requset.status === 'SUCCESS') {
+            console.log(requset.data.records)
+            total.value = requset.data.total
+            tableData.value = requset.data.records
+          } else {
+            ElMessage.error(requset.msg)
+          }
+        })
     }
-  },
-  computed: {
 
-    allMaxData:function(){
+    //查看
+    const handleClick = (row) => {
+      alert('查看对应站点（页面跳转）')
+      console.log(row)
+    }
 
-     var allMaxData = {};
+    const handleSizeChange = (val) => {
+      console.log(`每页 ${val} 条`)
+    }
 
-      var totalNumData = [];
-      var oneAlarmingData = [];
-      var twoAlarmingData = [];
-      var otherData = [];
+    const handleCurrentChange = (val) => {
+      console.log(`当前页: ${val}`)
+    }
 
-      this.tableData.forEach((element,index) => {
-        totalNumData[index] = element.totalNum;
-        oneAlarmingData[index] = element.oneAlarming;
-        twoAlarmingData[index] = element.twoAlarming;
-        otherData[index] = element.other;
-      });
+    const goVariableList = () => {
+      // 跳转至订单列表页面传参
+      router.push({
+        path: '../siteManage/variableList/index.vue',
+      })
+      // this.$router.push({ name:'variableList'})
+    }
 
-     allMaxData.totalNumMax = Math.max.apply(Math,totalNumData);
-     allMaxData.oneAlarmingMax = Math.max.apply(Math,oneAlarmingData);
-     allMaxData.twoAlarmingMax = Math.max.apply(Math,twoAlarmingData);
-     allMaxData.otherMax = Math.max.apply(Math,otherData);
+    const getMsgFormSon = () => {
+      pageShow.value = !pageShow.value
+    }
+    const goAlarmTotal = () => {
+      pageShow.value = !pageShow.value
+    }
 
-      return allMaxData;
+    onMounted(() => {
+      listSelect()
+    })
 
-   },
-  },
-  methods: {
+    const allMaxData = computed(() => {
+      var allMaxData = {}
 
-    
-    getMsgFormSon() {
-      this.pageShow = !this.pageShow
-    },
+      var totalNumData = []
+      var oneAlarmingData = []
+      var twoAlarmingData = []
+      var otherData = []
+
+      tableData.value.forEach((element, index) => {
+        totalNumData[index] = element.totalGrade
+        oneAlarmingData[index] = element.oneGrade
+        twoAlarmingData[index] = element.twoGrade
+        otherData[index] = element.otherGrade
+      })
+
+      allMaxData.totalNumMax = Math.max.apply(Math, totalNumData)
+      allMaxData.oneAlarmingMax = Math.max.apply(Math, oneAlarmingData)
+      allMaxData.twoAlarmingMax = Math.max.apply(Math, twoAlarmingData)
+      allMaxData.otherMax = Math.max.apply(Math, otherData)
+
+      return allMaxData
+    })
 
-    goAlarmTotal() {
-      this.pageShow = !this.pageShow
-    },
-    //查看
-    handleClick(row) {
-      alert('查看对应站点（页面跳转）')
-      console.log(row)
-    },
     //自定义列样式
-    cellStyle({ row, column, rowIndex, columnIndex }) {
-      row, column, rowIndex 
+    const cellStyle = ({ row, column, rowIndex, columnIndex }) => {
+      row, column, rowIndex
       // console.log(row, column, rowIndex)
       if (columnIndex === 0) {
         return `color:#0284E8;cursor:pointer`
       }
-      if (columnIndex ) {
+      if (columnIndex) {
         // return `text-align:left;cursor:pointer;`
       } else {
         return ''
       }
-    },
-
-    handleSizeChange(val) {
-      console.log(`每页 ${val} 条`)
-    },
-    handleCurrentChange(val) {
-      console.log(`当前页: ${val}`)
-    },
-
+    }
     // 表头样式设置
-    goVariableList() {
-      // 跳转至订单列表页面传参
-      this.$router.push({
-        path: '../siteManage/variableList/index.vue',
-      })
-      // this.$router.push({ name:'variableList'})
-    },
-    headClass() {
+    const headClass = () => {
       return 'background:#FAFAFA;'
-    },
+    }
+    return {
+      headClass,
+      goVariableList,
+      handleCurrentChange,
+      handleSizeChange,
+      cellStyle,
+      handleClick,
+      goAlarmTotal,
+      getMsgFormSon,
+      listSelect,
+
+      store,
+      pageShow,
+      dateValue,
+
+      total,
+      pageSize,
+      currentPage,
+      tableData,
+
+      showDialog: false,
+      tabPosition: 'one',
+
+      input: '',
+      region: '',
+      allMaxData,
+    }
   },
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/dataManage/sameAnalysis/index.vue

@@ -7,7 +7,6 @@
           @change="siteChange"
           placeholder="选择站点"
         >
-        {{store.state.siteList}}
           <el-option
             v-for="item in store.state.siteList"
             :key="item.id"

src/views/deviceManage/powerEquip/powerDialog/insertDialog.vue

@@ -5,7 +5,7 @@
       v-model="dialogVisible"
       @close="close"
       @open="open"
-      width="30rem"
+      width="40%"
     >
       <div>
         <el-form

src/views/login/index.vue

@@ -38,11 +38,11 @@
         </div>
       </a-col>
     </a-row>
-    <div class="login-container-tips">
+    <!-- <div class="login-container-tips">
       基于vue{{ dependencies['vue'] }}
       + ant-design-vue
       {{ dependencies['ant-design-vue'] }}开发
-    </div>
+    </div> -->
   </div>
 </template>
 <script>

src/views/monthReport/index.vue

@@ -83,11 +83,6 @@ export default defineComponent({
       console.log(tab, event)
     }
 
-    // 表头样式设置
-    const headClass = () => {
-      return 'background:#FAFAFA !important;color: black;'
-    }
-
     const modleBool = ref(true)
     const modleAll = (value) => {
       modleBool.value = value.modleBool
@@ -114,6 +109,11 @@ export default defineComponent({
       // watch 刚被创建的时候不执行
       { lazy: true }
     )
+    
+    // 表头样式设置
+    const headClass = () => {
+      return 'background:#FAFAFA !important;color: black;'
+    }
     return {
       filterNode,
       headClass,

src/views/powerQuality/harmonicReport/curveCom.vue

@@ -0,0 +1,186 @@
+<template>
+  <div shadow="never" class="homeBoxCard" v-loading="loading">
+    <div style="text-align: center; font-weight: bold">
+      {{ curveComList.name }}
+    </div>
+    <div class="height300" ref="worksChartRef" />
+  </div>
+</template>
+<script>
+import { computed, defineComponent, onMounted, ref, watch } from 'vue'
+import { useStore } from 'vuex'
+import * as echarts from 'echarts'
+
+export default defineComponent({
+  name: 'CurveComB',
+  props: {
+    curveComList: Object,
+  },
+  setup(props, context) {
+    context
+    const store = useStore()
+    const worksChartRef = ref(null)
+
+    // 总数
+    const total = computed(() => store.state.Home.worksChartData.total)
+    // num
+    const num = computed(() => store.state.Home.worksChartData.num)
+
+    // 读取数据 func
+    const loading = ref(true)
+    const getData = async () => {
+      // loading.value = true
+      // await store.dispatch("Home/queryWorksChartData");
+      loading.value = false
+    }
+
+    function ecahrts() {
+      let myChart = echarts.init(worksChartRef.value)
+
+      // 绘制图表
+      myChart.setOption({
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow',
+          },
+        },
+        legend: {
+          right: 60,
+          itemWidth: 10,
+          itemHeight: 10,
+          itemGap: 35,
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true,
+        },
+        xAxis: [
+          {
+            type: 'category',
+            data: props.curveComList.dateList,
+            axisLine: {
+              show: true,
+              lineStyle: {
+                color: '#444',
+                width: 1,
+                type: 'solid',
+              },
+            },
+            axisTick: {
+              show: false,
+            },
+            axisLabel: {
+              show: true,
+              color: '#444',
+            },
+          },
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            name: 'A',
+            nameTextStyle: {
+              color: '#444',
+            },
+            axisLabel: {
+              formatter: '{value} ',
+            },
+            axisTick: {
+              show: false,
+            },
+            axisLine: {
+              show: false,
+              lineStyle: {
+                color: '#444',
+                width: 1,
+                type: 'solid',
+              },
+            },
+            splitLine: {
+              lineStyle: {
+                color: '#444',
+              },
+            },
+          },
+        ],
+        series: [
+          {
+            name: props.curveComList.icontitle,
+            type: 'bar',
+            data: props.curveComList.data,
+            barWidth: 10, //柱子宽度
+            barGap: '1', //柱子之间间距
+            itemStyle: {
+              normal: {
+                color: '#5b82ee',
+                opacity: 1,
+              },
+            },
+          },
+        ],
+      })
+      window.addEventListener('resize', () => {
+        myChart.resize()
+      })
+    }
+
+    onMounted(() => {
+      getData()
+      ecahrts()
+    })
+
+    // 异步任务 用于给tree传值
+    const writeValue = (val) => {
+      val
+      //   console.log(val)
+      ecahrts()
+    }
+    // 定义 watch 监听
+    watch(
+      props.curveComList,
+      (newCount, old, clear) => {
+        // 执行异步任务，并得到关闭异步任务的 id
+        let id = writeValue(newCount, old)
+        // 如果 watch 监听被重复执行了，则会先清除上次未完成的异步任务
+        clear(() => clearTimeout(id))
+      },
+      // watch 刚被创建的时候不执行
+      { lazy: true }
+    )
+
+    return {
+      worksChartRef,
+      loading,
+      total,
+      num,
+    }
+  },
+})
+</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;
+  }
+  .height300 {
+    height: 300px;
+  }
+}
+</style>

src/views/powerQuality/harmonicReport/curveComA.vue

@@ -1,6 +1,6 @@
 <template>
   <div shadow="never" class="homeBoxCard" v-loading="loading">
-    <div style="text-align: center;font-weight:bold">A相电流（A）</div>
+    <div style="text-align: center; font-weight: bold">A相电流（A）</div>
     <div class="height300" id="worksChartRef" ref="worksChartRef" />
   </div>
 </template>
@@ -14,6 +14,7 @@ export default defineComponent({
   setup() {
     const store = useStore()
 
+    const worksChartRef = ref(null)
     // 总数
     const total = computed(() => store.state.Home.worksChartData.total)
     // num
@@ -24,12 +25,12 @@ export default defineComponent({
     const getData = async () => {
       // loading.value = true
       // await store.dispatch("Home/queryWorksChartData");
-      loading.value = false;
+      loading.value = false
     }
 
     onMounted(() => {
       getData()
-      let myChart = echarts.init(document.getElementById('worksChartRef'))
+      let myChart = echarts.init(worksChartRef.value)
       // 绘制图表
       myChart.setOption({
         tooltip: {
@@ -39,6 +40,7 @@ export default defineComponent({
           },
         },
         legend: {
+          
           right: 60,
           itemWidth: 10,
           itemHeight: 10,
@@ -159,6 +161,7 @@ export default defineComponent({
     })
 
     return {
+      worksChartRef,
       loading,
       total,
       num,

src/views/powerQuality/harmonicReport/index.vue

@@ -7,64 +7,54 @@
           <div class="filter-item">
             选择站点:
             <el-select
-              v-model="region"
+              v-model="store.state.siteId"
               placeholder="请选择"
               style="width: 150px"
             >
-              <el-option label="站点一" value="1"></el-option>
-              <el-option label="站点二" value="2"></el-option>
+              <el-option
+                v-for="site in store.state.siteList"
+                :key="site"
+                :label="site.siteName"
+                :value="site.id"
+              ></el-option>
             </el-select>
           </div>
 
           <div class="filter-item">
-            回路:
+            选择设备:
             <el-select
-              v-model="circuit"
+              v-model="deviceCode"
               placeholder="请选择"
               style="width: 150px"
+              @change="listSelect()"
             >
-              <el-option label="回路1" value="1"></el-option>
-              <el-option label="回路2" value="2"></el-option>
-            </el-select>
-          </div>
-
-          <div class="filter-item">
-            测量类型:
-            <el-select
-              v-model="measurType"
-              placeholder="请选择"
-              style="width: 150px"
-            >
-              <el-option label="类型1" value="1"></el-option>
-              <el-option label="类型2" value="2"></el-option>
-            </el-select>
-          </div>
-
-          <div class="filter-item">
-            谐波次数:
-            <el-select
-              v-model="number"
-              placeholder="请选择"
-              style="width: 150px"
-            >
-              <el-option label="已执行" value="1"></el-option>
-              <el-option label="未执行" value="2"></el-option>
+              <el-option
+                v-for="device in deviceList"
+                :key="device"
+                :label="device.deviceName"
+                :value="device.deviceCode"
+              ></el-option>
+              <el-option label="设备1" value="DA00021026"></el-option>
             </el-select>
           </div>
 
           <div class="filter-item">
             时间：
             <el-date-picker
-              v-model="value4"
-             :type="dateType"
+              v-model="dateTime"
+              :type="dateType"
               placeholder="请选择"
               style="width: 150px"
+              @change="listSelect()"
+              :clearable="false"
+              :editable="false"
             ></el-date-picker>
 
-            <el-radio-group v-model="listTabPosition"  @change="listTabsChange(listTabPosition)" style="    display: inline-block;
-    position: relative;
-    top: -3px;
-}">
+            <el-radio-group
+              v-model="listTabPosition"
+              @change="listTabsChange(listTabPosition)"
+              style="display: inline-block; position: relative; top: -3px"
+            >
               <el-radio-button label="dayValue">按日</el-radio-button>
               <el-radio-button label="monthValue">按月</el-radio-button>
             </el-radio-group>
@@ -107,40 +97,148 @@
     >
       表格
     </el-button>
-    <div  v-if="num2 == 0">
-        <curve-comA></curve-comA>
-        <curve-comB></curve-comB>
-        <curve-comC></curve-comC>
+    <div v-if="num2 == 0">
+      <div v-for="curve in curveComList" :key="curve">
+        <curve-com :curveComList="curve"></curve-com>
+      </div>
+
+      <!-- <curve-comA></curve-comA>
+      <curve-comB></curve-comB>
+      <curve-comC></curve-comC> -->
     </div>
-   
-    <table-com v-if="num2 == 1"></table-com>
+
+    <table-com v-if="num2 == 1" :tableList="tableList"></table-com>
   </div>
 </template>
 
 <script>
-import curveComA from './curveComA'
-import curveComB from './curveComB'
-import curveComC from './curveComC'
+import curveCom from './curveCom'
+// import curveComA from './curveComA'
+// import curveComB from './curveComB'
+// import curveComC from './curveComC'
 import tableCom from './tableCom'
+import { useStore } from 'vuex'
+import { defineComponent, onMounted, ref } from 'vue'
+import * as api from '@/api/powerQuality/harmonicReport'
+import { ElMessage } from 'element-plus'
 
-export default {
+export default defineComponent({
   name: 'VariableList',
   components: {
-    curveComA,
-    curveComB,
-    curveComC,
+    curveCom,
+    // curveComA,
+    // curveComB,
+    // curveComC,
     tableCom,
   },
+  setup() {
+    const store = useStore()
+    const dateType = ref('date')
+    const listTabPosition = ref('dayValue')
+    const deviceCode = ref('DA00021026')
+    const deviceList = ref([])
+    const dateTime = ref(new Date())
+    const tableList = ref([]) //表格子页面数据传递存储
+    const curveComList = ref([
+      {
+        name: 'A相电流（A）',
+        icontitle: 'ia',
+        dateList: [],
+        data: [],
+      },
+      {
+        name: 'B相电流（A）',
+        icontitle: 'ib',
+        dateList: [],
+        data: [],
+      },
+      {
+        name: 'C相电流（A）',
+        icontitle: 'ic',
+        dateList: [],
+        data: [],
+      },
+    ])
+
+    const listTabsChange = (value) => {
+      value == 'dayValue'
+        ? (dateType.value = 'date')
+        : (dateType.value = 'month')
+      listSelect()
+    }
+
+    function listSelect() {
+      let list = {}
+
+      if (listTabPosition.value == 'dayValue') {
+        store.commit('getNowFormatDate', dateTime.value)
+        list = {
+          deviceCode: deviceCode.value,
+          startTime: store.state.dateList + ' ' + '00:00:00',
+          endTime: store.state.dateList + ' ' + '24:00:00',
+        }
+      } else {
+        store.commit('getCurrentMonthLast', dateTime.value)
+        list = {
+          deviceCode: deviceCode.value,
+          startTime: store.state.monthList[0],
+          endTime: store.state.monthList[1],
+        }
+      }
+
+      api.rtRealScore(list).then((requset) => {
+        if (requset.status === 'SUCCESS') {
+          tableList.value = requset.data
+          curveComList.value[0].data = []
+          curveComList.value[0].dateList = []
+          curveComList.value[1].data = []
+          curveComList.value[1].dateList = []
+          curveComList.value[2].data = []
+          curveComList.value[2].dateList = []
+          requset.data.map((val) => {
+            curveComList.value[0].data.push(val.ia)
+            curveComList.value[0].dateList.push(val.dataTime)
+            curveComList.value[1].data.push(val.ib)
+            curveComList.value[1].dateList.push(val.dataTime)
+            curveComList.value[2].data.push(val.ic)
+            curveComList.value[2].dateList.push(val.dataTime)
+          })
+        } else {
+          ElMessage.error(requset.msg)
+        }
+      })
+    }
 
-  data() {
+    function deviceSelect() {
+      api.deviceListOne({ siteId: store.state.siteId }).then((requset) => {
+        if (requset.status === 'SUCCESS') {
+          deviceList.value = requset.data
+        } else {
+          ElMessage.error(requset.msg)
+        }
+      })
+    }
+
+    onMounted(() => {
+      deviceSelect()
+      listTabsChange('dayValue')
+    })
     return {
-      dateType:'date',
-      listTabPosition: 'dayValue',
-      num: 0,
-      num2: 0,
-      value4: '2021-10-21',
-      number: 1,
-      measurType: 1,
+      listTabsChange,
+      listSelect,
+      deviceSelect,
+
+      store,
+      dateType,
+      dateTime,
+      tableList,
+      deviceCode,
+      deviceList,
+      curveComList,
+      listTabPosition,
+      num: ref(0),
+      num2: ref(0),
+
       select: 1,
       currentPage4: 4,
       showDialog: false,
@@ -149,14 +247,7 @@ export default {
       region: '',
     }
   },
-  methods: {
-    listTabsChange(value){
-      value == 'dayValue'? (this.dateType = 'date'): (this.dateType = 'month')
-
-    }
-
-  },
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/powerQuality/harmonicReport/tableCom.vue

@@ -2,11 +2,11 @@
   <div>
     <!-- 表格start -->
     <el-table
-      :data="tableData"
+      :data="tableList"
       style="width: 100%"
       :header-cell-style="headCellStyle"
     >
-      <el-table-column
+      <!-- <el-table-column
         prop="date"
         label="描述(单位A)"
         width=""
@@ -30,14 +30,16 @@
         <el-table-column prop="province" label="平均值"></el-table-column>
         <el-table-column prop="city" label="最大值"></el-table-column>
         <el-table-column prop="address" label="95%"></el-table-column>
-      </el-table-column>
-
-      <!-- <el-table-column  label="B" width=""> </el-table-column> -->
+      </el-table-column> -->
+      <el-table-column prop="dataTime" label="时间" width="" />
+      <el-table-column label="A相" prop="ia" />
+      <el-table-column label="B相" prop="ib" />
+      <el-table-column label="C相" prop="ic" />
     </el-table>
     <!-- 表格end -->
 
     <!-- 分页start -->
-    <div class="paginationBlock">
+    <!-- <div class="paginationBlock">
       <el-pagination
         @size-change="handleSizeChange"
         @current-change="handleCurrentChange"
@@ -47,7 +49,7 @@
         layout="total, sizes, prev, pager, next, jumper"
         :total="400"
       ></el-pagination>
-    </div>
+    </div> -->
 
     <!-- 分页end -->
   </div>
@@ -55,6 +57,9 @@
 <script>
 export default {
   name: 'tableCom',
+  props: {
+    tableList: Object,
+  },
   data() {
     return {
       tableData: [
@@ -120,7 +125,7 @@ export default {
   methods: {
     // 表头行的 style 的回调方法
     headCellStyle({ row, column, rowIndex, columnIndex }) {
-      row,column
+      row, column
       if (columnIndex !== 0 && rowIndex === 0) {
         return `text-align:center;`
       } else {

vue.config.js

@@ -36,13 +36,13 @@ const resolve = (dir) => {
     return path.join(__dirname, dir)
 }
 
-const mockServer = () => {
-    if (process.env.NODE_ENV === 'development') {
-        return require('./mock/mockServer.js')
-    } else {
-        return ''
-    }
-}
+// const mockServer = () => {
+//     if (process.env.NODE_ENV === 'development') {
+//         return require('./mock/mockServer.js')
+//     } else {
+//         return ''
+//     }
+// }
 
 module.exports = {
     publicPath,
@@ -70,17 +70,26 @@ module.exports = {
             errors: true,
         },
         // 注释掉的地方是前端配置代理访问后端的示例
-        // proxy: {
-        //   [baseURL]: {
-        //     target: `http://你的后端接口地址`,
-        //     ws: true,
-        //     changeOrigin: true,
-        //     pathRewrite: {
-        //       ["^/" + baseURL]: "",
-        //     },
-        //   },
-        // },
-        after: mockServer(),
+        proxy: {
+            //   [baseURL]: {
+            //     target: `http://你的后端接口地址`,
+            //     ws: true,
+            //     changeOrigin: true,
+            //     pathRewrite: {
+            //       ["^/" + baseURL]: "",
+            //     },
+            //   },
+            './': {
+                target: 'https://qhome.usky.cn/fivapi/',
+                ws: false,
+                changeOrigin: true,
+                pathRewrite: {
+                    '^./': './'
+                }
+            }
+        },
+        public: 'localhost:9999/',
+        // after: mockServer(),
     },
     configureWebpack() {
         return {
@@ -158,9 +167,9 @@ module.exports = {
                             archive: [{
                                 source: `./${outputDir}`,
                                 destination: `./${outputDir}/${abbreviation}_${outputDir}_${date}.7z`,
-                            }, ],
+                            },],
                         },
-                    }, ])
+                    },])
                     .end()
             })
         }