master
loveflow 6 months ago
parent a2f7f22a1c
commit d547e6ef21

@ -7,6 +7,7 @@
:rowKey="rowKey ? rowKey : ''"
@selection-change="selectionChange"
v-bind="$attrs"
style="width: 100%"
>
<!-- 多选批量操作 -->
<el-table-column
@ -113,9 +114,17 @@ export default {
.el-table__body-wrapper {
height: calc(100% - 50px);
overflow-y: scroll;
overflow-x: hidden;
&::-webkit-scrollbar-corner{
background: transparent;
}
&::-webkit-scrollbar {
display: none;
width: 6px;
height: 6px;
}
&::-webkit-scrollbar-thumb {
background: rgba(93, 106, 105, 1);
border-radius: 6px;
}
}
}

@ -1,5 +1,5 @@
<template>
<div style="height: 100%; width: 100%">
<div style="height: 100%; width: 100%" id="dpieWrap">
<g-chart :echartdata="option"></g-chart>
</div>
</template>
@ -16,6 +16,7 @@ export default {
data() {
return {
option: {},
fontSize: 10,
};
},
mounted() {
@ -23,6 +24,17 @@ export default {
},
methods: {
setOption() {
let temp = this.getHeight();
let height = parseInt(temp / 4);
console.log(height);
if (height > 40) {
this.fontSize = 12;
}
if (this.fontSize > 60) {
this.fontSize = 14;
}
let dataList = this.chartObj.data;
let maxArr = [];
let maxValue = 0;
@ -71,7 +83,7 @@ export default {
textStyle: {
verticalAlign: "bottom",
color: "#299CD4",
fontSize: 14,
fontSize: this.fontSize + 2,
fontFamily: "Microsoft YaHei",
align: "left",
padding: [0, 0, 5, 7],
@ -93,12 +105,12 @@ export default {
value: {
padding: [4, 0, 0, 4],
color: "#9CE0FF",
fontSize: 16,
fontSize: this.fontSize + 4,
},
rate: {
align: "right",
color: "rgba(255,255,255,0.9)",
fontSize: 12,
fontSize: this.fontSize,
},
},
},
@ -169,7 +181,7 @@ export default {
rich: {
a: {
color: "#9CE0FF",
fontSize: 16,
fontSize: this.fontSize + 4,
align: "right",
},
},
@ -201,6 +213,10 @@ export default {
],
};
},
getHeight() {
let div = document.getElementById("dpieWrap");
return div.clientHeight;
},
},
watch: {
chartObj: {

@ -21,7 +21,9 @@ export default {
},
methods: {
resize() {
this.dom.resize();
console.log(11111);
console.log( this.dom);
this.dom && this.dom.resize();
},
},
mounted() {

@ -1,5 +1,5 @@
<template>
<div class="dpiePanel">
<div class="dpiePanel" id="dpieWrap">
<div class="dpieLegend">
<div class="dpieRow" v-for="item in data" :key="item.name">
<div
@ -11,7 +11,14 @@
</div>
</div>
<div style="flex: 1">
<div class="dpiebg">
<div
class="dpiebg"
:style="{
height: parseInt(viewH) + 'px',
width: 2 * viewH + 'px',
marginLeft: parseInt(0.5 * viewH) + 'px',
}"
>
<div ref="dpieWrapRef" class="dpieWrap"></div>
</div>
</div>
@ -40,6 +47,7 @@ export default {
},
],
total: 1,
viewH: 1,
};
},
mounted() {
@ -48,12 +56,17 @@ export default {
this.total += this.data[i].value;
}
this.setOption();
let temp = this.getHeight();
let height = parseInt(temp / 3);
this.viewH = 2 * height;
console.log(height);
setTimeout(() => {
this.setOption();
}, 500);
},
methods: {
setOption() {
let optionsData = this.data;
let hoveredIndex = "";
let chartDom = this.$refs["dpieWrapRef"];
let myChart = echarts.init(chartDom);
const getPie3D = (pieData, internalDiameterRatio) => {
@ -144,7 +157,7 @@ export default {
show: false,
boxHeight: boxHeight, //
left: 0,
top: -20, //3d
top: -18, //3d
viewControl: {
//3d
alpha: 24, //
@ -267,6 +280,10 @@ export default {
});
option && myChart.setOption(option);
},
getHeight() {
let div = document.getElementById("dpieWrap");
return div.clientHeight;
},
},
watch: {
chartObj: {
@ -284,10 +301,16 @@ export default {
position: relative;
flex: 1;
height: 100%;
display: flex;
align-items: center;
.dpieLegend {
position: absolute;
right: 40px;
top: 28px;
right: vw(30);
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
.dpieRow {
display: flex;
align-items: center;
@ -311,11 +334,10 @@ export default {
}
}
.dpieWrap {
width: 240px;
height: 120px;
width: 100%;
height: 100%;
}
.dpiebg {
margin-top: 10px;
width: 240px;
height: 120px;
background: url("~@/assets/images/screen/dpie.png");

@ -16,6 +16,7 @@ export default {
data() {
return {
option: {},
fontSize: 12,
};
},
mounted() {
@ -23,6 +24,10 @@ export default {
},
methods: {
setOption() {
let temp = this.getHeight();
let height = parseInt(temp / 5);
this.viewH = 2 * height;
console.log(height);
let point = this.chartObj.point; //
let total = this.chartObj.total;
@ -37,14 +42,14 @@ export default {
text: this.chartObj.name,
textStyle: { fontSize: 12, lineHeight: 12, color: "#D0DEEE" },
subtextStyle: {
fontSize: 18,
fontSize: 16,
fontWeight: 500,
lineHeight: 10,
color: "#E3FEFF",
},
textAlign: "center",
left: "47%",
top: 140,
top: 4 * height - 16,
},
color: this.chartObj.color,
graphic: {
@ -53,8 +58,8 @@ export default {
type: "image",
style: {
image: this.chartObj.icon,
width: 160,
height: 160,
width: 4 * height,
height: 4 * height,
zIndex: 1,
},
left: "center",
@ -66,8 +71,8 @@ export default {
{
// name: '访1',
type: "pie",
radius: [30, 40],
center: ["center", 80],
radius: [height - 6, height],
center: ["center", 2 * height],
data: [
{
value: 100, //100%
@ -93,9 +98,10 @@ export default {
// name: '访2',
type: "pie",
showEmptyCircle: true, //
radius: [30, 40],
radius: [height - 6, height],
center: ["center", 2 * height],
avoidLabelOverlap: true, //
center: ["center", 80],
data: [
{
value: (point / total) * 100,

@ -1,5 +1,5 @@
<template>
<div class="dpiePanel">
<div class="dpiePanel" id="dpieWrap">
<div class="dpieLegend">
<div class="dpieRow" v-for="item in data" :key="item.name">
<div class="flex-center">
@ -13,7 +13,14 @@
</div>
</div>
<div class="" style="flex: 1">
<div class="dpiebg">
<div
class="dpiebg"
:style="{
height: parseInt(viewH) + 'px',
width: 2 * viewH + 'px',
marginLeft: parseInt(0.5 * viewH) + 'px',
}"
>
<div ref="dpieWrapRef" class="dpieWrap"></div>
</div>
</div>
@ -25,6 +32,7 @@ import "echarts-gl";
export default {
data() {
return {
fontSize: 12,
data: [
{
name: "资质正常企业数",
@ -42,6 +50,7 @@ export default {
},
],
total: 1,
viewH: 1,
};
},
mounted() {
@ -50,12 +59,18 @@ export default {
this.total += this.data[i].value;
}
this.setOption();
let temp = this.getHeight();
let height = parseInt(temp / 3);
this.viewH = 2 * height;
console.log(height);
setTimeout(() => {
this.setOption();
//window.addEventListener("resize", this.setOption(), false);
}, 500);
},
methods: {
setOption() {
let optionsData = this.data;
let hoveredIndex = "";
let chartDom = this.$refs["dpieWrapRef"];
let myChart = echarts.init(chartDom);
const getPie3D = (pieData, internalDiameterRatio) => {
@ -269,6 +284,10 @@ export default {
});
option && myChart.setOption(option);
},
getHeight() {
let div = document.getElementById("dpieWrap");
return div.clientHeight;
},
},
watch: {
chartObj: {
@ -287,7 +306,7 @@ export default {
flex: 1;
.dpieLegend {
position: absolute;
top: 20px;
top: vw(20);
right: 20px;
display: flex;
flex-direction: column;
@ -297,8 +316,7 @@ export default {
display: flex;
align-items: center;
justify-content: space-around;
width: vw(200);
margin-bottom: vw(16);
margin-bottom: vw(6);
//background-color: rgba(108, 128, 151, 0.1);
.dpieIcon {
margin-right: 6px;
@ -319,8 +337,8 @@ export default {
}
}
.dpieWrap {
width: 160px;
height: 70;
width: 100%;
height: 100%;
}
.dpiebg {
margin-top: vw(14);

@ -18,6 +18,7 @@
:style="{
height: parseInt(viewH) + 'px',
width: 2 * viewH + 'px',
marginTop: parseInt(0.6 * viewH) + 'px',
}"
>
<div ref="dpieWrapRef" class="dpieWrap"></div>
@ -67,7 +68,7 @@ export default {
}
let temp = this.getHeight();
let height = parseInt(temp / 4);
let height = parseInt(temp / 3);
this.viewH = 2 * height;
console.log(height);
this.fontSize = 12;

@ -35,7 +35,7 @@ export default {
.value {
margin-left: vw(76);
font-family: AlibabaPuHuiTiM;
font-size: vw(24);
font-size: vw(22);
color: #ffffff;
}
.name {

@ -1,6 +1,6 @@
<template>
<div style="height: 100%; width: 100%" id="pieWrap">
<g-chart :echartdata="option"></g-chart>
<g-chart ref="gChartRef" :echartdata="option"></g-chart>
</div>
</template>
<script>
@ -23,6 +23,7 @@ export default {
},
mounted() {
this.setOption();
window.addEventListener("resize", this.$refs.gChartRef.resize(), false);
},
methods: {
setOption() {

@ -16,6 +16,7 @@ export default {
data() {
return {
option: {},
fontSize: 12,
};
},
mounted() {
@ -23,6 +24,16 @@ export default {
},
methods: {
setOption() {
let temp = this.getHeight();
let height = parseInt(temp / 4);
console.log(height);
this.fontSize = 12;
if (height < 30) {
this.fontSize = 8;
}
if (height > 40) {
this.fontSize = 12;
}
let point = this.chartObj.point; //
let total = this.chartObj.total;
this.option = {
@ -31,11 +42,11 @@ export default {
show: true, //
text: this.chartObj.name,
textStyle: {
fontSize: 12,
fontSize: this.fontSize,
color: "#D0DEEE",
},
subtextStyle: {
fontSize: 14,
fontSize: this.fontSize,
fontWeight: 400,
lineHeight: 10,
color: "#E3FEFF",
@ -132,12 +143,12 @@ export default {
rich: {
b_style: {
padding: [0, 0, -8, 0],
fontSize: 12,
fontSize: this.fontSize,
fontWeight: 400,
color: "#D0DEEE",
},
c_style: {
fontSize: 14,
fontSize: this.fontSize,
fontWeight: 400,
color: "#D0DEEE",
},
@ -150,6 +161,10 @@ export default {
],
};
},
getHeight() {
let div = document.getElementById("pieWrap");
return div.clientHeight;
},
},
watch: {
chartObj: {

@ -78,7 +78,7 @@ export default {
this.option = {
tooltip: {
show: false,
trigger: "item",
},
legend: {
data: legend,

@ -68,7 +68,8 @@ export default {
},
};
</script>
<style lang="less">
<style lang="scss">
@import "@/loveflow/assets/index.scss";
.enterpriseTopicPanel {
padding: 20px;
height: 100%;
@ -118,7 +119,7 @@ export default {
);
border: 1px solid #5b748c;
.filterBtnWrap {
padding: 2px;
padding: vw(2);
&:last-child {
.el-divider {
display: none;
@ -129,10 +130,10 @@ export default {
display: flex;
justify-content: center;
align-items: center;
padding: 0 10px;
height: 34px;
padding: 0 vw(10);
height: vw(34);
font-weight: 400;
font-size: 14px;
font-size: vw(14);
color: #eaf6ff;
&.filterActive {
font-weight: 500;
@ -149,12 +150,3 @@ export default {
}
}
</style>
<style lang="scss" scoped>
@import "@/loveflow/assets/index.scss";
.enterpriseTopicPanel {
.personSafetyWrap {
.enterpriseTopicResult {
}
}
}
</style>

@ -140,10 +140,16 @@ export default {
{
prop: "phone",
label: "户口详址",
attrs: {
width: 180,
},
},
{
prop: "cmy",
label: "归属企业",
attrs: {
width: 180,
},
},
{
prop: "address",
@ -153,10 +159,16 @@ export default {
slot: "gwSlot",
prop: "address",
label: "文化程度",
attrs: {
width: 120,
},
},
{
prop: "personType",
label: "暂住地址",
attrs: {
width: 180,
},
},
{
prop: "date",
@ -173,10 +185,16 @@ export default {
{
prop: "address",
label: "所属派出所",
attrs: {
width: 120,
},
},
{
prop: "address",
label: "所属委员会",
attrs: {
width: 120,
},
},
{
prop: "date",

@ -119,7 +119,6 @@ export default {
data() {
return {
total: 53981 + "",
tl1Obj: {
name: "危险品领用人员",
total: 3400,
@ -148,7 +147,6 @@ export default {
icon: require("@/assets/images/topic/pie4b.png"),
color: ["#FFE3E3", "#FF2C2C", "#FF6D6D"],
},
tmObj: {
l1: {
icon: require("@/assets/images/topic/l1.png"),
@ -333,8 +331,11 @@ export default {
display: flex;
flex-direction: column;
flex: 1;
.topWrap {
height: 30%;
}
.btmWrap {
flex: 1;
height: 70%;
display: flex;
flex-direction: column;
.flowHead {

@ -5,10 +5,10 @@
<div class="screenRow screenRowTop mb14">
<div class="mr16 screenColOne">
<div
class="topCol mb14 pointer"
class="topCol pointer mb14"
@click="gotoPage('/topic/personSafety/screen')"
>
<colWrap title="人员安全风险评估">
<colWrap class="" title="人员安全风险评估">
<pieTwo :chartObj="tlObj"></pieTwo>
</colWrap>
</div>
@ -503,6 +503,9 @@ export default {
display: flex;
.left {
flex: 1;
display: flex;
flex-direction: column;
height: calc(100% - 14px);
.wxHead {
background: url("~@/assets/images/screen/wxl.png") no-repeat
center center;
@ -511,6 +514,9 @@ export default {
}
.right {
flex: 1;
display: flex;
flex-direction: column;
height: calc(100% - 14px);
.wxHead {
background: url("~@/assets/images/screen/wxr.png") no-repeat
center center;
@ -519,7 +525,7 @@ export default {
}
.wxHead {
padding: 0 10px;
height: 40px;
height: vw(40);
display: flex;
justify-content: space-between;
align-items: center;
@ -538,7 +544,7 @@ export default {
}
.wxBody {
padding: 0 10px;
height: calc(100% - 48px);
flex: 1;
background-color: rgba(108, 128, 151, 0.1);
overflow-y: scroll;
&::-webkit-scrollbar {
@ -563,7 +569,7 @@ export default {
.btmCol {
height: 60%;
.tableInfoWrap {
height: calc(100% - 40px);
height: calc(100% - 30px);
}
}
}
@ -572,12 +578,13 @@ export default {
height: 100%;
display: flex;
flex-direction: column;
overflow: hidden;
.screenChart {
display: flex;
flex-direction: column;
}
.topCol {
height: 120px;
height: 22%;
display: flex;
flex-direction: column;
.xfssWrap {
@ -589,14 +596,14 @@ export default {
}
}
.midCol {
flex: 1;
height: 20%;
display: flex;
flex-direction: column;
.xfzdWrap {
height: 68px;
height: 68%;
margin-bottom: 10px;
flex: 1;
padding: 4px;
padding: vw(4);
display: flex;
justify-content: space-between;
align-items: center;
@ -605,11 +612,11 @@ export default {
display: flex;
align-items: center;
border: 1px solid #495461;
padding: 2px 8px;
padding: vw(2) vw(8);
.icon {
margin-right: 4px;
width: 37px;
height: 40px;
width: vw(37);
height: vw(40);
img {
width: 100%;
}
@ -628,7 +635,7 @@ export default {
}
}
.btmCol {
flex: 2;
height: 36%;
display: flex;
flex-direction: column;
.xfsjWrap {
@ -644,7 +651,7 @@ export default {
display: flex;
flex-direction: column;
align-items: center;
padding: 2px 8px;
padding: vw(2) vw(8);
.icon {
margin-right: 4px;
width: vh(78);

Loading…
Cancel
Save