Commit 2da12654 authored by jianqian's avatar jianqian

一、企业分布

1.左侧隐藏
2.预警信息 滚动
二。企业统计
1.展示单个企业的安全生产信息
2.图表,折线图(事故数量,设备预警,近一年)

三、视频可视化
对接海康视频平台

去掉预案信息管理
一企一档
危险源、隐患、职业危害场所、监控监测点位
parent 8a3f2a3e
...@@ -11,9 +11,11 @@ ...@@ -11,9 +11,11 @@
"@types/axios": "^0.14.0", "@types/axios": "^0.14.0",
"axios": "^0.19.2", "axios": "^0.19.2",
"core-js": "^3.6.4", "core-js": "^3.6.4",
"easy-player": "^2.2.7",
"echarts": "^5.1.1", "echarts": "^5.1.1",
"element-ui": "^2.13.0", "element-ui": "^2.13.0",
"ol": "^6.4.3", "ol": "^6.4.3",
"video.js": "^7.15.4",
"vue": "^2.6.11", "vue": "^2.6.11",
"vue-amap": "^0.5.10", "vue-amap": "^0.5.10",
"vue-class-component": "^7.2.2", "vue-class-component": "^7.2.2",
...@@ -22,6 +24,7 @@ ...@@ -22,6 +24,7 @@
"vue-ellipse-progress": "^1.3.0", "vue-ellipse-progress": "^1.3.0",
"vue-property-decorator": "^8.3.0", "vue-property-decorator": "^8.3.0",
"vue-router": "^3.1.5", "vue-router": "^3.1.5",
"vue-video-player": "^5.0.2",
"vuex": "^3.1.2", "vuex": "^3.1.2",
"vuex-class": "^0.3.2" "vuex-class": "^0.3.2"
}, },
......
<template> <template>
<el-tabs v-model="activeName" type="border-card" > <el-tabs v-model="activeName" type="border-card" >
<el-tab-pane label="图表" name="first"> <el-tab-pane label="图表" name="first" >
<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>
</div>
<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="" @click="showList(1)" style="cursor:pointer;"> <div class="el-tab-pane-div second-div" style="" 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/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.dangerNum}}</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="" @click="showList(2)" style="cursor:pointer;"> <div class="el-tab-pane-div second-div" style="" 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/z-zhuce.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.enterpriseRegNum}}</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(3)" 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/z-shenhe.png" width="25%" style="margin-top: 2rem;">-->
<p>待审批数量</p> <!--<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>-->
</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> <EnterprisesTj></EnterprisesTj>
</div> </div>
</div> </div>
<EnterprisesTj></EnterprisesTj>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="列表" name="second"> <el-tab-pane label="列表" name="second">
<div class="EnseList" style="background-color: #fff;padding: 20px;"> <div class="EnseList" style="background-color: #fff;padding: 20px;">
...@@ -239,10 +249,13 @@ export default class EnterprisesMg extends Vue { ...@@ -239,10 +249,13 @@ 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() totalOne: string = 0;
@Provide() totalTwo: string = 0
//编辑组件 //编辑组件
@Provide() dialogVisible1: Boolean = false; @Provide() dialogVisible1: Boolean = false;
@Provide() dialogVisible2: Boolean = false; @Provide() dialogVisible2: Boolean = false;
@Provide() dialogVisible3: Boolean = false; @Provide() dialogVisible3: Boolean = false;
@Provide() idcolor: string = "";
@Provide() zjKey: any = 0; @Provide() zjKey: any = 0;
...@@ -255,6 +268,14 @@ export default class EnterprisesMg extends Vue { ...@@ -255,6 +268,14 @@ export default class EnterprisesMg extends Vue {
this.dialogVisible3 = true; this.dialogVisible3 = true;
} }
} }
showqiye(id){
if(this.idcolor!=''){
document.getElementById(this.idcolor).style.background="";
}
document.getElementById(id).style.background="#00008B";
this.idcolor= id;
this.getData();
}
getTableData() { getTableData() {
let that = this, let that = this,
param = Object.assign({accountStatus:'0'}, that.PAGE, that.searchData); param = Object.assign({accountStatus:'0'}, that.PAGE, that.searchData);
...@@ -267,6 +288,7 @@ export default class EnterprisesMg extends Vue { ...@@ -267,6 +288,7 @@ 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)
} }
} }
); );
...@@ -284,6 +306,24 @@ export default class EnterprisesMg extends Vue { ...@@ -284,6 +306,24 @@ export default class EnterprisesMg extends Vue {
} }
); );
} }
getData() {
let that = this;
var id = this.idcolor;
var param ={ enterpriseId: id, fromdate: "2021" }
METHOD.axiosPost(
that,
`/enterpriseInfo/enterpriseHistogram`,
param,
function (res: any) {
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)
}
}
);
}
searchFun() { searchFun() {
this.PAGE = { page: 1, size: 10 }; this.PAGE = { page: 1, size: 10 };
this.getTableData(); this.getTableData();
...@@ -327,7 +367,7 @@ export default class EnterprisesMg extends Vue { ...@@ -327,7 +367,7 @@ export default class EnterprisesMg extends Vue {
@import "@/utils/public.scss"; @import "@/utils/public.scss";
.second-div{ .second-div{
margin-top: 20px; margin-top: 20px;
width: 30%; width: 45%;
float: left; float: left;
margin-left: 2.5%; margin-left: 2.5%;
height: 9rem; height: 9rem;
...@@ -337,6 +377,31 @@ export default class EnterprisesMg extends Vue { ...@@ -337,6 +377,31 @@ export default class EnterprisesMg extends Vue {
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);
} }
.qiyetitle{
height: 60px;
line-height:60px;
margin-left: 20px;
text-align:center;
color:#f0c78a;
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;
font-size: large;
margin-left: 20px;
letter-spacing:1px;
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 { main > div {
background: #ffffff; background: #ffffff;
height: calc(100vh - 120px)!important; height: calc(100vh - 120px)!important;
......
<template style=""> <template style="">
<div class="pie" style="width:100%;height: 700px;"> <div class="pie" style="width:100%;height: 700px;">
<div id="pie1" style="float:left;width:50%;height: 500px;"> <!--<div id="pie1" style="float:left;width:50%;height: 500px;">-->
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> <!--&lt;!&ndash; 为 ECharts 准备一个具备大小(宽高)的 DOM &ndash;&gt;-->
<div id="main1" style="width:700px;height:500px;"></div> <!--<div id="main1" style="width:700px;height:500px;"></div>-->
</div> <!--</div>-->
<div id="pie2" style="float:right;width:40%;height: 500px;"> <div style="width:100%;display:flex;flex-direction:row;justify-content:flex-start;">
<div id="pie2" style="width:45%;height: 500px;">
<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="main3" style="width:550px;height:500px;"></div>
</div>
</div>
</div> </div>
</template> </template>
...@@ -24,8 +30,8 @@ export default { ...@@ -24,8 +30,8 @@ export default {
created(){ created(){
}, },
mounted(){ mounted(){
this.initData(); //this.initData();
this.drawPieChart(); //this.drawPieChart();
}, },
methods:{ methods:{
//初始化数据 //初始化数据
...@@ -62,7 +68,6 @@ export default { ...@@ -62,7 +68,6 @@ export default {
}) })
} }
}); });
// 绘制图表 // 绘制图表
myChart1.setOption({ myChart1.setOption({
title : { title : {
...@@ -112,43 +117,95 @@ export default { ...@@ -112,43 +117,95 @@ export default {
}); });
}, },
drawPieChart(){ getData(data) {
console.log(data)
let that = this;
//var id = this.idcolor;
},
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 = []; var getData1 = data.alarm.num;
var getData2 = []; var getData2 = data.accident.num;
METHOD.axiosGet( // myChart2.setOption({
this, // xAxis: {
`/enterpriseGoods/getNumberByEnterprise`, // data: getData1,
function(res) { // },
if (res.code === 0) { // series:[{
//先进行赋值 // data: getData2,
for(let i=0; i<res.data.result.length; i++) { // }]
var obj = new Object(); // })
var arr = new Object(); // 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; // obj = res.data.result[i].number;
// arr = res.data.result[i].type; // arr = res.data.result[i].name;
obj = res.data.result[i].number; // getData1[i] = obj;
arr = res.data.result[i].name; // getData2[i] = arr;
getData1[i] = obj; // }
getData2[i] = arr; // myChart2.setOption({
} // xAxis: {
// data: getData2,
// },
// series:[{
// data: getData1,
// }]
// })
// }
// });
// 绘制图表
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: { 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, data: getData2,
}],
textStyle: {
color: "#fff",
fontSize: 18
}, },
series:[{
data: getData1,
}]
})
}
}); });
// 绘制图表 myChart3.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)'], // 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: '#fff',
// subtext: '柱状图', // subtext: '柱状图',
textStyle: { textStyle: {
...@@ -157,7 +214,7 @@ export default { ...@@ -157,7 +214,7 @@ export default {
}, },
tooltip: {}, tooltip: {},
legend: { legend: {
data:['危险源'], data:['预警次数'],
textStyle: { //图例文字的样式 textStyle: { //图例文字的样式
color: '#fff', color: '#fff',
} }
...@@ -168,14 +225,14 @@ export default { ...@@ -168,14 +225,14 @@ export default {
rotate:40 rotate:40
} , } ,
// data: ["报警器","二氧化碳报警器","摄像头","水压探测器","摄像头","有毒气体探测器"], // data: ["报警器","二氧化碳报警器","摄像头","水压探测器","摄像头","有毒气体探测器"],
data: [], data: ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],
}, },
yAxis: {}, yAxis: {},
series: [{ series: [{
name: '危险源', name: '预警次数',
type: 'bar', type: 'bar',
// data: [5, 20, 36, 10, 10, 20], // data: [5, 20, 36, 10, 10, 20],
data: [], data: getData1,
}], }],
textStyle: { textStyle: {
color: "#fff", color: "#fff",
...@@ -196,6 +253,11 @@ export default { ...@@ -196,6 +253,11 @@ export default {
margin-left: 20px; margin-left: 20px;
margin-top: 50px; margin-top: 50px;
} }
.pie #pie3{
/* border:1px #000000 solid; */
margin-left: 20px;
margin-top: 50px;
}
.el-main .el-tabs .el-tabs__content{ .el-main .el-tabs .el-tabs__content{
background-image: url(../../assets/bg.png); background-image: url(../../assets/bg.png);
background-repeat: no-repeat; background-repeat: no-repeat;
......
...@@ -118,6 +118,7 @@ ...@@ -118,6 +118,7 @@
<script lang="ts"> <script lang="ts">
import { Component, Vue, Provide, Watch } from "vue-property-decorator"; import { Component, Vue, Provide, Watch } from "vue-property-decorator";
import METHOD from "@/utils/methods";
@Component({ @Component({
components: { } components: { }
}) })
...@@ -158,12 +159,22 @@ ...@@ -158,12 +159,22 @@
nodeClick(data: any, node: any, target: any) { nodeClick(data: any, node: any, target: any) {
let that = this; let that = this;
that.treecheckedObj = node.data; that.treecheckedObj = node.data;
if(node.level == "3"){ if(node.level == "3"){
that.playerWindow = 'newplay' + that.flag; that.playerWindow = 'newplay' + that.flag;
var player = new WasmPlayer(null, that.playerWindow, null, {Height: true}); var player = new WasmPlayer(null, that.playerWindow, null, {Height: true});
// console.log(that.playerWindow, node.data.deviceNumber) // console.log(that.playerWindow, node.data.deviceNumber)
player.play('http://27.128.189.137:18000/flv/hls/' + that.treecheckedObj.deviceNumber + '.flv', 1); METHOD.axiosGet(
this,
`/artemis/getPreviewURLs?cameraIndexCode=`+that.treecheckedObj.deviceNumber,
function(res) {
// console.log(res.code)
if (res.code == 0) {
player.play(res.data.url, 1);
}else{
//player.play('http://live.hkstv.hk.lxdns.com/flv/hks.flv', 1);
}
});
//player.play('http://27.128.189.137:18000/flv/hls/' + that.treecheckedObj.deviceNumber + '.flv', 1);
if(that.flag < 4) { if(that.flag < 4) {
that.flag++; that.flag++;
} }
......
<!--
<template> <template>
<div class="amap-page-container"> <div class="amap-page-container">
<el-amap ref="map" vid="amapDemo" :center="center" :zoom="zoom" :plugin="plugin" :events="events" class="amap-demo"> <el-amap vid="amapDemo" :zoom="zoom" :center="center" ></el-amap>
<el-amap-marker v-for="marker in markers":key="i" :position="marker.position"></el-amap-marker> </div>
</el-amap> --> </template>
<!-- <div class="toolbar"> <style>
<button @click="getMap()">get map</button>
</div> -->
<!-- </div>
</template>
<style>
.amap-page-container { .amap-page-container {
height: 400px; height: 100%;
} }
</style> --> </style>
<!-- <script> <script>
import VueAMap from 'vue-amap'; //import VueAMap from '@/utils/VamapLoad.ts';
import VueAMap from 'vue-amap';
import "@/utils/directive.js";
import {
Icon
} from "element-ui";
import { Component, Vue, Provide, Prop, Watch } from "vue-property-decorator";
Vue.use(VueAMap); Vue.use(VueAMap);
VueAMap.initAMapApiLoader({ VueAMap.initAMapApiLoader({
  // 高德的keye // 高德的keye
  key: 'cb087c0fb3b8bc56a4af064630495bb9',
  uiVersion: '1.0.11' ,// 版本号
  // 插件集合
  plugin: ['AMap.Geocoder','AMap.Autocomplete','AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView', 'AMap.Geolocation','AMap.ToolBar', 'AMap.MapType', 'AMap.PolyEditor', 'AMap.CircleEditor'], key: 'cb087c0fb3b8bc56a4af064630495bb9',
uiVersion: '1.0.11' ,// 版本号
// 插件集合
plugin: ['AMap.Geocoder','AMap.Autocomplete','AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView', 'AMap.Geolocation','AMap.ToolBar', 'AMap.MapType', 'AMap.PolyEditor', 'AMap.CircleEditor'],
// 高德 sdk 版本,默认为 1.4.4
  // 高德 sdk 版本,默认为 1.4.4 v: '1.4.4'
  v: '1.4.4' });
});
// import { AMapManager } from 'vue-amap'; // import { AMapManager } from 'vue-amap';
// import { AMap } from 'vue-amap'; // import { AMap } from 'vue-amap';
export default { export default {
...@@ -52,7 +47,6 @@ import VueAMap from 'vue-amap'; ...@@ -52,7 +47,6 @@ import VueAMap from 'vue-amap';
position: [117.148118, 36.660223], position: [117.148118, 36.660223],
events: { events: {
click: () => { click: () => {
alert('click marker');
}, },
dragend: (e) => { dragend: (e) => {
console.log('---event---: dragend') console.log('---event---: dragend')
...@@ -63,75 +57,15 @@ import VueAMap from 'vue-amap'; ...@@ -63,75 +57,15 @@ import VueAMap from 'vue-amap';
draggable: false, draggable: false,
template: '<span>1</span>', template: '<span>1</span>',
} }
],
events: {
init: (o) => {
console.log(o.getCenter())
console.log(this.$refs.map.$$getInstance())
o.getCity(result => {
console.log(result)
})
},
'moveend': () => {
},
'zoomchange': () => {
},
'click': (e) => {
let {lng,lat} = e.lnglat;
self.lng = lng;
self.lat = lat;
console.log(self.lng,self.lat)
let points = [self.lng,self.lat]
this.getAddress(points)
let marker = {
position: [self.lng, self.lat]
};
if (!this.markers.length) return;
this.markers.splice(this.markers.length - 1, 1);
this.markers.push(marker);
}
},
getAddress (points) {
let geocoder = new AMap.Geocoder({ radius: 1000, extensions: "all" })
geocoder.getAddress(points, (status, result) => {
if (status === 'complete' && result.regeocode) {
this.address = result.regeocode.formattedAddress
console.log(this.address)
}
})
},
plugin: ['ToolBar', {
pName: 'MapType',
defaultType: 0,
events: {
init(o) {
console.log(o);
}
}
}],
texts: [
{
position: [121.5273285, 31.21515044],
text: 'hello world',
offset: [0, 0],
events: {
click: () => {
alert('click text');
}
}
}
] ]
} }
}, },
methods: { methods: {
getMap() { getMap() {
console.log(AMapManager._componentMap);
// gaode map instance // gaode map instance
console.log(AMapManager._map); console.log(AMapManager._map);
alert('click text'); alert('click text');
} }
} }
}; };
</script> --> </script>
\ No newline at end of file \ No newline at end of file
...@@ -127,6 +127,7 @@ export default { ...@@ -127,6 +127,7 @@ export default {
that, that,
`/alarmInfo/getAlarmInfoList`,{}, `/alarmInfo/getAlarmInfoList`,{},
function(res) { function(res) {
console.log(res)
if (res.code == 0) { if (res.code == 0) {
that.$data.tableData = res.data.pageData; that.$data.tableData = res.data.pageData;
} }
...@@ -418,6 +419,10 @@ export default { ...@@ -418,6 +419,10 @@ export default {
} }
</script> </script>
<style> <style>
.el-table__body-wrapper::-webkit-scrollbar {
/*width: 0;宽度为0隐藏*/
width: 0px;
}
.pie-div{ .pie-div{
width: 100%; width: 100%;
height: 210px; height: 210px;
......
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