update: 累计客流百分比

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
     }
   })

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));
     }
   }
 

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
   }))
 }

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
       }