Web/daimp-front
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

政务云智慧大屏-部分细节调整

Browse Source
This commit is contained in:
2090205686@qq.com 2025-05-22 16:10:22 +08:00
parent 07dbd6398d
commit 304be8b129
2 changed files with 17 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
new-digital-agriculture-screen/src/views/business/components/businessThere.vue
View File

@ -57,10 +57,10 @@ const series = types.map((type, idx) => {
barGap: '0%', // 强制堆叠布局 barGap: '0%', // 强制堆叠布局
itemStyle: { itemStyle: {
color: colors[idx], color: colors[idx],
barBorderRadius: 8, barBorderRadius: 0,
shadowColor: colors[idx], shadowColor: colors[idx],
// shadowBlur: 8, // shadowBlur: 8,
shadowOffsetY: -16, shadowOffsetY: 0,
}, },
label: { label: {
// 添加标签配置 // 添加标签配置
@ -70,16 +70,18 @@ const series = types.map((type, idx) => {
backgroundColor: 'rgba(255,255,255,0.7)', // 白色背景 backgroundColor: 'rgba(255,255,255,0.7)', // 白色背景
padding: [2, 4], padding: [2, 4],
borderRadius: 4, borderRadius: 4,
formatter: '{@value}万亩',
z: 100, z: 100,
normal: { normal: {
show: true, show: true,
position: 'inside', position: 'inside',
formatter: '{c}%', formatter: '{c}万亩',
}, },
}, },
silent: true, // 禁用所有交互效果
animation: false, // 禁用动画
emphasis: { emphasis: {
focus: 'series', focus: 'series',
disabled: true, // 禁用高亮效果
}, },
z: 100 - idx, z: 100 - idx,
data: towns.map((town) => { data: towns.map((town) => {
@ -96,8 +98,10 @@ const state = reactive({
legend: { legend: {
data: types, data: types,
textStyle: { textStyle: {
color: '#ccc', color: '#fff',
}, },
selectedMode: false, // 禁用图例切换功能
inactiveColor: '#fff', // 设置非激活状态颜色（保持原色）
}, },
grid: { grid: {
top: '15%', top: '15%',
@ -117,7 +121,7 @@ const state = reactive({
}, },
yAxis: { yAxis: {
type: 'category', // 分类轴（横向条形图的标签） type: 'category', // 分类轴（横向条形图的标签）
data: [120, 230, 152, 136, 145, 17], // 分类数据放在 yAxis data: towns, // 分类数据放在 yAxis
axisTick: { show: false }, // 隐藏刻度线 axisTick: { show: false }, // 隐藏刻度线
}, },
color: colors, color: colors,
@ -128,7 +132,7 @@ const state = reactive({
axisPointer: { axisPointer: {
type: 'shadow', type: 'shadow',
}, },
backgroundColor: 'rgba(0,0,0,0.6);', backgroundColor: 'rgba(0,0,0,0);',
borderColor: '#35d0c0', borderColor: '#35d0c0',
borderRadius: 8, borderRadius: 8,
formatter: (params) => ` formatter: (params) => `

11
new-digital-agriculture-screen/src/views/land/components/basicInfo.vue
View File

@ -33,26 +33,27 @@ const props = defineProps({
.basic { .basic {
width: 100%; width: 100%;
margin-top: 10px; margin-top: 10px;
height: 100%; height: 95%;
border: 2px solid #01fefd; border: 2px solid #01fefd;
border-radius: 16px; border-radius: 16px;
backdrop-filter: blur(2px); backdrop-filter: blur(2px);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: flex-start;
color: #ffffff; color: #ffffff;
padding: 20px; padding: 20px;
.line { .line {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
text-align: left; text-align: left;
line-height: 20px; line-height: 50px;
.title { .title {
font-size: 16px; font-size: 14px;
width: 40%; width: 40%;
color: #ddd;
} }
.values { .values {
font-size: 20px; font-size: 16px;
width: 60%; width: 60%;
} }
} }