From 4fe21d5bd8b17eebe1eb30c375e8e2ec3a0369a8 Mon Sep 17 00:00:00 2001 From: dkwang Date: Wed, 21 Oct 2026 13:09:27 +0800 Subject: [PATCH] =?UTF-8?q?update:=20=E7=B4=AF=E8=AE=A1=E5=AE=A2=E6=B5=81?= =?UTF-8?q?=E7=99=BE=E5=88=86=E6=AF=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/yunying.js | 4 +-- src/views/home/components/DashboardHeader.vue | 29 +++++++++++++++-- src/views/home/components/ModuleSix.vue | 31 ++++++++++++------- vite.config.js | 4 ++- 4 files changed, 50 insertions(+), 18 deletions(-) diff --git a/src/utils/yunying.js b/src/utils/yunying.js index d503da9..5859419 100644 --- a/src/utils/yunying.js +++ b/src/utils/yunying.js @@ -26,7 +26,7 @@ export function processYunyingInfo(dataList) { const redData = getTimeValues(item.maxDay) const maxValue = redData[currentTimeIndex] - const compareMaxValue = yellowData[currentTimeIndex] + const comparePercent = item.compareDay?.totalSum ? parseFloat(item.compareDay.totalSum) : 0 const totalSum = item.today?.totalSum ? parseFloat(item.today.totalSum) : 0 const total = barData.reduce((sum, val) => sum + val, 0) const totalStr = Math.floor(total).toString() @@ -45,7 +45,7 @@ export function processYunyingInfo(dataList) { compareDate: item.compareDate || '', maxDate: item.maxDay?.maxDate || '', maxValue, - compareMaxValue, + comparePercent, totalSum } }) diff --git a/src/views/home/components/DashboardHeader.vue b/src/views/home/components/DashboardHeader.vue index f5b1ac5..ffb8c48 100644 --- a/src/views/home/components/DashboardHeader.vue +++ b/src/views/home/components/DashboardHeader.vue @@ -44,6 +44,7 @@ const currentTime = ref('') const weatherInfo = ref({}) const noticeList = ref([]) const currentNoticeIndex = ref(0) +const marqueeDuration = ref(30) // 默认动画时间 let noticeTimer = null let timeTimer = null @@ -97,6 +98,7 @@ const fetchTaskNotice = async () => { if (data && data.content) { const textContent = data.content.replace(/<[^>]+>/g, '') noticeList.value = [textContent] + calculateMarqueeDuration(textContent) startNoticeScroll() } } @@ -105,6 +107,27 @@ const fetchTaskNotice = async () => { } } +const calculateMarqueeDuration = (text) => { + // 创建一个临时元素测量文字宽度 + const temp = document.createElement('div') + temp.style.cssText = ` + position: absolute; + visibility: hidden; + font-size: 40px; + white-space: nowrap; + font-weight: normal; + ` + temp.textContent = text + document.body.appendChild(temp) + const textWidth = temp.offsetWidth + document.body.removeChild(temp) + + // 计算总移动距离（容器宽度 + 文字宽度） + const totalDistance = 1300 + textWidth + // 按 100px/s 的速度计算动画时间 + marqueeDuration.value = totalDistance / 100 +} + const startNoticeScroll = () => { if (noticeList.value.length <= 1) return @@ -221,18 +244,18 @@ onUnmounted(() => { font-size: 40px; color: rgba(255, 255, 255, 0.9); white-space: nowrap; - animation: marquee 20s linear infinite; + animation: marquee 30s linear infinite; } } } @keyframes marquee { 0% { - transform: translateX(100%); + transform: translateX(1300px); } 100% { - transform: translateX(-100%); + transform: translateX(calc(-100% - 1300px)); } } diff --git a/src/views/home/components/ModuleSix.vue b/src/views/home/components/ModuleSix.vue index bbbc26e..19544a7 100644 --- a/src/views/home/components/ModuleSix.vue +++ b/src/views/home/components/ModuleSix.vue @@ -46,10 +46,10 @@ const chartRefs = ref([]) const xLabels = ['6', '8', '10', '12', '14', '16', '18', '20', '22', '24'] const chartDataList = ref([ - { number: 0, barData: [], yellowData: [], redData: [], digits: [], compareDate: '', maxDate: '', maxValue: 0, compareMaxValue: 0 }, - { number: 0, barData: [], yellowData: [], redData: [], digits: [], compareDate: '', maxDate: '', maxValue: 0, compareMaxValue: 0 }, - { number: 0, barData: [], yellowData: [], redData: [], digits: [], compareDate: '', maxDate: '', maxValue: 0, compareMaxValue: 0 }, - { number: 0, barData: [], yellowData: [], redData: [], digits: [], compareDate: '', maxDate: '', maxValue: 0, compareMaxValue: 0 } + { number: 0, barData: [], yellowData: [], redData: [], digits: [], compareDate: '', maxDate: '', maxValue: 0, comparePercent: 0 }, + { number: 0, barData: [], yellowData: [], redData: [], digits: [], compareDate: '', maxDate: '', maxValue: 0, comparePercent: 0 }, + { number: 0, barData: [], yellowData: [], redData: [], digits: [], compareDate: '', maxDate: '', maxValue: 0, comparePercent: 0 }, + { number: 0, barData: [], yellowData: [], redData: [], digits: [], compareDate: '', maxDate: '', maxValue: 0, comparePercent: 0 } ]) const charts = ref(chartDataList.value) @@ -74,21 +74,28 @@ const getNumberBoxTextColor = (number) => { } const getBaifenbiPercentage = (chart) => { - if (!chart.compareMaxValue || chart.compareMaxValue === 0) { + if (!chart.comparePercent || chart.comparePercent === 0) { + console.log('百分比计算: comparePercent 为 0 或空，返回 0.00') return '0.00' } - console.log("今日客流累计 对比 对比日当前时间点客流:", chart.totalSum, chart.compareMaxValue) - - const percentage = ((chart.totalSum - chart.compareMaxValue) / chart.compareMaxValue) * 100 - // return Math.abs(percentage).toFixed(2) + + const percentage = ((chart.totalSum - chart.comparePercent) / chart.comparePercent) * 100 + + console.log('====== 百分比计算详情 ======') + console.log('今日累计客流 (totalSum):', chart.totalSum) + console.log('对比日累计客流 (comparePercent):', chart.comparePercent) + console.log('差值:', chart.totalSum - chart.comparePercent) + console.log('计算结果:', percentage.toFixed(2) + '%') + console.log('===========================') + return percentage.toFixed(2) } const getBaifenbiColorStyle = (chart) => { - if (!chart.compareMaxValue || chart.compareMaxValue === 0) { + if (!chart.comparePercent || chart.comparePercent === 0) { return { color: '#ffffff', fontWeight: 'bold' } } - const percentage = (chart.totalSum - chart.compareMaxValue) / chart.compareMaxValue + const percentage = (chart.totalSum - chart.comparePercent) / chart.comparePercent if (percentage > 0) { return { color: '#ff3333', fontWeight: 'bold' } } else if (percentage < 0) { @@ -107,7 +114,7 @@ const processData = (dataList) => { compareDate: item.compareDate, maxDate: item.maxDate, maxValue: item.maxValue, - compareMaxValue: item.compareMaxValue, + comparePercent: item.comparePercent, totalSum: item.totalSum })) } diff --git a/vite.config.js b/vite.config.js index 3e63c6d..2eb875b 100644 --- a/vite.config.js +++ b/vite.config.js @@ -16,7 +16,9 @@ export default defineConfig({ open: true, proxy: { '/juntech-ysdp': { - target: 'http://101.133.172.2:8082', + target: 'http://192.168.16.193:8888', + // （binyu使用，切换时注释上面那行，取消注释下面这行） + // target: 'http://101.133.172.2:8082', changeOrigin: true, rewrite: (path) => path }