lixuefeng/fengjie-datascreen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix 样式优化

Browse Source
This commit is contained in:
duanliang
2026-01-25 19:05:28 +08:00
parent e23a541799
commit 4d81265f97
8 changed files with 78 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Title1/index.vue
View File

@@ -21,7 +21,7 @@
position: relative;
.title {
margin: vh(20) auto;
width: vw(450);
width: vw(640);
height: vh(66);
display: flex;
align-items: center;

1
src/components/Title3/index.vue
View File

@@ -21,7 +21,6 @@
margin-top: vh(20);
background-image: url('@/assets/images/title-6.png');
background-size: 100% 100%;
& > span {
position: absolute;
bottom: vh(4);

26
src/views/home/components/box-2.vue
View File

@@ -1,6 +1,7 @@
<template>
<div class="box-3" :class="homeStore.amplify?'':'coll-box'">
<div class="header" :class="homeStore.amplify?'':'coll-box-2'">
<div class="header-2"></div>
<div class="header top-header" :class="homeStore.amplify?'':'coll-box-2'">
<div class="flex">
<div class="left">
<div class="item"
@@ -878,8 +879,23 @@
height:100%;
flex:1;
margin-top: vh(120);
.header-2{
height: vh(128);
padding: 0 vw(40);
box-sizing: border-box;
// background-image: url('@/assets/images/group.png');
background-size: 100% 100%;
}
.top-header{
position:absolute;
width: vw(1750);
left:50%;
transform: translateX(-50%);
top:vh(110);
}
.header {
// width: vw(1400);
height: vh(128);
padding: 0 vw(40);
box-sizing: border-box;
@@ -887,10 +903,10 @@
background-size: 100% 100%;
.left {
display: flex;
width: vw(840);
// width: vw(840);
margin-top: vh(20);
flex:1;
flex: 1;
margin-left:vw(20);
}
.right {
flex: 1;

8
src/views/home/components/vacancy.vue
View File

@@ -128,7 +128,7 @@
show: true,
axisLabel: {
color: '#fff',
fontSize: fitChartSize(12),
fontSize: fitChartSize(16),
verticalAlign: 'bottom',
padding: [0, 0, 6, 0],
inside: true,
@@ -141,13 +141,13 @@
align: 'center',
color: '#fff',
fontWeight: 600,
fontSize: fitChartSize(14)
fontSize: fitChartSize(16)
},
total: {
align: 'center',
color: '#fff',
fontWeight: 600,
fontSize: fitChartSize(14)
fontSize: fitChartSize(16)
},
}
},
@@ -172,7 +172,7 @@
fontWeight: 500,
position: 'left',
align: 'left',
fontSize: fitChartSize(14),
fontSize: fitChartSize(16),
formatter: function (params) {
return params.data.name
}

8
src/views/workOrder/components/box-2.vue
View File

@@ -70,7 +70,7 @@
</div>
<div class="box-2">
<Title1 title="不同景区工单占比" />
<div class="chart">
<div class="chart" style="padding-top: 0;">
<div class="chart__wrapper">
<Title3 title="景区工单占比" />
<div class="chart__inner">
@@ -343,11 +343,13 @@
&__inner {
display: flex;
align-items: center;
justify-content: center;
}
&__legend {
flex: 1;
// flex: 1;
width: vw(800);
margin-left:vw(50);
&-item {
position: relative;
width: 50%;

12
src/views/workOrder/components/box-3.vue
View File

@@ -44,7 +44,7 @@
</div>
</div>
</div>
<div class="chart-box">
<div class="chart-box" style="justify-content: center;align-items: center;">
<newsRate :dataList="newsStateList" />
<ul class="chart__legend">
<li class="chart__legend-item" v-for="(item, index) in newsStateList" :key="index">
@@ -160,14 +160,14 @@
.name {
font-weight: 400;
font-size: vw(12);
font-size: font-vw(18);
color: #ffffff;
width: vw(130);
}
.value {
font-weight: bold;
font-size: vw(15);
font-size: font-vw(20);
color: #ffffff;
}
}
@@ -233,10 +233,16 @@
}
.label--warning {
@extend .label;
width:initial;
height:initial;
padding:vw(15);
background: #feae00;
}
.label--error {
width:initial;
height:initial;
@extend .label;
padding:vw(15);
background: #d9011b;
}
.time {

13
src/views/workOrder/components/newsRate.vue
View File

@@ -55,11 +55,11 @@
rich: {
name: {
color: '#fff',
fontSize: fitChartSize(12)
fontSize: fitChartSize(18)
},
value: {
color: '#fff',
fontSize: fitChartSize(12)
fontSize: fitChartSize(18)
}
}
}
@@ -80,13 +80,13 @@
rich: {
value: {
color: '#fff',
fontSize: fitChartSize(16),
fontSize: fitChartSize(18),
fontWeight: 'bold',
padding: [0, 0, 5, 0]
},
name: {
color: '#fff',
fontSize: fitChartSize(12)
fontSize: fitChartSize(18)
}
}
},
@@ -158,7 +158,8 @@
<style scoped lang="scss">
.alarmRate {
width: vw(380);
height: vh(180);
width: vw(440);
height: vh(300);
}
</style>

38
src/views/workOrder/components/spotRate.vue
View File

@@ -34,12 +34,36 @@
const { id, setOption } = useEchart()
var defaultCofig = {
color: [],
color: [],
legend: {
orient: 'vertical',
y: 'center',
left: '50%',
itemWidth: fitChartSize(18),
itemHeight: fitChartSize(18),
itemGap: fitChartSize(6),
formatter: (name) => {
let obj = props.dataList.find((item) => item.name == name)
return `{name|${name}} {value|${obj?.value}}{value|%}`
},
textStyle: {
rich: {
name: {
color: '#fff',
fontSize: fitChartSize(18)
},
value: {
color: '#fff',
fontSize: fitChartSize(18)
}
}
}
},
series: [
{
type: 'pie',
center: ['50%', '50%'],
radius: ['70%', '90%'],
center: ['24%', '50%'],
radius: ['35%', '50%'],
itemStyle: {
borderWidth: fitChartSize(4),
borderColor: '#093672'
@@ -51,13 +75,13 @@
rich: {
value: {
color: '#fff',
fontSize: fitChartSize(24),
fontSize: fitChartSize(20),
fontWeight: 'bold',
padding: [0, 0, 5, 0]
},
name: {
color: '#fff',
fontSize: fitChartSize(12)
fontSize: fitChartSize(22)
}
}
},
@@ -92,7 +116,7 @@
<style scoped lang="scss">
.spotRate {
width: vw(240);
height: vh(320);
width: vw(640);
height: vh(400);
}
</style>