Commit 32dd9971 authored by jianqian's avatar jianqian

企业统计更新,一起一档修改

parent 2da12654
<template>
<div class="wrapper enseDetail">
<div class="flexBox">
<div class="flexBox-item">
<div class="enterDetail">
<div class="flexBox-item" style="width: 40%">
<div class="enterDetail" >
<h3>*企业注册信息*</h3>
<div class="enterDetail-item">
<span class="itit">单位名称必填:</span>
{{ editForm.unitName }}
</div>
<div class="enterDetail-item">
<span class="itit">统一社会信用代码:</span>
{{ editForm.orgCode }}
</div>
<div class="enterDetail-item">
<span class="itit">法定代表人:</span>
{{ editForm.legalPerson }}
</div>
<div class="enterDetail-item">
<span class="itit">法人邮箱:</span>
{{ editForm.legalPersonEmail }}
</div>
<div class="enterDetail-item">
<span class="itit">所属区域:</span>
<City :valueqv="cityval" :disabled="true"></City>
</div>
<div class="enterDetail-item">
<span class="itit">所属街道:</span>
{{ editForm.streetName }}
</div>
<div class="enterDetail-item">
<span class="itit">单位注册地址:</span>
{{ editForm.regAddress }}
</div>
<div class="enterDetail-item">
<span class="itit">生产经营地址:</span>
{{ editForm.runAddress }}
<div style="display:flex;flex-direction:row;justify-content:flex-start;">
<div class="enterDetail-item">
<span class="itit">单位名称必填:</span>
{{ editForm.unitName }}
</div>
<div class="enterDetail-item">
<span class="itit">统一社会信用代码:</span>
{{ editForm.orgCode }}
</div>
</div>
<div class="enterDetail-item">
<span class="itit">法人手机:</span>
{{ editForm.legalPersonPhone }}
<div style="display:flex;flex-direction:row;justify-content:flex-start;">
<div class="enterDetail-item">
<span class="itit">法定代表人:</span>
{{ editForm.legalPerson }}
</div>
<div class="enterDetail-item">
<span class="itit">法人手机:</span>
{{ editForm.legalPersonPhone }}
</div>
</div>
<div class="enterDetail-item">
<span class="itit">营业执照:</span>
<span class="dbtn sd qiCr" v-if="editForm.viewOrgFilePath" @click="checkFile(editForm.viewOrgFilePath)">
<div style="display:flex;flex-direction:row;justify-content:flex-start;">
<div class="enterDetail-item">
<span class="itit">所属区域:</span>
<City :valueqv="cityval" :disabled="true"></City>
</div>
<div class="enterDetail-item">
<span class="itit">营业执照:</span>
<span class="dbtn sd qiCr" v-if="editForm.viewOrgFilePath" @click="checkFile(editForm.viewOrgFilePath)">
<i class="el-icon el-icon-view"></i>查看
</span>
</div>
</div>
<div class="enterDetail-item">
<span class="itit">授权书:</span>
<span class="dbtn sd qiCr" v-if="editForm.viewAuthorizeFile" @click="checkFile(editForm.viewAuthorizeFile)">
<i class="el-icon el-icon-view"></i>查看
</span>
<span class="itit">单位注册地址:</span>
{{ editForm.regAddress }}
</div>
<div class="enterDetail-item">
<span class="itit">管理员姓名:</span>
{{ editForm.userName }}
<div class="link-top"></div>
<span class="itit" style="font-weight:900 ">隐患列表:</span>
<el-table
:data="tableData2"
max-height="110"
border
size="mini"
style="width: 100%;">
<el-table-column
prop="troubleName"
label="隐患名称"
width="150">
</el-table-column>
<el-table-column
prop="troubleType"
label="隐患类型"
width="100">
</el-table-column>
<el-table-column
prop="troubleLevel"
label="等级"
width="100">
</el-table-column>
<el-table-column
prop="address"
label="地址">
</el-table-column>
</el-table>
</div>
<div class="link-top"></div>
<div class="enterDetail-item">
<span class="itit">管理员身份证:</span>
{{ editForm.idCard }}
<span class="itit" style="font-weight:900 ">危险源列表:</span>
<el-table
:data="tableData3"
max-height="110"
border
size="mini"
style="width: 100%;">
<el-table-column
prop="goodsName"
label="名称"
width="150">
</el-table-column>
<el-table-column
prop="number"
label="设备编号"
width="100">
</el-table-column>
<el-table-column
prop="dangerGrade"
label="等级"
width="100">
</el-table-column>
<el-table-column
prop="factoryLocation"
label="厂区位置">
</el-table-column>
</el-table>
</div>
<div class="link-top"></div>
<div class="enterDetail-item">
<span class="itit">管理员Email:</span>
{{ editForm.email }}
<span class="itit" style="font-weight:900 ">职业危害场所:</span>
<el-table
:data="tableData4"
max-height="110"
border
size="mini"
style="width: 100%;">
<el-table-column
prop="placeName"
label="场所名称"
width="150">
</el-table-column>
<el-table-column
prop="placeType"
label="类型"
width="100">
</el-table-column>
<el-table-column
prop="harmLevel"
label="等级"
width="100">
</el-table-column>
<el-table-column
prop="address"
label="地址">
</el-table-column>
</el-table>
</div>
<div class="link-top"></div>
<div class="enterDetail-item">
<span class="itit">管理员手机:</span>
{{ editForm.mobliePhone }}
<span class="itit" style="font-weight:900 ">监控检测点位:</span>
<el-table
:data="tableData1"
max-height="110"
border
border-radius="6px"
size="mini"
style="width: 100%;">
<el-table-column
prop="deviceName"
label="设备名称"
width="150">
</el-table-column>
<el-table-column
prop="deviceNumber"
label="设备编号:"
width="250">
</el-table-column>
<el-table-column
prop="factoryLocation"
label="所在位置">
</el-table-column>
</el-table>
</div>
<div class="link-top"></div>
<h3>
<span class="dbtn dg fr" @click="$router.go(-1)">
<i class="el-icon-d-arrow-left"></i> 返回上一页
</span>
</h3>
<div style="height: 40px;">
</div>
</div>
</div>
<div class="flexBox-item">
<div class="flexBox-item" style="width: 60%">
<el-row>
<el-checkbox @change="handleCheckAllChange" :indeterminate="isIndeterminate" v-model="checkAll">全选</el-checkbox>
<el-checkbox-group v-model="checkList" @change="CheckChange">
......@@ -165,7 +258,10 @@ export default class EnseListDetail extends Vue {
@Provide() mapData: any = [];
@Provide() windowsArr: any = [];
@Provide() currentWindow: any = "";
@Provide() tableData1 : any = [];
@Provide() tableData2 : any = [];
@Provide() tableData3 : any = [];
@Provide() tableData4 : any = [];
@Provide() toolobj: any;
@Provide() mouseTool: any; //测量工具
@Provide() toolVisble: boolean = false;
......@@ -225,6 +321,11 @@ export default class EnseListDetail extends Vue {
let res3: any = alldata.goodsList;
let res4: any = alldata.harmPlace;
that.mapData = [...res1, ...res2, ...res3, ...res4];
console.log(res1)
this.tableData1=res1;
this.tableData2=res2;
this.tableData3=res3;
this.tableData4=res4;
let mapData = [...res1, ...res2, ...res3, ...res4];
let latSum = 0;
let lngSum = 0;
......@@ -490,11 +591,28 @@ main>div {
padding-left: 10px;
border-left: 1px solid #eeeeee;
}
.link-top {
width: 110%;
margin-left: -10px;
margin-top: 2px;
height: 1px;
border-top: solid #ACC0D8 3px;
}
</style><style lang="scss" scoped>
.enterDetail {
border: none;
border:1px solid #CDCDCD;
overflow-y:auto;
}
::-webkit-scrollbar {
width: 6px; /* 滚动条宽度, width:对应竖滚动条的宽度 height:对应横滚动条的高度*/
}
/*定义滑块 样式*/
::-webkit-scrollbar-thumb {
border-radius: 3px;
height: 100px; /* 滚动条滑块长度 */
background-color: #ccc;
}
.enterDetail .enterDetail-item {
width: 100%;
}
......
......@@ -5,30 +5,48 @@
<div style ="display:flex;flex-direction:row;justify-content:flex-start;">
<div style="width: 24%;height:700px;" >
<div class="qiyetitle">企业列表</div>
<div class="qiyelist" style="letter-spacing:1px;" :id="item.enterpriseId" @click="showqiye(item.enterpriseId)" v-for="(item, index) in tableData.pageData" :key="index">
{{item.unitName}}
<div style ="display:flex;flex-direction:row;justify-content:flex-start;margin-bottom: 20px;margin-left: 20px">
<el-input v-model="searchData.unitName" placeholder="请输入资源名称"></el-input>
<el-button type="primary" @click="searchFun()">
<i class="el-icon-search"></i> 搜索
</el-button>
</div>
<div style="max-height:400px;background: #f3fafc;margin-left: 20px;margin-bottom:20px; ">
<div class="qiyelist" style="letter-spacing:1px;" :id="item.enterpriseId" @click="showqiye(item.enterpriseId)" v-for="(item, index) in tableData.pageData" :key="index">
<div style="margin-left: 10px;cursor: pointer;">{{item.unitName}}</div>
</div>
</div>
<el-pagination
background
layout="total, prev, pager, next"
:total="tableData.total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="PAGE.page"
:page-size="PAGE.size"
></el-pagination>
</div>
<div style="width: 75%">
<div style="width: 100%;height: 10em;">
<div class="el-tab-pane-div second-div" style="" style="cursor:pointer;">
<div class="el-tab-pane-div second-div" @click="showList(1)" style="cursor:pointer;">
<div style="width: 40%;height: 100%; text-align: center;float: left;font-size: 15px;">
<img src="../../assets/logo2.png" width="25%" style="margin-top: 2rem;">
<img src="../../assets/shigunum.png" width="25%" style="margin-top: 2rem;">
<p>事故总次数</p>
</div>
<div style="width: 60%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{totalOne}}</div>
</div>
<div class="el-tab-pane-div second-div" style="" style="cursor:pointer;">
<div class="el-tab-pane-div second-div" @click="showList(2)" style="cursor:pointer;">
<div style="width: 40%;height: 100%; text-align: center;float: left;font-size: 15px;">
<img src="../../assets/z-zhuce.png" width="25%" style="margin-top: 2rem;">
<img src="../../assets/yujingnum.png" width="25%" style="margin-top: 2rem;">
<p>设备预警总次数</p>
</div>
<div style="width: 60%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{totalTwo}}</div>
</div>
<!--<div class="el-tab-pane-div second-div" style="" @click="showList(3)" style="cursor:pointer;">-->
<!--<div class="el-tab-pane-div second-div" style="" @click="showList(1)" style="cursor:pointer;">-->
<!--<div style="width: 40%;height: 100%; text-align: center;float: left;font-size: 15px;">-->
<!--<img src="../../assets/z-shenhe.png" width="25%" style="margin-top: 2rem;">-->
<!--<p>待审批数量</p>-->
<!--<img src="../../assets/logo2.png" width="25%" style="margin-top: 2rem;">-->
<!--<p>危险源总数量</p>-->
<!--</div>-->
<!--<div style="width: 60%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{tjNumberObj.enterpriseCheckIngNum}}</div>-->
<!--</div>-->
......@@ -107,64 +125,28 @@
</el-tab-pane>
<el-dialog :visible.sync="dialogVisible1" title="危险源列表">
<el-table :data="tjNumberObj.goodsList" stripe border style="width:100%;" :loading="loading" max-height="530px">
<el-table :data="tjNumberObj.pageData" stripe border style="width:100%;" :loading="loading" max-height="530px">
<el-table-column width="50px" type="index" label="序号"></el-table-column>
<el-table-column prop="goodsName" label="危险源名称"></el-table-column>
<el-table-column prop="unitName" label="所属企业"></el-table-column>
<el-table-column prop="category" label="物品类型"></el-table-column>
<el-table-column prop="dangerGrade" label="危险等级"></el-table-column>
<el-table-column prop="isBigDanger" label="是否重大危险源">
<template slot-scope="scope">
<span v-if="scope.row.isBigDanger == 0"></span>
<span v-if="scope.row.isBigDanger == 1"></span>
</template>
<el-table-column prop="accidentText" label="事故简述"></el-table-column>
<el-table-column prop="accidentReason" label="事故原因"></el-table-column>
<el-table-column prop="accidentLevel" label="事故等级"></el-table-column>
<el-table-column prop="accidentTime" label="事故时间"></el-table-column>
<el-table-column prop="createTime" label="创建时间">
</el-table-column>
<el-table-column prop="contacts" label="联系人"></el-table-column>
<el-table-column prop="phone" label="电话"></el-table-column>
</el-table>
</el-dialog>
<el-dialog :visible.sync="dialogVisible2" title="注册企业列表">
<el-table :data="tjNumberObj.enterpriseList" stripe border style="width:100%;" :loading="loading" max-height="530px">
<el-table :data="tjNumberObj2.pageData" stripe border style="width:100%;" :loading="loading" max-height="530px">
<el-table-column width="50px" type="index" label="序号"></el-table-column>
<el-table-column prop="unitName" label="企业名称"></el-table-column>
<el-table-column width="100px" prop="legalPerson" label="企业法人"></el-table-column>
<el-table-column width="200px" prop="orgCode" label="统一社会信用代码"></el-table-column>
<el-table-column prop="legalPersonEmail" label="法人邮箱"></el-table-column>
<el-table-column prop="regulationBigType" label="监管分类">
<template slot-scope="scope">
<span v-if="scope.row.regulationBigType == 1">非煤矿山</span>
<span v-if="scope.row.regulationBigType == 2">危险化学品</span>
<span v-if="scope.row.regulationBigType == 3">冶金</span>
<span v-if="scope.row.regulationBigType == 4">有色</span>
<span v-if="scope.row.regulationBigType == 5">建材</span>
<span v-if="scope.row.regulationBigType == 6">机械</span>
<span v-if="scope.row.regulationBigType == 7">轻工</span>
<span v-if="scope.row.regulationBigType == 8">纺织</span>
<span v-if="scope.row.regulationBigType == 9">商贸</span>
<span v-if="scope.row.regulationBigType == 10">其他</span>
</template>
</el-table-column>
<el-table-column prop="accountStatus" label="账号状态">
<template slot-scope="scope">
<font v-if="scope.row.accountStatus === '0'" class="colorM">
<i class="iconfont iconzhengchang"></i> 正常
</font>
<font v-else-if="scope.row.accountStatus == 2" class="colorP">
<i class="iconfont iconsuoding"></i> 已锁定
</font>
<font v-else-if="scope.row.accountStatus == 1" class="colorR">
<i class="iconfont iconicon_huabanfuben"></i> 已删除
</font>
<font v-else-if="scope.row.accountStatus == 3" class="colorP">
<i class="iconfont iconshenhe"></i> 审核中
</font>
<font v-else-if="scope.row.accountStatus == 4" class="colorR">
<i class="iconfont iconweitongguo"></i> 审核未通过
</font>
</template>
</el-table-column>
<el-table-column width="150px" prop="alarmInfo" label="预警名称"></el-table-column>
<el-table-column width="100px" prop="alarmType" label="报警类型"></el-table-column>
<el-table-column width="100px" prop="remarks" label="预警设备"></el-table-column>
<el-table-column width="100px" prop="reportValue" label="上报数值"></el-table-column>
<el-table-column prop="alarmTime" label="报警时间"></el-table-column>
</el-table>
</el-dialog>
......@@ -249,6 +231,7 @@ export default class EnterprisesMg extends Vue {
@Provide() loading: Boolean = false;
@Provide() cityval: any = [];
@Provide() tjNumberObj: any = {};
@Provide() tjNumberObj2: any = {};
@Provide() totalOne: string = 0;
@Provide() totalTwo: string = 0
//编辑组件
......@@ -262,8 +245,10 @@ export default class EnterprisesMg extends Vue {
showList(type: any){
if(type == 1){
this.dialogVisible1 = true;
this.getStatiData(this.idcolor);
}else if(type == 2){
this.dialogVisible2 = true;
this.getStatiData2(this.idcolor);
}else if(type == 3){
this.dialogVisible3 = true;
}
......@@ -271,8 +256,8 @@ export default class EnterprisesMg extends Vue {
showqiye(id){
if(this.idcolor!=''){
document.getElementById(this.idcolor).style.background="";
document.getElementById(this.idcolor).style.color="#000";
}
document.getElementById(id).style.background="#00008B";
this.idcolor= id;
this.getData();
}
......@@ -288,17 +273,19 @@ export default class EnterprisesMg extends Vue {
that.loading = false;
if (res.code == 0) {
that.tableData = res.data;
console.log(that.tableData.pageData)
if(that.tableData.pageData.length>0){
that.showqiye(that.tableData.pageData[0].enterpriseId);
}
}
}
);
}
getStatiData() {
getStatiData(id) {
let that = this;
METHOD.axiosPost(
that,
`/dataStatistics/managerDataStatistics`,
{ cityId: "", countyId: "", provinceId: "" },
`/accidentInfo/getAccidentInfoList`,
{ enterpriseId:id, fromdate: "2021",size:200 },
function (res: any) {
if (res.code == 0) {
that.tjNumberObj = res.data;
......@@ -306,6 +293,19 @@ export default class EnterprisesMg extends Vue {
}
);
}
getStatiData2(id) {
let that = this;
METHOD.axiosPost(
that,
`/alarmInfo/selectInfoByEnterpriseId`,
{ enterpriseId:id, fromdate: "2021",size:200 },
function (res: any) {
if (res.code == 0) {
that.tjNumberObj2 = res.data;
}
}
);
}
getData() {
let that = this;
var id = this.idcolor;
......@@ -318,11 +318,24 @@ export default class EnterprisesMg extends Vue {
if (res.code == 0) {
that.totalOne = res.data.accident.totalNum;
that.totalTwo = res.data.alarm.totalNum;
console.log(res.data.accident)
EnterprisesTj.methods.drawPieChart(res.data)
document.getElementById(that.idcolor).style.background="#4980b5";
document.getElementById(that.idcolor).style.color="#fff";
//EnterprisesTj.methods.drawPieChart2(id)
}
}
);
METHOD.axiosGet(
this,
`/dataStatistics/enterpriseDatainfo/${id}`,
function(res) {
if (res.code === 0) {
//先进行赋值
var datas = res.data;
var arr = [datas.cameraList.length,datas.goodsList.length,datas.harmPlace.length,datas.troubleList.length,datas.allList.length,]
EnterprisesTj.methods.drawPieChart2(arr)
}
});
}
searchFun() {
this.PAGE = { page: 1, size: 10 };
......@@ -359,7 +372,7 @@ export default class EnterprisesMg extends Vue {
this.getTableData();
}
mounted() {
this.getStatiData();
//this.getStatiData();
}
}
</script>
......@@ -371,8 +384,8 @@ export default class EnterprisesMg extends Vue {
float: left;
margin-left: 2.5%;
height: 9rem;
color: #FFFFFF;
background-color: rgba(47, 96, 177, 0.1);
color: #fff;
background-color: #4980b5;
border-radius: 5px;
border: 2px solid rgb(22, 151, 207, 0.3);
box-shadow: 0 0 8px 8px rgba(131, 229, 255, 0.1)inset, 0 0 7px 7px rgba(22, 151, 207, 0.2);
......@@ -380,27 +393,20 @@ export default class EnterprisesMg extends Vue {
.qiyetitle{
height: 60px;
line-height:60px;
margin-left: 20px;
text-align:center;
color:#f0c78a;
color:#000;
font-size: 30px;
margin-top:20px;
background-color: rgba(47, 96, 177, 0.1);
border-radius: 5px;
border: 2px solid rgb(22, 151, 207, 0.3);
box-shadow: 0 0 8px 8px rgba(131, 229, 255, 0.1)inset, 0 0 7px 7px rgba(22, 151, 207, 0.2);
}
.qiyelist{
height: 40px;
line-height:40px;
color: #f0f0f0;
color: #000000;
font-size: large;
margin-left: 20px;
letter-spacing:1px;
background-color: rgba(47, 96, 177, 0.1);
/*background-color: rgba(47, 96, 177, 0.1);*/
border-radius: 5px;
border: 2px solid rgb(22, 151, 207, 0.3);
box-shadow: 0 0 8px 8px rgba(131, 229, 255, 0.1)inset, 0 0 7px 7px rgba(22, 151, 207, 0.2);
}
main > div {
background: #ffffff;
......
......@@ -6,10 +6,10 @@
<!--</div>-->
<div style="width:100%;display:flex;flex-direction:row;justify-content:flex-start;">
<div id="pie2" style="width:45%;height: 500px;">
<div id="pie20" style="width:45%;height: 500px;margin-left: 5%;">
<div id="main2" style="width:550px;height:500px;"></div>
</div>
<div id="pie3" style="width:45%;height: 500px;">
<div id="pie3" style="width:45%;height: 500px;margin-left: 5%;">
<div id="main3" style="width:550px;height:500px;"></div>
</div>
</div>
......@@ -32,6 +32,7 @@ export default {
mounted(){
//this.initData();
//this.drawPieChart();
//this.drawPieChart2("1");
},
methods:{
//初始化数据
......@@ -126,7 +127,6 @@ export default {
drawPieChart(data){
// 基于准备好的dom,初始化echarts实例
var myChart2 = echarts.init(document.getElementById('main2'));
var myChart3 = echarts.init(document.getElementById('main3'));
let that=this;
var getData1 = data.alarm.num;
var getData2 = data.accident.num;
......@@ -165,90 +165,190 @@ export default {
// }
// });
// 绘制图表
myChart2.setOption({
// color:['rgb(8,252,7)','rgb(255,168,0)','rgb(0,121,254)','rgb(0,255,251)','rgb(3,120,251)','rgb(0,200,251)'],
title: {
text: '企业事故次数统计',//主标题
color: '#fff',
// subtext: '柱状图',
textStyle: {
color: "#fff",
}
},
tooltip: {},
legend: {
data:['事故次数'],
textStyle: { //图例文字的样式
color: '#fff',
}
},
xAxis: {
axisLabel: {
interval:0,
rotate:40
} ,
// data: ["报警器","二氧化碳报警器","摄像头","水压探测器","摄像头","有毒气体探测器"],
data: ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],
},
yAxis: {},
series: [{
name: '事故数量',
type: 'bar',
// data: [5, 20, 36, 10, 10, 20],
data: getData2,
}],
textStyle: {
color: "#fff",
fontSize: 18
},
});
myChart3.setOption({
// color:['rgb(8,252,7)','rgb(255,168,0)','rgb(0,121,254)','rgb(0,255,251)','rgb(3,120,251)','rgb(0,200,251)'],
myChart2.setOption({
title: {
text: '企业预警次数统计',//主标题
color: '#fff',
text: '事故和预警',//主标题
color: '#000',
// subtext: '柱状图',
textStyle: {
color: "#fff",
color: "#000",
}
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
}
},
tooltip: {},
legend: {
data:['预警次数'],
data: ['事故', '预警'],
textStyle: { //图例文字的样式
color: '#fff',
color: '#000',
}
},
xAxis: {
axisLabel: {
interval:0,
rotate:40
} ,
// data: ["报警器","二氧化碳报警器","摄像头","水压探测器","摄像头","有毒气体探测器"],
data: ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],
},
yAxis: {},
series: [{
name: '预警次数',
type: 'bar',
// data: [5, 20, 36, 10, 10, 20],
data: getData1,
}],
textStyle: {
color: "#fff",
fontSize: 18
},
});
}
xAxis: [
{
type: 'category',
axisLabel: {
show:true,
interval:0,
rotate:40
} ,
//X轴白线
axisLine: {
show: true,
lineStyle: {
color: '#000',
},
},
//data: ['测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患'],
data:["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],
axisPointer: {
type: 'shadow'
}
}
],
yAxis: [
{
type: 'value',
axisLabel:{
show: true,
rich: {
flag: {
fontSize: 25,
padding: 5
}
}
},
axisLine: {
show: true,
lineStyle: {
color: '#000',
},
},
splitLine: {
show: true,
lineStyle: {
color: 'rgba(71, 126, 171, 1)',
type: 'dashed'
},
},
},
{
type: 'value',
interval: 5,
}
],
series: [
{
name: '事故',
type: 'bar',
// data: [
// 400, 1300, 700, 1000, 1500, 1800, 200, 300, 2000, 1000, 1300
// ]
data:getData2,
},
{
name: '预警',
type: 'line',
// symbol:'circle',
symbolSize:6,
//data: [1000,1300, 1450, 1600, 1700, 1800, 1850, 1800, 1700, 1600, 1500],
data:getData1,
itemStyle : {normal : {color:'#00D7FE', //改变折线点的颜色
lineStyle:{color:'#00D7FE'} //改变折线颜色
},
},
}
]
})
},
drawPieChart2(data){
// 基于准备好的dom,初始化echarts实例
var myChart2 = echarts.init(document.getElementById('main3'));
let that=this;
// myChart2.setOption({
// xAxis: {
// data: ["1","2","3","4","5"],
// },
// series:[{
// //data: [datas.cameraList.length(),datas.cameraList.length(),datas.cameraList.length(),datas.cameraList.length(),datas.cameraList.length()],
// data:[2,5,9,1,6]
// }]
// })
// METHOD.axiosGet(
// this,
// `/enterpriseGoods/getNumberByEnterprise`,{},
// function(res) {
// if (res.code === 0) {
// //先进行赋值
// // for(let i=0; i<res.data.result.length; i++) {
// // var obj = new Object();
// // var arr = new Object();
// // // obj = res.data.result[i].number;
// // // arr = res.data.result[i].type;
// // obj = res.data.result[i].number;
// // arr = res.data.result[i].name;
// // getData1[i] = obj;
// // getData2[i] = arr;
// // }
// }
// });
// 绘制图表
myChart2.setOption({
// color:['rgb(8,252,7)','rgb(255,168,0)','rgb(0,121,254)','rgb(0,255,251)','rgb(3,120,251)','rgb(0,200,251)'],
title: {
text: '企业危险源数量统计',//主标题
color: '#000',
// subtext: '柱状图',
textStyle: {
color: "#000",
}
},
tooltip: {},
legend: {
data:['危险源'],
textStyle: { //图例文字的样式
color: '#000',
}
},
xAxis: {
axisLabel: {
interval:0,
rotate:40
} ,
data: ["监控点位","危险源","职业危害场所","隐患","设备数量"],
//data: [],
},
yAxis: {},
series: [{
name: '危险源',
type: 'bar',
//data: [5, 20, 36, 10, 10, 20],
data: data,
}],
textStyle: {
color: "#000",
fontSize: 18
},
});
}
}
}
//background-image: url(../../assets/bg.png);
</script>
<style>
.pie #pie1{
/* border:1px #000000 solid; */
padding: 30px;
}
.pie #pie2{
.pie #pie20{
/* border:1px #000000 solid; */
margin-left: 20px;
margin-top: 50px;
......@@ -259,7 +359,6 @@ export default {
margin-top: 50px;
}
.el-main .el-tabs .el-tabs__content{
background-image: url(../../assets/bg.png);
background-repeat: no-repeat;
background-size: 100% 100%;
/* height: 100%; */
......
<template>
<div class="gis">
<div class="gis" style="padding: 0px;">
<div id="mapbox">
<div style="position:absolute;left:-30px;top:10px">
<button @click="Mutil.tianSlA()" class="map-botton">卫星地图</button>
......@@ -871,7 +871,7 @@
background: url('../../assets/z3.png') 100% 100%;
position: absolute;
top: -0px;
right: 10px;
right: 0px;
}
.markBox .markbox-div {
......
<template>
<div class="gis">
<div class="gis" style="padding: 0px">
<div id="mapbox" style="margin: 0">
<div style="position:absolute;left:500px;top:10px">
<button @click="Mutil.tianSlA()" id="but1" class="map-botton">卫星地图</button>
......@@ -21,12 +21,12 @@
</div>
<div style="">
<div id="bluebox"
style="width: 500px;height: 100%;z-index: 11;background-color: rgba(2, 40, 90, 0.7);position: absolute;top: 0;left: 10px;float: left;">
style="width: 500px;height: 100%;z-index: 11;background-color: rgba(2, 40, 90, 0.7);position: absolute;top: 0;float: left;">
<QyMapone></QyMapone>
</div>
<div @click="kongzhi" id="bluebox2"
style="width: 30px;height: 10%;z-index: 11;background-color: rgba(2, 40, 90, 0.7);position: absolute;top: 0;left: 510px;float: left;top:45%">
<img style="height: 100%;width: 100%" src="@/assets/mark/markqy.png"/>
style="width: 30px;height: 8%;z-index: 11;background-color: rgba(2, 40, 90, 0.9);position: absolute;top: 0;left: 500px;float: left;top:45%;border-radius: 5px;">
<img id ="ko" style="height: 100%;width: 100%" src="@/assets/Subtract-1.png"/>
</div>
<div class="markBox">
......@@ -477,22 +477,24 @@
}
//隐藏企业信息
kongzhi(){
// var a = document.getElementById("bluebox").style.left;
//var a = document.getElementById("bluebox").style.left;
// this.kongzhi2(10)
var a = document.getElementById("bluebox").style.left
if(a=="10px"){
if(a=="0px"||a==''){
document.getElementById('ko').src = require('@/assets/Subtract.png');
document.getElementById("bluebox").style.left="-500px"
document.getElementById("bluebox2").style.left="10px"
document.getElementById("bluebox2").style.left="0px"
document.getElementById("but1").style.left="-450px"
document.getElementById("but2").style.left="-340px"
//console.log(document.getElementsByClassName("ol-unselectable").item(1));
this.removeClass(document.getElementsByClassName('ol-zoom').item(0), 'ol-zoom');
}else {
document.getElementById("bluebox").style.left="10px"
document.getElementById("bluebox2").style.left="510px"
document.getElementById("bluebox").style.left="0px"
document.getElementById("bluebox2").style.left="500px"
document.getElementById("but1").style.left="50px"
document.getElementById("but2").style.left="160px"
this.addClass(document.getElementsByClassName('ol-unselectable').item(1), 'ol-zoom');
document.getElementById('ko').src = require('@/assets/Subtract-1.png');
//this.addClass(document.getElementsByClassName('ol-unselectable').item(0), 'ol-zoom');
}
return;
......@@ -1204,7 +1206,7 @@
background: url('../../assets/z3.png') 100% 100%;
position: absolute;
top: -67px;
right: 10px;
right: 0px;
}
.markBox .markbox-div {
......
......@@ -36,12 +36,12 @@
<div id="main2" style="width:450px;height:calc(100vh - 670px);"></div>
</div>
</dv-border-box-12>
<div class="div-table" style="width:480px;margin-top: 15px;background-color: rgb(0, 0, 0,0);position: fixed;bottom: 0;right: 0;margin-right: 20px;">
<div class="div-table" style="width:480px;margin-bottom: 20px;background-color: rgb(0, 0, 0,0);position: fixed;bottom: 0;right: 0;margin-right: 10px;">
<div style="width: 100%;height: 38px;text-align: left;font-size: 16px; line-height: 38px;color: #fff;font-weight: 900;background: #013056;opacity: 0.8;"><span style="margin-left: 10px;">预警信息</span></div>
<el-table :data="$data.tableData" stripe border :header-cell-style="{background:'#02285a',color:'#fff',}">
<el-table :data="$data.tableData" ref="tableList" stripe border :header-cell-style="{background:'#02285a',color:'#fff',}" >
<el-table-column prop="unitName" label="企业名称" width="110"></el-table-column>
<el-table-column prop="alarmInfo" label="预警信息" width="110">
<template slot-scope="scope">
<template slot-scope="scope" >
<font class="dg">{{scope.row.alarmInfo}}</font>
</template>
</el-table-column>
......@@ -96,12 +96,14 @@ echarts.use(
// require('echarts/lib/component/tooltip')
// require('echarts/lib/component/title')
import METHOD from "@/utils/methods";
import elTableInfiniteScroll from 'el-table-infinite-scroll';
import VueEllipseProgress from 'vue-ellipse-progress';
// Vue.prototype.$echarts = echarts;
Vue.use(VueEllipseProgress);
export default {
data(){
return{
tableData:[],
......@@ -120,19 +122,33 @@ export default {
this.getStatiData()
},
methods:{
getTableData() {
let that = this;
that.loading = true;
METHOD.axiosPost(
that,
`/alarmInfo/getAlarmInfoList`,{},
function(res) {
console.log(res)
if (res.code == 0) {
that.$data.tableData = res.data.pageData;
}
});
async getTableData() {
let that = this;
that.loading = true;
await METHOD.axiosPost(
that,
`/alarmInfo/getAlarmInfoList`,{},
function(res) {
console.log(res)
if (res.code == 0) {
that.$data.tableData = res.data.pageData;
that.goscroll();
}
});
},
goscroll(){
let _this = this;
let divData = this.$refs.tableList.bodyWrapper ;
console.log(divData)
this.dibiao_clear=setInterval(() => {
divData.scrollTop += 1
if (divData.clientHeight + divData.scrollTop == divData.scrollHeight) {
divData.scrollTop = 0
}
}, 100);
},
getStatiData() {
let that = this;
METHOD.axiosPost(
......
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