提交 197b59d5 authored 作者: 冯小芳's avatar 冯小芳

深色版修改

上级 3bde422c
差异被折叠。
...@@ -35,19 +35,25 @@ ...@@ -35,19 +35,25 @@
<div class="xbox-content user_line"> <div class="xbox-content user_line">
<div class="Progress"> <div class="Progress">
<p>{{ citys.municipal }}</p> <p>{{ citys.municipal }}</p>
<div class="percent">{{ citys.municipalnum }}%</div>
<el-progress <el-progress
type="circle" type="circle"
:percentage="citys.municipalnum" :percentage="citys.municipalnum"
:width="iswidth" :width="iswidth"
:show-text="false"
></el-progress> ></el-progress>
</div> </div>
<div class="Progress"> <div class="Progress">
<p>{{ citys.county }}</p> <p>{{ citys.county }}</p>
<div class="yellow">{{ citys.countynum }}%</div>
<el-progress <el-progress
type="circle" type="circle"
:percentage="citys.countynum" :percentage="citys.countynum"
color="#634cf0" color="#fac858"
:width="iswidth" :width="iswidth"
:show-text="false"
></el-progress> ></el-progress>
</div> </div>
</div> </div>
...@@ -80,44 +86,43 @@ export default defineComponent({ ...@@ -80,44 +86,43 @@ export default defineComponent({
MapTitle, MapTitle,
}, },
setup() {}, setup() {},
computed: { computed: {
...mapState({ ...mapState({
curDataType: (state) => state.curDataType, curDataType: (state) => state.curDataType,
}), }),
industryCardItems() { industryCardItems() {
return Mock[this.curDataType].industryCardItems; return Mock[this.curDataType].industryCardItems;
}, },
city() { city() {
return Mock[this.curDataType].city; return Mock[this.curDataType].city;
}, },
}, },
data() { data() {
return { return {
iswidth: 72, iswidth: 82,
}; };
}, },
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep .Progress .el-progress__text { // ::v-deep .Progress .el-progress__text {
position: relative; // position: relative;
top: -20px; // top: -20px;
left: 65px; // left: 75px;
font-size: 18px; // font-size: 18px;
color: #4198ff; // color: #4198ff;
} // }
::v-deep .Progress .el-progress__text span { // ::v-deep .Progress .el-progress__text span {
font-size: 20px // font-size: 20px;
} // }
.card-item { .card-item {
background: #fff; background-color: #0d417140;
border: 1px solid #125ba3;
border-radius: 5px; border-radius: 5px;
padding: 15px 20px; padding: 15px 20px;
overflow: hidden; overflow: hidden;
cursor: pointer; cursor: pointer;
transition: all 0.2s; transition: all 0.2s;
box-shadow: 2px 2px 10px #eee;
flex: 1; flex: 1;
height: 100%; height: 100%;
box-sizing: border-box; box-sizing: border-box;
...@@ -134,7 +139,7 @@ export default defineComponent({ ...@@ -134,7 +139,7 @@ export default defineComponent({
.xbox-content { .xbox-content {
height: 150px; height: 150px;
box-sizing: border-box; box-sizing: border-box;
background-color: #f8f9fb; background-color: #0e4785;
border-radius: 4px; border-radius: 4px;
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
...@@ -145,13 +150,26 @@ export default defineComponent({ ...@@ -145,13 +150,26 @@ export default defineComponent({
text-align: center; text-align: center;
position: relative; position: relative;
p { p {
color: #666666; color: #fff;
position: absolute; position: absolute;
top: 10px; top: 10px;
right: 23%; right: 20%;
font-size: 14px; font-size: 14px;
} }
.percent {
color: #4198ff;
position: absolute;
top: 40px;
right: 18%;
font-size: 16px;
}
.yellow {
color: #fac858;
position: absolute;
top: 40px;
right: 18%;
font-size: 16px;
}
} }
} }
.user_line { .user_line {
......
...@@ -114,10 +114,37 @@ export default defineComponent({ ...@@ -114,10 +114,37 @@ export default defineComponent({
yAxis: { yAxis: {
type: "value", type: "value",
name: "数量(次)", name: "数量(次)",
nameTextStyle: {
color: "#fff",
},
axisLabel: {
show: true,
color: "#fff",
},
splitLine: {
show: true,
lineStyle: {
color: "#125ba3",
type: "dotted",
},
},
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisCity, data: xAxisCity,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [seriesBar], series: [seriesBar],
}; };
...@@ -203,8 +230,8 @@ export default defineComponent({ ...@@ -203,8 +230,8 @@ export default defineComponent({
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
border-radius: 4px; border-radius: 4px;
color: #666666; color: #fff;
background: rgba(248, 249, 251, 1); background: #0e4785;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 0 10px 0 14px; padding: 0 10px 0 14px;
...@@ -212,12 +239,12 @@ export default defineComponent({ ...@@ -212,12 +239,12 @@ export default defineComponent({
margin-top: 10px; margin-top: 10px;
} }
.frequency { .frequency {
color: #19ecff;
font-size: 20px; font-size: 20px;
color: rgba(65, 152, 255, 1);
font-weight: 500; font-weight: 500;
} }
.second { .second {
color: #666666; color: #fff;
font-size: 12px; font-size: 12px;
font-weight: normal; font-weight: normal;
} }
......
...@@ -89,6 +89,19 @@ export default defineComponent({ ...@@ -89,6 +89,19 @@ export default defineComponent({
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisValue, data: xAxisValue,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [ series: [
{ {
...@@ -98,8 +111,9 @@ export default defineComponent({ ...@@ -98,8 +111,9 @@ export default defineComponent({
}, },
label: { label: {
show: true, show: true,
color: "#00dbf6",
position: "top", position: "top",
// formatter: "{c} 分", formatter: "{c} 分",
}, },
barWidth: 20, barWidth: 20,
data: this.seriesData, data: this.seriesData,
...@@ -148,7 +162,7 @@ export default defineComponent({ ...@@ -148,7 +162,7 @@ export default defineComponent({
box-sizing: border-box; box-sizing: border-box;
.text { .text {
color: #4198ff; color: #fff;
margin: 10px 0; margin: 10px 0;
font-size: 16px; font-size: 16px;
} }
......
...@@ -115,10 +115,37 @@ export default defineComponent({ ...@@ -115,10 +115,37 @@ export default defineComponent({
yAxis: { yAxis: {
type: "value", type: "value",
name: "数量(次)", name: "数量(次)",
nameTextStyle: {
color: "#fff",
},
axisLabel: {
show: true,
color: "#fff",
},
splitLine: {
show: true,
lineStyle: {
color: "#125ba3",
type: "dotted",
},
},
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisCity, data: xAxisCity,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [seriesBar], series: [seriesBar],
}; };
...@@ -171,10 +198,10 @@ export default defineComponent({ ...@@ -171,10 +198,10 @@ export default defineComponent({
flex: 1; flex: 1;
padding: 8px 15px; padding: 8px 15px;
margin-right: 15px; margin-right: 15px;
background: #f8f9fb; background: #0e4785;
border-radius: 5px; border-radius: 5px;
font-size: 14px; font-size: 14px;
color: #333; color: #fff;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
...@@ -183,13 +210,13 @@ export default defineComponent({ ...@@ -183,13 +210,13 @@ export default defineComponent({
} }
.value-des { .value-des {
font-size: 12px; font-size: 12px;
color: #999; color: #fff;
display: flex; display: flex;
align-items: center; align-items: center;
span { span {
font-size: 20px; font-size: 20px;
margin-right: 5px; margin-right: 5px;
color: #4198ff; color: #19ecff;
} }
} }
} }
......
...@@ -98,13 +98,13 @@ export default defineComponent({ ...@@ -98,13 +98,13 @@ export default defineComponent({
padding: [0, -100, 0, -100], padding: [0, -100, 0, -100],
rich: { rich: {
name1: { name1: {
color: "rgba(36, 36, 36, 1)", color: "#fff",
fontSize: 13, fontSize: 13,
align: "center", align: "center",
padding: [-5, -0, 0, -90], padding: [-5, -0, 0, -90],
}, },
name0: { name0: {
color: "rgba(36, 36, 36, 1)", color: "#fff",
fontSize: 13, fontSize: 13,
align: "center", align: "center",
}, },
...@@ -113,14 +113,14 @@ export default defineComponent({ ...@@ -113,14 +113,14 @@ export default defineComponent({
fontWeight: 500, fontWeight: 500,
fontSize: 22, fontSize: 22,
padding: [-5, -30, 0, -66], padding: [-5, -30, 0, -66],
color: "#1D91F5", color: PieColor[`level_${index + 1}`],
align: "center", align: "center",
}, },
percent0: { percent0: {
fontFamily: "DIN", fontFamily: "DIN",
fontWeight: 500, fontWeight: 500,
fontSize: 22, fontSize: 22,
color: "#1D91F5", color: PieColor[`level_${index + 1}`],
align: "center", align: "center",
}, },
small: { small: {
...@@ -129,9 +129,11 @@ export default defineComponent({ ...@@ -129,9 +129,11 @@ export default defineComponent({
}, },
text1: { text1: {
padding: [-5, 30, 0, 8], padding: [-5, 30, 0, 8],
color: "#fff",
}, },
text0: { text0: {
padding: [-5, 0, 0, 8], padding: [-5, 0, 0, 8],
color: "#fff",
}, },
cir0: { cir0: {
fontSize: 15, fontSize: 15,
...@@ -240,10 +242,10 @@ export default defineComponent({ ...@@ -240,10 +242,10 @@ export default defineComponent({
flex: 1; flex: 1;
padding: 8px 15px; padding: 8px 15px;
margin-right: 15px; margin-right: 15px;
background: #f8f9fb; background: #0e4785;
border-radius: 5px; border-radius: 5px;
font-size: 14px; font-size: 14px;
color: #333; color: #fff;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
...@@ -253,11 +255,11 @@ export default defineComponent({ ...@@ -253,11 +255,11 @@ export default defineComponent({
.value-des { .value-des {
// margin-top: 10px; // margin-top: 10px;
font-size: 12px; font-size: 12px;
color: #999; color: #fff;
span { span {
font-size: 20px; font-size: 20px;
margin-right: 5px; margin-right: 5px;
color: #4198ff; color: #19ecff;
} }
} }
} }
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<div class="card-item"> <div class="card-item">
<MapTitle text="领跑技术(产品)情况" /> <MapTitle text="国防科技工业产值规模分布" />
<div class="echarts-search"> <div class="echarts-search">
<div class="card-items"> <div class="card-items">
...@@ -170,10 +170,37 @@ export default defineComponent({ ...@@ -170,10 +170,37 @@ export default defineComponent({
yAxis: { yAxis: {
type: "value", type: "value",
name: "数量(个)", name: "数量(个)",
nameTextStyle: {
color: "#fff",
},
axisLabel: {
show: true,
color: "#fff",
},
splitLine: {
show: true,
lineStyle: {
color: "#125ba3",
type: "dotted",
},
},
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisCity, data: xAxisCity,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [...seriesBar], series: [...seriesBar],
}; };
...@@ -207,13 +234,14 @@ export default defineComponent({ ...@@ -207,13 +234,14 @@ export default defineComponent({
} }
.card-item { .card-item {
background: #fff; background-color: #0d417140;
border: 1px solid #125ba3;
border-radius: 5px; border-radius: 5px;
padding: 15px 20px; padding: 15px 20px;
overflow: hidden; overflow: hidden;
cursor: pointer; cursor: pointer;
transition: all 0.2s; transition: all 0.2s;
box-shadow: 2px 2px 10px #eee; // box-shadow: 2px 2px 10px #eee;
flex: 1; flex: 1;
height: 100%; height: 100%;
box-sizing: border-box; box-sizing: border-box;
...@@ -234,10 +262,10 @@ export default defineComponent({ ...@@ -234,10 +262,10 @@ export default defineComponent({
flex: 1; flex: 1;
padding: 8px 15px; padding: 8px 15px;
margin-right: 15px; margin-right: 15px;
background: #f8f9fb; background: #0d488d;
border-radius: 5px; border-radius: 5px;
font-size: 14px; font-size: 14px;
color: #333; color: #fff;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
...@@ -246,13 +274,13 @@ export default defineComponent({ ...@@ -246,13 +274,13 @@ export default defineComponent({
} }
.value-des { .value-des {
font-size: 12px; font-size: 12px;
color: #999; color: #fff;
display: flex; display: flex;
align-items: center; align-items: center;
span { span {
font-size: 20px; font-size: 20px;
margin-right: 5px; margin-right: 5px;
color: #4198ff; color: #19ecff;
} }
} }
} }
...@@ -262,6 +290,7 @@ export default defineComponent({ ...@@ -262,6 +290,7 @@ export default defineComponent({
.map-warpper { .map-warpper {
box-sizing: border-box; box-sizing: border-box;
.economic-construct { .economic-construct {
flex: 1; flex: 1;
} }
......
...@@ -126,10 +126,37 @@ export default defineComponent({ ...@@ -126,10 +126,37 @@ export default defineComponent({
yAxis: { yAxis: {
type: "value", type: "value",
name: "金额(亿元)", name: "金额(亿元)",
nameTextStyle: {
color: "#fff",
},
axisLabel: {
show: true,
color: "#fff",
},
splitLine: {
show: true,
lineStyle: {
color: "#125ba3",
type: "dotted",
},
},
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisCity, data: xAxisCity,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [...seriesBar], series: [...seriesBar],
}; };
...@@ -209,8 +236,8 @@ export default defineComponent({ ...@@ -209,8 +236,8 @@ export default defineComponent({
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
border-radius: 4px; border-radius: 4px;
color: #666666; color: #fff;
background: rgba(248, 249, 251, 1); background: #0e4785;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 0 10px 0 10px; padding: 0 10px 0 10px;
...@@ -218,7 +245,7 @@ export default defineComponent({ ...@@ -218,7 +245,7 @@ export default defineComponent({
margin-top: 10px; margin-top: 10px;
} }
.frequency { .frequency {
color: rgba(65, 152, 255, 1); color: #19ecff;
font-weight: 500; font-weight: 500;
font-size: 20px; font-size: 20px;
display: flex; display: flex;
...@@ -226,7 +253,7 @@ export default defineComponent({ ...@@ -226,7 +253,7 @@ export default defineComponent({
} }
.second { .second {
margin-left: 5px; margin-left: 5px;
color: #666666; color: #fff;
font-size: 12px; font-size: 12px;
font-weight: normal; font-weight: normal;
} }
......
...@@ -93,16 +93,31 @@ export default defineComponent({ ...@@ -93,16 +93,31 @@ export default defineComponent({
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisValue, data: xAxisValue,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [ series: [
{ {
type: "bar", type: "bar",
itemStyle: { itemStyle: {
color: "#4198ff", color: "#419afe",
}, },
label: { label: {
show: true, show: true,
color: "#00dbf6",
position: "top", position: "top",
formatter: "{c}分",
}, },
barWidth: 20, barWidth: 20,
data: this.seriesData, data: this.seriesData,
...@@ -159,7 +174,7 @@ export default defineComponent({ ...@@ -159,7 +174,7 @@ export default defineComponent({
box-sizing: border-box; box-sizing: border-box;
.text { .text {
color: #4198ff; color: #fff;
margin: 10px 0; margin: 10px 0;
font-size: 16px; font-size: 16px;
} }
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<MapTitle text="全省军民协同创新平台情况" /> <MapTitle text="全省军民协同创新平台情况" />
<div class="echarts-search"> <div class="echarts-search">
<div class="card-items"> <!-- <div class="card-items">
<div class="item"> <div class="item">
<span>协同创新平台</span> <span>协同创新平台</span>
<div class="value-des"> <div class="value-des">
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
> >
</div> </div>
</div> </div>
</div> </div> -->
<div class="title2X">历年军民协同创新平台情况</div> <div class="title2X">历年军民协同创新平台情况</div>
</div> </div>
...@@ -113,10 +113,37 @@ export default defineComponent({ ...@@ -113,10 +113,37 @@ export default defineComponent({
name: "数量(个)", name: "数量(个)",
min: 0, min: 0,
max: 250, max: 250,
nameTextStyle: {
color: "#fff",
},
axisLabel: {
show: true,
color: "#fff",
},
splitLine: {
show: true,
lineStyle: {
color: "#125ba3",
type: "dotted",
},
},
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisCity, data: xAxisCity,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [...seriesBar], series: [...seriesBar],
}; };
...@@ -189,12 +216,12 @@ export default defineComponent({ ...@@ -189,12 +216,12 @@ export default defineComponent({
.title2X { .title2X {
margin-top: 15px; margin-top: 15px;
font-size: 16px; font-size: 16px;
color: #4198ff; color: #fff;
} }
.target-bar { .target-bar {
flex: 1; flex: 1;
height: calc(100% - 120px); height: calc(100% - 70px);
box-sizing: border-box; box-sizing: border-box;
margin-top: 10px; margin-top: 10px;
} }
......
...@@ -198,7 +198,7 @@ export default defineComponent({ ...@@ -198,7 +198,7 @@ export default defineComponent({
padding: 10px 15px; padding: 10px 15px;
margin-right: 15px; margin-right: 15px;
background: #f8f9fb; background: #0d488d;
border-radius: 5px; border-radius: 5px;
font-size: 14px; font-size: 14px;
color: #333; color: #333;
...@@ -206,14 +206,17 @@ export default defineComponent({ ...@@ -206,14 +206,17 @@ export default defineComponent({
&:last-of-type { &:last-of-type {
margin-right: 0; margin-right: 0;
} }
span {
color: #fff;
}
.value-des { .value-des {
margin-top: 10px; margin-top: 10px;
font-size: 12px; font-size: 12px;
color: #999; color: #fff;
span { span {
font-size: 20px; font-size: 20px;
margin-right: 5px; margin-right: 5px;
color: #4198ff; color: #19ecff;
} }
} }
} }
...@@ -232,7 +235,7 @@ export default defineComponent({ ...@@ -232,7 +235,7 @@ export default defineComponent({
border-radius: 5px; border-radius: 5px;
.el-row { .el-row {
font-size: 14px; font-size: 14px;
color: #333; color: #fff;
} }
.pie-value { .pie-value {
margin-top: 5px; margin-top: 5px;
...@@ -241,11 +244,11 @@ export default defineComponent({ ...@@ -241,11 +244,11 @@ export default defineComponent({
color: #999; color: #999;
display: flex; display: flex;
align-items: center; align-items: center;
color: #4198ff; color: #19ecff;
font-size: 20px; font-size: 20px;
span { span {
font-size: 12px; font-size: 12px;
color: rgba(153, 153, 153, 1); color: #fff;
} }
} }
.square { .square {
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<TotalContrac /> <TotalContrac />
</el-col> </el-col>
<el-col :span="11" :offset="1"> <el-col :span="11" :offset="1">
<Activity /> <Activity />
</el-col> </el-col>
</el-row> </el-row>
</el-col> </el-col>
...@@ -55,7 +55,7 @@ export default defineComponent({ ...@@ -55,7 +55,7 @@ export default defineComponent({
Facility, Facility,
}, },
setup() {}, setup() {},
computed: { computed: {
...mapState({ ...mapState({
curDataType: (state) => state.curDataType, curDataType: (state) => state.curDataType,
}), }),
...@@ -65,23 +65,21 @@ export default defineComponent({ ...@@ -65,23 +65,21 @@ export default defineComponent({
extendCardItems() { extendCardItems() {
return Mock[this.curDataType].extendCardItems; return Mock[this.curDataType].extendCardItems;
}, },
}, },
data() { data() {
return { return {};
};
}, },
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.card-item { .card-item {
background: #fff; background-color: #0d417140;
border: 1px solid #125ba3;
border-radius: 5px; border-radius: 5px;
padding: 16px; padding: 16px;
overflow: hidden; overflow: hidden;
cursor: pointer; cursor: pointer;
transition: all 0.2s; transition: all 0.2s;
box-shadow: 2px 2px 10px #eee;
flex: 1; flex: 1;
height: 100%; height: 100%;
box-sizing: border-box; box-sizing: border-box;
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="meeting"> <div class="meeting">
<div>合同成交总额</div> <div>合同成交总额</div>
<div class="frequency"> <div class="frequency">
{{ seriesData[0].value.reduce((total, num) => total + num) || "--" }} {{ seriesData[0].value.reduce((total, num) => total + num) || "--" }}
<span class="second">万元</span> <span class="second">万元</span>
</div> </div>
</div> </div>
...@@ -71,14 +71,12 @@ export default defineComponent({ ...@@ -71,14 +71,12 @@ export default defineComponent({
return { return {
type: "line", type: "line",
lineStyle: { lineStyle: {
type: "dashed", type: "dotted",
color: "#3aba67",
}, },
itemStyle: { itemStyle: {
color: "#4198ff", color: "#fff",
}, },
itemStyle: {
color: "#3aba67",
},
barWidth: 20, barWidth: 20,
data: item.value.map((item) => { data: item.value.map((item) => {
...@@ -93,7 +91,10 @@ export default defineComponent({ ...@@ -93,7 +91,10 @@ export default defineComponent({
return { return {
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
axisPointer: {
type: "line",
color: "#3aba67",
},
formatter: (params) => { formatter: (params) => {
let html = ``; let html = ``;
...@@ -118,12 +119,39 @@ export default defineComponent({ ...@@ -118,12 +119,39 @@ export default defineComponent({
yAxis: { yAxis: {
type: "value", type: "value",
name: "金额(万元)", name: "金额(万元)",
splitNumber: 4 splitNumber: 4,
nameTextStyle: {
color: "#fff",
},
axisLabel: {
show: true,
color: "#fff",
},
splitLine: {
show: true,
lineStyle: {
color: "#125ba3",
type: "dotted",
},
},
// min: 10000 // min: 10000
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisCity, data: xAxisCity,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [...seriesBar], series: [...seriesBar],
}; };
...@@ -202,21 +230,21 @@ export default defineComponent({ ...@@ -202,21 +230,21 @@ export default defineComponent({
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
border-radius: 4px; border-radius: 4px;
color: #666666; color: #fff;
background: rgba(248, 249, 251, 1); background: #0d488d;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 0 10px 0 10px; padding: 0 10px 0 10px;
box-sizing: border-box; box-sizing: border-box;
margin-top: 10px; margin-top: 10px;
.frequency { .frequency {
color: rgba(65, 152, 255, 1); color: #19ecff;
font-weight: 500; font-weight: 500;
font-size: 20px; font-size: 20px;
} }
.second { .second {
color: #999; color: #fff;
font-size: 14px font-size: 14px;
} }
} }
.text { .text {
......
...@@ -58,6 +58,8 @@ export default defineComponent({ ...@@ -58,6 +58,8 @@ export default defineComponent({
label: { label: {
show: true, show: true,
position: "right", position: "right",
color: "#00dbf6",
formatter: "{c}台",
}, },
barWidth: 18, barWidth: 18,
data: item.value.map((barItem, barIndex) => { data: item.value.map((barItem, barIndex) => {
...@@ -98,15 +100,46 @@ export default defineComponent({ ...@@ -98,15 +100,46 @@ export default defineComponent({
{ {
type: "category", type: "category",
data: xAxisValue, data: xAxisValue,
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisLabel: {
show: true,
color: "#ffffff",
},
axisTick: {
show: false,
},
}, },
], ],
xAxis: [ xAxis: [
{ {
type: "value", type: "value",
max:1000, max: 1000,
name: "数量(台)", name: "数量(台)",
axisLine: { nameTextStyle: {
color: "#fff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisLabel: {
show: true, show: true,
color: "#ffffff",
},
axisTick: {
show: false,
},
splitLine: {
show: false,
}, },
}, },
], ],
......
...@@ -73,7 +73,7 @@ export default defineComponent({ ...@@ -73,7 +73,7 @@ export default defineComponent({
type: "bar", type: "bar",
itemStyle: { itemStyle: {
color: "#634cf0", color: "#4198ff",
}, },
barWidth: 20, barWidth: 20,
...@@ -116,10 +116,37 @@ export default defineComponent({ ...@@ -116,10 +116,37 @@ export default defineComponent({
yAxis: { yAxis: {
type: "value", type: "value",
name: "数量(个)", name: "数量(个)",
nameTextStyle: {
color: "#fff",
},
axisLabel: {
show: true,
color: "#fff",
},
splitLine: {
show: true,
lineStyle: {
color: "#125ba3",
type: "dotted",
},
},
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisCity, data: xAxisCity,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [...seriesBar], series: [...seriesBar],
}; };
...@@ -197,20 +224,20 @@ export default defineComponent({ ...@@ -197,20 +224,20 @@ export default defineComponent({
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
border-radius: 4px; border-radius: 4px;
color: #666666; color: #fff;
background: rgba(248, 249, 251, 1); background: #0d488d;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 0 10px 0 10px; padding: 0 10px 0 10px;
box-sizing: border-box; box-sizing: border-box;
margin-top: 10px; margin-top: 10px;
.frequency { .frequency {
color: rgba(65, 152, 255, 1); color: #19ecff;
font-weight: 500; font-weight: 500;
font-size: 20px; font-size: 20px;
} }
.second { .second {
color: #999; color: #fff;
font-size: 14px; font-size: 14px;
} }
} }
......
...@@ -94,6 +94,19 @@ export default defineComponent({ ...@@ -94,6 +94,19 @@ export default defineComponent({
xAxis: { xAxis: {
type: "category", type: "category",
data: xAxisValue, data: xAxisValue,
axisLabel: {
show: true,
color: "#ffffff",
},
axisLine: {
show: true,
lineStyle: {
color: "#125ba3",
},
},
axisTick: {
show: false,
},
}, },
series: [ series: [
{ {
...@@ -104,8 +117,9 @@ export default defineComponent({ ...@@ -104,8 +117,9 @@ export default defineComponent({
barWidth: 20, barWidth: 20,
label: { label: {
show: true, show: true,
color: "#00dbf6",
position: "top", position: "top",
// formatter: "{c}亿元" formatter: "{c}分",
}, },
data: this.seriesData, data: this.seriesData,
}, },
...@@ -165,7 +179,7 @@ export default defineComponent({ ...@@ -165,7 +179,7 @@ export default defineComponent({
.echarts-search { .echarts-search {
padding-left: 10px; padding-left: 10px;
.title { .title {
color: #4198ff; color: #fff;
margin: 10px 0; margin: 10px 0;
font-size: 16px; font-size: 16px;
} }
......
...@@ -100,7 +100,7 @@ export default defineComponent({ ...@@ -100,7 +100,7 @@ export default defineComponent({
optionBar() { optionBar() {
const seriesBar = { const seriesBar = {
type: "pie", type: "pie",
radius: ["40%", "70%"], radius: ["30%", "60%"],
itemStyle: { itemStyle: {
borderRadius: 0, borderRadius: 0,
}, },
...@@ -242,20 +242,20 @@ export default defineComponent({ ...@@ -242,20 +242,20 @@ export default defineComponent({
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
border-radius: 4px; border-radius: 4px;
color: #666666; color: #fff;
background: rgba(248, 249, 251, 1); background: #0d488d;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 0 10px 0 10px; padding: 0 10px 0 10px;
box-sizing: border-box; box-sizing: border-box;
margin-top: 10px; margin-top: 10px;
.frequency { .frequency {
color: rgba(65, 152, 255, 1); color: #19ecff;
font-weight: 500; font-weight: 500;
font-size: 20px; font-size: 20px;
} }
.second { .second {
color: #999; color: #fff;
font-size: 14px; font-size: 14px;
} }
} }
...@@ -279,7 +279,7 @@ export default defineComponent({ ...@@ -279,7 +279,7 @@ export default defineComponent({
box-sizing: border-box; box-sizing: border-box;
.el-row { .el-row {
font-size: 14px; font-size: 14px;
color: #333; color: #fff;
} }
.pie-value { .pie-value {
padding-left: 20px; padding-left: 20px;
...@@ -291,7 +291,7 @@ export default defineComponent({ ...@@ -291,7 +291,7 @@ export default defineComponent({
span { span {
margin-left: 5px; margin-left: 5px;
font-size: 12px; font-size: 12px;
color: rgba(153, 153, 153, 1); color: #fff;
} }
} }
.square { .square {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论