From efdaedc5dd259cee768e0ad9c9f54ffc03a9a60e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?M=E5=85=88=E7=94=9F?= <1211120248@qq.com> Date: Mon, 13 Jul 2026 09:09:42 +0800 Subject: [PATCH] chore: align source with latest built assets --- src/views/ecologicalProtection/data.js | 10 +- .../components/BusinessPanelRenderer.vue | 183 +++++++++++++++++- src/views/pastureManagement/index.vue | 1 - 3 files changed, 188 insertions(+), 6 deletions(-) diff --git a/src/views/ecologicalProtection/data.js b/src/views/ecologicalProtection/data.js index 6eb85f4..cf6be00 100644 --- a/src/views/ecologicalProtection/data.js +++ b/src/views/ecologicalProtection/data.js @@ -1061,7 +1061,9 @@ export const parkPanels = { key: "park-town-grass-wet-area", title: "草地湿地面积分布", type: "stackColumn", - variant: "dual", + variant: "parkSlim", + showValue: true, + sharedScale: true, unit: "万亩", segments: [ { key: "grassland", name: "草地面积", color: "#24f6c4" }, @@ -1073,7 +1075,9 @@ export const parkPanels = { key: "park-town-productivity", title: "草地湿地生产力", type: "stackColumn", - variant: "dual", + variant: "parkSlim", + showValue: true, + sharedScale: true, unit: "万吨", segments: [ { key: "grassland", name: "草地生产力", color: "#32dcff" }, @@ -1085,7 +1089,7 @@ export const parkPanels = { key: "park-town-yak", title: "乡镇牦牛数量", type: "bar", - variant: "raceBar", + variant: "parkBar", rows: parkTownYakRows, }, { diff --git a/src/views/forestGrassWet/components/BusinessPanelRenderer.vue b/src/views/forestGrassWet/components/BusinessPanelRenderer.vue index 6b6fc95..b557226 100644 --- a/src/views/forestGrassWet/components/BusinessPanelRenderer.vue +++ b/src/views/forestGrassWet/components/BusinessPanelRenderer.vue @@ -282,6 +282,7 @@ 'is-distribution': panel?.variant === 'distribution', 'is-capacity': panel?.variant === 'capacity', 'is-rank-bar': panel?.variant === 'rankBar', + 'is-park-bar': panel?.variant === 'parkBar', 'is-race-bar': isRaceBarVariant, 'is-few-rows': isRaceBarVariant && chartRows.length <= 3, 'is-degradation': panel?.variant === 'degradation', @@ -1211,7 +1212,7 @@ function stackItemSegments(item) { if (!total) return [] return stackSegments.value.map((segment, index) => { const value = Number(values[segment.key]) || 0 - const percentBase = props.panel?.variant === "dual" || props.panel?.sharedScale === true + const percentBase = props.panel?.variant === "dual" || props.panel?.variant === "parkSlim" || props.panel?.sharedScale === true ? stackColumnMaxTotal.value : total return { @@ -1388,7 +1389,7 @@ function stackColumnTotalPrefix(item) { } function showStackColumnValue() { - return props.panel?.showValue === true || props.panel?.variant === "dual" + return props.panel?.showValue === true || props.panel?.variant === "dual" || props.panel?.variant === "parkSlim" } function normalizeSearch(value) { @@ -5979,6 +5980,184 @@ function columnGradient(index, item = {}) { -webkit-line-clamp: 1; } } + + &.is-variant-parkSlim { + grid-template-rows: 24px minmax(0, 1fr); + gap: 2px; + padding: 7px 22px 8px; + + .business-stack-legend { + justify-content: center; + gap: 22px; + padding-right: 0; + + span { + color: rgba(245, 253, 255, 0.88); + font-size: 11px; + line-height: 16px; + font-weight: 700; + } + + i { + width: 7px; + height: 7px; + border-radius: 50%; + box-shadow: 0 0 3px currentColor; + } + } + + .business-stack-unit { + margin-left: 6px; + color: rgba(235, 252, 255, 0.78); + font-size: 11px; + font-weight: 700; + } + + .business-stack-chart { + position: relative; + grid-template-columns: repeat(auto-fit, minmax(82px, 1fr)); + gap: 28px; + padding: 4px 10px 0; + + &:before { + content: ""; + position: absolute; + left: 8px; + right: 8px; + top: 26px; + bottom: 43px; + background: + repeating-linear-gradient( + to bottom, + rgba(194, 238, 246, 0.14) 0 1px, + transparent 1px 22px + ); + pointer-events: none; + } + } + + .business-stack-item { + position: relative; + z-index: 1; + grid-template-rows: 18px minmax(70px, 1fr) 42px; + min-width: 0; + overflow: visible; + } + + .business-stack-total { + align-self: end; + color: rgba(250, 254, 255, 0.96); + font-family: var(--screen-font-number, D-DIN, Arial, sans-serif); + font-size: 12px; + line-height: 16px; + font-weight: 800; + white-space: nowrap; + text-shadow: 0 0 5px rgba(255, 255, 255, 0.2); + + em { + margin-left: 2px; + color: rgba(235, 252, 255, 0.72); + font-family: var(--screen-font-ui, "Alibaba PuHuiTi", "PingFang SC", "Microsoft YaHei", Arial, sans-serif); + font-size: 10px; + font-style: normal; + font-weight: 600; + } + } + + .business-stack-track { + position: relative; + align-self: end; + width: 18px; + height: 100%; + min-height: 66px; + max-height: 100px; + overflow: visible; + border: 0; + background: linear-gradient(180deg, rgba(48, 220, 255, 0.1), rgba(48, 220, 255, 0.035)); + box-shadow: none; + + &:before { + content: ""; + position: absolute; + left: 50%; + bottom: 0; + width: 38px; + height: 1px; + background: linear-gradient(90deg, transparent, rgba(180, 248, 255, 0.35), transparent); + transform: translateX(-50%); + } + + &:after { + content: ""; + position: absolute; + left: 50%; + bottom: -5px; + width: 34px; + height: 7px; + border-radius: 50%; + background: radial-gradient(ellipse at center, rgba(48, 220, 255, 0.22), rgba(48, 220, 255, 0) 72%); + transform: translateX(-50%); + pointer-events: none; + } + + i { + position: relative; + display: block; + min-height: 3px; + box-shadow: + inset 0 1px 0 rgba(255, 255, 255, 0.28), + 0 0 3px color-mix(in srgb, currentColor 32%, transparent); + + &:first-child { + border-radius: 0 0 8px 8px; + } + + &:last-child { + border-radius: 8px 8px 0 0; + } + + &:last-child:before { + content: ""; + position: absolute; + left: 2px; + right: 2px; + top: -4px; + height: 6px; + border-radius: 50%; + background: rgba(238, 255, 255, 0.82); + box-shadow: 0 0 4px rgba(238, 255, 255, 0.36); + } + } + } + + .business-stack-item span { + align-self: center; + width: 18px; + height: 40px; + color: rgba(250, 254, 255, 0.92); + font-size: 12px; + font-weight: 700; + line-height: 16px; + letter-spacing: 0; + text-align: center; + writing-mode: vertical-rl; + text-orientation: upright; + white-space: nowrap; + overflow: visible; + -webkit-line-clamp: unset; + } + + .business-stack-item.is-active { + .business-stack-track i { + animation: none; + } + + span, + strong { + color: #ffffff; + } + } + } } .business-stack-legend { diff --git a/src/views/pastureManagement/index.vue b/src/views/pastureManagement/index.vue index 93ec718..23bb2f9 100644 --- a/src/views/pastureManagement/index.vue +++ b/src/views/pastureManagement/index.vue @@ -992,7 +992,6 @@ async function handlePastureSelect(row) { const focused = mapSceneRef.value?.focusPasture?.({ name: row?.name, grasslands: pastureGrasslands, - locateOnly: true, }) if (!focused) cancelPastureFocusSelection() }