diff --git a/public/mapIcon/binhai.png b/public/mapIcon/binhai.png new file mode 100644 index 0000000..951af72 Binary files /dev/null and b/public/mapIcon/binhai.png differ diff --git a/public/mapIcon/dafeng.png b/public/mapIcon/dafeng.png new file mode 100644 index 0000000..2d24e95 Binary files /dev/null and b/public/mapIcon/dafeng.png differ diff --git a/public/mapIcon/dongtai.png b/public/mapIcon/dongtai.png new file mode 100644 index 0000000..010f954 Binary files /dev/null and b/public/mapIcon/dongtai.png differ diff --git a/public/mapIcon/funing.png b/public/mapIcon/funing.png new file mode 100644 index 0000000..dc48bc7 Binary files /dev/null and b/public/mapIcon/funing.png differ diff --git a/public/mapIcon/jianhu.png b/public/mapIcon/jianhu.png new file mode 100644 index 0000000..2b81eca Binary files /dev/null and b/public/mapIcon/jianhu.png differ diff --git a/public/mapIcon/location.png b/public/mapIcon/location.png new file mode 100644 index 0000000..59b7565 Binary files /dev/null and b/public/mapIcon/location.png differ diff --git a/public/mapIcon/sheyang.png b/public/mapIcon/sheyang.png new file mode 100644 index 0000000..390cf28 Binary files /dev/null and b/public/mapIcon/sheyang.png differ diff --git a/public/mapIcon/tinghu.png b/public/mapIcon/tinghu.png new file mode 100644 index 0000000..2afbe62 Binary files /dev/null and b/public/mapIcon/tinghu.png differ diff --git a/public/mapIcon/xiangshui.png b/public/mapIcon/xiangshui.png new file mode 100644 index 0000000..daf9910 Binary files /dev/null and b/public/mapIcon/xiangshui.png differ diff --git a/public/mapIcon/yandu.png b/public/mapIcon/yandu.png new file mode 100644 index 0000000..37502d7 Binary files /dev/null and b/public/mapIcon/yandu.png differ diff --git a/public/mapIcon/圆角矩形 1.png b/public/mapIcon/圆角矩形 1.png new file mode 100644 index 0000000..685edfe Binary files /dev/null and b/public/mapIcon/圆角矩形 1.png differ diff --git a/src/App.vue b/src/App.vue index aebc986..897c3a8 100644 --- a/src/App.vue +++ b/src/App.vue @@ -2,14 +2,15 @@
-
2022-12-14 14:30:50    |   星期二
+
{{time}}    |   {{week}}
-
电力行业发展
+
电力行业发展
-
能源发展综述
+
能源发展综述
-
晴转多云   |   -2-5℃  |   东风3级
+
晴转多云   |   -2-5℃  |   东风3级
@@ -63,10 +64,15 @@ import axios from "axios" export default { data(){ return{ + time:'', + handleAction:'', + handleAction1:'', fileType:false, //pdf显示 numPages: 1, //pdf页数 filePdf:'', //pdf文件 - weather:require('./assets/weather/Cloudy .png') + weather:require('./assets/weather/Cloudy .png'), + weekList:['星期日','星期一','星期二','星期三','星期四','星期五','星期六'], + week:'' } }, mounted() { @@ -78,6 +84,11 @@ import axios from "axios" // console.log(err); // }) // }) + let week = new Date(this.$moment().format("YYYY-MM-DD")).getDay() + this.week = this.weekList[week] + window.setInterval(()=>{ + this.time = this.$moment().format("YYYY-MM-DD hh:mm:ss") + },1000) }, methods:{ @@ -85,20 +96,26 @@ import axios from "axios" handleClosePdf(){ this.fileType = false this.filePdf = '' + this.$nextTick(()=>{ + this.handleAction = '' + this.handleAction1 = '' + }) }, powerPdf(){ + this.filePdf = '' let fileUrl = "/pdf/power.pdf"; this.numPages = 20 this.filePdf = pdf.createLoadingTask(fileUrl) this.fileType = true - + this.handleAction = '电力行业发展' }, energyPdf(){ + this.filePdf = '' let fileUrl = "/pdf/energy.pdf"; - this.numPages = 27 this.filePdf = pdf.createLoadingTask(fileUrl) + this.numPages = 27 this.fileType = true - + this.handleAction1 = '能源发展综述' } }, components: { @@ -157,7 +174,7 @@ import axios from "axios" height: 100%; display: flex; justify-content: flex-start; - color:rgb(15,251,251); + color:#ffffff; .leftBtnText{ height: 61%; // width: 56.62%; @@ -166,6 +183,13 @@ import axios from "axios" background-size: 100% 100%; } } + .handleAction{ + width:20%; + height: 100%; + display: flex; + justify-content: flex-start; + color:rgb(15,251,251); + } .middleText{ width:59%; height: 100%; @@ -191,7 +215,7 @@ import axios from "axios" height: 100%; display: flex; justify-content: flex-end; - color:rgb(15,251,251); + color:#ffffff; .rightBtnText{ height: 61%; // width: 56.62%; @@ -200,6 +224,13 @@ import axios from "axios" background-size: 100% 100%; } } + .handleAction1{ + width:24%; + height: 100%; + display: flex; + justify-content: flex-end; + color:rgb(15,251,251); + } } .right{ width: 9%; diff --git a/src/views/index.vue b/src/views/index.vue index 89b797e..8f525ec 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -27,7 +27,7 @@
- 18132.6667MW + {{capacity}}MW 盐城电力生产总装机量
@@ -219,27 +219,29 @@ + > + > + > + show-overflow-tooltip + > + show-overflow-tooltip + >
@@ -280,6 +282,7 @@ import {getData} from '../api/index.js' export default { data(){ return{ + capacity:0, //装机总量 news:[ { Journalism:'' @@ -419,129 +422,10 @@ export default { qiyeshuliang:'12' }, ], - popTableData2:[ - { - diqu:'亭湖区', - dianzhanshu:'13', - jizhongshi:'1', - fenbushi:'12' - }, - { - diqu:'亭湖区', - dianzhanshu:'13', - jizhongshi:'1', - fenbushi:'12' - }, - { - diqu:'亭湖区', - dianzhanshu:'13', - jizhongshi:'1', - fenbushi:'12' - }, - { - diqu:'亭湖区', - dianzhanshu:'13', - jizhongshi:'1', - fenbushi:'12' - }, - { - diqu:'亭湖区', - dianzhanshu:'13', - jizhongshi:'1', - fenbushi:'12' - }, - ], - popTableData3:[ - { - feitongdiao:'集中式光伏', - zuoshu:'13', - taishu:'1', - bingwang:'694.4890' - }, - { - feitongdiao:'集中式光伏', - zuoshu:'13', - taishu:'1', - bingwang:'694.4890' - }, - { - feitongdiao:'集中式光伏', - zuoshu:'13', - taishu:'1', - bingwang:'694.4890' - }, - { - feitongdiao:'集中式光伏', - zuoshu:'13', - taishu:'1', - bingwang:'694.4890' - }, - ], - popTableData4:[ - { - diqu:'开发区', - guangfuhezhun:'70.45000', - guangfushiji:'69.70000' - }, - { - diqu:'开发区', - guangfuhezhun:'70.45000', - guangfushiji:'69.70000' - }, - { - diqu:'开发区', - guangfuhezhun:'70.45000', - guangfushiji:'69.70000' - }, - { - diqu:'开发区', - guangfuhezhun:'70.45000', - guangfushiji:'69.70000' - }, - { - diqu:'开发区', - guangfuhezhun:'70.45000', - guangfushiji:'69.70000' - }, - { - diqu:'开发区', - guangfuhezhun:'70.45000', - guangfushiji:'69.70000' - }, - ], + popTableData2:[], + popTableData3:[], + popTableData4:[], popTableData5:[ - { - fadianchang:'毛竹沙风电', - zhuangji:'300', - fengdian:'风电', - zuigao:'500kv', - date:'2021-11-26 00:00:00', - status:'在运' - }, - { - fadianchang:'毛竹沙风电', - zhuangji:'300', - fengdian:'风电', - zuigao:'500kv', - date:'2021-11-26 00:00:00', - status:'在建' - }, - { - fadianchang:'毛竹沙风电', - zhuangji:'300', - fengdian:'风电', - zuigao:'500kv', - date:'2021-11-26 00:00:00', - status:'退运' - }, - { - fadianchang:'毛竹沙风电', - zhuangji:'300', - fengdian:'风电', - zuigao:'500kv', - date:'2021-11-26 00:00:00', - status:'在运' - }, ], popTableData6:[ { @@ -578,38 +462,6 @@ export default { }, ], popTableData7:[ - { - fadianchang:'毛竹沙风电', - zhuangji:'300', - fengdian:'光热一体', - zuigao:'500kv', - date:'2021-11-26 00:00:00', - status:'在运' - }, - { - fadianchang:'毛竹沙风电', - zhuangji:'300', - fengdian:'光热一体', - zuigao:'500kv', - date:'2021-11-26 00:00:00', - status:'在建' - }, - { - fadianchang:'毛竹沙风电', - zhuangji:'300', - fengdian:'光热一体', - zuigao:'500kv', - date:'2021-11-26 00:00:00', - status:'退运' - }, - { - fadianchang:'毛竹沙风电', - zhuangji:'300', - fengdian:'光热一体', - zuigao:'500kv', - date:'2021-11-26 00:00:00', - status:'在运' - }, ], popTableData8:[ { @@ -754,10 +606,6 @@ export default { } }, mounted(){ - this.echartsTwo(); - this.echartsThree(); - this.echartsFour(); - this.echartsFive(); this.echartsSix(); this.echartsSeven(); this.echartsMap(); @@ -794,37 +642,94 @@ export default { contaminatedData = res.data.data this.echartsOne(contaminatedData); }) + //查询当日上网电量 + getData( + { + action:'one', + key:'当日上网电量' + } + ).then((res)=>{ + let powerData = [] + powerData = res.data.data + this.echartsFive(powerData); + + }) + //查询盐城装机容量 + getData( + { + action:'one', + key:'盐城装机容量' + } + ).then((res)=>{ + let sumCapacity = []; + let capacityData = res.data.data + this.echartsTwo(capacityData); + Object.keys(capacityData).map((item,index)=>{ + for (const key in capacityData[index]) { + sumCapacity.push(Number(capacityData[index][key])) + } + }) + this.capacity = sumCapacity.reduce((x,y)=>x+y) + }) + //查询非统调光伏电站座数 + getData( + { + action:'one', + key:'非统调光伏电站座数' + } + ).then((res)=>{ + this.popTableData2 = res.data.data + let powerStation = res.data.data + this.echartsThree(powerStation); + }) + //查询非统调电厂并网容量 + getData( + { + action:'one', + key:'非统调电厂并网容量' + } + ).then((res)=>{ + this.popTableData3 = res.data.data + this.echartsFour(this.popTableData3); + }) }, methods:{ cityChange(val){ this.popTableShow = 0 this.cityActive = val if (val == 0) { - this.modelOthers = true - this.componentShow = 'pop'; - this.popName = '风电'; - this.popTableShow = 5 + this.popName = '风电'; }else if (val == 1) { - this.modelOthers = true - this.componentShow = 'pop'; this.popName = '光伏'; - this.popTableShow = 5 }else if (val == 2) { - this.modelOthers = true - this.componentShow = 'pop'; this.popName = '光热一体'; - this.popTableShow = 5 }else if (val == 3) { - this.modelOthers = true - this.componentShow = 'pop'; this.popName = '火电'; - this.popTableShow = 5 }else if (val == 4) { - this.modelOthers = true - this.componentShow = 'pop'; this.popName = '水电'; - this.popTableShow = 5 } + getData( + { + action:'one', + key:'装机容量'+this.popName + } + ).then((res)=>{ + this.modelOthers = true + this.componentShow = 'pop'; + this.popTableShow = 5 + if (this.popName == '风电') { + this.popTableData5 = res.data.data + }else if (this.popName == '光伏') { + this.popTableData6 = res.data.data + }else if (this.popName == '光热一体') { + this.popTableData7 = res.data.data + }else if (this.popName == '火电') { + this.popTableData8 = res.data.data + }else if (this.popName == '水电') { + this.popTableData9 = res.data.data + } + }) + }, typeChange(val){ this.popTableShow = 0 @@ -855,7 +760,6 @@ export default { this.mapCityAction = val }, echartsOne(contaminatedData){ - console.log(contaminatedData,'contaminatedData'); let regionData = [ { name:'', @@ -863,9 +767,9 @@ export default { } ] //求企业数量和 - let enterpriseNum = contaminatedData.reduce((sum,e)=> sum + Number(e.企业数量 || 0),0) + // let enterpriseNum = contaminatedData.reduce((sum,e)=> sum + Number(e.企业数量 || 0),0) regionData = Object.keys(contaminatedData).map((item,index)=>{ - return {name:contaminatedData[index].区县,value: Number(contaminatedData[index].企业数量/enterpriseNum*100).toFixed(2)} + return {name:contaminatedData[index].区县,value: contaminatedData[index].企业数量} }) var myChart = this.$echarts.init(document.getElementById("echartsOne")); var option ={ @@ -902,11 +806,7 @@ export default { borderWidth: 1, padding:[5,10,10,5], // borderRadius: [0,0,14,0], - formatter: function (param) { - // return param.name + ': ' + (param.value - number) + ' ' + (((param.value - number) / sum) * 100) - // .toFixed(2) + '%' - return param.name + ':' + param.value + '%' - }, + formatter: [ '{b}','{d}%'].join(':'), }, @@ -1107,7 +1007,19 @@ export default { }; myChart.setOption(option); }, - echartsTwo(){ + echartsTwo(capacityData){ + let capacitySum = null + let capacityList = [] + // for (let i = 0; i < capacityData.length; i++) { + // capacitySum = Number(capacityData[i].风电) + Number(capacityData[i].光伏) + Number(capacityData[i].光热一体) + + // Number(capacityData[i].火电) + Number(capacityData[i].水电) + // } + Object.keys(capacityData).map((item,index)=>{ + for (const key in capacityData[index]) { + capacityList.push({name:key , value:capacityData[index][key]}) + } + + }) var myChart = this.$echarts.init(document.getElementById("echartsTwo")); var option = { tooltip: { @@ -1135,19 +1047,17 @@ export default { radius: [0, '70%'], color: ['#57d1fa','#b6b91d','#8bd2b2','#57d1fa','#ff9374'], roseType: 'area', - data: [ - {value: 25, name: 'A类型'}, - {value: 30, name: 'B类型'}, - {value: 30, name: 'C类型'}, - {value: 25, name: 'D类型'}, - {value: 25, name: 'E类型'}, - ] + data: capacityList } ] } myChart.setOption(option); }, - echartsThree(){ + echartsThree(powerStation){ + let powerStationList = []; + powerStationList = Object.keys(powerStation).map((item,index)=>{ + return {name:powerStation[index].地区, value: powerStation[index].电站数} + }) var myChart = this.$echarts.init(document.getElementById("echartsThree")); var option ={ tooltip: { @@ -1155,7 +1065,7 @@ export default { }, series: [ { - name: "企业污染", + name: "非统调光伏电站座数分布", type: "pie", radius: ["20%", "63%"], center: ["50%", "50%"], @@ -1183,11 +1093,7 @@ export default { borderWidth: 1, padding:[5,10,10,5], // borderRadius: [0,0,14,0], - formatter: function (param) { - // return param.name + ': ' + (param.value - number) + ' ' + (((param.value - number) / sum) * 100) - // .toFixed(2) + '%' - return param.name + ':' + param.value + '%' - }, + formatter: [ '{b}','{d}%'].join(':'), }, @@ -1198,14 +1104,7 @@ export default { // shadowOffsetX: 5, // shadowOffsetY: 5 // }, - data:[{name:'东台市',value:71.03}, - {name:'阜宁县',value:12.66}, - {name:'盐都区',value:6.04}, - {name:'响水县',value:8.04}, - {name:'建湖县',value:8.04}, - {name:'大丰区',value:18.04}, - {name:'射阳县',value:9.04}, - ] + data:powerStationList }, { name: "ring5", @@ -1395,7 +1294,13 @@ export default { }; myChart.setOption(option); }, - echartsFour(){ + echartsFour(powerPlant){ + let powerPlantType = []; + let powerPlantCount = []; + for (let i = 0; i < powerPlant.length; i++) { + powerPlantType.push(powerPlant[i].非统调电源类型) + powerPlantCount.push(powerPlant[i].实际并网容量) + } var myChart = this.$echarts.init(document.getElementById("echartsFour")); var option = { tooltip: { @@ -1414,11 +1319,11 @@ export default { grid: { // top:'20%', // bottom: '10%', - right: '10%', + right: '8%', left: '10%', }, xAxis: { - data: ['00:00', '01:00', '02:00', '03:00', '04:00', '05:00','06:00', '07:00', '08:00', '09:00', '10:00', '11:00'], + data: powerPlantType, axisLine: { lineStyle: { color: '#08c386' @@ -1439,15 +1344,15 @@ export default { axisLabel: { show: true, interval:0, - // rotate:20, + rotate:20, margin: 14, - fontSize: 14, + fontSize: 12, color: 'rgb(78,227,207)', }, }, yAxis: [ { - name: '', + name: '单位:MW', nameTextStyle: { fontSize: 11, color: '#08c386', @@ -1520,7 +1425,7 @@ export default { backgroundColor: 'rgb(5,52,44)', formatter: '{c}', }, - data: [47, 46, 41, 46, 44, 90,47, 46, 41, 46, 44, 90], + data: powerPlantCount, z: 10, zlevel: 0, }, @@ -1539,7 +1444,7 @@ export default { symbolSize: [22, 5], symbolPosition: 'start', symbolOffset: [1, 1], - data: [47, 46, 41, 46, 44, 90,47, 46, 41, 46, 44, 90], + data: powerPlantCount, width: 2, z: 0, zlevel: 1, @@ -1567,7 +1472,13 @@ export default { }; myChart.setOption(option) }, - echartsFive(){ + echartsFive(powerData){ + let powerX = [] + let powerY = [] + for (let i = 0; i < powerData.length; i++) { + powerX.push(powerData[i].类型) + powerY.push(powerData[i].电量) + } var myChart = this.$echarts.init(document.getElementById("echartsFive")); var option = { tooltip: { @@ -1590,7 +1501,7 @@ export default { left: '10%', }, xAxis: { - data: ['光伏发电','风力发电','余电上网光伏','电厂'], + data: powerX, axisLine: { lineStyle: { color: '#08c386' @@ -1619,7 +1530,7 @@ export default { }, yAxis: [ { - name: '', + name: '单位/万kWh', nameTextStyle: { fontSize: 11, color: '#08c386', @@ -1692,7 +1603,7 @@ export default { backgroundColor: 'rgb(5,52,44)', formatter: '{c}', }, - data: [47, 46, 41, 46,], + data: powerY, z: 10, zlevel: 0, }, @@ -1711,7 +1622,7 @@ export default { symbolSize: [22, 2], symbolPosition: 'start', symbolOffset: [1, 25], - data: [47, 46, 41, 46,], + data: powerY, width: 1, z: 0, zlevel: 1, @@ -1747,7 +1658,7 @@ export default { }, series: [ { - name: "企业污染", + name: "非统调光伏电站装机容量分布", type: "pie", radius: ["20%", "63%"], center: ["50%", "50%"], @@ -2029,7 +1940,7 @@ export default { return `{${circle}|}\n{${color}|${params.name}\n${params.value}}`; }, rich: { - yellow: { + purple: { color:'rgb(5,204,148)', fontSize: 18, }, @@ -2041,7 +1952,7 @@ export default { color:'rgb(30,140,189)', fontSize: 18, }, - purple: { + yellow: { color: 'rgb(255,160,98)', fontSize: 18, }, @@ -2123,7 +2034,6 @@ export default { if (params.componentSubType == 'scatter') { return `
${params.name}
-
` } @@ -2160,35 +2070,22 @@ export default { colorStops: [ { offset: 0, - color: "#009DA1", // 0% 处的颜色 + color: "rgb(11,224,181)", // 0% 处的颜色 }, { offset: 1, - color: "#005B9E", // 50% 处的颜色 + color: "rgb(11,224,181)", // 50% 处的颜色 }, ], global: true, // 缺省为 false }, opacity: 0.5, }, - emphasis: { - areaColor: "#2a333d", - }, + // emphasis: { + // areaColor: "#2a333d", + // }, }, - // regions: [ - // { - // name: "南海诸岛", - // itemStyle: { - // areaColor: "rgba(0, 10, 52, 1)", - // borderColor: "rgba(0, 10, 52, 1)", - // }, - // emphasis: { - // areaColor: "rgba(0, 10, 52, 1)", - // borderColor: "rgba(0, 10, 52, 1)", - // }, - // }, - // ], z: 2, }, series: [ @@ -2207,7 +2104,106 @@ export default { show: true, // 是否显示标签。 fontSize: '11', color: 'rgba(0,0,0,0.7)', - + fontSize:15, + // position: [10,20], + color: '#fff', + backgroundColor: 'rgb(5,52,44)', + formatter: (params) => { + let color = "blue"; + if (params.dataIndex === 0) { + var res = "{binhai|}" + return res; + } else if (params.dataIndex === 1) { + var res = "{dafeng|}" + return res; + } else if (params.dataIndex === 2) { + var res = "{dongtai|}" + return res; + } else if (params.dataIndex === 3) { + var res = "{funing|}" + return res; + }else if (params.dataIndex === 4) { + var res = "{jianhu|}" + return res; + }else if (params.dataIndex === 5) { + var res = "{sheyang|}" + return res; + }else if (params.dataIndex === 6) { + var res = "{tinghu|}" + return res; + }else if (params.dataIndex === 7) { + var res = "{xiangshui|}" + return res; + }else if (params.dataIndex === 8) { + var res = "{yandu|}" + return res; + } + }, + rich: { + binhai: { + height: 21, + width: 64, + backgroundColor: { + image: '/mapIcon/binhai.png' + }, + }, + dafeng: { + height: 21, + width: 52, + backgroundColor: { + image: '/mapIcon/dafeng.png' + }, + }, + dongtai: { + height: 21, + width: 49, + backgroundColor: { + image: '/mapIcon/dongtai.png' + }, + }, + funing: { + height: 21, + width: 52, + backgroundColor: { + image: '/mapIcon/funing.png' + }, + }, + jianhu: { + height: 21, + width: 52, + backgroundColor: { + image: '/mapIcon/jianhu.png' + }, + }, + sheyang: { + height: 21, + width: 52, + backgroundColor: { + image: '/mapIcon/sheyang.png' + }, + }, + tinghu: { + height: 21, + width: 52, + backgroundColor: { + image: '/mapIcon/tinghu.png' + }, + }, + xiangshui: { + height: 21, + width: 52, + backgroundColor: { + image: '/mapIcon/xiangshui.png' + }, + }, + yandu: { + height: 21, + width: 52, + backgroundColor: { + image: '/mapIcon/yandu.png' + }, + }, + }, }, itemStyle: { @@ -2283,7 +2279,7 @@ export default { { name: '响水县', value: [120.339948,33.177641] }, { name: '盐都区', value: [120.439991,33.077621] }, ], - symbol: "image:///mapIcon/地标.png", + symbol: "image:///mapIcon/location.png", symbolSize:[16, 20], symbolKeepAspect:"true" // itemStyle: { @@ -4221,10 +4217,16 @@ export default { this.popName = '非统调电厂'; this.popTableShow = val }else if (val == 4) { - this.modelOthers = true - this.componentShow = 'pop'; - this.popName = '非统调光伏电站装机容量分布'; - this.popTableShow = val + getData({ + action:'one', + key:'非统调光伏电站装机容量' + }).then((res)=>{ + this.modelOthers = true + this.componentShow = 'pop'; + this.popName = '非统调光伏电站装机容量分布'; + this.popTableShow = val + this.popTableData4 = res.data.data + }) } } }, @@ -4280,8 +4282,8 @@ export default { background: url("../assets/images/kuang.png") no-repeat; background-size: 100% 100%; color: #ffffff; - text-indent : 40px; - letter-spacing:7px; + text-indent : 32px; + letter-spacing:1px; text-align:left; line-height:25px; overflow: auto; @@ -4404,9 +4406,10 @@ export default { height: 100%; display: flex; flex-wrap: wrap; - justify-content: space-around; + justify-content: center; align-items: center; align-content: center; + flex-direction: column; } } @@ -5091,6 +5094,7 @@ export default { height: 10%; right: 4%; top: 4%; + z-index: 100; .el-select{ ::v-deep .el-input--suffix .el-input__inner{ background: url("../assets/images/selectKuang.png") no-repeat; @@ -5137,7 +5141,7 @@ export default { } /deep/ .el-table__header { height: 48px; - background: url("../assets/images/table.png") no-repeat !important; + background: url("../assets/images/table.png") no-repeat ; background-size: 100% 100%; } /deep/ .el-table__header th { @@ -5230,6 +5234,9 @@ export default { .el-select-dropdown__item{ color: #ffffff !important; } + .el-select-dropdown__item.hover, .el-select-dropdown__item:hover{ + background-color: rgb(8,52,41) !important; + } } diff --git a/src/views/pop.vue b/src/views/pop.vue index 254d241..b9415e4 100644 --- a/src/views/pop.vue +++ b/src/views/pop.vue @@ -51,22 +51,22 @@ @@ -84,23 +84,23 @@ @@ -119,21 +119,18 @@ @@ -150,37 +147,38 @@ @@ -268,9 +266,8 @@ props: { } }, mounted(){ - console.log(this.popTableData2,'popTableData'); this.tableShow = this.popTableShow; - if (this.popTableShow == 1) { + if (this.popTableShow == 1) { this.popData = this.popTableData1; }else if (this.popTableShow == 2) { this.popData = this.popTableData2; @@ -301,7 +298,15 @@ props: { this.popData = this.popTableData13; } } - + }, + watch: { + // //监听内容 + // popData(newVal,oldVal) { + // console.log(newVal,oldVal,"value发生了变化"); + // if (newVal != oldVal && newVal != '') { + // this.popData = newVal + // } + // } }, methods:{ close(){ @@ -347,7 +352,7 @@ props: { } .secondContent{ width: 100%; - height: 100%; + height: calc(100% - 8%); padding-top: 2%; box-sizing: border-box; /deep/ .el-table { @@ -361,7 +366,7 @@ props: { } /deep/ .el-table__header { height: 48px; - background: url("../assets/images/table.png") no-repeat !important; + background: url("../assets/images/table.png") no-repeat ; background-size: 100% 100%; } /deep/ .el-table__header th {