提交 f8a0e5da authored 作者: 邓文彬's avatar 邓文彬

fix(资源开放共享): UI优化

上级 eb73949c
...@@ -11,12 +11,7 @@ ...@@ -11,12 +11,7 @@
<TotalContrac /> <TotalContrac />
</el-col> </el-col>
<el-col :span="11" :offset="1"> <el-col :span="11" :offset="1">
<Activity <Activity />
echartsId="activityBar"
echartsTitle="军地需求对接活动情况"
echartsDesText=""
:cardItems="extendCardItems"
/>
</el-col> </el-col>
</el-row> </el-row>
</el-col> </el-col>
...@@ -32,11 +27,7 @@ ...@@ -32,11 +27,7 @@
<el-col class="map-left" :span="8"> <el-col class="map-left" :span="8">
<div class="business-extend footer-item card-item"> <div class="business-extend footer-item card-item">
<Facility <Facility />
echartsId="industryDistribute"
echartsTitle="军工科研设备设施开放共享情况"
:cardItems="industryCardItems"
/>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<div class="text">合同成交额分布情况</div> <div class="text">合同成交额分布情况</div>
</div> </div>
<div :id="echartsId" class="bar-echarts-line"></div> <div id="activityBar" class="bar-echarts-line"></div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent } from "vue"; import { defineComponent } from "vue";
...@@ -40,35 +40,6 @@ const xAxisCity = [ ...@@ -40,35 +40,6 @@ const xAxisCity = [
* 军地需求对接活动数量 * 军地需求对接活动数量
*/ */
export default defineComponent({ export default defineComponent({
props: {
echartsTitle: {
type: String,
required: true,
},
echartsDesText: {
type: String,
required: true,
},
cardItems: {
type: Array,
required: true,
dafault: () => [],
},
echartsData: {
type: Array,
// required: true,
dafault: () => [],
},
echartsAxisValue: {
type: Array,
// required: true,
dafault: () => [],
},
echartsId: {
type: String,
required: true,
},
},
components: { components: {
MapTitle, MapTitle,
}, },
...@@ -144,6 +115,8 @@ export default defineComponent({ ...@@ -144,6 +115,8 @@ export default defineComponent({
yAxis: { yAxis: {
type: "value", type: "value",
name: "金额(万元)", name: "金额(万元)",
splitNumber: 4
// min: 10000
}, },
xAxis: { xAxis: {
type: "category", type: "category",
...@@ -155,7 +128,7 @@ export default defineComponent({ ...@@ -155,7 +128,7 @@ export default defineComponent({
}, },
methods: { methods: {
initEcharts() { initEcharts() {
const dom = document.getElementById(this.echartsId); const dom = document.getElementById("activityBar");
MAP_ECHARTS = echarts.init(dom); MAP_ECHARTS = echarts.init(dom);
MAP_ECHARTS.setOption(this.optionBar); MAP_ECHARTS.setOption(this.optionBar);
this.mapEcharts = MAP_ECHARTS; this.mapEcharts = MAP_ECHARTS;
...@@ -214,7 +187,7 @@ export default defineComponent({ ...@@ -214,7 +187,7 @@ export default defineComponent({
<style lang="scss" scoped> <style lang="scss" scoped>
.bar-echarts-line { .bar-echarts-line {
flex: 1; flex: 1;
height: calc(100% - 150px); height: calc(100% - 180px);
box-sizing: border-box; box-sizing: border-box;
} }
.activity-describes { .activity-describes {
......
<template> <template>
<MapTitle :text="echartsTitle" /> <MapTitle text="军工科研设备设施开放共享情况" />
<div :id="echartsId" class="facility-echarts-line"></div> <div id="industryDistribute" class="facility-echarts-line"></div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent } from "vue"; import { defineComponent } from "vue";
...@@ -19,14 +19,7 @@ const xAxisValue = ["2018年", "2019年", "2020年", "2021年"]; ...@@ -19,14 +19,7 @@ const xAxisValue = ["2018年", "2019年", "2020年", "2021年"];
*/ */
export default defineComponent({ export default defineComponent({
props: { props: {
echartsTitle: {
type: String,
required: true,
},
echartsId: {
type: String,
required: true,
},
}, },
components: { components: {
MapTitle, MapTitle,
...@@ -91,8 +84,8 @@ export default defineComponent({ ...@@ -91,8 +84,8 @@ export default defineComponent({
}, },
}, },
grid: { grid: {
left: "2%", left: "3%",
right: "10%", right: "5%",
bottom: "3%", bottom: "3%",
containLabel: true, containLabel: true,
}, },
...@@ -112,7 +105,7 @@ export default defineComponent({ ...@@ -112,7 +105,7 @@ export default defineComponent({
}, },
methods: { methods: {
initEcharts() { initEcharts() {
const dom = document.getElementById(this.echartsId); const dom = document.getElementById("industryDistribute");
MAP_ECHARTS = echarts.init(dom); MAP_ECHARTS = echarts.init(dom);
MAP_ECHARTS.setOption(this.optionBar); MAP_ECHARTS.setOption(this.optionBar);
this.mapEcharts = MAP_ECHARTS; this.mapEcharts = MAP_ECHARTS;
......
...@@ -108,8 +108,8 @@ export default defineComponent({ ...@@ -108,8 +108,8 @@ export default defineComponent({
legend: {}, legend: {},
grid: { grid: {
top: "12%", top: "12%",
left: "2%", left: "1%",
right: "2%", right: "1%",
bottom: "3%", bottom: "3%",
containLabel: true, containLabel: true,
}, },
......
...@@ -82,7 +82,7 @@ export default defineComponent({ ...@@ -82,7 +82,7 @@ export default defineComponent({
grid: { grid: {
top: 0, top: 0,
left: "-5%", left: "-5%",
right: "5%", right: "0%",
bottom: "3%", bottom: "3%",
containLabel: true, containLabel: true,
}, },
......
...@@ -100,9 +100,8 @@ export default defineComponent({ ...@@ -100,9 +100,8 @@ export default defineComponent({
optionBar() { optionBar() {
const seriesBar = { const seriesBar = {
type: "pie", type: "pie",
radius: [20, 140], // radius: [20, 140],
radius: ["38%", "90%"], radius: ['40%', '70%'],
roseType: "radius",
itemStyle: { itemStyle: {
borderRadius: 0, borderRadius: 0,
}, },
...@@ -137,7 +136,7 @@ export default defineComponent({ ...@@ -137,7 +136,7 @@ export default defineComponent({
return { return {
tooltip: { tooltip: {
trigger: "item", // trigger: "item",
}, },
grid: { grid: {
...@@ -279,15 +278,14 @@ export default defineComponent({ ...@@ -279,15 +278,14 @@ export default defineComponent({
color: #333; color: #333;
} }
.pie-value { .pie-value {
// margin-top: 5px;
padding-left: 20px; padding-left: 20px;
font-size: 12px; font-size: 20px;
color: #999; color: #999;
display: flex; display: flex;
align-items: center; align-items: center;
color: #4198ff; color: #4198ff;
font-size: 18px;
span { span {
margin-left: 5px;
font-size: 12px; font-size: 12px;
color: rgba(153, 153, 153, 1); color: rgba(153, 153, 153, 1);
} }
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论