Skip to content

D
dxgaqgl-vue
Commit 273cf9c8 authored by 李苏's avatar 李苏 💬
Browse files
Options

首页调整

parent f310a50a
Show whitespace changes
Inline Side-by-side
Showing with 1308 additions and 1042 deletions
src/api/home/homepage.js
View file @ 273cf9c8
import request from '@/utils/request'; import request from 'common/src/utils/request'
/*query */ /*query */
export function fxpcQuery(query) { export function fxpcQuery(query) {
return request({ return request({
......
src/views/threeViolations/homePage/index.vue
View file @ 273cf9c8
<template> <template>
<!-- 外层排版--> <!-- 外层排版-->
<!-- <div class="home-page" id="homePageBody" :style="{ height: height + 'px' }"> --> <!-- <div class="home-page" id="homePageBody" :style="{ height: height + 'px' }"> -->
<div class="min_full" > <div class="min_full">
<div class="home-page full" ref='homePageBody' id="homePageBody" style="overflow: hidden;"> <div class="home-page full" ref='homePageBody' id="homePageBody" style="overflow: hidden;">
<div class="page-homepage" id="homePage" @dblclick="handleDoubleClick" style=""> <div class="page-homepage" id="homePage" @dblclick="handleDoubleClick" style="">
<div class="echarts_nav" id="echarts_nav"> <div class="echarts_nav" id="echarts_nav">
<div class="iconTable" v-for="item in gsList" :key="item.id" @click="bindGsid(item)"> <div class="iconTable" v-for="item in gsList" :key="item.id" @click="bindGsid(item)">
<div class="dv-border-box-10 nav_border" <div class="dv-border-box-10 nav_border"
:style="{color:queryParams1.gsid==item.id?activeStyle.color:'', boxShadow:queryParams1.gsid==item.id?'#00bfff 0px 0px 25px 3px inset':'#204b85 0px 0px 25px 3px inset'}"> :style="{color:(superuser?(queryParams1.gsid==item.id):(queryParams1.bmid==item.id))?activeStyle.color:'', boxShadow:(superuser?(queryParams1.gsid==item.id):(queryParams1.bmid==item.id))?'#00bfff 0px 0px 25px 3px inset':'#204b85 0px 0px 25px 3px inset'}">
<svg width="131" height="37" class="dv-border-svg-container"> <svg width="131" height="37" class="dv-border-svg-container">
<polygon fill="transparent" points=" <polygon fill="transparent" points="
4, 0 127, 0 131, 4 131, 33 127, 37 4, 0 127, 0 131, 4 131, 33 127, 37
4, 37 0, 33 0, 4 4, 37 0, 33 0, 4
"></polygon> "></polygon>
</svg><svg width="150px" height="150px" class="left-top dv-border-svg-container"> </svg><svg width="150px" height="150px" class="left-top dv-border-svg-container">
<polygon points="40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3" :fill="queryParams1.gsid==item.id?'#00BFFF':'#3377CB'"></polygon> <polygon points="40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3"
:fill="(superuser?(queryParams1.gsid==item.id):(queryParams1.bmid==item.id))?'#00BFFF':'#3377CB'"></polygon>
</svg> </svg>
<svg width="150px" height="150px" class="right-top dv-border-svg-container"> <svg width="150px" height="150px" class="right-top dv-border-svg-container">
<polygon points="40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3" :fill="queryParams1.gsid==item.id?'#00BFFF':'#3377CB'"></polygon> <polygon points="40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3"
:fill="(superuser?(queryParams1.gsid==item.id):(queryParams1.bmid==item.id))?'#00BFFF':'#3377CB'"></polygon>
</svg> </svg>
<svg width="150px" height="150px" class="left-bottom dv-border-svg-container"> <svg width="150px" height="150px" class="left-bottom dv-border-svg-container">
<polygon points="40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3" :fill="queryParams1.gsid==item.id?'#00BFFF':'#3377CB'"></polygon> <polygon points="40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3"
:fill="(superuser?(queryParams1.gsid==item.id):(queryParams1.bmid==item.id))?'#00BFFF':'#3377CB'"></polygon>
</svg><svg width="150px" height="150px" class="right-bottom dv-border-svg-container"> </svg><svg width="150px" height="150px" class="right-bottom dv-border-svg-container">
<polygon points="40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3" :fill="queryParams1.gsid==item.id?'#00BFFF':'#3377CB'"></polygon> <polygon points="40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3"
:fill="(superuser?(queryParams1.gsid==item.id):(queryParams1.bmid==item.id))?'#00BFFF':'#3377CB'"></polygon>
</svg> </svg>
<div class="border-box-content"><span class="spanTitle"> <div class="border-box-content"><span class="spanTitle">
<i class="iconfont icon-zhexiantu"></i> {{item.bmmc}} </span> <i class="iconfont icon-zhexiantu"></i> {{item.bmmc}} </span>
...@@ -49,7 +53,8 @@ ...@@ -49,7 +53,8 @@
<el-carousel-item v-for="(item, index) in showList" :key="item.id + index"> <el-carousel-item v-for="(item, index) in showList" :key="item.id + index">
<div class="lbtAll"> <div class="lbtAll">
<div class="sm"> <div class="sm">
<el-tooltip :content="`${item.gsName}${item.bzName || ''}:${item.wzr}:${item.wzxw}`" placement="top"> <el-tooltip :content="`${item.gsName}${item.bzName || ''}:${item.wzr}:${item.wzxw}`"
placement="top">
<span class='infor'> <span class='infor'>
{{ `${item.gsName}${item.bzName || ''}的${item.wzr}做出违章行为:${item.wzxw}` }} {{ `${item.gsName}${item.bzName || ''}的${item.wzr}做出违章行为:${item.wzxw}` }}
</span> </span>
...@@ -101,30 +106,76 @@ ...@@ -101,30 +106,76 @@
601, 10 597, 6 85, 6 81, 10 75, 10 73, 8 41, 8 38, 11 24, 11 13, 21 13, 24"></polygon> 601, 10 597, 6 85, 6 81, 10 75, 10 73, 8 41, 8 38, 11 24, 11 13, 21 13, 24"></polygon>
</svg> </svg>
<svg width="150px" height="150px" class="left-top border"> <svg width="150px" height="150px" class="left-top border">
<polygon points="6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63" fill="#4fd2dd"> <polygon
<animate attributeName="fill" values="#4fd2dd;#235fa7;#4fd2dd" dur="0.5s" begin="0s" repeatCount="indefinite"></animate> points="6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63"
</polygon><polygon points="27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8" fill="#235fa7"> fill="#4fd2dd">
<animate attributeName="fill" values="#235fa7;#4fd2dd;#235fa7" dur="0.5s" begin="0s" repeatCount="indefinite"></animate> <animate attributeName="fill" values="#4fd2dd;#235fa7;#4fd2dd" dur="0.5s" begin="0s"
</polygon><polygon points="9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54" fill="#4fd2dd"> repeatCount="indefinite"></animate>
<animate attributeName="fill" values="#4fd2dd;#235fa7;transparent" dur="1s" begin="0s" repeatCount="indefinite"></animate> </polygon>
</polygon></svg><svg width="150px" height="150px" class="right-top border">
<polygon points="6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63" fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;#4fd2dd" dur="0.5s" begin="0s" repeatCount="indefinite"></animate>
</polygon><polygon points="27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8" fill="#235fa7">
<animate attributeName="fill" values="#235fa7;#4fd2dd;#235fa7" dur="0.5s" begin="0s" repeatCount="indefinite"></animate></polygon>
<polygon points="9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54" fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;transparent" dur="1s" begin="0s" repeatCount="indefinite"></animate>
</polygon></svg><svg width="150px" height="150px" class="left-bottom border">
<polygon points="6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63" fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;#4fd2dd" dur="0.5s" begin="0s" repeatCount="indefinite"></animate></polygon>
<polygon points="27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8" fill="#235fa7"> <polygon points="27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8" fill="#235fa7">
<animate attributeName="fill" values="#235fa7;#4fd2dd;#235fa7" dur="0.5s" begin="0s" repeatCount="indefinite"></animate></polygon> <animate attributeName="fill" values="#235fa7;#4fd2dd;#235fa7" dur="0.5s" begin="0s"
<polygon points="9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54" fill="#4fd2dd"> repeatCount="indefinite"></animate>
<animate attributeName="fill" values="#4fd2dd;#235fa7;transparent" dur="1s" begin="0s" repeatCount="indefinite"></animate></polygon></svg> </polygon>
<svg width="150px" height="150px" class="right-bottom border"><polygon points="6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63" fill="#4fd2dd"> <polygon
<animate attributeName="fill" values="#4fd2dd;#235fa7;#4fd2dd" dur="0.5s" begin="0s" repeatCount="indefinite"></animate></polygon><polygon points="27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8" fill="#235fa7"> points="9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54"
<animate attributeName="fill" values="#235fa7;#4fd2dd;#235fa7" dur="0.5s" begin="0s" repeatCount="indefinite"></animate></polygon><polygon points="9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54" fill="#4fd2dd"> fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;transparent" dur="1s" begin="0s" repeatCount="indefinite"></animate></polygon></svg><div class="border-box-content"> <animate attributeName="fill" values="#4fd2dd;#235fa7;transparent" dur="1s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
</svg><svg width="150px" height="150px" class="right-top border">
<polygon
points="6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63"
fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;#4fd2dd" dur="0.5s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
<polygon points="27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8" fill="#235fa7">
<animate attributeName="fill" values="#235fa7;#4fd2dd;#235fa7" dur="0.5s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
<polygon
points="9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54"
fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;transparent" dur="1s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
</svg><svg width="150px" height="150px" class="left-bottom border">
<polygon
points="6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63"
fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;#4fd2dd" dur="0.5s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
<polygon points="27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8" fill="#235fa7">
<animate attributeName="fill" values="#235fa7;#4fd2dd;#235fa7" dur="0.5s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
<polygon
points="9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54"
fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;transparent" dur="1s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
</svg>
<svg width="150px" height="150px" class="right-bottom border">
<polygon
points="6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63"
fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;#4fd2dd" dur="0.5s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
<polygon points="27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8" fill="#235fa7">
<animate attributeName="fill" values="#235fa7;#4fd2dd;#235fa7" dur="0.5s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
<polygon
points="9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54"
fill="#4fd2dd">
<animate attributeName="fill" values="#4fd2dd;#235fa7;transparent" dur="1s" begin="0s"
repeatCount="indefinite"></animate>
</polygon>
</svg>
<div class="border-box-content">
<div class="realPicture-min"> <div class="realPicture-min">
<div class="realImg"> <div class="realImg">
</div> </div>
...@@ -172,43 +223,53 @@ ...@@ -172,43 +223,53 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
const baseurl = process.env.VUE_APP_BASE_API const baseurl = process.env.VUE_APP_BASE_API
import { import {
tableMixin tableMixin
} from 'common' } from 'common'
import vueSeamlessScroll from 'vue-seamless-scroll' import vueSeamlessScroll from 'vue-seamless-scroll'
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import aqpng from '@/assets/images/aq.png'; import aqpng from '@/assets/images/aq.png';
import gspicture from '@/assets/images/gs.jpg'; import gspicture from '@/assets/images/gs.jpg';
import { import {
doQuery as doQueryfx doQuery as doQueryfx
} from "@/api/riskPrecontrol/riskAnalysis.js"; } from "@/api/riskPrecontrol/riskAnalysis.js";
import { import {
queryYhsbtj as doQueryyh queryYhsbtj as doQueryyh
} from "@/api/dangerManagement/yhslhz.js"; } from "@/api/dangerManagement/yhslhz.js";
import { import {
doQuery as doQueryDcl doQuery as doQueryDcl
} from "@/api/dangerManagement/enterSafetyRecords.js" } from "@/api/dangerManagement/enterSafetyRecords.js"
import { import {
queryBglxFile queryBglxFile
} from '@/api/threeViolations/enterTV.js'; } from '@/api/threeViolations/enterTV.js';
import { import {
doQueryWithFile doQueryWithFile
} from '@/api/basicData/ryq.js'; } from '@/api/basicData/ryq.js';
import {
fxpcQuery,
lzglQuery,
ygczQuery,
yhtjQuery,
yjylQuery,
gsQuery
} from '@/api/home/homepage.js'
import ryqno from '@/assets/images/ryqno.png'
import { var allUserInfo = JSON.parse(sessionStorage.getItem('allUserInfo'));
fxpcQuery, lzglQuery, ygczQuery, yhtjQuery, yjylQuery,gsQuery console.log(allUserInfo, 'allUserInfo')
} from '@/api/home/homepage.js'
import ryqno from '@/assets/images/ryqno.png'
export default { export default {
components: { components: {
vueSeamlessScroll vueSeamlessScroll
...@@ -218,6 +279,9 @@ export default { ...@@ -218,6 +279,9 @@ export default {
gsid() { gsid() {
return this.queryParams1.gsid return this.queryParams1.gsid
}, },
bmid() {
return this.queryParams1.bmid
},
}, },
watch: { watch: {
gsid(val) { gsid(val) {
...@@ -226,13 +290,25 @@ export default { ...@@ -226,13 +290,25 @@ export default {
this.queryParams2.gsid = this.queryParams1.gsid this.queryParams2.gsid = this.queryParams1.gsid
this.doQueryfx() this.doQueryfx()
this.doQueryyh(); this.doQueryyh();
this.postYhzl();//隐患治理 this.postYhzl(); //隐患治理
this.postFxpc();//风险排查 this.postFxpc(); //风险排查
this.postLzgl();//履职管理 this.postLzgl(); //履职管理
this.postYgcz();//员工持证 this.postYgcz(); //员工持证
} }
}, },
height(value){ bmid(val) {
/* 监听公司id*/
if (val) {
this.queryParams2.bmid = this.queryParams1.bmid
this.doQueryfx()
this.doQueryyh();
this.postYhzl(); //隐患治理
this.postFxpc(); //风险排查
this.postLzgl(); //履职管理
this.postYgcz(); //员工持证
}
},
height(value) {
document.addEventListener('fullscreenchange', (event) => { document.addEventListener('fullscreenchange', (event) => {
if (!document.fullscreenElement) { if (!document.fullscreenElement) {
// 全屏已退出 // 全屏已退出
...@@ -256,17 +332,20 @@ export default { ...@@ -256,17 +332,20 @@ export default {
} }
}, },
activated() { activated() {
console.log('activated')
}, },
mounted() { mounted() {
/* 获取当前登录人的信息*/
this.postGs(); this.postGs();
this.$nextTick(() => { this.$nextTick(() => {
this.height=document.getElementById('homePageBody').parentNode.clientHeight; this.height = document.getElementById('homePageBody').parentNode.clientHeight;
this.carHeight=this.height*0.4-60+'px'; this.carHeight = this.height * 0.4 - 60 + 'px';
}) })
window.addEventListener('resize',function (params) { window.addEventListener('resize', function(params) {
}) })
this.fxpcChart = echarts.init(document.getElementById('fxpcChart')) this.fxpcChart = echarts.init(document.getElementById('fxpcChart'))
...@@ -274,32 +353,35 @@ export default { ...@@ -274,32 +353,35 @@ export default {
this.yjylChart = echarts.init(document.getElementById('yjylChart')); this.yjylChart = echarts.init(document.getElementById('yjylChart'));
this.yhzlChart = echarts.init(document.getElementById('yhzlChart')); this.yhzlChart = echarts.init(document.getElementById('yhzlChart'));
this.rfxpcChart = echarts.init(document.getElementById('rfxpcChart')); this.rfxpcChart = echarts.init(document.getElementById('rfxpcChart'));
this.lzglChart= echarts.init(document.getElementById('lzglChart')); this.lzglChart = echarts.init(document.getElementById('lzglChart'));
this.ygzcChart= echarts.init(document.getElementById('ygzcChart')); this.ygzcChart = echarts.init(document.getElementById('ygzcChart'));
doQueryWithFile({}).then(res => { doQueryWithFile({}).then(res => {
this.showListRy = res.data.records || [] this.showListRy = res.data.records || []
}) })
queryBglxFile({}).then(res => { queryBglxFile({}).then(res => {
this.showList = res.data.records || [] this.showList = res.data.records || []
// this.showList=[] // this.showList=[]
}) })
this.postYjyl();//应急演练 this.postYjyl(); //应急演练
}, },
data() { data() {
return { return {
activeStyle:{ orgname: allUserInfo.orgname,
color:"rgb(0, 191, 255)", superuser: allUserInfo.superuser,
boxShadow:"rgb(0, 191, 255) 0px 0px 25px 3px inset;" activeStyle: {
color: "rgb(0, 191, 255)",
boxShadow: "rgb(0, 191, 255) 0px 0px 25px 3px inset;"
}, },
gsList:[], gsList: [],
height:300, height: 300,
showListRy: [], showListRy: [],
queryParams1: { queryParams1: {
grouptype: 'GS', grouptype: 'GS',
rwlx: 'D', rwlx: 'D',
gsid: '', gsid: '',
bmid: '',
ksrq: new Date().getTime(), ksrq: new Date().getTime(),
jsrq: new Date().getTime() jsrq: new Date().getTime()
...@@ -307,33 +389,34 @@ doQueryWithFile({}).then(res => { ...@@ -307,33 +389,34 @@ doQueryWithFile({}).then(res => {
queryParams2: { queryParams2: {
hzfs: 'GS', hzfs: 'GS',
gsid: '', gsid: '',
bmid: '',
ksrq: null, ksrq: null,
jsrq: new Date().getTime() jsrq: new Date().getTime()
}, },
queryParams: { queryParams: {
queryType: 'YHWCL' queryType: 'YHWCL'
// zt:'S' // zt:'S'
}, },
carHeight:"290px", carHeight: "290px",
ryqno: ryqno, ryqno: ryqno,
aqpng: aqpng, aqpng: aqpng,
gspicture:gspicture, gspicture: gspicture,
baseurl: baseurl, baseurl: baseurl,
showList: [], showList: [],
/* dom*/ /* dom*/
fxpcChart: null, fxpcChart: null,
yhclChart: null, yhclChart: null,
yjylChart :null, yjylChart: null,
yhzlChart :null, yhzlChart: null,
rfxpcChart:null, rfxpcChart: null,
lzglChart:null, lzglChart: null,
ygzcChart:null ygzcChart: null
} }
}, },
methods: { methods: {
handleDoubleClick(){ handleDoubleClick() {
this.fullScreen(document.getElementById('homePage')); this.fullScreen(document.getElementById('homePage'));
setTimeout(() => { setTimeout(() => {
this.fxpcChart.resize(); this.fxpcChart.resize();
...@@ -344,8 +427,8 @@ doQueryWithFile({}).then(res => { ...@@ -344,8 +427,8 @@ doQueryWithFile({}).then(res => {
this.lzglChart.resize(); this.lzglChart.resize();
this.ygzcChart.resize(); this.ygzcChart.resize();
this.$nextTick(() => { this.$nextTick(() => {
this.height=document.getElementById('homePageBody').parentNode.clientHeight; this.height = document.getElementById('homePageBody').parentNode.clientHeight;
this.carHeight=this.height*0.4-60+'px'; this.carHeight = this.height * 0.4 - 60 + 'px';
}) })
}, 50); }, 50);
...@@ -369,14 +452,30 @@ doQueryWithFile({}).then(res => { ...@@ -369,14 +452,30 @@ doQueryWithFile({}).then(res => {
} }
} }
}, },
bindGsid(item){ bindGsid(item) {
this.queryParams1.gsid=item.id if (this.superuser) {
delete this.queryParams1.bmid
this.queryParams1.gsid = item.id
} else {
delete this.queryParams1.gsid
this.queryParams1.bmid = item.id
}
}, },
postGs(){ postGs() {
gsQuery().then(res=>{ gsQuery().then(res => {
if(res.success){ if (res.success) {
this.gsList=res.data.records||[]; this.gsList = res.data.records || [];
this.queryParams1.gsid=this.gsList[0]["id"]; /* 判定是否是superuser*/
console.log(this, 'this')
if (this.superuser) {
this.queryParams1.gsid = this.gsList[0]["id"];
} else {
delete this.queryParams1.gsid
this.queryParams1.bmid = this.orgname;
}
} }
}) })
}, },
...@@ -395,6 +494,10 @@ doQueryWithFile({}).then(res => { ...@@ -395,6 +494,10 @@ doQueryWithFile({}).then(res => {
this.queryParams1.ksrq = timestamp; this.queryParams1.ksrq = timestamp;
this.queryParams1.jsrq = new Date().getTime(); this.queryParams1.jsrq = new Date().getTime();
} }
if (!this.superuser) {
delete this.queryParams1.grouptype
this.queryParams1.hzfs = 'BM'
}
doQueryfx(this.queryParams1).then(res => { doQueryfx(this.queryParams1).then(res => {
if (res.success) { if (res.success) {
let value let value
...@@ -414,8 +517,10 @@ doQueryWithFile({}).then(res => { ...@@ -414,8 +517,10 @@ doQueryWithFile({}).then(res => {
}, },
getFirstWeek() { getFirstWeek() {
let nowDate = new Date(); let nowDate = new Date();
let first = nowDate.getDate() - nowDate.getDay() + 1;//getDate()从nowDate对象返回一个月中的某一天;getDay()从nowDate对象返回一周中的某一天 let first = nowDate.getDate() - nowDate.getDay() +
let firstDate = new Date(nowDate.setDate(first)).toUTCString();//setDate()设置nowDate对象中月的某一天;toUTCString()根据世界时，把nowDate对象转换为字符串。 1; //getDate()从nowDate对象返回一个月中的某一天;getDay()从nowDate对象返回一周中的某一天
let firstDate = new Date(nowDate.setDate(first))
.toUTCString(); //setDate()设置nowDate对象中月的某一天;toUTCString()根据世界时，把nowDate对象转换为字符串。
console.log(firstDate); console.log(firstDate);
return firstDate; return firstDate;
}, },
...@@ -451,7 +556,8 @@ doQueryWithFile({}).then(res => { ...@@ -451,7 +556,8 @@ doQueryWithFile({}).then(res => {
yjylQuery().then(res => { yjylQuery().then(res => {
if (res.success) { if (res.success) {
let value = res.data.records ? res.data.records : []; let value = res.data.records ? res.data.records : [];
let seriesData = [], xAxis = []; let seriesData = [],
xAxis = [];
value.forEach(element => { value.forEach(element => {
xAxis.push(element.bmName || ""); xAxis.push(element.bmName || "");
seriesData.push(Number(parseFloat((element.wcl || 0) * 100).toFixed(2))); seriesData.push(Number(parseFloat((element.wcl || 0) * 100).toFixed(2)));
...@@ -460,75 +566,82 @@ doQueryWithFile({}).then(res => { ...@@ -460,75 +566,82 @@ doQueryWithFile({}).then(res => {
this.setBarhart(this.yjylChart, { this.setBarhart(this.yjylChart, {
title: "应急演练", title: "应急演练",
xAxis: xAxis, xAxis: xAxis,
titleShow:true, titleShow: true,
yAxis:[ yAxis: [{
{
type: 'value', type: 'value',
axisTick: { axisTick: {
color:"white" color: "white"
}, },
axisLabel:{ axisLabel: {
color:'white', color: 'white',
formatter:"{value}%", formatter: "{value}%",
}, },
axisLine:{ axisLine: {
lineStyle:{ lineStyle: {
color:'white' color: 'white'
}, },
}, },
splitLine:{ splitLine: {
show:false, show: false,
color:'white' color: 'white'
} }
} }],
], series: [{
series:[
{
name: "完成率", name: "完成率",
type: 'bar', type: 'bar',
barWidth: "60%", barWidth: "60%",
data: seriesData, data: seriesData,
show:true, show: true,
position:"top", position: "top",
itemStyle: { itemStyle: {
color: '#03a9f4' color: '#03a9f4'
}, },
label: { label: {
normal: { normal: {
show: true,//开启显示 show: true, //开启显示
position: 'top',//柱形上方 position: 'top', //柱形上方
textStyle: { //数值样式 textStyle: { //数值样式
color: '#fff' color: '#fff'
}, },
formatter:'{c}%' formatter: '{c}%'
}
} }
} }
] }]
}) })
} }
}) })
}, },
postYhzl(){ postYhzl() {
yhtjQuery({ let params = {
gsid:this.queryParams1.gsid
}).then(res=>{ }
if(res.success){ if (this.superuser) {
params.gsid = this.queryParams1.gsid
} else {
params.bmid = this.queryParams1.bmid
}
yhtjQuery(params).then(res => {
if (res.success) {
let value = res.data.records ? res.data.records : []; let value = res.data.records ? res.data.records : [];
let seriesStyle={ let seriesStyle = {
show:true, position:"top", show: true,
position: "top",
label: { label: {
normal: { normal: {
show: true, show: true,
position: 'top', position: 'top',
color:"white" color: "white"
} }
} }
} }
let seriesData = []; let seriesData = [];
let series = [ let series = [{
{name:"隐患数量",data:[],type:"bar",itemStyle: {color: { name: "隐患数量",
data: [],
type: "bar",
itemStyle: {
color: {
type: 'linear', // 线性渐变 type: 'linear', // 线性渐变
x: 0, x: 0,
y: 0, y: 0,
...@@ -541,8 +654,15 @@ doQueryWithFile({}).then(res => { ...@@ -541,8 +654,15 @@ doQueryWithFile({}).then(res => {
offset: 1, offset: 1,
color: '#08173a' // 100%处的颜色为蓝 color: '#08173a' // 100%处的颜色为蓝
}] }]
}}}, }
{name:"隐患关闭数量",data:[],type:"bar",itemStyle: {color: { }
},
{
name: "隐患关闭数量",
data: [],
type: "bar",
itemStyle: {
color: {
type: 'linear', // 线性渐变 type: 'linear', // 线性渐变
x: 0, x: 0,
y: 0, y: 0,
...@@ -555,8 +675,15 @@ doQueryWithFile({}).then(res => { ...@@ -555,8 +675,15 @@ doQueryWithFile({}).then(res => {
offset: 1, offset: 1,
color: '#11162f' // 100%处的颜色为蓝 color: '#11162f' // 100%处的颜色为蓝
}] }]
}}}, }
{name:"超期未处理",data:[],type:"bar",itemStyle: {color: { }
},
{
name: "超期未处理",
data: [],
type: "bar",
itemStyle: {
color: {
type: 'linear', // 线性渐变 type: 'linear', // 线性渐变
x: 0, x: 0,
y: 0, y: 0,
...@@ -569,8 +696,15 @@ doQueryWithFile({}).then(res => { ...@@ -569,8 +696,15 @@ doQueryWithFile({}).then(res => {
offset: 1, offset: 1,
color: '#11162f' // 100%处的颜色为蓝 color: '#11162f' // 100%处的颜色为蓝
}] }]
}}}, }
{name:"超期已处理",data:[],type:"bar",itemStyle: {color: { }
},
{
name: "超期已处理",
data: [],
type: "bar",
itemStyle: {
color: {
type: 'linear', // 线性渐变 type: 'linear', // 线性渐变
x: 0, x: 0,
y: 0, y: 0,
...@@ -583,46 +717,72 @@ doQueryWithFile({}).then(res => { ...@@ -583,46 +717,72 @@ doQueryWithFile({}).then(res => {
offset: 1, offset: 1,
color: '#11162f' // 100%处的颜色为蓝 color: '#11162f' // 100%处的颜色为蓝
}] }]
}}}, }
], xAxis = []; }
seriesData[0]={...seriesStyle,...series[0]}; },
seriesData[1]={...seriesStyle,...series[1]}; ],
seriesData[2]={...seriesStyle,...series[2]}; xAxis = [];
seriesData[3]={...seriesStyle,...series[3]}; seriesData[0] = {
...seriesStyle,
...series[0]
};
seriesData[1] = {
...seriesStyle,
...series[1]
};
seriesData[2] = {
...seriesStyle,
...series[2]
};
seriesData[3] = {
...seriesStyle,
...series[3]
};
value.forEach(element => { value.forEach(element => {
xAxis.push(element.month+"月"); xAxis.push(element.month + "月");
seriesData[0]["data"].push(element.allCount||0); seriesData[0]["data"].push(element.allCount || 0);
seriesData[1]["data"].push(element.yclCount||0); seriesData[1]["data"].push(element.yclCount || 0);
seriesData[2]["data"].push(element.cqwclCount ||0); seriesData[2]["data"].push(element.cqwclCount || 0);
seriesData[3]["data"].push(element.cqyclCount ||0); seriesData[3]["data"].push(element.cqyclCount || 0);
}); });
this.setBarhart(this.yhzlChart, { this.setBarhart(this.yhzlChart, {
title: "隐患治理", title: "隐患治理",
xAxis: xAxis, xAxis: xAxis,
titleShow:true, titleShow: true,
series:seriesData series: seriesData
}) })
} }
}) })
}, },
postFxpc(){ postFxpc() {
fxpcQuery({ let params = {
gsid:this.queryParams1.gsid
}).then(res=>{ }
if(res.success){ if (this.superuser) {
params.gsid = this.queryParams1.gsid
} else {
params.bmid = this.queryParams1.bmid
}
fxpcQuery(params).then(res => {
if (res.success) {
let value = res.data.records ? res.data.records : []; let value = res.data.records ? res.data.records : [];
let seriesStyle={ let seriesStyle = {
show:true, position:"top", show: true,
position: "top",
label: { label: {
normal: { normal: {
show: true, show: true,
position: 'top', position: 'top',
color:'white' color: 'white'
} }
} }
} }
let seriesData = [ let seriesData = [{
{name:"全部",data:[],type:"bar",itemStyle: {color: { name: "全部",
data: [],
type: "bar",
itemStyle: {
color: {
type: 'linear', // 线性渐变 type: 'linear', // 线性渐变
x: 0, x: 0,
y: 0, y: 0,
...@@ -635,8 +795,16 @@ doQueryWithFile({}).then(res => { ...@@ -635,8 +795,16 @@ doQueryWithFile({}).then(res => {
offset: 1, offset: 1,
color: '#08173a' // 100%处的颜色为蓝 color: '#08173a' // 100%处的颜色为蓝
}] }]
}},...seriesStyle}, }
{name:"完成",data:[],type:"bar",itemStyle: { color: { },
...seriesStyle
},
{
name: "完成",
data: [],
type: "bar",
itemStyle: {
color: {
type: 'linear', // 线性渐变 type: 'linear', // 线性渐变
x: 0, x: 0,
y: 0, y: 0,
...@@ -649,34 +817,39 @@ doQueryWithFile({}).then(res => { ...@@ -649,34 +817,39 @@ doQueryWithFile({}).then(res => {
offset: 1, offset: 1,
color: '#11162f' // 100%处的颜色为蓝 color: '#11162f' // 100%处的颜色为蓝
}] }]
}},...seriesStyle}, }
], xAxis = []; },
let lx={ ...seriesStyle
"D":"昨日", },
"W":"本周", ],
"M":"本月" xAxis = [];
let lx = {
"D": "昨日",
"W": "本周",
"M": "本月"
} }
value.forEach(element => { value.forEach(element => {
xAxis.push(lx[element.lx]); xAxis.push(lx[element.lx]);
seriesData[0]["data"].push(element.allCount||0); seriesData[0]["data"].push(element.allCount || 0);
seriesData[1]["data"].push(element.wcCount||0); seriesData[1]["data"].push(element.wcCount || 0);
}); });
this.setBarhart(this.rfxpcChart, { this.setBarhart(this.rfxpcChart, {
title: "风险排查", title: "风险排查",
xAxis: xAxis, xAxis: xAxis,
series:seriesData series: seriesData
}) })
} }
}) })
}, },
postLzgl(){ postLzgl() {
lzglQuery({ lzglQuery({
gsid:this.queryParams1.gsid gsid: this.queryParams1.gsid
}).then(res=>{ }).then(res => {
if(res.success){ if (res.success) {
let value = res.data.records ? res.data.records : []; let value = res.data.records ? res.data.records : [];
let seriesStyle={ let seriesStyle = {
show:true, position:"top", show: true,
position: "top",
label: { label: {
normal: { normal: {
show: true, show: true,
...@@ -684,19 +857,25 @@ doQueryWithFile({}).then(res => { ...@@ -684,19 +857,25 @@ doQueryWithFile({}).then(res => {
} }
} }
} }
let seriesStyle2={ let seriesStyle2 = {
show:true, position:"top", show: true,
position: "top",
label: { label: {
normal: { normal: {
show: true, show: true,
position: 'top', position: 'top',
formatter:"{c}%" formatter: "{c}%"
}, },
} }
} }
let seriesData = [ let seriesData = [{
{name:"全部",data:[],type:"bar", yAxisIndex: 0,itemStyle: {color: { name: "全部",
data: [],
type: "bar",
yAxisIndex: 0,
itemStyle: {
color: {
type: 'linear', // 线性渐变 type: 'linear', // 线性渐变
x: 0, x: 0,
y: 0, y: 0,
...@@ -709,8 +888,17 @@ doQueryWithFile({}).then(res => { ...@@ -709,8 +888,17 @@ doQueryWithFile({}).then(res => {
offset: 1, offset: 1,
color: '#08173a' // 100%处的颜色为蓝 color: '#08173a' // 100%处的颜色为蓝
}] }]
}},...seriesStyle}, }
{name:"完成",data:[],type:"bar", yAxisIndex: 0,itemStyle: {color: { },
...seriesStyle
},
{
name: "完成",
data: [],
type: "bar",
yAxisIndex: 0,
itemStyle: {
color: {
type: 'linear', // 线性渐变 type: 'linear', // 线性渐变
x: 0, x: 0,
y: 0, y: 0,
...@@ -723,109 +911,164 @@ doQueryWithFile({}).then(res => { ...@@ -723,109 +911,164 @@ doQueryWithFile({}).then(res => {
offset: 1, offset: 1,
color: '#11162f' // 100%处的颜色为蓝 color: '#11162f' // 100%处的颜色为蓝
}] }]
}},...seriesStyle}, }
{name:"完成率",data:[],type:"line", yAxisIndex: 1,itemStyle: {color: '#049bbc'},...seriesStyle2}, },
], xAxis = [],yAxis=[]; ...seriesStyle
let lx={ },
"D":"昨日", {
"W":"本周", name: "完成率",
"M":"本月" data: [],
type: "line",
yAxisIndex: 1,
itemStyle: {
color: '#049bbc'
},
...seriesStyle2
},
],
xAxis = [],
yAxis = [];
let lx = {
"D": "昨日",
"W": "本周",
"M": "本月"
}; };
let yAxisStyle={axisTick: { let yAxisStyle = {
color:"white" axisTick: {
color: "white"
}, },
axisLabel:{ axisLabel: {
color:'white' color: 'white'
}, },
axisLine:{ axisLine: {
lineStyle:{ lineStyle: {
color:'white' color: 'white'
}, },
}, },
splitLine:{ splitLine: {
show:false, show: false,
color:'white' color: 'white'
}} }
yAxis=[{},{}]; }
yAxis[0]={...{ name: "数量",type: "value",position: "left",},...yAxisStyle}; yAxis = [{}, {}];
yAxis[1]={...yAxisStyle,...{ name: "完成率",type: "value",position: "right", axisLabel: { yAxis[0] = {
...{
name: "数量",
type: "value",
position: "left",
},
...yAxisStyle
};
yAxis[1] = {
...yAxisStyle,
...{
name: "完成率",
type: "value",
position: "right",
axisLabel: {
formatter: "{value}%" formatter: "{value}%"
} }
}}; }
};
value.forEach(element => { value.forEach(element => {
xAxis.push(lx[element.lx]); xAxis.push(lx[element.lx]);
seriesData[0]["data"].push(element.allCount||0); seriesData[0]["data"].push(element.allCount || 0);
seriesData[1]["data"].push(element.wcCount||0); seriesData[1]["data"].push(element.wcCount || 0);
let percent=element.allCount?(element.wcCount/element.allCount):0; let percent = element.allCount ? (element.wcCount / element.allCount) : 0;
seriesData[2]["data"].push(Number(parseFloat(percent*100).toFixed(2))); seriesData[2]["data"].push(Number(parseFloat(percent * 100).toFixed(2)));
}); });
this.setBarhart(this.lzglChart, { this.setBarhart(this.lzglChart, {
title: "履职管理", title: "履职管理",
xAxis: xAxis, xAxis: xAxis,
yAxis:yAxis, yAxis: yAxis,
series:seriesData series: seriesData
}) })
} }
}) })
}, },
postYgcz(){ postYgcz() {
ygczQuery({ ygczQuery({
gsid:this.queryParams1.gsid gsid: this.queryParams1.gsid
}).then(res=>{ }).then(res => {
if(res.success){ if (res.success) {
let value = res.data.records ? res.data.records : []; let value = res.data.records ? res.data.records : [];
let seriesStyle={ let seriesStyle = {
show:true, position:"top", show: true,
position: "top",
label: { label: {
normal: { normal: {
show: true, show: true,
position: 'top', position: 'top',
color:'white' color: 'white'
} }
} }
}; };
let yAxisStyle={axisTick: { let yAxisStyle = {
color:"white", axisTick: {
show:false color: "white",
}, show: false
axisLabel:{ },
color:'white', axisLabel: {
show:false color: 'white',
}, show: false
axisLine:{ },
show:false, axisLine: {
lineStyle:{ show: false,
color:'white' lineStyle: {
}, color: 'white'
}, },
splitLine:{ },
show:false, splitLine: {
color:'white' show: false,
}} color: 'white'
let seriesData = [ }
{name:"持证人数",data:[],type:"bar",barWidth:20, stack: 'total',itemStyle: {color: "#334284"},...seriesStyle}, }
{name:"即将到期",data:[],type:"bar",barWidth:20, stack: 'total',itemStyle: {color: ""},...seriesStyle}, let seriesData = [{
], xAxis = []; name: "持证人数",
data: [],
type: "bar",
barWidth: 20,
stack: 'total',
itemStyle: {
color: "#334284"
},
...seriesStyle
},
{
name: "即将到期",
data: [],
type: "bar",
barWidth: 20,
stack: 'total',
itemStyle: {
color: ""
},
...seriesStyle
},
],
xAxis = [];
value.forEach(element => { value.forEach(element => {
xAxis.push(element.flName); xAxis.push(element.flName);
seriesData[0]["data"].push(element.allCount-element.dqCount||0); seriesData[0]["data"].push(element.allCount - element.dqCount || 0);
seriesData[1]["data"].push(element.dqCount||0); seriesData[1]["data"].push(element.dqCount || 0);
}); });
this.setBarhart(this.ygzcChart, { this.setBarhart(this.ygzcChart, {
title: "员工持证", title: "员工持证",
titleShow:true, titleShow: true,
yAxis: { yAxis: {
name:"种类", name: "种类",
data:xAxis, data: xAxis,
show:false, show: false,
type:"category",...yAxisStyle type: "category",
...yAxisStyle
}, },
customxAxis:{ customxAxis: {
type:"value", type: "value",
boundaryGap: [0, 0.01],...yAxisStyle boundaryGap: [0, 0.01],
...yAxisStyle
}, },
series:seriesData series: seriesData
}) })
} }
}) })
...@@ -847,11 +1090,10 @@ doQueryWithFile({}).then(res => { ...@@ -847,11 +1090,10 @@ doQueryWithFile({}).then(res => {
fontWeight: 400, fontWeight: 400,
align: 'center', align: 'center',
verticalAlign: 'middle', verticalAlign: 'middle',
color:'white' color: 'white'
} }
}, },
series: [ series: [{
{
axisLine: { axisLine: {
lineStyle: { lineStyle: {
width: 6, width: 6,
...@@ -881,14 +1123,11 @@ doQueryWithFile({}).then(res => { ...@@ -881,14 +1123,11 @@ doQueryWithFile({}).then(res => {
} }
}, },
data: [ data: [{
{
value: setting.value, value: setting.value,
name: setting.name name: setting.name
} }]
] }]
}
]
} }
/* 渲染dom*/ /* 渲染dom*/
chartDom.setOption(option); chartDom.setOption(option);
...@@ -899,7 +1138,7 @@ doQueryWithFile({}).then(res => { ...@@ -899,7 +1138,7 @@ doQueryWithFile({}).then(res => {
/* 基础配置*/ /* 基础配置*/
let option = { let option = {
title: { title: {
show: setting.titleShow||false, show: setting.titleShow || false,
text: setting.title || "", text: setting.title || "",
top: 20, top: 20,
left: "center", left: "center",
...@@ -908,7 +1147,7 @@ doQueryWithFile({}).then(res => { ...@@ -908,7 +1147,7 @@ doQueryWithFile({}).then(res => {
fontWeight: 600, fontWeight: 600,
align: 'center', align: 'center',
verticalAlign: 'middle', verticalAlign: 'middle',
color:'white' color: 'white'
} }
}, },
tooltip: { tooltip: {
...@@ -921,54 +1160,50 @@ doQueryWithFile({}).then(res => { ...@@ -921,54 +1160,50 @@ doQueryWithFile({}).then(res => {
left: '3%', left: '3%',
right: '4%', right: '4%',
bottom: '3%', bottom: '3%',
top:'20%', top: '20%',
containLabel: true containLabel: true
}, },
xAxis: setting.customxAxis||[ xAxis: setting.customxAxis || [{
{
type: 'category', type: 'category',
data: setting.xAxis, data: setting.xAxis,
axisTick: { axisTick: {
alignWithLabel: true, alignWithLabel: true,
color:"white" color: "white"
}, },
axisLabel:{ axisLabel: {
color:'white', color: 'white',
interval: 0, // 横轴信息全部显示 interval: 0, // 横轴信息全部显示
}, },
axisLine:{ axisLine: {
lineStyle:{ lineStyle: {
color:'white' color: 'white'
}, },
}, },
splitLine:{ splitLine: {
show:false, show: false,
color:'white' color: 'white'
}
} }
], }],
yAxis: setting.yAxis||[ yAxis: setting.yAxis || [{
{
type: 'value', type: 'value',
axisTick: { axisTick: {
color:"white" color: "white"
}, },
axisLabel:{ axisLabel: {
color:'white' color: 'white'
}, },
axisLine:{ axisLine: {
lineStyle:{ lineStyle: {
color:'white' color: 'white'
}, },
}, },
splitLine:{ splitLine: {
show:false, show: false,
color:'white' color: 'white'
} }
} }],
], series: setting.series || []
series: setting.series||[]
} }
/* 渲染dom*/ /* 渲染dom*/
chartDom.setOption(option); chartDom.setOption(option);
...@@ -977,35 +1212,35 @@ doQueryWithFile({}).then(res => { ...@@ -977,35 +1212,35 @@ doQueryWithFile({}).then(res => {
} }
} }
</script> </script>
<style lang="scss" scope> <style lang="scss" scope>
.listf { .listf {
float: right; float: right;
} }
.ztcxxx { .ztcxxx {
height: 60px; height: 60px;
width: 100%; width: 100%;
} }
.chart { .chart {
width: 100%; width: 100%;
height: calc(300px - 60px - 30px); height: calc(300px - 60px - 30px);
} }
.homePage { .homePage {
width: 35%; width: 35%;
height: 100%; height: 100%;
} }
.nodata { .nodata {
background-image: url('/src/assets/image/aq.svg'); background-image: url('/src/assets/image/aq.svg');
} }
.lbt { .lbt {
height: 100%; height: 100%;
width: 100%; width: 100%;
...@@ -1035,24 +1270,25 @@ doQueryWithFile({}).then(res => { ...@@ -1035,24 +1270,25 @@ doQueryWithFile({}).then(res => {
} }
} }
} }
} }
.el-carousel__item:nth-child(2n) { .el-carousel__item:nth-child(2n) {
background-color: #99a9bf; background-color: #99a9bf;
} }
.el-carousel__item:nth-child(2n+1) { .el-carousel__item:nth-child(2n+1) {
background-color: #d3dce6; background-color: #d3dce6;
} }
.page-homepage { .page-homepage {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
display: flex; display: flex;
background: url('~@/assets/images/background.jpg') no-repeat 50%; background: url('~@/assets/images/background.jpg') no-repeat 50%;
background-size: 100% 100%; background-size: 100% 100%;
.echarts_nav{
.echarts_nav {
width: 85%; width: 85%;
height: 48px; height: 48px;
display: flex; display: flex;
...@@ -1061,62 +1297,73 @@ doQueryWithFile({}).then(res => { ...@@ -1061,62 +1297,73 @@ doQueryWithFile({}).then(res => {
position: absolute; position: absolute;
top: 0; top: 0;
left: 3%; left: 3%;
.iconTable{
.iconTable {
text-align: center; text-align: center;
align-items: center; align-items: center;
width: 100%; width: 100%;
height: 70%; height: 70%;
margin-left: .5%; margin-left: .5%;
cursor: pointer; cursor: pointer;
.nav_border { .nav_border {
text-align: center; text-align: center;
height: 100%; height: 100%;
width: 100%; width: 100%;
color: #fff; color: #fff;
position: relative; position: relative;
.dv-border-svg-container { .dv-border-svg-container {
position: absolute; position: absolute;
display: block; display: block;
} }
.right-top { .right-top {
right: 0; right: 0;
transform: rotateY(180deg); transform: rotateY(180deg);
} }
.left-bottom { .left-bottom {
bottom: 0; bottom: 0;
transform: rotateX(180deg); transform: rotateX(180deg);
} }
.right-bottom { .right-bottom {
right: 0; right: 0;
bottom: 0; bottom: 0;
transform: rotateX(180deg) rotateY(180deg); transform: rotateX(180deg) rotateY(180deg);
} }
.border-box-content{
.border-box-content {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
.spanTitle { .spanTitle {
display: flex; display: flex;
width: 100%; width: 100%;
height: 100%; height: 100%;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.icon-zhexiantu{
.icon-zhexiantu {
margin: 0 1% 0 0; margin: 0 1% 0 0;
color: #fff; color: #fff;
font-size: 22px; font-size: 22px;
} }
} }
} }
} }
} }
} }
.echart-body{
height: calc( 100% - 48px); .echart-body {
height: calc(100% - 48px);
width: 100%; width: 100%;
margin-top: 48px; margin-top: 48px;
// display: flex; // display: flex;
} }
.page-left { .page-left {
// flex: 1; // flex: 1;
width: 25%; width: 25%;
...@@ -1128,10 +1375,12 @@ doQueryWithFile({}).then(res => { ...@@ -1128,10 +1375,12 @@ doQueryWithFile({}).then(res => {
width: 100%; width: 100%;
height: 30%; height: 30%;
} }
.page-left-4{
.page-left-4 {
width: 100%; width: 100%;
height: 40%; height: 40%;
} }
.page-left-t { .page-left-t {
display: flex; display: flex;
...@@ -1158,33 +1407,40 @@ doQueryWithFile({}).then(res => { ...@@ -1158,33 +1407,40 @@ doQueryWithFile({}).then(res => {
.page-center-t { .page-center-t {
width: 100%; width: 100%;
height: 70%; height: 70%;
.dv-border-box-1 { .dv-border-box-1 {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
.border { .border {
position: absolute; position: absolute;
display: block; display: block;
} }
.right-top { .right-top {
right: 0; right: 0;
transform: rotateY(180deg); transform: rotateY(180deg);
} }
.left-bottom { .left-bottom {
bottom: 0; bottom: 0;
transform: rotateX(180deg); transform: rotateX(180deg);
} }
.right-bottom { .right-bottom {
right: 0; right: 0;
bottom: 0; bottom: 0;
transform: rotateX(180deg) rotateY(180deg); transform: rotateX(180deg) rotateY(180deg);
} }
.border-box-content { .border-box-content {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.realPicture-min{
.realPicture-min {
width: 95%; width: 95%;
height: 95%; height: 95%;
position: absolute; position: absolute;
...@@ -1193,6 +1449,7 @@ doQueryWithFile({}).then(res => { ...@@ -1193,6 +1449,7 @@ doQueryWithFile({}).then(res => {
right: 0; right: 0;
left: 0; left: 0;
margin: auto; margin: auto;
.realImg { .realImg {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -1201,10 +1458,11 @@ doQueryWithFile({}).then(res => { ...@@ -1201,10 +1458,11 @@ doQueryWithFile({}).then(res => {
display: block; display: block;
background: url('~@/assets/images/gs.jpg'); background: url('~@/assets/images/gs.jpg');
background-size: 100% 100%; background-size: 100% 100%;
}
} }
} }
} }
}
.page-center-b { .page-center-b {
width: 100%; width: 100%;
height: 30%; height: 30%;
...@@ -1222,21 +1480,26 @@ doQueryWithFile({}).then(res => { ...@@ -1222,21 +1480,26 @@ doQueryWithFile({}).then(res => {
width: 100%; width: 100%;
height: 30%; height: 30%;
} }
.page-right-c{
.page-right-c {
width: 100%; width: 100%;
height: 40%; height: 40%;
} }
} }
.chart-auto{
width: 100%;height: 100%; .chart-auto {
width: 100%;
height: 100%;
} }
.yhzl-big-box{
.yhzl-big-box {
width: 100%; width: 100%;
height: 100%; height: 100%;
color: #fff; color: #fff;
background:url('~@/assets/images/bc.png') no-repeat rgba(3,15,42,.7) 100% .5%; background: url('~@/assets/images/bc.png') no-repeat rgba(3, 15, 42, .7) 100% .5%;
background-size: 100% 13%; background-size: 100% 13%;
.yhzl-big-box-title{
.yhzl-big-box-title {
width: 100%; width: 100%;
height: 13%; height: 13%;
display: block; display: block;
...@@ -1245,15 +1508,18 @@ doQueryWithFile({}).then(res => { ...@@ -1245,15 +1508,18 @@ doQueryWithFile({}).then(res => {
padding: .5% 0 0 5%; padding: .5% 0 0 5%;
box-sizing: border-box; box-sizing: border-box;
} }
.echarts{
.echarts {
width: 100%; width: 100%;
height: 83%; height: 83%;
margin: 1% 0 0 0; margin: 1% 0 0 0;
} }
.el-carousel__container{
height: 100%!important; .el-carousel__container {
height: 100% !important;
}
} }
}
}</style> }
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment