|
@@ -2,8 +2,8 @@
|
|
|
* @Description:
|
|
|
* @Author: wangcc
|
|
|
* @Date: 2022-07-06 15:56:45
|
|
|
- * @LastEditors: gcz
|
|
|
- * @LastEditTime: 2022-07-12 11:17:37
|
|
|
+ * @LastEditors: wangcc
|
|
|
+ * @LastEditTime: 2022-07-12 19:37:28
|
|
|
* @FilePath: \castgroup_bigscreen\src\views\index.vue
|
|
|
* @Copyright: Copyright (c) 2016~2022 by wangcc, All Rights Reserved.
|
|
|
-->
|
|
@@ -101,14 +101,20 @@
|
|
|
mid="page6Char2"
|
|
|
ref="page6Char2"
|
|
|
:option="page6Char2"
|
|
|
- /> -->
|
|
|
+ />-->
|
|
|
<div class="left-item">
|
|
|
<!-- <div class="ntitle">{{$store.state.addr.selectAddr}}事件发生记录</div> -->
|
|
|
<div class="ntitle">
|
|
|
- <span v-if="$store.state.addr.mapLevel=='province'">{{$store.state.addr.selectAddr}}各地州(市)事件发生记录</span>
|
|
|
+ <span
|
|
|
+ v-if="$store.state.addr.mapLevel=='province'"
|
|
|
+ >{{$store.state.addr.selectAddr}}各地州(市)事件发生记录</span>
|
|
|
<span v-if="$store.state.addr.mapLevel=='city'">{{$store.state.addr.selectAddr}}各县事件发生记录</span>
|
|
|
- <span v-if="$store.state.addr.mapLevel=='district'">{{$store.state.addr.selectAddr}}各乡镇事件发生记录</span>
|
|
|
- <span v-if="$store.state.addr.mapLevel=='street'">{{$store.state.addr.selectAddr}}各村事件发生记录</span>
|
|
|
+ <span
|
|
|
+ v-if="$store.state.addr.mapLevel=='district'"
|
|
|
+ >{{$store.state.addr.selectAddr}}各乡镇事件发生记录</span>
|
|
|
+ <span
|
|
|
+ v-if="$store.state.addr.mapLevel=='street'"
|
|
|
+ >{{$store.state.addr.selectAddr}}各村事件发生记录</span>
|
|
|
</div>
|
|
|
<dv-scroll-board
|
|
|
:key="scrollBoardKey"
|
|
@@ -118,7 +124,6 @@
|
|
|
@click="scrollEventClick"
|
|
|
@mouseout="scrollEventOut"
|
|
|
/>
|
|
|
-
|
|
|
</div>
|
|
|
</section>
|
|
|
|
|
@@ -136,7 +141,12 @@
|
|
|
<i class="el-icon-search el-input__icon" slot="suffix" @click="xiaobansearch"></i>
|
|
|
</el-input>
|
|
|
</div>
|
|
|
- <section v-if="showxiaoban||showbase" class="scroll-board-wrap" :class="{close:showScrollBoard==true}" @mouseout="scrollOut">
|
|
|
+ <section
|
|
|
+ v-if="showxiaoban||showbase"
|
|
|
+ class="scroll-board-wrap"
|
|
|
+ :class="{close:showScrollBoard==true}"
|
|
|
+ @mouseout="scrollOut"
|
|
|
+ >
|
|
|
<dv-scroll-board
|
|
|
v-if="showbase"
|
|
|
:key="scrollBoardKey"
|
|
@@ -144,6 +154,7 @@
|
|
|
:config="scrollBaseListConfig"
|
|
|
ref="scrollBaseList"
|
|
|
@click="scrollBaseListClick"
|
|
|
+ @mouseout="baseListClick"
|
|
|
/>
|
|
|
<dv-scroll-board
|
|
|
v-if="showxiaoban"
|
|
@@ -201,7 +212,8 @@ import {
|
|
|
eventList,
|
|
|
smallClassDetail,
|
|
|
smallInfo,
|
|
|
- eventDetail
|
|
|
+ eventDetail,
|
|
|
+ financeBaseDetail
|
|
|
} from '../service/index';
|
|
|
|
|
|
import scrollBoardSchema from '../dataSchema/scrollBoardSchema';
|
|
@@ -217,9 +229,8 @@ import page6Char1Schema from '../dataSchema/page6Char1Schema';
|
|
|
import page6Char2Schema from '../dataSchema/page6Char2Schema';
|
|
|
import scrollEventSchema from '../dataSchema/scrollEventSchema';
|
|
|
|
|
|
-
|
|
|
//柱状图颜色
|
|
|
-let colorArr = ['rgb(2, 238, 255)','rgb(94, 229, 116)','rgb(255, 255, 0)'];
|
|
|
+let colorArr = ['rgb(2, 238, 255)', 'rgb(94, 229, 116)', 'rgb(255, 255, 0)'];
|
|
|
|
|
|
// import { provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus, CodeToText, TextToCode } from 'element-china-area-data';
|
|
|
export default {
|
|
@@ -235,8 +246,8 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- showxiaoban:true,
|
|
|
- showbase:false,
|
|
|
+ showxiaoban: true,
|
|
|
+ showbase: false,
|
|
|
showScrollBoard: false,
|
|
|
page: 1,
|
|
|
// addrOptions: regionDataPlus,
|
|
@@ -255,7 +266,7 @@ export default {
|
|
|
// height: '60vh'
|
|
|
},
|
|
|
scrollBoardConfig: scrollBoardSchema,
|
|
|
- scrollBaseListConfig:scrollBaseListSchema,
|
|
|
+ scrollBaseListConfig: scrollBaseListSchema,
|
|
|
page1numerical: [
|
|
|
{ name: '蓄积量', number: '2309', unit: '立方米' },
|
|
|
{ name: '占地面积', number: '55.4', unit: '万亩' }
|
|
@@ -278,9 +289,9 @@ export default {
|
|
|
page6numerical: [],
|
|
|
page6Char1: page6Char1Schema,
|
|
|
page6Char2: page6Char2Schema,
|
|
|
- scrollEventConfig:scrollEventSchema,
|
|
|
+ scrollEventConfig: scrollEventSchema,
|
|
|
xiaobaninput: '',
|
|
|
- baseinput:''
|
|
|
+ baseinput: ''
|
|
|
};
|
|
|
},
|
|
|
created() {},
|
|
@@ -290,7 +301,7 @@ export default {
|
|
|
setInterval(() => {
|
|
|
this.getPageData();
|
|
|
}, 60000);
|
|
|
- window.onresize=()=>{
|
|
|
+ window.onresize = () => {
|
|
|
//图表resize
|
|
|
if (this.$store.state.addr.page == 'forest') {
|
|
|
let page1Char1Uuid = this.$refs.page1Char1.mid;
|
|
@@ -304,23 +315,20 @@ export default {
|
|
|
|
|
|
let page2Char3Uuid = this.$refs.page2Char3.mid;
|
|
|
this.$refs.page2Char3.resizeChar(page2Char3Uuid);
|
|
|
-
|
|
|
} else if (this.$store.state.addr.page == 'economics') {
|
|
|
let page5Char1Uuid = this.$refs.page5Char1.mid;
|
|
|
this.$refs.page5Char1.resizeChar(page5Char1Uuid);
|
|
|
|
|
|
let page5Char2Uuid = this.$refs.page5Char2.mid;
|
|
|
this.$refs.page5Char2.resizeChar(page5Char2Uuid);
|
|
|
-
|
|
|
} else if (this.$store.state.addr.page == 'event') {
|
|
|
let page6Char1Uuid = this.$refs.page6Char1.mid;
|
|
|
this.$refs.page6Char1.resizeChar(page6Char1Uuid);
|
|
|
|
|
|
let page6Char2Uuid = this.$refs.page6Char2.mid;
|
|
|
this.$refs.page6Char2.resizeChar(page6Char2Uuid);
|
|
|
-
|
|
|
}
|
|
|
- }
|
|
|
+ };
|
|
|
},
|
|
|
watch: {
|
|
|
xiaobaninput: {
|
|
@@ -345,18 +353,13 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- ...mapMutations([
|
|
|
- 'changeSearchSmallClass',
|
|
|
- 'changeEvenData'
|
|
|
- ]),
|
|
|
+ ...mapMutations(['changeSearchSmallClass', 'changeEvenData','changeBaseDetail']),
|
|
|
addrChange(value) {
|
|
|
console.log('addrChange', value);
|
|
|
},
|
|
|
navClick(index) {
|
|
|
let pageName = this.navList[index - 1].en;
|
|
|
- if (
|
|
|
- pageName == 'sink' ||pageName == 'circulation'
|
|
|
- ) {
|
|
|
+ if (pageName == 'sink' || pageName == 'circulation') {
|
|
|
Message('暂未开放!');
|
|
|
return;
|
|
|
}
|
|
@@ -364,17 +367,16 @@ export default {
|
|
|
console.log('this.navList[index-1].en', this.navList[index - 1].en);
|
|
|
this.page = index;
|
|
|
console.log('index', index);
|
|
|
- if(this.navList[index - 1].en=='economics'){
|
|
|
+ if (this.navList[index - 1].en == 'economics') {
|
|
|
this.showbase = true;
|
|
|
this.showxiaoban = false;
|
|
|
- }else if(this.navList[index - 1].en=='event'){
|
|
|
+ } else if (this.navList[index - 1].en == 'event') {
|
|
|
this.showbase = false;
|
|
|
this.showxiaoban = false;
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.showbase = false;
|
|
|
this.showxiaoban = true;
|
|
|
}
|
|
|
-
|
|
|
|
|
|
// 切换专题时,重置区域
|
|
|
// this.$store.dispatch('searchArea', {
|
|
@@ -455,7 +457,7 @@ export default {
|
|
|
//数量过小时隐藏滚动
|
|
|
if (this.page1Char1.xAxis.data.length <= 5) {
|
|
|
this.page1Char1.dataZoom[0].show = false;
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.page1Char1.dataZoom[0].show = true;
|
|
|
}
|
|
|
let charUuid = this.$refs.page1Char1.mid;
|
|
@@ -483,7 +485,7 @@ export default {
|
|
|
//数量过小时隐藏滚动
|
|
|
if (this.page1Char2.xAxis.data.length <= 5) {
|
|
|
this.page1Char2.dataZoom[0].show = false;
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.page1Char2.dataZoom[0].show = true;
|
|
|
}
|
|
|
let charUuid = this.$refs.page1Char2.mid;
|
|
@@ -530,7 +532,7 @@ export default {
|
|
|
console.log('echarts01 err', err);
|
|
|
});
|
|
|
},
|
|
|
- getBaseList(){
|
|
|
+ getBaseList() {
|
|
|
let param = {
|
|
|
baseName: this.baseinput,
|
|
|
cityId: this.$store.state.addr.selectCity.areaId,
|
|
@@ -545,14 +547,14 @@ export default {
|
|
|
let cropName = '';
|
|
|
for (let index = 0; index < cateInfoList.length; index++) {
|
|
|
const item = cateInfoList[index];
|
|
|
- cropName+=item.cropName + ',';
|
|
|
+ cropName += item.cropName + ',';
|
|
|
}
|
|
|
- cropName = cropName.substring(0, cropName.lastIndexOf(","));
|
|
|
+ cropName = cropName.substring(0, cropName.lastIndexOf(','));
|
|
|
this.scrollBaseListConfig.data.push([
|
|
|
element.baseName,
|
|
|
- cropName||'暂无作物',
|
|
|
- element.baseArea+ '亩',
|
|
|
- element.id,
|
|
|
+ cropName || '暂无作物',
|
|
|
+ element.baseArea + '亩',
|
|
|
+ element.id
|
|
|
]);
|
|
|
});
|
|
|
this.scrollBoardKey = Date.now();
|
|
@@ -561,7 +563,7 @@ export default {
|
|
|
console.log('echarts01 err', err);
|
|
|
});
|
|
|
},
|
|
|
- getEventList(){
|
|
|
+ getEventList() {
|
|
|
let param = {
|
|
|
cityId: this.$store.state.addr.selectCity.areaId,
|
|
|
countyId: this.$store.state.addr.selectDistrict.areaId,
|
|
@@ -572,8 +574,8 @@ export default {
|
|
|
this.scrollEventConfig.data = [];
|
|
|
res.rows.forEach((element) => {
|
|
|
this.scrollEventConfig.data.push([
|
|
|
- element.createTime.slice(5,16),
|
|
|
- element.townName+element.villageName,
|
|
|
+ element.createTime.slice(5, 16),
|
|
|
+ element.townName + element.villageName,
|
|
|
this.eventTypeFilter(element.eventType),
|
|
|
// element.createBy,
|
|
|
this.eventStateFilter(element.state),
|
|
@@ -586,22 +588,22 @@ export default {
|
|
|
console.log('getEventList err', err);
|
|
|
});
|
|
|
},
|
|
|
- eventTypeFilter(e){
|
|
|
- if(e=='1'){
|
|
|
- return '火灾'
|
|
|
- }else if(e=='2'){
|
|
|
- return '砍伐'
|
|
|
- }else if(e=='3'){
|
|
|
- return '病虫害'
|
|
|
- }else if(e=='4'){
|
|
|
- return '偷盗林木'
|
|
|
+ eventTypeFilter(e) {
|
|
|
+ if (e == '1') {
|
|
|
+ return '火灾';
|
|
|
+ } else if (e == '2') {
|
|
|
+ return '砍伐';
|
|
|
+ } else if (e == '3') {
|
|
|
+ return '病虫害';
|
|
|
+ } else if (e == '4') {
|
|
|
+ return '偷盗林木';
|
|
|
}
|
|
|
},
|
|
|
- eventStateFilter(e){
|
|
|
- if(e=='0'){
|
|
|
- return '未反馈'
|
|
|
- }else if(e=='1'){
|
|
|
- return '已反馈'
|
|
|
+ eventStateFilter(e) {
|
|
|
+ if (e == '0') {
|
|
|
+ return '未反馈';
|
|
|
+ } else if (e == '1') {
|
|
|
+ return '已反馈';
|
|
|
}
|
|
|
},
|
|
|
getAlarmData() {
|
|
@@ -686,16 +688,16 @@ export default {
|
|
|
obj[next.name] ? '' : (obj[next.name] = true && newArr.push(next));
|
|
|
return newArr;
|
|
|
}, []);
|
|
|
- seriesList = seriesList.map((item,index ) => {
|
|
|
+ seriesList = seriesList.map((item, index) => {
|
|
|
let itemColor = null;
|
|
|
- if(item.name=='杉木'||item.name=='杉'){
|
|
|
- itemColor = colorArr[0]
|
|
|
- }else if(item.name=='马尾松'||item.name=='马'){
|
|
|
- itemColor = colorArr[1]
|
|
|
- }else if(item.name=='软阔'||item.name=='软'){
|
|
|
- itemColor = colorArr[2]
|
|
|
- }else if(item.name=='硬阔'||item.name=='硬'){
|
|
|
- itemColor = colorArr[3]
|
|
|
+ if (item.name == '杉木' || item.name == '杉') {
|
|
|
+ itemColor = colorArr[0];
|
|
|
+ } else if (item.name == '马尾松' || item.name == '马') {
|
|
|
+ itemColor = colorArr[1];
|
|
|
+ } else if (item.name == '软阔' || item.name == '软') {
|
|
|
+ itemColor = colorArr[2];
|
|
|
+ } else if (item.name == '硬阔' || item.name == '硬') {
|
|
|
+ itemColor = colorArr[3];
|
|
|
}
|
|
|
return {
|
|
|
name: item.name,
|
|
@@ -709,7 +711,7 @@ export default {
|
|
|
},
|
|
|
data: [],
|
|
|
itemStyle: {
|
|
|
- normal: { color: itemColor||"auto" },
|
|
|
+ normal: { color: itemColor || 'auto' }
|
|
|
}
|
|
|
};
|
|
|
});
|
|
@@ -731,7 +733,7 @@ export default {
|
|
|
//数量过小时隐藏滚动
|
|
|
if (this.page2Char2.xAxis.data.length <= 5) {
|
|
|
this.page2Char2.dataZoom[0].show = false;
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.page2Char2.dataZoom[0].show = true;
|
|
|
}
|
|
|
|
|
@@ -777,16 +779,16 @@ export default {
|
|
|
obj[next.name] ? '' : (obj[next.name] = true && newArr.push(next));
|
|
|
return newArr;
|
|
|
}, []);
|
|
|
- seriesList = seriesList.map((item,index) => {
|
|
|
+ seriesList = seriesList.map((item, index) => {
|
|
|
let itemColor = null;
|
|
|
- if(item.name=='杉木'||item.name=='杉'){
|
|
|
- itemColor = colorArr[0]
|
|
|
- }else if(item.name=='马尾松'||item.name=='马'){
|
|
|
- itemColor = colorArr[1]
|
|
|
- }else if(item.name=='软阔'||item.name=='软'){
|
|
|
- itemColor = colorArr[2]
|
|
|
- }else if(item.name=='硬阔'||item.name=='硬'){
|
|
|
- itemColor = colorArr[3]
|
|
|
+ if (item.name == '杉木' || item.name == '杉') {
|
|
|
+ itemColor = colorArr[0];
|
|
|
+ } else if (item.name == '马尾松' || item.name == '马') {
|
|
|
+ itemColor = colorArr[1];
|
|
|
+ } else if (item.name == '软阔' || item.name == '软') {
|
|
|
+ itemColor = colorArr[2];
|
|
|
+ } else if (item.name == '硬阔' || item.name == '硬') {
|
|
|
+ itemColor = colorArr[3];
|
|
|
}
|
|
|
return {
|
|
|
name: item.name,
|
|
@@ -800,7 +802,7 @@ export default {
|
|
|
},
|
|
|
data: [],
|
|
|
itemStyle: {
|
|
|
- normal: { color: itemColor||"auto" },
|
|
|
+ normal: { color: itemColor || 'auto' }
|
|
|
}
|
|
|
};
|
|
|
});
|
|
@@ -822,7 +824,7 @@ export default {
|
|
|
//数量过小时隐藏滚动
|
|
|
if (this.page2Char3.xAxis.data.length <= 5) {
|
|
|
this.page2Char3.dataZoom[0].show = false;
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.page2Char3.dataZoom[0].show = true;
|
|
|
}
|
|
|
|
|
@@ -883,7 +885,7 @@ export default {
|
|
|
//数量过小时隐藏滚动
|
|
|
if (this.page5Char1.xAxis.data.length <= 5) {
|
|
|
this.page5Char1.dataZoom[0].show = false;
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.page5Char1.dataZoom[0].show = true;
|
|
|
}
|
|
|
let charUuid = this.$refs.page5Char1.mid;
|
|
@@ -912,7 +914,7 @@ export default {
|
|
|
//数量过小时隐藏滚动
|
|
|
if (this.page5Char2.xAxis.data.length <= 5) {
|
|
|
this.page5Char2.dataZoom[0].show = false;
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.page5Char2.dataZoom[0].show = true;
|
|
|
}
|
|
|
let charUuid = this.$refs.page5Char2.mid;
|
|
@@ -984,7 +986,7 @@ export default {
|
|
|
//数量过小时隐藏滚动
|
|
|
if (this.page6Char1.xAxis.data.length <= 5) {
|
|
|
this.page6Char1.dataZoom[0].show = false;
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.page6Char1.dataZoom[0].show = true;
|
|
|
}
|
|
|
let charUuid = this.$refs.page6Char1.mid;
|
|
@@ -1044,29 +1046,37 @@ export default {
|
|
|
},
|
|
|
scrollBoardClick(e) {
|
|
|
let param = {
|
|
|
- smallNumber: e.row[0],
|
|
|
+ smallNumber: e.row[0]
|
|
|
};
|
|
|
smallInfo(param).then((res) => {
|
|
|
this.changeSearchSmallClass(res.data);
|
|
|
});
|
|
|
},
|
|
|
scrollOut() {
|
|
|
- this.changeSearchSmallClass({name:false});
|
|
|
- },
|
|
|
- scrollBaseListClick(e){
|
|
|
- console.log('scrollBaseListClick',e);
|
|
|
-
|
|
|
+ this.changeSearchSmallClass({ name: false });
|
|
|
},
|
|
|
- scrollEventClick(e,){
|
|
|
+ scrollBaseListClick(e) {
|
|
|
+ console.log('scrollBaseListClick', e);
|
|
|
let param = {
|
|
|
- id: e.row[4],
|
|
|
+ baseId: e.row[3]
|
|
|
};
|
|
|
- eventDetail(param).then( res =>{
|
|
|
- this.changeEvenData(res.data)
|
|
|
+ financeBaseDetail(param).then((res) => {
|
|
|
+ this.changeBaseDetail(res.data)
|
|
|
})
|
|
|
},
|
|
|
+ baseListClick(){
|
|
|
+ this.changeBaseDetail({ name: false })
|
|
|
+ },
|
|
|
+ scrollEventClick(e) {
|
|
|
+ let param = {
|
|
|
+ id: e.row[4]
|
|
|
+ };
|
|
|
+ eventDetail(param).then((res) => {
|
|
|
+ this.changeEvenData(res.data);
|
|
|
+ });
|
|
|
+ },
|
|
|
scrollEventOut() {
|
|
|
- this.changeEvenData({name:false})
|
|
|
+ this.changeEvenData({ name: false });
|
|
|
},
|
|
|
toggleShowScrollBoard() {
|
|
|
this.showScrollBoard = !this.showScrollBoard;
|