Commit 32dd9971 authored by jianqian's avatar jianqian

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

parent 2da12654
<template> <template>
<div class="wrapper enseDetail"> <div class="wrapper enseDetail">
<div class="flexBox"> <div class="flexBox">
<div class="flexBox-item"> <div class="flexBox-item" style="width: 40%">
<div class="enterDetail"> <div class="enterDetail" >
<h3>*企业注册信息*</h3> <h3>*企业注册信息*</h3>
<div class="enterDetail-item"> <div style="display:flex;flex-direction:row;justify-content:flex-start;">
<span class="itit">单位名称必填:</span> <div class="enterDetail-item">
{{ editForm.unitName }} <span class="itit">单位名称必填:</span>
</div> {{ editForm.unitName }}
<div class="enterDetail-item"> </div>
<span class="itit">统一社会信用代码:</span> <div class="enterDetail-item">
{{ editForm.orgCode }} <span class="itit">统一社会信用代码:</span>
</div> {{ editForm.orgCode }}
<div class="enterDetail-item"> </div>
<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> </div>
<div class="enterDetail-item"> <div style="display:flex;flex-direction:row;justify-content:flex-start;">
<span class="itit">法人手机:</span> <div class="enterDetail-item">
{{ editForm.legalPersonPhone }} <span class="itit">法定代表人:</span>
{{ editForm.legalPerson }}
</div>
<div class="enterDetail-item">
<span class="itit">法人手机:</span>
{{ editForm.legalPersonPhone }}
</div>
</div> </div>
<div class="enterDetail-item"> <div style="display:flex;flex-direction:row;justify-content:flex-start;">
<span class="itit">营业执照:</span> <div class="enterDetail-item">
<span class="dbtn sd qiCr" v-if="editForm.viewOrgFilePath" @click="checkFile(editForm.viewOrgFilePath)"> <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>查看 <i class="el-icon el-icon-view"></i>查看
</span> </span>
</div>
</div> </div>
<div class="enterDetail-item"> <div class="enterDetail-item">
<span class="itit">授权书:</span> <span class="itit">单位注册地址:</span>
<span class="dbtn sd qiCr" v-if="editForm.viewAuthorizeFile" @click="checkFile(editForm.viewAuthorizeFile)"> {{ editForm.regAddress }}
<i class="el-icon el-icon-view"></i>查看
</span>
</div> </div>
<div class="enterDetail-item"> <div class="enterDetail-item">
<span class="itit">管理员姓名:</span> <div class="link-top"></div>
{{ editForm.userName }} <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>
<div class="link-top"></div>
<div class="enterDetail-item"> <div class="enterDetail-item">
<span class="itit">管理员身份证:</span> <span class="itit" style="font-weight:900 ">危险源列表:</span>
{{ editForm.idCard }} <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>
<div class="link-top"></div>
<div class="enterDetail-item"> <div class="enterDetail-item">
<span class="itit">管理员Email:</span> <span class="itit" style="font-weight:900 ">职业危害场所:</span>
{{ editForm.email }} <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>
<div class="link-top"></div>
<div class="enterDetail-item"> <div class="enterDetail-item">
<span class="itit">管理员手机:</span> <span class="itit" style="font-weight:900 ">监控检测点位:</span>
{{ editForm.mobliePhone }} <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>
<div class="link-top"></div>
<h3> <h3>
<span class="dbtn dg fr" @click="$router.go(-1)"> <span class="dbtn dg fr" @click="$router.go(-1)">
<i class="el-icon-d-arrow-left"></i> 返回上一页 <i class="el-icon-d-arrow-left"></i> 返回上一页
</span> </span>
</h3> </h3>
<div style="height: 40px;">
</div>
</div> </div>
</div> </div>
<div class="flexBox-item"> <div class="flexBox-item" style="width: 60%">
<el-row> <el-row>
<el-checkbox @change="handleCheckAllChange" :indeterminate="isIndeterminate" v-model="checkAll">全选</el-checkbox> <el-checkbox @change="handleCheckAllChange" :indeterminate="isIndeterminate" v-model="checkAll">全选</el-checkbox>
<el-checkbox-group v-model="checkList" @change="CheckChange"> <el-checkbox-group v-model="checkList" @change="CheckChange">
...@@ -165,7 +258,10 @@ export default class EnseListDetail extends Vue { ...@@ -165,7 +258,10 @@ export default class EnseListDetail extends Vue {
@Provide() mapData: any = []; @Provide() mapData: any = [];
@Provide() windowsArr: any = []; @Provide() windowsArr: any = [];
@Provide() currentWindow: any = ""; @Provide() currentWindow: any = "";
@Provide() tableData1 : any = [];
@Provide() tableData2 : any = [];
@Provide() tableData3 : any = [];
@Provide() tableData4 : any = [];
@Provide() toolobj: any; @Provide() toolobj: any;
@Provide() mouseTool: any; //测量工具 @Provide() mouseTool: any; //测量工具
@Provide() toolVisble: boolean = false; @Provide() toolVisble: boolean = false;
...@@ -225,6 +321,11 @@ export default class EnseListDetail extends Vue { ...@@ -225,6 +321,11 @@ export default class EnseListDetail extends Vue {
let res3: any = alldata.goodsList; let res3: any = alldata.goodsList;
let res4: any = alldata.harmPlace; let res4: any = alldata.harmPlace;
that.mapData = [...res1, ...res2, ...res3, ...res4]; 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 mapData = [...res1, ...res2, ...res3, ...res4];
let latSum = 0; let latSum = 0;
let lngSum = 0; let lngSum = 0;
...@@ -490,11 +591,28 @@ main>div { ...@@ -490,11 +591,28 @@ main>div {
padding-left: 10px; padding-left: 10px;
border-left: 1px solid #eeeeee; 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> </style><style lang="scss" scoped>
.enterDetail { .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 { .enterDetail .enterDetail-item {
width: 100%; width: 100%;
} }
......
...@@ -5,30 +5,48 @@ ...@@ -5,30 +5,48 @@
<div style ="display:flex;flex-direction:row;justify-content:flex-start;"> <div style ="display:flex;flex-direction:row;justify-content:flex-start;">
<div style="width: 24%;height:700px;" > <div style="width: 24%;height:700px;" >
<div class="qiyetitle">企业列表</div> <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"> <div style ="display:flex;flex-direction:row;justify-content:flex-start;margin-bottom: 20px;margin-left: 20px">
{{item.unitName}} <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>
<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>
<div style="width: 75%"> <div style="width: 75%">
<div style="width: 100%;height: 10em;"> <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;"> <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> <p>事故总次数</p>
</div> </div>
<div style="width: 60%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{totalOne}}</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>
<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;"> <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> <p>设备预警总次数</p>
</div> </div>
<div style="width: 60%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{totalTwo}}</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>
<!--<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;">--> <!--<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;">--> <!--<img src="../../assets/logo2.png" width="25%" style="margin-top: 2rem;">-->
<!--<p>待审批数量</p>--> <!--<p>危险源总数量</p>-->
<!--</div>--> <!--</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 style="width: 60%;height: 100%;text-align: center;line-height: 9rem;float: right;font-size: 3rem;font-family: 'UnidreamLED';">{{tjNumberObj.enterpriseCheckIngNum}}</div>-->
<!--</div>--> <!--</div>-->
...@@ -107,64 +125,28 @@ ...@@ -107,64 +125,28 @@
</el-tab-pane> </el-tab-pane>
<el-dialog :visible.sync="dialogVisible1" title="危险源列表"> <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 width="50px" type="index" label="序号"></el-table-column>
<el-table-column prop="goodsName" label="危险源名称"></el-table-column> <el-table-column prop="accidentText" label="事故简述"></el-table-column>
<el-table-column prop="unitName" label="所属企业"></el-table-column> <el-table-column prop="accidentReason" label="事故原因"></el-table-column>
<el-table-column prop="category" label="物品类型"></el-table-column> <el-table-column prop="accidentLevel" label="事故等级"></el-table-column>
<el-table-column prop="dangerGrade" label="危险等级"></el-table-column> <el-table-column prop="accidentTime" label="事故时间"></el-table-column>
<el-table-column prop="isBigDanger" label="是否重大危险源"> <el-table-column prop="createTime" 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> </el-table-column>
<el-table-column prop="contacts" label="联系人"></el-table-column>
<el-table-column prop="phone" label="电话"></el-table-column>
</el-table> </el-table>
</el-dialog> </el-dialog>
<el-dialog :visible.sync="dialogVisible2" title="注册企业列表"> <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 width="50px" type="index" label="序号"></el-table-column>
<el-table-column prop="unitName" label="企业名称"></el-table-column> <el-table-column width="150px" prop="alarmInfo" label="预警名称"></el-table-column>
<el-table-column width="100px" prop="legalPerson" label="企业法人"></el-table-column> <el-table-column width="100px" prop="alarmType" label="报警类型"></el-table-column>
<el-table-column width="200px" prop="orgCode" label="统一社会信用代码"></el-table-column> <el-table-column width="100px" prop="remarks" label="预警设备"></el-table-column>
<el-table-column prop="legalPersonEmail" label="法人邮箱"></el-table-column> <el-table-column width="100px" prop="reportValue" label="上报数值"></el-table-column>
<el-table-column prop="regulationBigType" label="监管分类"> <el-table-column prop="alarmTime" label="报警时间"></el-table-column>
<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> </el-table>
</el-dialog> </el-dialog>
...@@ -249,6 +231,7 @@ export default class EnterprisesMg extends Vue { ...@@ -249,6 +231,7 @@ export default class EnterprisesMg extends Vue {
@Provide() loading: Boolean = false; @Provide() loading: Boolean = false;
@Provide() cityval: any = []; @Provide() cityval: any = [];
@Provide() tjNumberObj: any = {}; @Provide() tjNumberObj: any = {};
@Provide() tjNumberObj2: any = {};
@Provide() totalOne: string = 0; @Provide() totalOne: string = 0;
@Provide() totalTwo: string = 0 @Provide() totalTwo: string = 0
//编辑组件 //编辑组件
...@@ -262,8 +245,10 @@ export default class EnterprisesMg extends Vue { ...@@ -262,8 +245,10 @@ export default class EnterprisesMg extends Vue {
showList(type: any){ showList(type: any){
if(type == 1){ if(type == 1){
this.dialogVisible1 = true; this.dialogVisible1 = true;
this.getStatiData(this.idcolor);
}else if(type == 2){ }else if(type == 2){
this.dialogVisible2 = true; this.dialogVisible2 = true;
this.getStatiData2(this.idcolor);
}else if(type == 3){ }else if(type == 3){
this.dialogVisible3 = true; this.dialogVisible3 = true;
} }
...@@ -271,8 +256,8 @@ export default class EnterprisesMg extends Vue { ...@@ -271,8 +256,8 @@ export default class EnterprisesMg extends Vue {
showqiye(id){ showqiye(id){
if(this.idcolor!=''){ if(this.idcolor!=''){
document.getElementById(this.idcolor).style.background=""; document.getElementById(this.idcolor).style.background="";
document.getElementById(this.idcolor).style.color="#000";
} }
document.getElementById(id).style.background="#00008B";
this.idcolor= id; this.idcolor= id;
this.getData(); this.getData();
} }
...@@ -288,17 +273,19 @@ export default class EnterprisesMg extends Vue { ...@@ -288,17 +273,19 @@ export default class EnterprisesMg extends Vue {
that.loading = false; that.loading = false;
if (res.code == 0) { if (res.code == 0) {
that.tableData = res.data; 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; let that = this;
METHOD.axiosPost( METHOD.axiosPost(
that, that,
`/dataStatistics/managerDataStatistics`, `/accidentInfo/getAccidentInfoList`,
{ cityId: "", countyId: "", provinceId: "" }, { enterpriseId:id, fromdate: "2021",size:200 },
function (res: any) { function (res: any) {
if (res.code == 0) { if (res.code == 0) {
that.tjNumberObj = res.data; that.tjNumberObj = res.data;
...@@ -306,6 +293,19 @@ export default class EnterprisesMg extends Vue { ...@@ -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() { getData() {
let that = this; let that = this;
var id = this.idcolor; var id = this.idcolor;
...@@ -318,11 +318,24 @@ export default class EnterprisesMg extends Vue { ...@@ -318,11 +318,24 @@ export default class EnterprisesMg extends Vue {
if (res.code == 0) { if (res.code == 0) {
that.totalOne = res.data.accident.totalNum; that.totalOne = res.data.accident.totalNum;
that.totalTwo = res.data.alarm.totalNum; that.totalTwo = res.data.alarm.totalNum;
console.log(res.data.accident)
EnterprisesTj.methods.drawPieChart(res.data) 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() { searchFun() {
this.PAGE = { page: 1, size: 10 }; this.PAGE = { page: 1, size: 10 };
...@@ -359,7 +372,7 @@ export default class EnterprisesMg extends Vue { ...@@ -359,7 +372,7 @@ export default class EnterprisesMg extends Vue {
this.getTableData(); this.getTableData();
} }
mounted() { mounted() {
this.getStatiData(); //this.getStatiData();
} }
} }
</script> </script>
...@@ -371,8 +384,8 @@ export default class EnterprisesMg extends Vue { ...@@ -371,8 +384,8 @@ export default class EnterprisesMg extends Vue {
float: left; float: left;
margin-left: 2.5%; margin-left: 2.5%;
height: 9rem; height: 9rem;
color: #FFFFFF; color: #fff;
background-color: rgba(47, 96, 177, 0.1); background-color: #4980b5;
border-radius: 5px; border-radius: 5px;
border: 2px solid rgb(22, 151, 207, 0.3); 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); 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 { ...@@ -380,27 +393,20 @@ export default class EnterprisesMg extends Vue {
.qiyetitle{ .qiyetitle{
height: 60px; height: 60px;
line-height:60px; line-height:60px;
margin-left: 20px;
text-align:center; text-align:center;
color:#f0c78a; color:#000;
font-size: 30px; font-size: 30px;
margin-top:20px; 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{ .qiyelist{
height: 40px; height: 40px;
line-height:40px; line-height:40px;
color: #f0f0f0; color: #000000;
font-size: large; font-size: large;
margin-left: 20px;
letter-spacing:1px; letter-spacing:1px;
background-color: rgba(47, 96, 177, 0.1); /*background-color: rgba(47, 96, 177, 0.1);*/
border-radius: 5px; 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 { main > div {
background: #ffffff; background: #ffffff;
......
...@@ -6,10 +6,10 @@ ...@@ -6,10 +6,10 @@
<!--</div>--> <!--</div>-->
<div style="width:100%;display:flex;flex-direction:row;justify-content:flex-start;"> <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 id="main2" style="width:550px;height:500px;"></div>
</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 id="main3" style="width:550px;height:500px;"></div>
</div> </div>
</div> </div>
...@@ -32,6 +32,7 @@ export default { ...@@ -32,6 +32,7 @@ export default {
mounted(){ mounted(){
//this.initData(); //this.initData();
//this.drawPieChart(); //this.drawPieChart();
//this.drawPieChart2("1");
}, },
methods:{ methods:{
//初始化数据 //初始化数据
...@@ -126,7 +127,6 @@ export default { ...@@ -126,7 +127,6 @@ export default {
drawPieChart(data){ drawPieChart(data){
// 基于准备好的dom,初始化echarts实例 // 基于准备好的dom,初始化echarts实例
var myChart2 = echarts.init(document.getElementById('main2')); var myChart2 = echarts.init(document.getElementById('main2'));
var myChart3 = echarts.init(document.getElementById('main3'));
let that=this; let that=this;
var getData1 = data.alarm.num; var getData1 = data.alarm.num;
var getData2 = data.accident.num; var getData2 = data.accident.num;
...@@ -165,90 +165,190 @@ export default { ...@@ -165,90 +165,190 @@ export default {
// } // }
// }); // });
// 绘制图表 // 绘制图表
myChart2.setOption({ 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)'],
title: { title: {
text: '企业预警次数统计',//主标题 text: '事故和预警',//主标题
color: '#fff', color: '#000',
// subtext: '柱状图', // subtext: '柱状图',
textStyle: { textStyle: {
color: "#fff", color: "#000",
}
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
} }
}, },
tooltip: {},
legend: { legend: {
data:['预警次数'], data: ['事故', '预警'],
textStyle: { //图例文字的样式 textStyle: { //图例文字的样式
color: '#fff', color: '#000',
} }
}, },
xAxis: { xAxis: [
axisLabel: { {
interval:0, type: 'category',
rotate:40 axisLabel: {
} , show:true,
// data: ["报警器","二氧化碳报警器","摄像头","水压探测器","摄像头","有毒气体探测器"], interval:0,
data: ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"], rotate:40
}, } ,
yAxis: {}, //X轴白线
series: [{ axisLine: {
name: '预警次数', show: true,
type: 'bar', lineStyle: {
// data: [5, 20, 36, 10, 10, 20], color: '#000',
data: getData1, },
}], },
textStyle: { //data: ['测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患', '测试隐患'],
color: "#fff", data:["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],
fontSize: 18 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> </script>
<style> <style>
.pie #pie1{ .pie #pie1{
/* border:1px #000000 solid; */ /* border:1px #000000 solid; */
padding: 30px; padding: 30px;
} }
.pie #pie2{ .pie #pie20{
/* border:1px #000000 solid; */ /* border:1px #000000 solid; */
margin-left: 20px; margin-left: 20px;
margin-top: 50px; margin-top: 50px;
...@@ -259,7 +359,6 @@ export default { ...@@ -259,7 +359,6 @@ export default {
margin-top: 50px; margin-top: 50px;
} }
.el-main .el-tabs .el-tabs__content{ .el-main .el-tabs .el-tabs__content{
background-image: url(../../assets/bg.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
/* height: 100%; */ /* height: 100%; */
......
<template> <template>
<div class="gis"> <div class="gis" style="padding: 0px;">
<div id="mapbox"> <div id="mapbox">
<div style="position:absolute;left:-30px;top:10px"> <div style="position:absolute;left:-30px;top:10px">
<button @click="Mutil.tianSlA()" class="map-botton">卫星地图</button> <button @click="Mutil.tianSlA()" class="map-botton">卫星地图</button>
...@@ -871,7 +871,7 @@ ...@@ -871,7 +871,7 @@
background: url('../../assets/z3.png') 100% 100%; background: url('../../assets/z3.png') 100% 100%;
position: absolute; position: absolute;
top: -0px; top: -0px;
right: 10px; right: 0px;
} }
.markBox .markbox-div { .markBox .markbox-div {
......
<template> <template>
<div class="gis"> <div class="gis" style="padding: 0px">
<div id="mapbox" style="margin: 0"> <div id="mapbox" style="margin: 0">
<div style="position:absolute;left:500px;top:10px"> <div style="position:absolute;left:500px;top:10px">
<button @click="Mutil.tianSlA()" id="but1" class="map-botton">卫星地图</button> <button @click="Mutil.tianSlA()" id="but1" class="map-botton">卫星地图</button>
...@@ -21,12 +21,12 @@ ...@@ -21,12 +21,12 @@
</div> </div>
<div style=""> <div style="">
<div id="bluebox" <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> <QyMapone></QyMapone>
</div> </div>
<div @click="kongzhi" id="bluebox2" <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%"> 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 style="height: 100%;width: 100%" src="@/assets/mark/markqy.png"/> <img id ="ko" style="height: 100%;width: 100%" src="@/assets/Subtract-1.png"/>
</div> </div>
<div class="markBox"> <div class="markBox">
...@@ -477,22 +477,24 @@ ...@@ -477,22 +477,24 @@
} }
//隐藏企业信息 //隐藏企业信息
kongzhi(){ kongzhi(){
// var a = document.getElementById("bluebox").style.left; //var a = document.getElementById("bluebox").style.left;
// this.kongzhi2(10) // this.kongzhi2(10)
var a = document.getElementById("bluebox").style.left 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("bluebox").style.left="-500px"
document.getElementById("bluebox2").style.left="10px" document.getElementById("bluebox2").style.left="0px"
document.getElementById("but1").style.left="-450px" document.getElementById("but1").style.left="-450px"
document.getElementById("but2").style.left="-340px" document.getElementById("but2").style.left="-340px"
//console.log(document.getElementsByClassName("ol-unselectable").item(1)); //console.log(document.getElementsByClassName("ol-unselectable").item(1));
this.removeClass(document.getElementsByClassName('ol-zoom').item(0), 'ol-zoom'); this.removeClass(document.getElementsByClassName('ol-zoom').item(0), 'ol-zoom');
}else { }else {
document.getElementById("bluebox").style.left="10px" document.getElementById("bluebox").style.left="0px"
document.getElementById("bluebox2").style.left="510px" document.getElementById("bluebox2").style.left="500px"
document.getElementById("but1").style.left="50px" document.getElementById("but1").style.left="50px"
document.getElementById("but2").style.left="160px" document.getElementById("but2").style.left="160px"
this.addClass(document.getElementsByClassName('ol-unselectable').item(1), 'ol-zoom'); 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'); //this.addClass(document.getElementsByClassName('ol-unselectable').item(0), 'ol-zoom');
} }
return; return;
...@@ -1204,7 +1206,7 @@ ...@@ -1204,7 +1206,7 @@
background: url('../../assets/z3.png') 100% 100%; background: url('../../assets/z3.png') 100% 100%;
position: absolute; position: absolute;
top: -67px; top: -67px;
right: 10px; right: 0px;
} }
.markBox .markbox-div { .markBox .markbox-div {
......
...@@ -36,12 +36,12 @@ ...@@ -36,12 +36,12 @@
<div id="main2" style="width:450px;height:calc(100vh - 670px);"></div> <div id="main2" style="width:450px;height:calc(100vh - 670px);"></div>
</div> </div>
</dv-border-box-12> </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> <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="unitName" label="企业名称" width="110"></el-table-column>
<el-table-column prop="alarmInfo" label="预警信息" width="110"> <el-table-column prop="alarmInfo" label="预警信息" width="110">
<template slot-scope="scope"> <template slot-scope="scope" >
<font class="dg">{{scope.row.alarmInfo}}</font> <font class="dg">{{scope.row.alarmInfo}}</font>
</template> </template>
</el-table-column> </el-table-column>
...@@ -96,12 +96,14 @@ echarts.use( ...@@ -96,12 +96,14 @@ echarts.use(
// require('echarts/lib/component/tooltip') // require('echarts/lib/component/tooltip')
// require('echarts/lib/component/title') // require('echarts/lib/component/title')
import METHOD from "@/utils/methods"; import METHOD from "@/utils/methods";
import elTableInfiniteScroll from 'el-table-infinite-scroll';
import VueEllipseProgress from 'vue-ellipse-progress'; import VueEllipseProgress from 'vue-ellipse-progress';
// Vue.prototype.$echarts = echarts; // Vue.prototype.$echarts = echarts;
Vue.use(VueEllipseProgress); Vue.use(VueEllipseProgress);
export default { export default {
data(){ data(){
return{ return{
tableData:[], tableData:[],
...@@ -120,19 +122,33 @@ export default { ...@@ -120,19 +122,33 @@ export default {
this.getStatiData() this.getStatiData()
}, },
methods:{ methods:{
getTableData() { async getTableData() {
let that = this; let that = this;
that.loading = true; that.loading = true;
METHOD.axiosPost( await METHOD.axiosPost(
that, that,
`/alarmInfo/getAlarmInfoList`,{}, `/alarmInfo/getAlarmInfoList`,{},
function(res) { function(res) {
console.log(res) console.log(res)
if (res.code == 0) { if (res.code == 0) {
that.$data.tableData = res.data.pageData; 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() { getStatiData() {
let that = this; let that = this;
METHOD.axiosPost( 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