添加图表

src/views/ems/report/currentVoltageCurve/index.vue

@@ -58,57 +58,57 @@
         <!--          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>-->
         <!--        </el-row>-->
 
-        <el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
+<!--        <el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">-->
-          <el-table-column type="selection" width="55" align="center"/>
+<!--          <el-table-column type="selection" width="55" align="center"/>-->
-          <el-table-column label="编号" align="center" prop="objId" v-if="columns[0].visible"/>
+<!--          <el-table-column label="编号" align="center" prop="objId" v-if="columns[0].visible"/>-->
-          <el-table-column label="计量设备编号" align="center" prop="monitorCode" v-if="columns[1].visible" width="100"/>
+<!--          <el-table-column label="计量设备编号" align="center" prop="monitorCode" v-if="columns[1].visible" width="100"/>-->
-          <el-table-column label="计量设备名称" align="center" prop="monitorName" v-if="columns[15].visible" width="120"/>
+<!--          <el-table-column label="计量设备名称" align="center" prop="monitorName" v-if="columns[15].visible" width="120"/>-->
-          <el-table-column label="采集时间" align="center" prop="collectTime" width="180" v-if="columns[2].visible">
+<!--          <el-table-column label="采集时间" align="center" prop="collectTime" width="180" v-if="columns[2].visible">-->
-            <template slot-scope="scope">
-              <span>{{ parseTime(scope.row.collectTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column label="A项电压" align="center" prop="va" v-if="columns[3].visible"/>
-          <el-table-column label="B项电压" align="center" prop="vb" v-if="columns[4].visible"/>
-          <el-table-column label="C项电压" align="center" prop="vc" v-if="columns[5].visible"/>
-          <el-table-column label="A项电流" align="center" prop="ia" v-if="columns[6].visible"/>
-          <el-table-column label="B项电流" align="center" prop="ib" v-if="columns[7].visible"/>
-          <el-table-column label="C项电流" align="center" prop="ic" v-if="columns[8].visible"/>
-          <el-table-column label="功率因数" align="center" prop="glys" v-if="columns[10].visible"/>
-          <el-table-column label="正向有功" align="center" prop="zxyg" v-if="columns[11].visible"/>
-          <el-table-column label="有功功率" align="center" prop="activePower" v-if="columns[12].visible"/>
-          <el-table-column label="无功功率" align="center" prop="reactivePower" v-if="columns[13].visible"/>
-          <el-table-column label="记录时间" align="center" prop="recordTime" width="180" v-if="columns[9].visible">
-            <template slot-scope="scope">
-              <span>{{ parseTime(scope.row.recordTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column label="采集方式" align="center" prop="collectType" v-if="columns[14].visible">
-            <template slot-scope="scope">
-              <dict-tag :options="dict.type.collect_type" :value="scope.row.collectType"/>
-            </template>
-          </el-table-column>
-          <!--          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">-->
 <!--            <template slot-scope="scope">-->
-          <!--              <el-button-->
+<!--              <span>{{ parseTime(scope.row.collectTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>-->
-          <!--                size="mini"-->
-          <!--                type="text"-->
-          <!--                icon="el-icon-edit"-->
-          <!--                @click="handleUpdate(scope.row)"-->
-          <!--                v-hasPermi="['ems/record:recordDnbInstant:edit']"-->
-          <!--              >修改-->
-          <!--              </el-button>-->
-          <!--              <el-button-->
-          <!--                size="mini"-->
-          <!--                type="text"-->
-          <!--                icon="el-icon-delete"-->
-          <!--                @click="handleDelete(scope.row)"-->
-          <!--                v-hasPermi="['ems/record:recordDnbInstant:remove']"-->
-          <!--              >删除-->
-          <!--              </el-button>-->
 <!--            </template>-->
 <!--          </el-table-column>-->
-        </el-table>
+<!--          <el-table-column label="A项电压" align="center" prop="va" v-if="columns[3].visible"/>-->
+<!--          <el-table-column label="B项电压" align="center" prop="vb" v-if="columns[4].visible"/>-->
+<!--          <el-table-column label="C项电压" align="center" prop="vc" v-if="columns[5].visible"/>-->
+<!--          <el-table-column label="A项电流" align="center" prop="ia" v-if="columns[6].visible"/>-->
+<!--          <el-table-column label="B项电流" align="center" prop="ib" v-if="columns[7].visible"/>-->
+<!--          <el-table-column label="C项电流" align="center" prop="ic" v-if="columns[8].visible"/>-->
+<!--          <el-table-column label="功率因数" align="center" prop="glys" v-if="columns[10].visible"/>-->
+<!--          <el-table-column label="正向有功" align="center" prop="zxyg" v-if="columns[11].visible"/>-->
+<!--          <el-table-column label="有功功率" align="center" prop="activePower" v-if="columns[12].visible"/>-->
+<!--          <el-table-column label="无功功率" align="center" prop="reactivePower" v-if="columns[13].visible"/>-->
+<!--          <el-table-column label="记录时间" align="center" prop="recordTime" width="180" v-if="columns[9].visible">-->
+<!--            <template slot-scope="scope">-->
+<!--              <span>{{ parseTime(scope.row.recordTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>-->
+<!--            </template>-->
+<!--          </el-table-column>-->
+<!--          <el-table-column label="采集方式" align="center" prop="collectType" v-if="columns[14].visible">-->
+<!--            <template slot-scope="scope">-->
+<!--              <dict-tag :options="dict.type.collect_type" :value="scope.row.collectType"/>-->
+<!--            </template>-->
+<!--          </el-table-column>-->
+<!--          &lt;!&ndash;          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">&ndash;&gt;-->
+<!--          &lt;!&ndash;            <template slot-scope="scope">&ndash;&gt;-->
+<!--          &lt;!&ndash;              <el-button&ndash;&gt;-->
+<!--          &lt;!&ndash;                size="mini"&ndash;&gt;-->
+<!--          &lt;!&ndash;                type="text"&ndash;&gt;-->
+<!--          &lt;!&ndash;                icon="el-icon-edit"&ndash;&gt;-->
+<!--          &lt;!&ndash;                @click="handleUpdate(scope.row)"&ndash;&gt;-->
+<!--          &lt;!&ndash;                v-hasPermi="['ems/record:recordDnbInstant:edit']"&ndash;&gt;-->
+<!--          &lt;!&ndash;              >修改&ndash;&gt;-->
+<!--          &lt;!&ndash;              </el-button>&ndash;&gt;-->
+<!--          &lt;!&ndash;              <el-button&ndash;&gt;-->
+<!--          &lt;!&ndash;                size="mini"&ndash;&gt;-->
+<!--          &lt;!&ndash;                type="text"&ndash;&gt;-->
+<!--          &lt;!&ndash;                icon="el-icon-delete"&ndash;&gt;-->
+<!--          &lt;!&ndash;                @click="handleDelete(scope.row)"&ndash;&gt;-->
+<!--          &lt;!&ndash;                v-hasPermi="['ems/record:recordDnbInstant:remove']"&ndash;&gt;-->
+<!--          &lt;!&ndash;              >删除&ndash;&gt;-->
+<!--          &lt;!&ndash;              </el-button>&ndash;&gt;-->
+<!--          &lt;!&ndash;            </template>&ndash;&gt;-->
+<!--          &lt;!&ndash;          </el-table-column>&ndash;&gt;-->
+<!--        </el-table>-->
         <pagination
           v-show="total>0"
           :total="total"
@@ -346,8 +346,12 @@ export default {
       delete query.pageSize
       const {data} = await dnbInstantList(query)
       let option1 = {
+        title:{
+          text:'电流信息',
+          x:'center'
+        },
         grid: {
-          top: "10%",
+          top: "15%",
           bottom: "10%",
           left:'3%',
           right:'3%'
@@ -364,7 +368,9 @@ export default {
         dataZoom:[{
           type:'slider'
         }],
-        legend: {},
+        legend: {
+          right:0
+        },
         xAxis: {
           data: data.map(e=>e.collectTime),
           axisLine: {
@@ -386,7 +392,7 @@ export default {
         yAxis: [
           {
             type: "value",
-            name: "电流",
+            name: "电流（A）",
             nameTextStyle: {
               color: "#000",
             },
@@ -470,8 +476,12 @@ export default {
         ],
       }
       let option2 = {
+        title:{
+          text:'电压信息',
+          x:'center'
+        },
         grid: {
-          top: "10%",
+          top: "15%",
           bottom: "10%",
           left:'3%',
           right:'3%'
@@ -489,7 +499,9 @@ export default {
             },
           },
         },
-        legend: {},
+        legend: {
+          right:0
+        },
         xAxis: {
           data: data.map(e=>e.collectTime),
           axisLine: {
@@ -511,7 +523,7 @@ export default {
         yAxis: [
           {
             type: "value",
-            name: "电压",
+            name: "电压（V）",
             nameTextStyle: {
               color: "#000",
             },