huajimang
/
yanDuLargeScreen
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

代码提交

This commit is contained in:
lixiaobang 2022-11-09 10:40:15 +08:00
parent dc90cc9dc3
commit 42b90c73ec
3 changed files with 140 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.vue
View File

@ -113,6 +113,8 @@ export default {
.active{ .active{
color: #ffffff; color: #ffffff;
background: url('./assets/images/routerActive.png') no-repeat; background: url('./assets/images/routerActive.png') no-repeat;
background-size: 100% 100%;
} }
} }
.right{ .right{

12
src/api/index.js
View File

@ -22,3 +22,15 @@ export const getDevice = (params) => {
params params
}) })
}; };
//班组故障查询
export const getBanzugz = (params) => {
return axios.get('/Handler/Banzugz.ashx', {
params
})
};
//查询工单统计
export const getGdtj = (params) => {
return axios.get('/Handler/gdtj.ashx', {
params
})
};

168
src/views/Home.vue
View File

@ -76,57 +76,62 @@
</div> </div>
</div> </div>
<div class="two" style="height: 570px"> <div class="two" style="height: 570px">
<div class="cartitle">全市本周配网故障次数</div> <div class="cartitle">
<div class="titleFont">
全市本周配网故障次数
</div>
</div>
<div class="table user_skills"> <div class="table user_skills">
<el-table <el-table
:data="tableData" :data="tableData"
style="width: 100%; height: 100%" style="width: 100%; height: 100%"
:header-cell-style="{ 'text-align': 'center' }" :header-cell-style="{ 'text-align': 'center' }"
:cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }"
> >
<el-table-column label="" align="center" width="10"> <el-table-column label="" align="center" width="20">
<template slot-scope="scop"> <template slot-scope="scop">
{{ scop.$index + 1 }} {{ scop.$index + 1 }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" label="班组" width="80"> <el-table-column prop="bz" label="班组" width="80" :show-overflow-tooltip="true">
</el-table-column> </el-table-column>
<el-table-column prop="line" label="故障路线" width="80"> <el-table-column prop="gzxl" label="故障路线" width="80" :show-overflow-tooltip="true">
</el-table-column> </el-table-column>
<el-table-column prop="why" label="故障原因" width="80"> <el-table-column prop="gzyy" label="故障原因" width="80" :show-overflow-tooltip="true">
</el-table-column> </el-table-column>
<el-table-column prop="sucss" label="重合成功" width="60"> <el-table-column prop="chcg" label="重合成功" width="60">
<template slot-scope="scope"> <template slot-scope="scope">
<div style="color:#ffbc3a"> <div style="color:#ffbc3a">
{{ scope.row.sucss}} {{ scope.row.chcg}}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="unsucss" label="重合不成" width="80"> <el-table-column prop="chbc" label="重合不成" width="80">
<template slot-scope="scope"> <template slot-scope="scope">
<div style="color:#ffbc3a"> <div style="color:#ffbc3a">
{{ scope.row.unsucss}} {{ scope.row.chbc}}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="noneunsucss" label="无重合闸" width="60"> <el-table-column prop="wchz" label="无重合闸" width="60">
<template slot-scope="scope"> <template slot-scope="scope">
<div style="color:#2793ff"> <div style="color:#2793ff">
{{ scope.row.noneunsucss}} {{ scope.row.wchz}}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="address" label="接地" width="60"> <el-table-column prop="jiedi" label="接地" width="60">
<template slot-scope="scope"> <template slot-scope="scope">
<div style="color:#794af8"> <div style="color:#794af8">
{{ scope.row.address}} {{ scope.row.jiedi}}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="total" label="合计" width="60"> <el-table-column prop="heji" label="合计" width="60">
<template slot-scope="scope"> <template slot-scope="scope">
<div style="color:#ee8316"> <div style="color:#ee8316">
{{ scope.row.total}} {{ scope.row.heji}}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
@ -180,7 +185,11 @@
</div> </div>
<div class="detailed"> <div class="detailed">
<div class="two" style="height: 350px; width: 780px"> <div class="two" style="height: 350px; width: 780px">
<div class="cartitle">本周路线故障跳闸明细</div> <div class="cartitle">
<div class="titleFont">
本周路线故障跳闸明细
</div>
</div>
<div class="detailedOneList"> <div class="detailedOneList">
<div> <div>
单位 单位
@ -219,7 +228,10 @@
<div id="detailedOne" style="height:90%"></div> <div id="detailedOne" style="height:90%"></div>
</div> </div>
<div class="three" style="height: 350px; width: 780px"> <div class="three" style="height: 350px; width: 780px">
<div class="cartitle">本年度路线故障调闸明细</div> <div class="cartitle">
<div class="titleFont">
本年度路线故障调闸明细</div>
</div>
<div id="detailedFour"></div> <div id="detailedFour"></div>
</div> </div>
</div> </div>
@ -227,7 +239,10 @@
<div class="right"> <div class="right">
<div class="one" style="height: 310px"> <div class="one" style="height: 310px">
<div class="cartitle"> <div class="cartitle">
<div style="width: 82%;display: flex;justify-content: space-between;align-items: center;">盐都配变停运管理情况 <div style="width: 82%;display: flex;justify-content: space-between;align-items: center;">
<div class="titleFont">
盐都配变停运管理情况
</div>
<div class="dateSelect"> <div class="dateSelect">
<div style="text-indent: 15px;" @click="handleDate(index)" :class="addColor(index)" v-for="(item,index) in dateList" :key="index"> <div style="text-indent: 15px;" @click="handleDate(index)" :class="addColor(index)" v-for="(item,index) in dateList" :key="index">
{{item}} {{item}}
@ -244,11 +259,19 @@
<div style="height:90%" id="detailedFive"></div> <div style="height:90%" id="detailedFive"></div>
</div> </div>
<div class="two" style="height: 340px"> <div class="two" style="height: 340px">
<div class="cartitle">盐都供电质量统计</div> <div class="cartitle">
<div class="titleFont">
盐都供电质量统计
</div>
</div>
<div id="detailedTwo"></div> <div id="detailedTwo"></div>
</div> </div>
<div class="three" style="height: 310px"> <div class="three" style="height: 310px">
<div class="cartitle">工单统计</div> <div class="cartitle">
<div class="titleFont">
工单统计
</div>
</div>
<div id="detailedThree"></div> <div id="detailedThree"></div>
</div> </div>
</div> </div>
@ -303,7 +326,7 @@
</template> </template>
<script> <script>
import { getCompanyInfo,getLine} from "../api/index.js"; import { getCompanyInfo,getLine,getBanzugz,getGdtj} from "../api/index.js";
import ringMainUnit from "./HomePop/ringMainUnit.vue" import ringMainUnit from "./HomePop/ringMainUnit.vue"
export default { export default {
name: "home", name: "home",
@ -312,6 +335,7 @@ export default {
}, },
data() { data() {
return { return {
dataGzList:[],
dateList: ['周','月'], dateList: ['周','月'],
acolor: true,//是否展示颜色 acolor: true,//是否展示颜色
currentIndex : -1, currentIndex : -1,
@ -325,18 +349,7 @@ export default {
modelOthers: false, modelOthers: false,
componentShow: "", componentShow: "",
CompanyInfo: {}, CompanyInfo: {},
tableData: [ tableData: [],
{
name: "大岗供电所",
line: "10kv龙灯线",
why: "125-10",
sucss: "1",
unsucss: "1",
noneunsucss: "/",
address: "/",
total: "2",
},
],
btnArr: ["总览", "环网柜", "分支箱", "箱变", "开闭所", "热力图"], btnArr: ["总览", "环网柜", "分支箱", "箱变", "开闭所", "热力图"],
btnActive: 0, btnActive: 0,
iconGround:[ iconGround:[
@ -399,16 +412,37 @@ export default {
).then((res)=>{ ).then((res)=>{
if (res.data != '') { if (res.data != '') {
this.options = Object.keys(res.data.data).map((item,index)=>{ this.options = Object.keys(res.data.data).map((item,index)=>{
console.log(res.data.data[index],"res.data.data");
return {value:res.data.data[index].line_code,label:res.data.data[index].line_name} return {value:res.data.data[index].line_code,label:res.data.data[index].line_name}
}) })
} }
}) })
//周查询班组
getBanzugz(
{
action: 'week'
}
).then((res)=>{
for (let i = 0; i < res.data.data.length; i++) {
this.tableData.push(res.data.data[i])
}
})
//工单统计
getGdtj().then((res)=>{
let dataList = res.data.data
this.detailedThree(dataList);
})
//年度查询班组
getBanzugz(
{
action: 'year'
}
).then((res)=>{
this.dataGzList=res.data.data
this.detailedFour(this.dataGzList);
})
this.detailedOne(); this.detailedOne();
this.detailedThree();
this.detailedTwo(); this.detailedTwo();
this.detailedFour();
this.detailedFive(); this.detailedFive();
this.handleDate(0); this.handleDate(0);
let that = this; let that = this;
@ -773,23 +807,23 @@ export default {
}; };
myChart.setOption(option); myChart.setOption(option);
}, },
detailedThree(){ detailedThree(dataList){
var equipment = ["运检类投诉","运检类意见"]; var equipment = [dataList.yjlts,dataList.yjlyj];
var colorList = ["#0090ff","#06d3c4","#66b0ed","#7cb79d"] var colorList = ["#0090ff","#06d3c4","#66b0ed","#7cb79d"]
var dataList = [{ var dataList = [{
value: 875, value: dataList.pftd,
name: "频繁停电", name: "频繁停电",
}, },
{ {
value: 1239, value: dataList.dctd,
name: "多次停电", name: "多次停电",
}, },
{ {
value: 1239, value: dataList.clsjc,
name: "处理时间长", name: "处理时间长",
}, },
{ {
value: 500, value: dataList.mspc,
name: "民事赔偿", name: "民事赔偿",
},] },]
var myChart = this.$echarts.init(document.getElementById("detailedThree")); var myChart = this.$echarts.init(document.getElementById("detailedThree"));
@ -883,7 +917,7 @@ export default {
normal: { normal: {
formatter: function (params) { formatter: function (params) {
if (params.value != 0) if (params.value != 0)
return params.data.type + ":" + params.value + "个"; return params.data.name + ":" + params.data.type + "个";
else return ""; else return "";
}, },
color:"#ffffff", color:"#ffffff",
@ -893,13 +927,13 @@ export default {
data: [ data: [
{ {
value: 135, value: equipment[0],
name: "传输", name: "运检类投诉",
type: equipment[0], type: equipment[0],
}, },
{ {
value: 230, value: equipment[1],
name: "话务", name: "运检类意见",
type: equipment[1], type: equipment[1],
}, },
@ -909,7 +943,20 @@ export default {
}; };
myChart.setOption(option); myChart.setOption(option);
}, },
detailedFour(){ detailedFour(dataList){
let yearBzData = []
let yearChcg = []
let yearChbc = []
let yearWchz = []
let yearJieDi = []
for (let i = 0; i < dataList.length; i++) {
yearBzData.push(dataList[i].bz)
yearChcg.push(dataList[i].chcg)
yearChbc.push(dataList[i].chbc)
yearWchz.push(dataList[i].wchz)
yearJieDi.push(dataList[i].jiedi)
}
console.log(yearBzData);
let that = this let that = this
var myChart = this.$echarts.init(document.getElementById("detailedFour")); var myChart = this.$echarts.init(document.getElementById("detailedFour"));
var option = { var option = {
@ -961,7 +1008,7 @@ export default {
axisLabel: { axisLabel: {
interval: 0, interval: 0,
}, },
data: ["配网一班","配网二班","大冈", "大纵湖", "尚庄", "郭猛", "秦南", "西区","楼王","学富","潘黄","龙冈"], data: yearBzData,
}, },
], ],
yAxis: [ yAxis: [
@ -1024,7 +1071,7 @@ export default {
]), ]),
}, },
}, },
data: [1, 3, 5, 7, 9,4,5,4,1,10,2,10], data: yearChcg,
}, },
{ {
name: "重合不成", name: "重合不成",
@ -1057,7 +1104,7 @@ export default {
]), ]),
}, },
}, },
data: [3,5, 8, 7, 12,4,6,7,9,3,12,7], data: yearChbc,
}, },
{ {
name: "无重合闸", name: "无重合闸",
@ -1091,7 +1138,7 @@ export default {
barBorderRadius: 0, barBorderRadius: 0,
}, },
}, },
data: [4, 7, 6, 3, 2,19,2,20,10,11,20,10], data: yearWchz,
}, },
{ {
name: "接地", name: "接地",
@ -1125,11 +1172,13 @@ export default {
barBorderRadius: 0, barBorderRadius: 0,
}, },
}, },
data: [15, 23, 3, 5, 9,10,4,7,11,7,3,14], data: yearJieDi,
}, },
], ],
}; };
myChart.setOption(option); myChart.setOption(option);
}, },
detailedFive(){ detailedFive(){
let that = this; let that = this;
@ -1669,12 +1718,12 @@ export default {
height: calc(100% - 52px); height: calc(100% - 52px);
}; };
}; };
// .titleFont{ .titleFont{
// color: transparent ; color: transparent ;
// -webkit-background-clip: text; -webkit-background-clip: text;
// background-clip: text ; background-clip: text ;
// background-image: linear-gradient(to bottom, rgb(255,255,255), rgb(86,244,254)) background-image: linear-gradient(to bottom, rgb(255,255,255), rgb(123,247,245))
// } }
//弹窗样式 //弹窗样式
.componentShow{ .componentShow{
width: 100%; width: 100%;
@ -1798,6 +1847,7 @@ export default {
.el-table::before{ .el-table::before{
background-color: transparent; background-color: transparent;
} }
::v-deep .el-table .el-table__body tr.el-table__row td{ ::v-deep .el-table .el-table__body tr.el-table__row td{
background: rgba(79, 218, 255, 0.1) !important; background: rgba(79, 218, 255, 0.1) !important;
} }