五项对标

src/App.vue

@@ -306,7 +306,7 @@ body {
     opacity: 0;
     transition: opacity 0.2s;
     transition-timing-function: ease-in;
-    transform: translate(-@menuWidth);
+    // transform: translate(-@menuWidth);
 
     &:hover,
     &.hover {

src/components/chart/line/double-line-chart-home.vue

@@ -24,7 +24,7 @@ export default {
       type: Array,
       default: () => [
         {
-          title: "绿线",
+          title: "应发功率",
           smooth: true,
           value: [
             {
@@ -66,7 +66,7 @@ export default {
           ],
         },
         {
-          title: "黄线",
+          title: "实发功率",
           smooth: true,
           value: [
             {
@@ -107,6 +107,7 @@ export default {
             },
           ],
         },
+        
       ],
     },
     // 单位

src/components/chart/pie/dual-pie-chart.vue

@@ -104,48 +104,49 @@ export default {
           right: 40,
           bottom: 24,
         },
-        legend: {
-          show: this.showLegend,
-          orient: "vertical", //纵向图例
-          right: "0",
-          bottom: 32,
-          itemWidth: 15,
-          itemHeight: 15,
-          formatter: (name) => {
-            if (that.innerData.length) {
-              const item = that.innerData.filter((item) => item.name === name)[0];
-              return `{name|${name}：}{value| ${item.value}}`;
-            }
-          },
-          //icon: 'circle',
-          itemGap: 12, //图例item间距
-          textStyle: {
-            color: this.$store.state.themeName === "dark"
-              ? partten.getColor("gray")
-              : "#000",
-            fontSize: util.vh(14),
-            rich: {
-              name: {
-                color: this.$store.state.themeName === "dark"
-              ? partten.getColor("gray")
-              : "#000",
-                fontSize: 12,
-              },
-              value: {
-                color: this.$store.state.themeName === "dark"
-                ? partten.getColor("grayl")
-                : "#000",
-                fontSize: 12,
-              },
-            },
-          },
-          data: legend1,
-        },
+        // legend: {
+        //   // show: this.showLegend,
+        //   orient: "vertical", //纵向图例
+        //   right: "0",
+        //   bottom: 32,
+        //   itemWidth: 15,
+        //   itemHeight: 15,
+        //   formatter: (name) => {
+        //     if (that.innerData.length) {
+        //       const item = that.innerData.filter((item) => item.name === name)[0];
+        //       return `{name|${name}：}{value| ${item.value}}`;
+        //     }
+        //   },
+        //   //icon: 'circle',
+        //   itemGap: 12, //图例item间距
+        //   textStyle: {
+        //     color: this.$store.state.themeName === "dark"
+        //       ? partten.getColor("gray")
+        //       : "#000",
+        //     fontSize: util.vh(14),
+        //     rich: {
+        //       name: {
+        //         color: this.$store.state.themeName === "dark"
+        //       ? partten.getColor("gray")
+        //       : "#000",
+        //         fontSize: 12,
+        //       },
+        //       value: {
+        //         color: this.$store.state.themeName === "dark"
+        //         ? partten.getColor("grayl")
+        //         : "#000",
+        //         fontSize: 12,
+        //       },
+        //     },
+        //   },
+        //   data: legend1,
+        // },
         series: [
           {
             name: "",
             type: "pie",
-            center: [this.paddingWidth, "50%"],
+            //  center: [this.paddingWidth, "50%"],
+            center: ["50%", "50%"],
             radius: [0, "35%"],
             itemStyle: {
               normal: {},
@@ -165,7 +166,7 @@ export default {
           {
             name: "",
             type: "pie",
-            center: [this.paddingWidth, "50%"],
+            center: ["50%", "50%"],
             radius: ["55%", "95%"],
             data: this.outerData,
             labelLine: {

src/components/coms/panel/toolbar-panel.vue

@@ -1,3 +1,11 @@
+<!--
+ * @Author: 蒋珅 11455645+jiang-shena@user.noreply.gitee.com
+ * @Date: 2023-03-10 09:10:07
+ * @LastEditors: 蒋珅 11455645+jiang-shena@user.noreply.gitee.com
+ * @LastEditTime: 2023-03-22 11:14:58
+ * @FilePath: \zhfx\src\components\coms\panel\toolbar-panel.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
   <div class="com-panel" :class="{ 'no-title': !hasTitle, line: showLine }">
     <div v-if="hasTitle" class="panel-header">
@@ -43,4 +51,5 @@ export default {
 };
 </script>
 
-<style lang="less"></style>
+<style lang="less">
+</style>

src/components/coms/table/table.vue

@@ -1,8 +1,9 @@
 <template>
   <table class="com-table">
     <thead>
-      <tr>
+      <tr class="back">
         <th
+        class="nb"
           v-for="(col, index) of data.column"
           :key="index"
           :class="{ light: col.is_light }"
@@ -15,7 +16,7 @@
     </thead>
     <el-scrollbar>
       <tbody :style="{ height: height }">
-        <tr v-for="(row, index) of tableData" :key="index">
+        <tr class="dnb" v-for="(row, index) of tableData" :key="index">
           <td
             style="color:rgb(211, 214, 218)"
             v-for="(col, i) of data.column"
@@ -276,4 +277,15 @@ export default {
   height: 100%;
   // color: rgb(211, 214, 218);
 }
+.nb{
+    background-color: rgba(83, 89, 104, 0.3) ;
+    border-right: 1px solid rgba(0, 0, 0, 0.8);
+    border-bottom: 1px solid rgba(0, 0, 0, 0.8) ;
+}
+.dnb{
+  height: 45px;
+}
+.back{
+background: rgba(83,89,104,0.4);
+}
 </style>

src/views/Decision/Decision2.vue

@@ -1,112 +1,130 @@
 <template>
   <div class="decision-page-2">
-    <div class="query mg-b-8">
-      <div class="query-items">
-        <div class="query-item">
-          <div class="lable">场站：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value1"
-              @change="ChangZhanChange(value1)"
-              multiple
-              collapse-tags
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in ChangZhan"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">项目：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value2"
-              @change="XiangMuChange(value2)"
-              multiple
-              collapse-tags
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in XiangMu"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">线路：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value3"
-              @change="XianLuChange(value3)"
-              multiple
-              collapse-tags
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in XianLu"
-                :key="item.id"
-                :label="item.name"
-                :value="item.id"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">开始日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value4"
-              @change="BeginChange(value4)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-          </div>
+    <div class="title">
+      <div class="station">
+        场站：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value1"
+          @change="ChangZhanChange(value1)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in ChangZhan"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        项目：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value2"
+          @change="XiangMuChange(value2)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XiangMu"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        线路：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value3"
+          @change="XianLuChange(value3)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XianLu"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        开始日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value4"
+            @change="BeginChange(value4)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
         </div>
-        <div class="query-item">
-          <div class="lable">结束日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value5"
-              @change="EndChange(value5)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-            <div class="unit svg-icon svg-icon-gray">
+      </div>
+
+      <div class="station">
+        结束日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value5"
+            @change="EndChange(value5)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
+          <!-- <div class="unit svg-icon svg-icon-gray">
               <svg-icon :svgid="''" />
-            </div>
-          </div>
+            </div> -->
         </div>
       </div>
+
       <div :class="detailShow == 2 ? 'query-actions1 ' : 'query-actions'">
-        <button class="btn green" @click="AjaxCommon();">搜索</button>
-        <button class="btn" @click="dbfx">对标分析</button>
-        <button class="btn" @click="exportExcel()">导出</button>
-        <button class="btn" v-show="detailShow == 2" @click="back">返回</button>
+        <div class="but">
+          <button
+            class="btn green"
+            :class="detailShow == 2 ? 'active' : ''"
+            @click="AjaxCommon()"
+          >
+            搜索
+          </button>
+          <button
+            class="btn"
+            :class="detailShow == 2 ? 'active' : ''"
+            @click="dbfx"
+          >
+            对标分析
+          </button>
+          <!-- <button class="buttons" size="mini"  @click="exportExcel()">导出</button> -->
+          <!-- <button class="buttons" size="mini" v-show="detailShow == 2" @click="back">返回</button> -->
+        </div>
       </div>
     </div>
-
     <div v-show="detailShow == 1">
-      <toolbar-panel title="风机绩效榜" :showLine="false"></toolbar-panel>
+      <toolbar-panel title="五项损失率" :showLine="false"></toolbar-panel>
       <div class="mg-b-16">
         <div class="project-table">
           <Table
@@ -117,40 +135,31 @@
           ></Table>
         </div>
       </div>
-      <el-row class="mg-b-16">
-        <el-col :span="8">
-          <panel title="发电量占比">
-            <dual-pie-chart
-              height="21.296vh"
-              :innerData="innerFdl"
-              :outerData="outerFdl"
-              paddingWidth="28%"
-            />
-          </panel>
-        </el-col>
-        <el-col :span="8">
-          <panel title="各场站损失电量占比">
-            <dual-pie-chart
-              height="21.296vh"
-              :innerData="innerCz"
-              :outerData="outerCz"
-              paddingWidth="22%"
-            />
-          </panel>
-        </el-col>
-        <el-col :span="8">
-          <panel title="理论发电量占比">
-            <dual-pie-chart
-              height="21.296vh"
-              :innerData="innerLl"
-              :outerData="outerLl"
-              paddingWidth="26%"
-            />
-          </panel>
-        </el-col>
-      </el-row>
-      <div>
-        <panel title="损失电量分析">
+    </div>
+
+    <div class="echarts">
+      <div class="pie-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 损失电量分析 -->
+        </div>
+        <panel title=" 损失电量分析">
+          <dual-pie-chart
+            height="21.296vh"
+            :innerData="innerFdl"
+            :outerData="outerFdl"
+            paddingWidth="28%"
+          />
+        </panel>
+      </div>
+      <div class="bar-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 五项损失 -->
+        </div>
+        <panel title="五项损失">
           <multiple-bar-chart
             :height="'calc(100vh - 26.5vh - 500px)'"
             :list="analyis"
@@ -161,7 +170,8 @@
         </panel>
       </div>
     </div>
-    <el-row :type="'flex'" class="content" v-show="detailShow == 2">
+
+    <!-- <el-row :type="'flex'" class="content" v-show="detailShow == 2">
       <el-col :span="24" class="pd-l-8">
         <panel :title="'风机对标列表明细'" :showLine="false">
           <div class="project-table">
@@ -173,7 +183,7 @@
           </div>
         </panel>
       </el-col>
-    </el-row>
+    </el-row> -->
     <el-dialog
       title="对标排名分析"
       v-model="dialogVisible"
@@ -220,6 +230,7 @@ export default {
       tableIdArr: [], //放checkbox的id数组
       tableId: [],
       checkLength: 0, //对标分析只能选择2个
+
       tableData: {
         column: [
           {
@@ -855,7 +866,7 @@ export default {
           sort: "",
         })
         .then((res) => {
-          this.tableIdArr = []
+          this.tableIdArr = [];
           this.ajaxData = res.data;
           var dataTab = [], //表格
             fdl = [],
@@ -1326,7 +1337,7 @@ export default {
       let tHeader = []; // 上面设置Excel的表格第一行的标题
       let filterVal = []; // 上面的index、nickName、name是tableData里对象的属性key值
       that.tableData.column.forEach((ele, index) => {
-        if (index > 1 && index !== that.tableData.column.length -1) {
+        if (index > 1 && index !== that.tableData.column.length - 1) {
           tHeader.push(ele.name);
           filterVal.push(ele.field);
         }
@@ -1360,11 +1371,11 @@ export default {
 
   .project-table {
     overflow: auto;
+    // height: calc(100vh - 26vh);
 
     tbody {
-      height: 145px;
+      height: 440px;
     }
-
     th,
     td {
       color: #b2bdc0;
@@ -1385,4 +1396,98 @@ export default {
     cursor: pointer;
   }
 }
+
+.title {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  //   .nb{
+  //     width: 180px;
+  // height: 25px;
+  // background: rgba(67,81,107,0.2);
+  // border: 1px solid #3B4C6C;
+  // border-radius: 13px;
+
+  //   }
+
+  .station {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #b3b3b3;
+    margin-right: 10px;
+  }
+
+  .search-input {
+    margin-left: 10px;
+  }
+
+  .but {
+    display: flex;
+    flex-direction: row;
+    align-content: center;
+    margin-left: 10px;
+  }
+
+  .buttons {
+    width: 80px;
+    height: 25px;
+    background: rgba(0, 70, 199, 0.5);
+    border: 1px solid #1f51ae;
+    border-radius: 13px;
+    color: #ffffff;
+
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+
+    &:hover {
+      background-color: rgba(0, 70, 199, 0.5);
+      color: #ffffff;
+    }
+  }
+}
+.echarts {
+  width: 100%;
+  height: 26vh;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  // margin-top: 30px;
+
+  .chart-name {
+    display: flex;
+    align-items: center;
+    padding-left: 20px;
+    position: relative;
+    height: 39px;
+    width: 98%;
+    margin-left: 1%;
+    border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+    font-size: 16px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #ffffff;
+  }
+
+  .pie-echarts {
+    width: 30%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+
+  .bar-echarts {
+    width: 69%;
+    margin-left: 1%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+}
 </style>

src/views/Decision/Decision2Cjdb.vue

@@ -1,58 +1,104 @@
 <template>
   <div class="decision-page-2">
-    <div class="query mg-b-8">
-      <div class="query-items">
-        <div class="query-item">
-          <div class="lable">场站：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value1"
-              @change="ChangZhanChange(value1)"
-              multiple
-              collapse-tags
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in ChangZhan"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">开始日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value4"
-              @change="BeginChange(value4)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-          </div>
+    <div class="title">
+      <div class="station">
+        场站：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value1"
+          @change="ChangZhanChange(value1)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in ChangZhan"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        项目：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value2"
+          @change="XiangMuChange(value2)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XiangMu"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        线路：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value3"
+          @change="XianLuChange(value3)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XianLu"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        开始日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value4"
+            @change="BeginChange(value4)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
         </div>
-        <div class="query-item">
-          <div class="lable">结束日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value5"
-              @change="EndChange(value5)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-            <div class="unit svg-icon svg-icon-gray">
+      </div>
+
+      <div class="station">
+        结束日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value5"
+            @change="EndChange(value5)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
+          <!-- <div class="unit svg-icon svg-icon-gray">
               <svg-icon :svgid="''" />
-            </div>
-          </div>
+            </div> -->
         </div>
       </div>
       <div class="query-actions">
@@ -62,6 +108,7 @@
         <button class="btn" v-show="detailShow == 2" @click="back">返回</button>
       </div>
     </div>
+
     <div v-show="detailShow == 1">
       <toolbar-panel title="场际对标" :showLine="false"></toolbar-panel>
       <div class="mg-b-16">
@@ -74,7 +121,42 @@
           ></Table>
         </div>
       </div>
-      <el-row class="mg-b-16">
+    </div>
+
+    <div class="echarts">
+      <div class="pie-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 发电量占比 -->
+        </div>
+        <panel title="发电量占比">
+          <dual-pie-chart
+            height="21.296vh"
+            :innerData="innerFdl"
+            :outerData="outerFdl"
+          />
+        </panel>
+      </div>
+      <div class="bar-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 损失电量分析 -->
+        </div>
+        <panel title="损失电量分析">
+          <multiple-bar-chart
+            :height="'calc(100vh - 23.3vh - 550px)'"
+            :list="analyis"
+            :customerTooltip="true"
+            @tooltip="tooltip"
+            :units="['(万KWh)']"
+          />
+        </panel>
+      </div>
+    </div>
+
+    <!-- <el-row class="mg-b-16">
         <el-col :span="12">
           <panel title="发电量占比">
             <dual-pie-chart
@@ -118,7 +200,7 @@
           </div>
         </panel>
       </el-col>
-    </el-row>
+    </el-row>-->
 
     <el-dialog
       title="对标排名分析"
@@ -165,6 +247,7 @@ export default {
       tableIdArr: [], //放checkbox的id数组
       tableId: [],
       checkLength: 0, //对标分析只能选择2个
+
       tableData: {
         column: [
           {
@@ -209,7 +292,7 @@ export default {
             field: "name",
             is_num: false,
             is_light: false,
-            width: '100px',
+            width: "100px",
           },
           {
             name: "综合排名",
@@ -774,7 +857,7 @@ export default {
           sort: "",
         })
         .then((res) => {
-          this.tableIdArr = []
+          this.tableIdArr = [];
           this.ajaxData = res.data;
           var dataTab = [], //表格
             fdl = [],
@@ -1230,7 +1313,7 @@ export default {
       let tHeader = []; // 上面设置Excel的表格第一行的标题
       let filterVal = []; // 上面的index、nickName、name是tableData里对象的属性key值
       that.tableData.column.forEach((ele, index) => {
-        if (index > 1 && index !== that.tableData.column.length -1) {
+        if (index > 1 && index !== that.tableData.column.length - 1) {
           tHeader.push(ele.name);
           filterVal.push(ele.field);
         }
@@ -1262,7 +1345,7 @@ export default {
     overflow: auto;
 
     tbody {
-      height: 145px;
+      height: 440px;
     }
 
     th,
@@ -1285,4 +1368,98 @@ export default {
     cursor: pointer;
   }
 }
+
+.title {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  //   .nb{
+  //     width: 180px;
+  // height: 25px;
+  // background: rgba(67,81,107,0.2);
+  // border: 1px solid #3B4C6C;
+  // border-radius: 13px;
+
+  //   }
+
+  .station {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #b3b3b3;
+    margin-right: 10px;
+  }
+
+  .search-input {
+    margin-left: 10px;
+  }
+
+  .but {
+    display: flex;
+    flex-direction: row;
+    align-content: center;
+    margin-left: 10px;
+  }
+
+  .buttons {
+    width: 80px;
+    height: 25px;
+    background: rgba(0, 70, 199, 0.5);
+    border: 1px solid #1f51ae;
+    border-radius: 13px;
+    color: #ffffff;
+
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+
+    &:hover {
+      background-color: rgba(0, 70, 199, 0.5);
+      color: #ffffff;
+    }
+  }
+}
+.echarts {
+  width: 100%;
+  height: 26vh;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  // margin-top: 30px;
+
+  .chart-name {
+    display: flex;
+    align-items: center;
+    padding-left: 20px;
+    position: relative;
+    height: 39px;
+    width: 98%;
+    margin-left: 1%;
+    border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+    font-size: 16px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #ffffff;
+  }
+
+  .pie-echarts {
+    width: 30%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+
+  .bar-echarts {
+    width: 69%;
+    margin-left: 1%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+}
 </style>

src/views/Decision/Decision2Cndb.vue

@@ -1,57 +1,103 @@
 <template>
   <div class="decision-page-2">
-    <div class="query mg-b-8">
-      <div class="query-items">
-        <div class="query-item">
-          <div class="lable">场站：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value1"
-              @change="ChangZhanChange(value1)"
-              clearable
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in ChangZhan"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">开始日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value4"
-              @change="BeginChange(value4)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-          </div>
+    <div class="title">
+      <div class="station">
+        场站：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value1"
+          @change="ChangZhanChange(value1)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in ChangZhan"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        项目：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value2"
+          @change="XiangMuChange(value2)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XiangMu"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        线路：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value3"
+          @change="XianLuChange(value3)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XianLu"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </div>
+      <div class="station">
+        开始日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value4"
+            @change="BeginChange(value4)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
         </div>
-        <div class="query-item">
-          <div class="lable">结束日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value5"
-              @change="EndChange(value5)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-            <div class="unit svg-icon svg-icon-gray">
+      </div>
+
+      <div class="station">
+        结束日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value5"
+            @change="EndChange(value5)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
+          <!-- <div class="unit svg-icon svg-icon-gray">
               <svg-icon :svgid="''" />
-            </div>
-          </div>
+            </div> -->
         </div>
       </div>
       <div class="query-actions">
@@ -61,6 +107,7 @@
         <button class="btn" v-show="detailShow == 2" @click="back">返回</button>
       </div>
     </div>
+
     <div v-show="detailShow == 1">
       <toolbar-panel title="场内对标" :showLine="false"></toolbar-panel>
       <div class="mg-b-16">
@@ -73,7 +120,43 @@
           ></Table>
         </div>
       </div>
-      <el-row :type="'flex'" class="content">
+    </div>
+
+    <div class="echarts">
+      <div class="pie-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 损失电量分析 -->
+        </div>
+        <panel title=" 损失电量分析">
+          <dual-pie-chart
+            height="21.296vh"
+            :innerData="innerFdl"
+            :outerData="outerFdl"
+            paddingWidth="28%"
+          />
+        </panel>
+      </div>
+      <div class="bar-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 五项损失 -->
+        </div>
+        <panel title="五项损失">
+          <multiple-bar-chart
+            :height="'calc(100vh - 26.5vh - 500px)'"
+            :list="analyis"
+            :customerTooltip="true"
+            @tooltip="tooltip"
+            :units="['(万KWh)']"
+          />
+        </panel>
+      </div>
+    </div>
+
+    <!-- <el-row :type="'flex'" class="content">
         <el-col :span="24" class="pd-l-8">
           <panel title="损失电量分析">
             <multiple-bar-chart
@@ -99,7 +182,7 @@
           </div>
         </panel>
       </el-col>
-    </el-row>
+    </el-row> -->
 
     <el-dialog
       title="对标排名分析"
@@ -146,6 +229,10 @@ export default {
       // tableIdArr: [], //放checkbox的id数组
       tableId: [],
       checkLength: 0, //对标分析只能选择2个
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
       tableData: {
         column: [
           {
@@ -689,7 +776,7 @@ export default {
   methods: {
     ChangZhanVal() {
       api.benchmarkingWplist({}).then((res) => {
-        this.value1 = res.data[0].id
+        this.value1 = res.data[0].id;
         this.ChangZhan = res.data;
       });
 
@@ -718,7 +805,7 @@ export default {
       this.AjaxCommon();
       this.clearDb();
     },
-    search(){
+    search() {
       this.AjaxCommon();
       this.clearDb();
     },
@@ -1157,7 +1244,7 @@ export default {
       let tHeader = []; // 上面设置Excel的表格第一行的标题
       let filterVal = []; // 上面的index、nickName、name是tableData里对象的属性key值
       that.tableData.column.forEach((ele, index) => {
-        if (index > 1 && index !== that.tableData.column.length -1) {
+        if (index > 1 && index !== that.tableData.column.length - 1) {
           tHeader.push(ele.name);
           filterVal.push(ele.field);
         }
@@ -1189,7 +1276,7 @@ export default {
     overflow: auto;
 
     tbody {
-      height: calc(100vh - 60vh);
+      height: 440px;
     }
 
     th,
@@ -1212,4 +1299,97 @@ export default {
     cursor: pointer;
   }
 }
+.title {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  //   .nb{
+  //     width: 180px;
+  // height: 25px;
+  // background: rgba(67,81,107,0.2);
+  // border: 1px solid #3B4C6C;
+  // border-radius: 13px;
+
+  //   }
+
+  .station {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #b3b3b3;
+    margin-right: 10px;
+  }
+
+  .search-input {
+    margin-left: 10px;
+  }
+
+  .but {
+    display: flex;
+    flex-direction: row;
+    align-content: center;
+    margin-left: 10px;
+  }
+
+  .buttons {
+    width: 80px;
+    height: 25px;
+    background: rgba(0, 70, 199, 0.5);
+    border: 1px solid #1f51ae;
+    border-radius: 13px;
+    color: #ffffff;
+
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+
+    &:hover {
+      background-color: rgba(0, 70, 199, 0.5);
+      color: #ffffff;
+    }
+  }
+}
+.echarts {
+  width: 100%;
+  height: 26vh;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  // margin-top: 30px;
+
+  .chart-name {
+    display: flex;
+    align-items: center;
+    padding-left: 20px;
+    position: relative;
+    height: 39px;
+    width: 98%;
+    margin-left: 1%;
+    border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+    font-size: 16px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #ffffff;
+  }
+
+  .pie-echarts {
+    width: 30%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+
+  .bar-echarts {
+    width: 69%;
+    margin-left: 1%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+}
 </style>

src/views/Decision/Decision2Xldb.vue

@@ -1,100 +1,104 @@
 <template>
   <div class="decision-page-2">
-    <div class="query mg-b-8">
-      <div class="query-items">
-        <div class="query-item">
-          <div class="lable">场站：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value1"
-              @change="ChangZhanChange(value1)"
-              multiple
-              collapse-tags
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in ChangZhan"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">项目：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value2"
-              @change="XiangMuChange(value2)"
-              multiple
-              collapse-tags
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in XiangMu"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">线路：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value3"
-              @change="XianLuChange(value3)"
-              multiple
-              collapse-tags
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in XianLu"
-                :key="item.id"
-                :label="item.name"
-                :value="item.id"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">开始日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value4"
-              @change="BeginChange(value4)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-          </div>
+    <div class="title">
+      <div class="station">
+        场站：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value1"
+          @change="ChangZhanChange(value1)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in ChangZhan"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+    
+      <div class="station">
+        项目：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value2"
+          @change="XiangMuChange(value2)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XiangMu"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        线路：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value3"
+          @change="XianLuChange(value3)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XianLu"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        开始日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value4"
+            @change="BeginChange(value4)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
         </div>
-        <div class="query-item">
-          <div class="lable">结束日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value5"
-              @change="EndChange(value5)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-            <div class="unit svg-icon svg-icon-gray">
+      </div>
+
+      <div class="station">
+        结束日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value5"
+            @change="EndChange(value5)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
+          <!-- <div class="unit svg-icon svg-icon-gray">
               <svg-icon :svgid="''" />
-            </div>
-          </div>
+            </div> -->
         </div>
       </div>
       <div :class="detailShow == 2 ? 'query-actions1' : 'query-actions'">
@@ -111,7 +115,42 @@
           <Table :data="tableData" :canScroll="false" ref="curRef"></Table>
         </div>
       </div>
-      <el-row class="mg-b-16">
+    </div>
+
+    <div class="echarts">
+      <div class="pie-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 发电量占比 -->
+        </div>
+        <panel title="发电量占比">
+          <dual-pie-chart
+            height="21.296vh"
+            :innerData="innerFdl"
+            :outerData="outerFdl"
+          />
+        </panel>
+      </div>
+      <div class="bar-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 损失电量分析 -->
+        </div>
+        <panel title="损失电量分析">
+          <multiple-bar-chart
+            :height="'calc(100vh - 21.3vh - 550px)'"
+            :list="analyis"
+            :customerTooltip="true"
+            @tooltip="tooltip"
+            :units="['(万KWh)']"
+          />
+        </panel>
+      </div>
+    </div>
+
+    <!-- <el-row class="mg-b-16">
         <el-col :span="12">
           <panel title="发电量占比">
             <dual-pie-chart
@@ -150,8 +189,7 @@
             <Table :data="tableDataDetail" ref="curRef"></Table>
           </div>
         </panel>
-      </el-col>
-    </el-row>
+      </el-col>-->
 
     <el-dialog
       title="对标排名分析"
@@ -170,6 +208,7 @@
         :analyisDialog="analyisDialog"
       />
     </el-dialog>
+    -->
   </div>
 </template>
 
@@ -199,6 +238,7 @@ export default {
       tableIdArr: [], //放checkbox的id数组
       tableId: [],
       checkLength: 0, //对标分析只能选择2个
+
       tableData: {
         column: [
           {
@@ -245,7 +285,7 @@ export default {
             field: "name",
             is_num: false,
             is_light: false,
-            width: '100px',
+            width: "100px",
           },
           {
             name: "综合排名",
@@ -884,7 +924,6 @@ export default {
       }
     },
     AjaxCommon() {
-      
       api
         .benchmarkingXldb({
           wpids: this.value1,
@@ -897,7 +936,7 @@ export default {
         })
         .then((res) => {
           this.ajaxData = res.data;
-          this.tableIdArr = []
+          this.tableIdArr = [];
           var dataTab = [], //表格
             fdl = [],
             cz = [],
@@ -1366,7 +1405,7 @@ export default {
       let tHeader = []; // 上面设置Excel的表格第一行的标题
       let filterVal = []; // 上面的index、nickName、name是tableData里对象的属性key值
       that.tableData.column.forEach((ele, index) => {
-        if (index > 1 && index !== that.tableData.column.length -1) {
+        if (index > 1 && index !== that.tableData.column.length - 1) {
           tHeader.push(ele.name);
           filterVal.push(ele.field);
         }
@@ -1398,7 +1437,7 @@ export default {
     overflow: auto;
 
     tbody {
-      height: 200px;
+      height: 440px;
     }
 
     th,
@@ -1421,4 +1460,97 @@ export default {
     cursor: pointer;
   }
 }
+.title {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  //   .nb{
+  //     width: 180px;
+  // height: 25px;
+  // background: rgba(67,81,107,0.2);
+  // border: 1px solid #3B4C6C;
+  // border-radius: 13px;
+
+  //   }
+
+  .station {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #b3b3b3;
+    margin-right: 10px;
+  }
+
+  .search-input {
+    margin-left: 10px;
+  }
+
+  .but {
+    display: flex;
+    flex-direction: row;
+    align-content: center;
+    margin-left: 10px;
+  }
+
+  .buttons {
+    width: 80px;
+    height: 25px;
+    background: rgba(0, 70, 199, 0.5);
+    border: 1px solid #1f51ae;
+    border-radius: 13px;
+    color: #ffffff;
+
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+
+    &:hover {
+      background-color: rgba(0, 70, 199, 0.5);
+      color: #ffffff;
+    }
+  }
+}
+.echarts {
+  width: 100%;
+  height: 26vh;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  // margin-top: 30px;
+
+  .chart-name {
+    display: flex;
+    align-items: center;
+    padding-left: 20px;
+    position: relative;
+    height: 39px;
+    width: 98%;
+    margin-left: 1%;
+    border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+    font-size: 16px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #ffffff;
+  }
+
+  .pie-echarts {
+    width: 30%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+
+  .bar-echarts {
+    width: 69%;
+    margin-left: 1%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+}
 </style>

src/views/Decision/Decision2Xmdb.vue

@@ -1,78 +1,104 @@
 <template>
   <div class="decision-page-2">
-    <div class="query mg-b-8">
-      <div class="query-items">
-        <div class="query-item">
-          <div class="lable">场站：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value1"
-              @change="ChangZhanChange(value1)"
-              multiple
-              collapse-tags
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in ChangZhan"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">项目：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value2"
-              @change="XiangMuChange(value2)"
-              multiple
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in XiangMu"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">开始日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value4"
-              @change="BeginChange(value4)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-          </div>
+    <div class="title">
+      <div class="station">
+        场站：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value1"
+          @change="ChangZhanChange(value1)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in ChangZhan"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        项目：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value2"
+          @change="XiangMuChange(value2)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XiangMu"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        线路：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value3"
+          @change="XianLuChange(value3)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XianLu"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="station">
+        开始日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value4"
+            @change="BeginChange(value4)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
         </div>
-        <div class="query-item">
-          <div class="lable">结束日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value5"
-              @change="EndChange(value5)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-            <div class="unit svg-icon svg-icon-gray">
+      </div>
+
+      <div class="station">
+        结束日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value5"
+            @change="EndChange(value5)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
+          <!-- <div class="unit svg-icon svg-icon-gray">
               <svg-icon :svgid="''" />
-            </div>
-          </div>
+            </div> -->
         </div>
       </div>
       <div class="query-actions">
@@ -89,7 +115,42 @@
           <Table :data="tableData" :canScroll="false" ref="curRef"></Table>
         </div>
       </div>
-      <el-row class="mg-b-16">
+    </div>
+
+    <div class="echarts">
+      <div class="pie-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 发电量占比 -->
+        </div>
+        <panel title="发电量占比">
+          <dual-pie-chart
+            height="21.296vh"
+            :innerData="innerFdl"
+            :outerData="outerFdl"
+          />
+        </panel>
+      </div>
+      <div class="bar-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 损失电量分析 -->
+        </div>
+        <panel title="损失电量分析">
+          <multiple-bar-chart
+            :height="'calc(100vh - 21.3vh - 550px)'"
+            :list="analyis"
+            :customerTooltip="true"
+            @tooltip="tooltip"
+            :units="['(万KWh)']"
+          />
+        </panel>
+      </div>
+    </div>
+
+    <!-- <el-row class="mg-b-16">
         <el-col :span="12">
           <panel title="发电量占比">
             <dual-pie-chart
@@ -129,7 +190,7 @@
           </div>
         </panel>
       </el-col>
-    </el-row>
+    </el-row>-->
 
     <el-dialog
       title="对标排名分析"
@@ -176,6 +237,7 @@ export default {
       tableIdArr: [], //放checkbox的id数组
       tableId: [],
       checkLength: 0, //对标分析只能选择2个
+
       tableData: {
         column: [
           {
@@ -1313,7 +1375,7 @@ export default {
     overflow: auto;
 
     tbody {
-      height: 200px;
+      height: 440px;
     }
 
     th,
@@ -1336,4 +1398,97 @@ export default {
     cursor: pointer;
   }
 }
+.title {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  //   .nb{
+  //     width: 180px;
+  // height: 25px;
+  // background: rgba(67,81,107,0.2);
+  // border: 1px solid #3B4C6C;
+  // border-radius: 13px;
+
+  //   }
+
+  .station {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #b3b3b3;
+    margin-right: 10px;
+  }
+
+  .search-input {
+    margin-left: 10px;
+  }
+
+  .but {
+    display: flex;
+    flex-direction: row;
+    align-content: center;
+    margin-left: 10px;
+  }
+
+  .buttons {
+    width: 80px;
+    height: 25px;
+    background: rgba(0, 70, 199, 0.5);
+    border: 1px solid #1f51ae;
+    border-radius: 13px;
+    color: #ffffff;
+
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+
+    &:hover {
+      background-color: rgba(0, 70, 199, 0.5);
+      color: #ffffff;
+    }
+  }
+}
+.echarts {
+  width: 100%;
+  height: 26vh;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  // margin-top: 30px;
+
+  .chart-name {
+    display: flex;
+    align-items: center;
+    padding-left: 20px;
+    position: relative;
+    height: 39px;
+    width: 98%;
+    margin-left: 1%;
+    border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+    font-size: 16px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #ffffff;
+  }
+
+  .pie-echarts {
+    width: 30%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+
+  .bar-echarts {
+    width: 69%;
+    margin-left: 1%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+}
 </style>

src/views/Decision/Decision3.vue

@@ -1,78 +1,100 @@
 <template>
   <div class="decision-page-3">
-    <div class="query mg-b-8">
-      <div class="query-items">
-        <div class="query-item">
-          <div class="lable">场站：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value1"
-              @change="ChangZhanChange(value1)"
-              multiple
-              collapse-tags
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in ChangZhan"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">分类：</div>
-          <div class="search-input">
-            <el-select
-              v-model="value2"
-              @change="XiangMuChange(value2)"
-              clearable
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="(item, index) in XiangMu"
-                :key="item.id"
-                :value="index"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <div class="query-item">
-          <div class="lable">开始日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value4"
-              @change="BeginChange(value4)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-          </div>
+    <div class="title">
+      <div class="station">
+        场站：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value1"
+          @change="ChangZhanChange(value1)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in ChangZhan"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+      <div class="station">
+        项目：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value2"
+          @change="XiangMuChange(value2)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XiangMu"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+      <div class="station">
+        线路：
+        <el-select
+          class="nb"
+          size="mini"
+          v-model="value3"
+          @change="XianLuChange(value3)"
+          multiple
+          collapse-tags
+          placeholder="请选择"
+          popper-class="select"
+        >
+          <el-option
+            v-for="item in XianLu"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </div>
+      <div class="station">
+        开始日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value4"
+            @change="BeginChange(value4)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
         </div>
-        <div class="query-item">
-          <div class="lable">结束日期：</div>
-          <div class="search-input">
-            <el-date-picker
-              v-model="value5"
-              @change="EndChange(value5)"
-              type="date"
-              value-format="YYYY-MM-DD"
-              placeholder="选择日期"
-              popper-class="date-select"
-            >
-            </el-date-picker>
-            <div class="unit svg-icon svg-icon-gray">
+      </div>
+      <div class="station">
+        结束日期：
+        <div class="search-input">
+          <el-date-picker
+            class="nb"
+            v-model="value5"
+            @change="EndChange(value5)"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="选择日期"
+            popper-class="date-select"
+          >
+          </el-date-picker>
+          <!-- <div class="unit svg-icon svg-icon-gray">
               <svg-icon :svgid="''" />
-            </div>
-          </div>
+            </div> -->
         </div>
       </div>
       <div class="query-actions">
@@ -88,8 +110,9 @@
       <div class="project-table">
         <Table :data="tableData" ref="curRef"></Table>
       </div>
-      <!-- 风资源列表 -->
-      <!-- <div class="direction-info mg-b-16">
+    </div>
+    <!-- 风资源列表 -->
+    <!-- <div class="direction-info mg-b-16">
 				<table class="com-table">
 					<tbody>
 						<tr>
@@ -111,7 +134,41 @@
 					</tbody>
 				</table>
 			</div> -->
-      <el-row class="mg-b-16">
+
+    <div class="echarts">
+      <div class="pie-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 发电量占比 -->
+        </div>
+        <panel title="发电量占比">
+          <dual-pie-chart
+            height="21.296vh"
+            :innerData="innerFdl"
+            :outerData="outerFdl"
+          />
+        </panel>
+      </div>
+      <div class="bar-echarts">
+        <div class="chart-name">
+          <div class="point left bottom"></div>
+          <div class="point right bottom"></div>
+          <!-- 损失电量分析 -->
+        </div>
+        <panel title="损失电量分析">
+          <multiple-bar-chart
+            :height="'calc(100vh - 26.5vh - 500px)'"
+            :list="analyis"
+            :customerTooltip="true"
+            @tooltip="tooltip"
+            :units="['(万KWh)']"
+          />
+        </panel>
+      </div>
+    </div>
+
+    <!-- <el-row class="mg-b-16">
         <el-col :span="12">
           <panel title="发电量占比">
             <dual-pie-chart
@@ -154,7 +211,8 @@
           </div>
         </panel>
       </el-col>
-    </el-row>
+    </el-row>-->
+
     <el-dialog
       title="对标排名分析"
       v-model="dialogVisible"
@@ -200,6 +258,7 @@ export default {
       tableIdArr: [], //放checkbox的id数组
       tableId: [],
       checkLength: 0, //对标分析只能选择2个
+
       tableData: {
         column: that.column1,
         data: [],
@@ -1457,7 +1516,7 @@ export default {
 
     .com-table {
       tbody {
-        height: 145px;
+        height: 440px;
         padding-right: 0px;
       }
 
@@ -1531,4 +1590,96 @@ export default {
     cursor: pointer;
   }
 }
+.title {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  //   .nb{
+  //     width: 180px;
+  // height: 25px;
+  // background: rgba(67,81,107,0.2);
+  // border: 1px solid #3B4C6C;
+  // border-radius: 13px;
+
+  //   }
+
+  .station {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #b3b3b3;
+    margin-right: 10px;
+  }
+
+  .search-input {
+    margin-left: 10px;
+  }
+
+  .but {
+    display: flex;
+    flex-direction: row;
+    align-content: center;
+    margin-left: 10px;
+  }
+
+  .buttons {
+    width: 80px;
+    height: 25px;
+    background: rgba(0, 70, 199, 0.5);
+    border: 1px solid #1f51ae;
+    border-radius: 13px;
+    color: #ffffff;
+
+    font-size: 14px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    &:hover {
+      background-color: rgba(0, 70, 199, 0.5);
+      color: #ffffff;
+    }
+  }
+}
+.echarts {
+  width: 100%;
+  height: 27vh;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 20px;
+
+  .chart-name {
+    display: flex;
+    align-items: center;
+    padding-left: 20px;
+    position: relative;
+    height: 39px;
+    width: 98%;
+    margin-left: 1%;
+    border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+    font-size: 16px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #ffffff;
+  }
+
+  .pie-echarts {
+    width: 30%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+
+  .bar-echarts {
+    width: 69%;
+    margin-left: 1%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+}
 </style>

src/views/Decision/dual-pie-chart.vue

@@ -116,48 +116,48 @@ export default {
           right: 40,
           bottom: 24,
         },
-        legend: {
-          show: this.showLegend,
-          orient: "vertical", //纵向图例
-          right: "16",
-          bottom: 32,
-          itemWidth: 15,
-          itemHeight: 15,
-          formatter: (name) => {
-            if (that.innerData.length) {
-              const item = that.innerData.filter((item) => item.name === name)[0];
-              return `{name|${name}：}{value| ${item.value}}`;
-            }
-          },
-          //icon: 'circle',
-          itemGap: 12, //图例item间距
-          textStyle: {
-            color: this.$store.state.themeName === "dark"
-              ? partten.getColor("gray")
-              : "#000",
-            fontSize: util.vh(14),
-            rich: {
-              name: {
-                color: this.$store.state.themeName === "dark"
-              ? partten.getColor("gray")
-              : "#000",
-                fontSize: 12,
-              },
-              value: {
-                color: this.$store.state.themeName === "dark"
-                ? partten.getColor("grayl")
-                : "#000",
-                fontSize: 12,
-              },
-            },
-          },
-          data: legend1,
-        },
+        // legend: {
+        //   show: this.showLegend,
+        //   orient: "vertical", //纵向图例
+        //   right: "16",
+        //   bottom: 32,
+        //   itemWidth: 15,
+        //   itemHeight: 15,
+        //   formatter: (name) => {
+        //     if (that.innerData.length) {
+        //       const item = that.innerData.filter((item) => item.name === name)[0];
+        //       return `{name|${name}：}{value| ${item.value}}`;
+        //     }
+        //   },
+        //   //icon: 'circle',
+        //   itemGap: 12, //图例item间距
+        //   textStyle: {
+        //     color: this.$store.state.themeName === "dark"
+        //       ? partten.getColor("gray")
+        //       : "#000",
+        //     fontSize: util.vh(14),
+        //     rich: {
+        //       name: {
+        //         color: this.$store.state.themeName === "dark"
+        //       ? partten.getColor("gray")
+        //       : "#000",
+        //         fontSize: 12,
+        //       },
+        //       value: {
+        //         color: this.$store.state.themeName === "dark"
+        //         ? partten.getColor("grayl")
+        //         : "#000",
+        //         fontSize: 12,
+        //       },
+        //     },
+        //   },
+        //   data: legend1,
+        // },
         series: [
           {
             name: "",
             type: "pie",
-            center: ["20%", "50%"],
+            center: ["50%", "50%"],
             radius: [0, "35%"],
             itemStyle: {
               normal: {},
@@ -177,7 +177,7 @@ export default {
           {
             name: "",
             type: "pie",
-            center: ["20%", "50%"],
+            center: ["50%", "50%"],
             radius: ["55%", "95%"],
             data: this.outerData,
             labelLine: {

src/views/Decision/table.vue

@@ -1,8 +1,9 @@
 <template>
   <table class="com-table">
     <thead>
-      <tr>
+      <tr class="back">
         <th
+        class="nb"
           v-for="(col, index) of data.column"
           :key="index"
           :class="{ light: col.is_light }"
@@ -15,7 +16,7 @@
     </thead>
     <el-scrollbar>
       <tbody :style="{ height: height }">
-        <tr v-for="(row, index) of tableData" :key="index">
+        <tr class="dnb" v-for="(row, index) of tableData" :key="index">
           <td
             v-for="(col, i) of data.column"
             :key="i"
@@ -249,5 +250,16 @@ export default {
 </script>
 
 <style lang="less">
+.nb{
+    background-color: rgba(86, 90, 100, 0.3) ;
+    border-right: 1px solid rgba(0, 0, 0, 0.8);
+    border-bottom: 1px solid rgba(0, 0, 0, 0.8) ;
+}
+.dnb{
+  height: 45px;
+}
+.back{
+background: rgba(83,89,104,0.4);
+}
 </style>
 

src/views/Home/Home.vue

@@ -607,8 +607,10 @@ export default {
             Powertrend.value[2].value.push(item.bzgl)
             Powertrend.value[3].value.push(item.ssfs)
           })
-          this.Powertrend_power = Powertrend
+          this.Powertrend_power = Powertrend.value
+         
         }
+        
       })
     },
     // 请求服务
@@ -685,7 +687,7 @@ export default {
           this.homeSuspensionWindowsData = newArray
         }
       })
-      console.log(5555)
+      // console.log(5555)
       api.findBasicDataInfo({ id: this.wpId,}).then((res) => {
         if (res.data) {
           this.newpointmapData = res.data.newpointmap

src/views/WindSite/pages/Map2.vue

@@ -45,9 +45,10 @@
         <zkyqMap v-if="periodIndex === 'ZK01_GC'" ref="maps"></zkyqMap>
         <!-- 米梁局 -->
         <mljMap v-if="periodIndex === 'MLJ01_GC'" ref="maps"></mljMap>
-        
+        <!-- 山阴二期 -->
         <syMap2 v-if="periodIndex === 'SY02_GC'" ref="maps"></syMap2>
-         <syMap v-if="periodIndex === 'SY01_GC'" ref="maps"></syMap>
+        <!-- 山阴一期 -->
+        <syMap v-if="periodIndex === 'SY01_GC'" ref="maps"></syMap>
     </div>
 </template>
 <script>

src/views/WindSite/pages/components/sy-map.vue

@@ -27,21 +27,21 @@
             <svg data-v-28794fe1="" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
                 :x="String(Number(item.x)-45)" :y="String(Number(item.y)-60)" width="150" height="150" viewBox="0 0 220 392" enable-background="new 0 0 220 392"
                 xml:space="preserve" class="windmill">
-                <image v-if="item.name != '升压站'" data-v-28794fe1="" width="147" height="345" x="58" y="78" xlink:href="@/assets/map/fan/yz.png" class="pillar"></image>
+                <image v-if="item.name != '升压站'" data-v-28794fe1="" width="147" height="345" x="58" y="78" xlink:href="@/assets\png\sun.png" class="pillar"></image>
                 <!-- 运行 -->
-                <image v-if="item.type === 2 || item.type === 3" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_green.png" class="turnCircle"></image>
+                <!-- <image v-if="item.type === 2 || item.type === 3" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets\png\sun.png" class="turnCircle"></image> -->
                 <!-- 受累 -->
-                <image v-if="item.type === 12 || item.type === 13" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_white.png"></image>
+                <!-- <image v-if="item.type === 12 || item.type === 13" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets\png\sun.png"></image> -->
                 <!-- 限电 -->
-                <image v-if="item.type === 4 || item.type === 5" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_purple.png" class="turnCircle-slow"></image>
+                <!-- <image v-if="item.type === 4 || item.type === 5" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets\png\sun.png" class="turnCircle-slow"></image> -->
                 <!-- 离线 -->
-                <image v-if="item.type === 10 || item.type === 11" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_black.png"></image>
+                <!-- <image v-if="item.type === 10 || item.type === 11" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets\png\sun.png"></image> -->
                 <!-- 待机 -->
-                <image v-if="item.type === 0 || item.type === 1" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_blue.png"></image>
+                <!-- <image v-if="item.type === 0 || item.type === 1" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets\png\sun.png"></image> -->
                 <!-- 故障 -->
-                <image v-if="item.type === 6 || item.type === 7" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_red.png"></image>
+                <!-- <image v-if="item.type === 6 || item.type === 7" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets\png\sun.png"></image> -->
                 <!-- 检修 -->
-                <image v-if="item.type === 8 || item.type === 9" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_orange.png"></image>
+                <!-- <image v-if="item.type === 8 || item.type === 9" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets\png\sun.png"></image> -->
                 <!-- 升压站 -->
                 <image v-if="item.name == '升压站'" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/png/booster-station.png"></image>
             </svg>
@@ -49,13 +49,13 @@
             <text v-if="item.name != '升压站'" class="mapKey" :x="Number(item.x)+25" :y="Number(item.y) + 90" fill="#ffffff" font-size="14">{{ item.name }}</text>
             <text v-else class="mapKey" :x="Number(item.x)+10" :y="Number(item.y) + 80" fill="#ffffff" font-size="14">{{ item.name }}</text>
             <g class="isshow" v-if="item.name != '升压站'">
-                <rect :x="Number(item.x) + 55" :y="Number(item.y) + 20" width="70" height="50" stroke="#46C55A35" fill="#000000" opacity="0.8" />
-                <text class="mapValue" :x="Number(item.x) + 60" :y="Number(item.y) + 40" fill="#ffffff" font-size="14">{{ item.fs }}m/s</text>
-                <text class="mapValue" :x="Number(item.x) + 60" :y="Number(item.y) + 60" fill="#ffffff" font-size="14">{{ item.gl }}kw</text>
+                <rect :x="Number(item.x) + 55" :y="Number(item.y) + 20" width="50" height="25" stroke="#46C55A35" fill="#000000" opacity="0.8" />
+                <!-- <text class="mapValue" :x="Number(item.x) + 60" :y="Number(item.y) + 40" fill="#ffffff" font-size="14">{{ item.fs }}m/s</text> -->
+                <text class="mapValue" :x="Number(item.x) + 60" :y="Number(item.y) + 35" fill="#ffffff" font-size="14">{{ item.gl }}kw</text>
             </g>
             </g>
         </g>
-        <g>
+        <!-- <g>
             <svg :x="-20" :y="770" data-v-28794fe1="" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="150" height="150" viewBox="0 0 220 392" enable-background="new 0 0 220 392" xml:space="preserve" class="windmill">
             <image data-v-28794fe1="" width="147" height="345" x="58" y="78" xlink:href="@/assets/map/fan/yz.png" class="pillar"></image>
             <image data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_green.png"></image>
@@ -91,7 +91,7 @@
             <image data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_orange.png"></image>
             </svg>
             <text :x="410" :y="920" fill="#ffffff" font-size="14"> 检修 </text>
-        </g>
+        </g> -->
             <!-- <g>
                 <image style="overflow: visible" width="2050" height="1110" class="map-base"
                     xlink:href=""
@@ -148,92 +148,92 @@ export default {
                 },
      {
      name: '#13',
-     x: '1400',
-     y: '170',
+     x: '1415',
+     y: '195',
      type: 3,
 },
 {
      name: '#14',
-     x: '1420',
-     y: '300',
+     x: '1430',
+     y: '325',
      type: 3,
 },
 {
      name: '#15',
-     x: '1420',
-     y: '435',
+     x: '1440',
+     y: '465',
      type: 3,
 },
 {
      name: '#01',
-     x: '1210',
-     y: '190',
+     x: '1215',
+     y: '215',
      type: 3,
 },
 {
      name: '#05',
-     x: '1210',
-     y: '290',
+     x: '1215',
+     y: '325',
      type: 3,
 },
 {
      name: '#10',
      x: '1220',
-     y: '440',
+     y: '465',
      type: 3,
 },
 {
      name: '#12',
-     x: '1140',
-     y: '515',
+     x: '1135',
+     y: '555',
      type: 3,
 },
 {
      name: '#04',
-     x: '1000',
-     y: '290',
+     x: '1005',
+     y: '315',
      type: 3,
 },
 {
      name: '#09',
-     x: '990',
-     y: '430',
+     x: '995',
+     y: '455',
      type: 3,
 },
 {
      name: '#03',
-     x: '780',
-     y: '290',
+     x: '785',
+     y: '315',
      type: 3,
 },
 {
      name: '#08',
-     x: '760',
-     y: '430',
+     x: '765',
+     y: '455',
      type: 3,
 },
 {
      name: '#02',
-     x: '575',
-     y: '285',
+     x: '580',
+     y: '310',
      type: 3,
 },
 {
      name: '#07',
-     x: '540',
-     y: '430',
+     x: '545',
+     y: '455',
      type: 3,
 },
 {
      name: '#11',
-     x: '600',
-     y: '510',
+     x: '605',
+     y: '540',
      type: 3,
 },
 {
      name: '#06',
-     x: '320',
-     y: '425',
+     x: '325',
+     y: '450',
      type: 3,
 },
 

src/views/WindSite/pages/components/sy2-map.vue

@@ -25,23 +25,23 @@
             <image style="overflow: visible" width="2050" height="1220" class="map-base" xlink:href="./img/dmt_sy2.png" transform="matrix(1 0 0 1 0 -100)"></image>
             <g class="item-label-hover" v-for="(item, index) in dataList" :key="index">
             <svg data-v-28794fe1="" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-                :x="String(Number(item.x)-45)" :y="String(Number(item.y)-60)" width="150" height="150" viewBox="0 0 220 392" enable-background="new 0 0 220 392"
+                :x="String(Number(item.x)-30)" :y="String(Number(item.y)-40)" width="150" height="150" viewBox="0 0 220 392" enable-background="new 0 0 220 392"
                 xml:space="preserve" class="windmill">
-                <image v-if="item.name != '升压站'" data-v-28794fe1="" width="147" height="345" x="58" y="78" xlink:href="@/assets/map/fan/yz.png" class="pillar"></image>
+                <image v-if="item.name != '升压站'" data-v-28794fe1="" width="147" height="345" x="58" y="78" xlink:href="@/assets\png\sun.png" class="pillar"></image>
                 <!-- 运行 -->
-                <image v-if="item.type === 2 || item.type === 3" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_green.png" class="turnCircle"></image>
+                <!-- <image v-if="item.type === 2 || item.type === 3" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_green.png" class="turnCircle"></image> -->
                 <!-- 受累 -->
-                <image v-if="item.type === 12 || item.type === 13" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_white.png"></image>
+                <!-- <image v-if="item.type === 12 || item.type === 13" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_white.png"></image> -->
                 <!-- 限电 -->
-                <image v-if="item.type === 4 || item.type === 5" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_purple.png" class="turnCircle-slow"></image>
+                <!-- <image v-if="item.type === 4 || item.type === 5" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_purple.png" class="turnCircle-slow"></image> -->
                 <!-- 离线 -->
-                <image v-if="item.type === 10 || item.type === 11" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_black.png"></image>
+                <!-- <image v-if="item.type === 10 || item.type === 11" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_black.png"></image> -->
                 <!-- 待机 -->
-                <image v-if="item.type === 0 || item.type === 1" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_blue.png"></image>
+                <!-- <image v-if="item.type === 0 || item.type === 1" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_blue.png"></image> -->
                 <!-- 故障 -->
-                <image v-if="item.type === 6 || item.type === 7" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_red.png"></image>
+                <!-- <image v-if="item.type === 6 || item.type === 7" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_red.png"></image> -->
                 <!-- 检修 -->
-                <image v-if="item.type === 8 || item.type === 9" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_orange.png"></image>
+                <!-- <image v-if="item.type === 8 || item.type === 9" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_orange.png"></image> -->
                 <!-- 升压站 -->
                 <image v-if="item.name == '升压站'" data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/png/booster-station.png"></image>
             </svg>
@@ -49,13 +49,13 @@
             <text v-if="item.name != '升压站'" class="mapKey" :x="Number(item.x)+25" :y="Number(item.y) + 90" fill="#ffffff" font-size="14">{{ item.name }}</text>
             <text v-else class="mapKey" :x="Number(item.x)+10" :y="Number(item.y) + 80" fill="#ffffff" font-size="14">{{ item.name }}</text>
             <g class="isshow" v-if="item.name != '升压站'">
-                <rect :x="Number(item.x) + 55" :y="Number(item.y) + 20" width="70" height="50" stroke="#46C55A35" fill="#000000" opacity="0.8" />
-                <text class="mapValue" :x="Number(item.x) + 60" :y="Number(item.y) + 40" fill="#ffffff" font-size="14">{{ item.fs }}m/s</text>
-                <text class="mapValue" :x="Number(item.x) + 60" :y="Number(item.y) + 60" fill="#ffffff" font-size="14">{{ item.gl }}kw</text>
+                <rect :x="Number(item.x) + 55" :y="Number(item.y) + 20" width="70" height="25" stroke="#46C55A35" fill="#000000" opacity="0.8" />
+                <!-- <text class="mapValue" :x="Number(item.x) + 60" :y="Number(item.y) + 40" fill="#ffffff" font-size="14">{{ item.fs }}m/s</text> -->
+                 <text class="mapValue" :x="Number(item.x) + 60" :y="Number(item.y) + 35" fill="#ffffff" font-size="14">{{ item.gl }}kw</text>
             </g>
             </g>
         </g>
-        <g>
+        <!-- <g>
             <svg :x="-20" :y="770" data-v-28794fe1="" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="150" height="150" viewBox="0 0 220 392" enable-background="new 0 0 220 392" xml:space="preserve" class="windmill">
             <image data-v-28794fe1="" width="147" height="345" x="58" y="78" xlink:href="@/assets/map/fan/yz.png" class="pillar"></image>
             <image data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_green.png"></image>
@@ -91,7 +91,7 @@
             <image data-v-28794fe1="" width="200" height="460" xlink:href="@/assets/map/fan/yp_orange.png"></image>
             </svg>
             <text :x="410" :y="920" fill="#ffffff" font-size="14"> 检修 </text>
-        </g>
+        </g> -->
             <!-- <g>
                 <image style="overflow: visible" width="2050" height="1110" class="map-base"
                     xlink:href=""
@@ -149,25 +149,25 @@ export default {
                {
      name: 'T08',
      x: '1440',
-     y: '50',
+     y: '60',
      type: 3,
 },
 {
      name: 'T09',
      x: '1420',
-     y: '60',
+     y: '70',
      type: 3,
 },
 {
      name: 'T10',
      x: '1397',
-     y: '70',
+     y: '80',
      type: 3,
 },
 {
      name: 'T11',
      x: '1360',
-     y: '80',
+     y: '90',
      type: 3,
 },
 {
@@ -239,7 +239,7 @@ export default {
 {
      name: 'T48',
      x: '1130',
-     y: '0',
+     y: '40',
      type: 3,
 },
 {
@@ -329,7 +329,7 @@ export default {
 {
      name: 'T13',
      x: '625',
-     y: '190',
+     y: '180',
      type: 3,
 },
 {
@@ -401,102 +401,102 @@ export default {
 {
      name: 'T07',
      x: '1265',
-     y: '355',
+     y: '375',
      type: 3,
 },
 {
      name: 'T03',
      x: '1230',
-     y: '300',
+     y: '320',
      type: 3,
 },
 {
      name: 'T06',
      x: '1200',
-     y: '330',
+     y: '360',
      type: 3,
 },
 {
      name: 'T02',
      x: '1165',
-     y: '295',
+     y: '300',
      type: 3,
 },
 {
      name: 'T01',
-     x: '1170',
+     x: '1150',
      y: '230',
      type: 3,
 },
 {
      name: 'T05',
      x: '1140',
-     y: '305',
+     y: '335',
      type: 3,
 },
 {
      name: 'T04',
-     x: '1085',
-     y: '295',
+     x: '1065',
+     y: '300',
      type: 3,
 },
 {
      name: 'T31',
-     x: '1660',
-     y: '600',
+     x: '1640',
+     y: '610',
      type: 3,
 },
 {
      name: 'T35',
-     x: '1635',
-     y: '650',
+     x: '1630',
+     y: '660',
      type: 3,
 },
 {
      name: 'T28',
-     x: '1635',
-     y: '550',
+     x: '1625',
+     y: '560',
      type: 3,
 },
 {
      name: 'T30',
-     x: '1580',
-     y: '570',
+     x: '1560',
+     y: '580',
      type: 3,
 },
 {
      name: 'T34',
-     x: '1560',
-     y: '610',
+     x: '1540',
+     y: '630',
      type: 3,
 },
 {
      name: 'T29',
-     x: '1500',
+     x: '1480',
      y: '550',
      type: 3,
 },
 {
      name: 'T36',
-     x: '1500',
-     y: '645',
+     x: '1470',
+     y: '625',
      type: 3,
 },
 {
      name: 'T33',
-     x: '1470',
-     y: '580',
+     x: '1450',
+     y: '600',
      type: 3,
 },
 {
      name: 'T32',
-     x: '1425',
-     y: '580',
+     x: '1405',
+     y: '600',
      type: 3,
 },
 {
      name: 'T37',
-     x: '1390',
+     x: '1370',
      y: '630',
      type: 3,
 },
@@ -544,4 +544,5 @@ export default {
     display: none;
     color: #ffffff;
 }
+
 </style>