|
@@ -5,19 +5,48 @@
|
|
|
<div ref="chartRef" class="charts-container"></div>
|
|
|
<div class="describe-container">
|
|
|
<div>
|
|
|
- <span class="typeText">生产目标</span>
|
|
|
- <span class="valueText">{{ progressOption.orderNum }}</span>
|
|
|
- <span class="unitText">件</span>
|
|
|
+ <span
|
|
|
+ class="typeText"
|
|
|
+ :style="{ fontSize: bigScreenData.fontSize * 1.7 + 'px' }"
|
|
|
+ >生产目标</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ class="valueText"
|
|
|
+ :style="{ fontSize: bigScreenData.fontSize * 1.9 + 'px' }"
|
|
|
+ >{{ progressOption.orderNum }}</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ class="unitText"
|
|
|
+ :style="{ fontSize: bigScreenData.fontSize * 1.7 + 'px' }"
|
|
|
+ >件</span
|
|
|
+ >
|
|
|
</div>
|
|
|
<div>
|
|
|
- <span class="typeText">实际生产量</span>
|
|
|
- <span class="valueText">{{ progressOption.comNum }}</span>
|
|
|
- <span class="unitText">件</span>
|
|
|
+ <span
|
|
|
+ class="typeText"
|
|
|
+ :style="{ fontSize: bigScreenData.fontSize * 1.7 + 'px' }"
|
|
|
+ >实际生产量</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ class="valueText"
|
|
|
+ :style="{ fontSize: bigScreenData.fontSize * 1.9 + 'px' }"
|
|
|
+ >{{ progressOption.comNum }}</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ class="unitText"
|
|
|
+ :style="{ fontSize: bigScreenData.fontSize * 1.7 + 'px' }"
|
|
|
+ >件</span
|
|
|
+ >
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="bottom-progress">
|
|
|
- <div class="titleText">月进度</div>
|
|
|
+ <div
|
|
|
+ class="titleText"
|
|
|
+ :style="{ fontSize: bigScreenData.fontSize * 1.9 + 'px' }"
|
|
|
+ >
|
|
|
+ 月进度
|
|
|
+ </div>
|
|
|
<dv-percent-pond
|
|
|
:config="progressOption"
|
|
|
style="width: 100%; height: 20px"
|
|
@@ -30,7 +59,7 @@
|
|
|
import ScreenComHeader from "@/views/screens/configs/screenComHeader.vue";
|
|
|
import * as echarts from "echarts";
|
|
|
import { productionQuantity } from "@/api/screens";
|
|
|
-
|
|
|
+const bigScreenData: any = inject("bigScreenData");
|
|
|
const chartRef = ref(null);
|
|
|
|
|
|
const generateOption = (c: string, o: string) => {
|
|
@@ -61,7 +90,7 @@ const generateOption = (c: string, o: string) => {
|
|
|
axisLabel: {
|
|
|
distance: 12,
|
|
|
color: "#999",
|
|
|
- fontSize: 14,
|
|
|
+ fontSize: bigScreenData.value.fontSize * 1.5,
|
|
|
},
|
|
|
anchor: {
|
|
|
show: true,
|
|
@@ -76,7 +105,7 @@ const generateOption = (c: string, o: string) => {
|
|
|
},
|
|
|
detail: {
|
|
|
valueAnimation: true,
|
|
|
- fontSize: 16,
|
|
|
+ fontSize: bigScreenData.value.fontSize * 2,
|
|
|
offsetCenter: [0, "70%"],
|
|
|
formatter: "{value}%",
|
|
|
textStyle: {
|
|
@@ -142,7 +171,7 @@ const props = defineProps({
|
|
|
|
|
|
.titleText {
|
|
|
color: white;
|
|
|
- font-size: 14px;
|
|
|
+
|
|
|
width: 60px;
|
|
|
margin-right: 10px;
|
|
|
}
|