From 1c829f9177eab675b22be4d20ef2761ed1bbb423 Mon Sep 17 00:00:00 2001
From: 云 <2163098428@qq.com>
Date: 星期二, 15 九月 2026 16:15:48 +0800
Subject: [PATCH] refactor(layout): 调整布局样式并优化轮播卡片组件
---
src/views/reportAnalysis/productionAnalysis/components/left-bottom.vue | 33 +++++++++++++--------------------
1 files changed, 13 insertions(+), 20 deletions(-)
diff --git a/src/views/reportAnalysis/productionAnalysis/components/left-bottom.vue b/src/views/reportAnalysis/productionAnalysis/components/left-bottom.vue
index 33f431d..c5e2904 100644
--- a/src/views/reportAnalysis/productionAnalysis/components/left-bottom.vue
+++ b/src/views/reportAnalysis/productionAnalysis/components/left-bottom.vue
@@ -1,7 +1,7 @@
<template>
<div>
<PanelHeader title="鍦ㄥ埗鍝佺粺璁″垎鏋�" />
- <div class="main-panel panel-item-customers">
+ <div class="main-panel panel-item-customers bi-panel">
<CarouselCards :items="cardItems" :visible-count="3" />
<div class="chart-wrapper">
<Echarts
@@ -13,7 +13,7 @@
:tooltip="tooltip"
:xAxis="workInProcessXAxis"
:yAxis="workInProcessYAxis"
- :options="{ backgroundColor: 'transparent', textStyle: { color: '#B8C8E0' } }"
+ :options="{ backgroundColor: 'transparent', textStyle: { color: BI_COLORS.text } }"
style="height: 100%"
/>
</div>
@@ -27,6 +27,7 @@
import PanelHeader from './PanelHeader.vue'
import CarouselCards from './CarouselCards.vue'
import { getWorkInProcessTurnover } from '@/api/viewIndex.js'
+import { BI_COLORS, BI_TOOLTIP, barGradient } from '../theme.js'
// 鍦ㄥ埗鍝佸懆杞粺璁″璞�
const workInProcessStatistics = ref({
@@ -53,10 +54,11 @@
const tooltip = {
trigger: 'axis',
axisPointer: { type: 'shadow' },
+ ...BI_TOOLTIP,
formatter: function (params) {
let result = params[0].axisValueLabel + '<br/>'
params.forEach((item) => {
- result += `<div style="color: #B8C8E0">${item.marker} ${item.seriesName}: ${item.value}</div>`
+ result += `<div>${item.marker} ${item.seriesName}: ${item.value}</div>`
})
return result
},
@@ -67,46 +69,38 @@
{
type: 'category',
axisTick: { show: false },
- axisLabel: { color: '#B8C8E0' },
+ axisLabel: { color: BI_COLORS.text },
data: [],
},
])
const workInProcessYAxis = [
{
type: 'value',
- axisLabel: { color: '#B8C8E0' },
+ axisLabel: { color: BI_COLORS.text },
name: '',
+ splitLine: { lineStyle: { color: BI_COLORS.splitLine } },
},
]
const workInProcessBarLegend = {
show: false,
- textStyle: { color: '#B8C8E0' },
+ textStyle: { color: BI_COLORS.text },
data: [],
}
const workInProcessBarSeries = ref([
{
name: '鍦ㄥ埗鍝佹暟閲�',
type: 'bar',
- barWidth: 25,
+ barWidth: 20,
barGap: 0,
emphasis: { focus: 'series' },
itemStyle: {
- color: {
- type: 'linear',
- x: 0,
- y: 0,
- x2: 0,
- y2: 1,
- colorStops: [
- { offset: 1, color: 'rgba(0,164,237,0)' },
- { offset: 0, color: '#4EE4FF' },
- ],
- },
+ borderRadius: [3, 3, 0, 0],
+ color: barGradient(BI_COLORS.primary),
},
label: {
show: true,
position: 'top',
- color: '#B8C8E0',
+ color: BI_COLORS.text,
},
data: [],
},
@@ -156,7 +150,6 @@
}
.panel-item-customers {
- border: 1px solid #1a58b0;
padding: 18px;
width: 100%;
height: 449px;
--
Gitblit v1.9.3