From 10b04f8a0cee68bbcb69eac07e3412a33116efd1 Mon Sep 17 00:00:00 2001
From: liyong <18434998025@163.com>
Date: 星期二, 20 一月 2026 10:02:03 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/dev_天津军泰伟业' into dev_天津军泰伟业

---
 src/views/reportAnalysis/dataDashboard/index.vue |  654 +++++++++++++++++++++++++++++++++++++++++++++++++---------
 1 files changed, 547 insertions(+), 107 deletions(-)

diff --git a/src/views/reportAnalysis/dataDashboard/index.vue b/src/views/reportAnalysis/dataDashboard/index.vue
index 75fbf34..3937cba 100644
--- a/src/views/reportAnalysis/dataDashboard/index.vue
+++ b/src/views/reportAnalysis/dataDashboard/index.vue
@@ -1,5 +1,6 @@
 <template>
-    <div class="data-dashboard">
+		<div class="scale-container">
+			<div class="data-dashboard" :style="{ transform: `scale(${scaleRatio})` }">
       <!-- 鍏ㄥ睆鎸夐挳 - 绉诲姩鍒板乏涓婅 -->
       <button class="fullscreen-btn" @click="toggleFullscreen" :title="isFullscreen ? '閫�鍑哄叏灞�' : '鍏ㄥ睆鏄剧ず'">
         <svg v-if="!isFullscreen" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
@@ -174,24 +175,76 @@
         </div>
 				
 				<div class="financial-header">
-					<span class="financial-title">杩�4鏈堣储鍔″垎鏋�</span>
+					<span class="financial-title">鍚勭敓浜ц鍗曠殑瀹屾垚杩涘害缁熻</span>
 				</div>
 				<div class="main-panel">
 					<div class="panel-item-customers">
-						<div class="event-header">
-							<img src="@/assets/BI/shijianmingxiicon@2x.png" alt="鍥炬爣" class="event-icon" />
-							<span class="event-title">缁忚惀鎴愭灉鍒嗘瀽</span>
+						<div class="order-statistics-cards">
+							<div class="quality-cardSec">
+								<div class="quality-card four"></div>
+								<div class="quality-cardTitle">
+									<div>鎬昏鍗曟暟</div>
+									<div>{{orderStatisticsObject.totalOrderCount}}浠�</div>
+								</div>
+							</div>
+							<div class="quality-cardSec">
+								<div class="quality-card five"></div>
+								<div class="quality-cardTitle">
+									<div>鏈畬鎴愯鍗曟暟</div>
+									<div>{{orderStatisticsObject.uncompletedOrderCount}}浠�</div>
+								</div>
+							</div>
+							<div class="quality-cardSec">
+								<div class="quality-card six"></div>
+								<div class="quality-cardTitle">
+									<div>閮ㄥ垎瀹屾垚璁㈠崟鏁�</div>
+									<div>{{orderStatisticsObject.partialCompletedOrderCount}}浠�</div>
+								</div>
+							</div>
+							<div class="quality-cardSec">
+								<div class="quality-card seven"></div>
+								<div class="quality-cardTitle">
+									<div>宸插畬鎴愯鍗曟暟</div>
+									<div>{{orderStatisticsObject.completedOrderCount}}浠�</div>
+								</div>
+							</div>
 						</div>
-						<Echarts ref="chart"
-										 :chartStyle="chartStyle"
-										 :grid="grid"
-										 :legend="barLegend1"
-										 :series="barSeries11"
-										 :tooltip="tooltip"
-										 :xAxis="xAxis3"
-										 :yAxis="yAxis3"
-										 :options="{backgroundColor: 'transparent', textStyle: {color: '#B8C8E0'}}"
-										 style="height: 300px"></Echarts>
+						<div class="progress-table-container" ref="progressTableRef" @scroll="handleTableScroll">
+							<table class="progress-table">
+								<thead>
+									<tr>
+										<th>鐢熶骇璁㈠崟鍙�</th>
+										<th>浜у搧鍚嶇О</th>
+										<th>瑙勬牸</th>
+										<th>闇�姹傛暟閲�</th>
+										<th>瀹屾垚鏁伴噺</th>
+										<th>瀹屾垚杩涘害</th>
+									</tr>
+								</thead>
+								<tbody>
+									<tr 
+										v-for="(item, index) in progressTableData" 
+										:key="index"
+										:ref="el => setRowRef(el, index)"
+										:class="{ 'row-under-header': isRowUnderHeader(index) }"
+									>
+										<td>{{ item.npsNo || '-' }}</td>
+										<td>{{ item.productCategory || '-' }}</td>
+										<td>{{ item.specificationModel || '-' }}</td>
+										<td>{{ item.quantity || 0 }}</td>
+										<td>{{ item.completeQuantity || 0 }}</td>
+										<td>
+											<el-progress
+												:percentage="calculateProgress(item)"
+												:color="progressColor(calculateProgress(item))"
+												:status="calculateProgress(item) >= 100 ? 'success' : ''"
+												:stroke-width="8"
+											/>
+										</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
 					</div>
 				</div>
       </div>
@@ -234,12 +287,13 @@
 				</div>
       </div>
       </div>
+      </div>
     </div>
 </template>
 
 <script setup>
 import * as echarts from 'echarts'
-import { ref, onMounted, onBeforeUnmount, nextTick } from 'vue'
+import { ref, reactive, onMounted, onBeforeUnmount, nextTick } from 'vue'
 import autofit from 'autofit.js'
 import Echarts from "@/components/Echarts/echarts.vue";
 import useUserStore from '@/store/modules/user'
@@ -247,7 +301,9 @@
 	analysisCustomerContractAmounts, getAmountHalfYear,
 	homeTodos,
 	qualityStatistics,
-	statisticsReceivablePayable
+	statisticsReceivablePayable,
+	getProgressStatistics,
+  	getWorkInProcessTurnover
 } from "@/api/viewIndex.js";
 import {staffOnJobListPage} from "@/api/personnelManagement/employeeRecord.js";
 import {listCustomer} from "@/api/basicData/customerFile.js";
@@ -257,9 +313,16 @@
 import {getUpkeepPage} from "@/api/equipmentManagement/upkeep.js";
 import {measuringInstrumentListPage} from "@/api/equipmentManagement/measurementEquipment.js";
 import {listPageAnalysis} from "@/api/financialManagement/expenseManagement.js";
+import {productOrderListPage} from "@/api/productionManagement/productionOrder.js";
 
 // 鍏ㄥ睆鐩稿叧鐘舵��
 const isFullscreen = ref(false);
+
+// 缂╂斁姣斾緥
+const scaleRatio = ref(1)
+// 璁捐灏哄锛堝熀鍑嗗昂瀵革級- 鏍规嵁瀹為檯璁捐绋胯皟鏁�
+const designWidth = 1920
+const designHeight = 1080
 
 // 鐢ㄦ埛store
 const userStore = useUserStore()
@@ -278,7 +341,13 @@
 const realtimeLineChartRef = ref(null)
 const refContractList = ref(null)
 const refTodoList = ref(null)
+const progressTableRef = ref(null)
 const timerScroll = ref(null)
+const progressTableScrollTimer = ref(null)
+const isTableScrolling = ref(false)
+const tableScrollTimeout = ref(null)
+const tableRowRefs = ref([])
+const rowsUnderHeader = ref(new Set())
 
 const chartStylePie = {
 	width: '140%',
@@ -326,6 +395,14 @@
 	supplierNum: 0,
 	processNum: 0,
 	factoryNum: 0,
+})
+
+// 璁㈠崟缁熻瀵硅薄
+const orderStatisticsObject = ref({
+	totalOrderCount: 0,
+	uncompletedOrderCount: 0,
+	partialCompletedOrderCount: 0,
+	completedOrderCount: 0,
 })
 const chartStyle = {
 	width: '100%',
@@ -415,75 +492,52 @@
 	data: ['鍘熸潗鏂欏悎鏍兼暟', '杩囩▼鍚堟牸鏁�', '鍑轰笉鍚堟牸鏁�']
 }
 const barLegend1 = {
-	show: true,
+	show: false,
 	textStyle: { color: '#B8C8E0' },
-	data: ['鎬绘敹鍏�', '鎬绘敮鍑�', '鍑�鏀跺叆']
+	data: []
 }
 const barSeries11 = ref([
 	{
-		name: '鎬绘敹鍏�',
+		name: '鐢熶骇璁㈠崟缁熻',
 		type: 'bar',
 		barGap: 0,
 		emphasis: {
 			focus: 'series'
 		},
 		itemStyle: {
-			color: {
-				type: 'linear',
-				x: 0,
-				y: 0,
-				x2: 0,
-				y2: 1,
-				colorStops: [
-					{ offset: 1, color: '#00A4ED' },
-					{ offset: 0, color: '#4EE4FF' }
+			// 浣跨敤鍑芥暟鏍规嵁鏁版嵁绱㈠紩杩斿洖涓嶅悓棰滆壊
+			color: function(params) {
+				const colorStops = [
+					[
+						{ offset: 1, color: '#00A4ED' },
+						{ offset: 0, color: '#4EE4FF' }
+					],
+					[
+						{ offset: 1, color: '#3378FF' },
+						{ offset: 0, color: '#4E8AFF' }
+					],
+					[
+						{ offset: 1, color: '#FF6B6B' },
+						{ offset: 0, color: '#FF8E8E' }
+					],
+					[
+						{ offset: 1, color: '#537EF5' },
+						{ offset: 0, color: '#9061F8' }
+					]
 				]
+				const stops = colorStops[params.dataIndex] || colorStops[0]
+				return {
+					type: 'linear',
+					x: 0,
+					y: 0,
+					x2: 0,
+					y2: 1,
+					colorStops: stops
+				}
 			}
 		},
 		data: []
-	},
-	{
-		name: '鎬绘敮鍑�',
-		type: 'bar',
-		emphasis: {
-			focus: 'series'
-		},
-		itemStyle: {
-			color: {
-				type: 'linear',
-				x: 0,
-				y: 0,
-				x2: 0,
-				y2: 1,
-				colorStops: [
-					{ offset: 1, color: '#3378FF' },
-					{ offset: 0, color: '#4E8AFF' }
-				]
-			}
-		},
-		data: []
-	},
-	{
-		name: '鍑�鏀跺叆',
-		type: 'bar',
-		emphasis: {
-			focus: 'series'
-		},
-		itemStyle: {
-			color: {
-				type: 'linear',
-				x: 0,
-				y: 0,
-				x2: 0,
-				y2: 1,
-				colorStops: [
-					{ offset: 1, color: '#537EF5' },
-					{ offset: 0, color: '#9061F8' }
-				]
-			}
-		},
-		data: []
-	},
+	}
 ])
 const barSeries1 = ref([
 	{
@@ -595,13 +649,62 @@
 // 寰呭姙浜嬮」
 const todoList = ref([])
 
-// 绐楀彛澶у皬鍙樺寲澶勭悊
-const handleResize = () => {
+// 鐢熶骇璁㈠崟瀹屾垚杩涘害琛ㄦ牸鏁版嵁
+const progressTableData = ref([])
+
+// 璁$畻瀹屾垚杩涘害鐧惧垎姣�
+const calculateProgress = (item) => {
+	if (!item) return 0
+	// 浼樺厛浣跨敤completionStatus瀛楁
+	if (item.completionStatus !== undefined && item.completionStatus !== null) {
+		const percentage = Number(item.completionStatus)
+		if (isNaN(percentage)) return 0
+		return Math.min(Math.max(Math.round(percentage), 0), 100)
+	}
+	// 濡傛灉娌℃湁completionStatus锛屽垯鏍规嵁瀹屾垚鏁伴噺鍜岄渶姹傛暟閲忚绠�
+	if (!item.quantity || item.quantity === 0) return 0
+	const percentage = (item.completeQuantity || 0) / item.quantity * 100
+	return Math.min(Math.max(Math.round(percentage), 0), 100)
+}
+
+// 鏍规嵁杩涘害鐧惧垎姣旇繑鍥為鑹�
+const progressColor = (percentage) => {
+	const p = percentage || 0
+	if (p < 30) return "#f56c6c"
+	if (p < 50) return "#e6a23c"
+	if (p < 80) return "#409eff"
+	return "#67c23a"
+}
+
+// 璁$畻缂╂斁姣斾緥
+const calculateScale = () => {
+  const container = document.querySelector('.scale-container')
+  if (!container) return
+  
+  // 鑾峰彇瀹瑰櫒鐨勫疄闄呭昂瀵�
+	const rect = container.getBoundingClientRect?.()
+	const containerWidth = container.clientWidth || rect?.width || window.innerWidth
+	const containerHeight = container.clientHeight || rect?.height || window.innerHeight
+  
+  // 璁$畻瀹介珮缂╂斁姣斾緥锛屽彇杈冨皬鍊间互淇濊瘉鍐呭瀹屾暣鏄剧ず锛堢瓑姣旂缉鏀撅級
+  const scaleX = containerWidth / designWidth
+  const scaleY = containerHeight / designHeight
+  scaleRatio.value = Math.min(scaleX, scaleY)
+  
+  // 瑙﹀彂鍥捐〃resize
   charts.value.forEach(chart => {
     if (chart && chart.resize) {
       chart.resize()
     }
   })
+}
+
+// 绐楀彛澶у皬鍙樺寲澶勭悊
+const handleResize = () => {
+  // 寤惰繜鎵ц锛岀‘淇滵OM鏇存柊瀹屾垚
+  setTimeout(() => {
+    calculateScale()
+  }, 100)
 }
 
 // 閿�姣佸浘琛ㄥ疄渚�
@@ -640,15 +743,44 @@
 		qualityStatisticsObject.value.factoryNum = res.data.factoryNum
 	})
 }
-// 璐㈠姟缁熻
-const accountStatisticsInfo = () => {
-	listPageAnalysis().then((res) => {
-		xAxis3.value[0].data = res.data.days
-		barSeries11.value[0].data = res.data.totalIncome
-		barSeries11.value[1].data = res.data.totalExpense
-		barSeries11.value[2].data = res.data.netIncome
+// 鍚勭敓浜ц鍗曠殑瀹屾垚杩涘害缁熻
+const progressStatisticsInfo = () => {
+	// 浠庣粺璁℃帴鍙h幏鍙栫粺璁℃暟鎹�
+	getProgressStatistics().then((res) => {
+		console.log("鐢熶骇璁㈠崟瀹屾垚杩涘害缁熻鏁版嵁:", res)
+		
+		if (!res || !res.data) {
+			console.warn('鐢熶骇璁㈠崟瀹屾垚杩涘害缁熻鏁版嵁涓虹┖')
+			return
+		}
+		
+		// 浠庢帴鍙h幏鍙栫粺璁℃暟鎹�
+		orderStatisticsObject.value = {
+			totalOrderCount: res.data.totalOrderCount || 0,
+			uncompletedOrderCount: res.data.uncompletedOrderCount || 0,
+			partialCompletedOrderCount: res.data.partialCompletedOrderCount || 0,
+			completedOrderCount: res.data.completedOrderCount || 0
+		}
+		progressTableData.value = res.data.completedOrderDetails || []
+		// 閲嶇疆琛屽紩鐢�
+		tableRowRefs.value = []
+		rowsUnderHeader.value.clear()
+		
+		// 鍦ㄨ幏鍙栧埌鏁版嵁鍚庯紝鍒濆鍖栨粴鍔ㄥ姛鑳�
+		nextTick(() => {
+			initProgressTableScroll()
+		})
+	}).catch((error) => {
+		console.error('鑾峰彇鐢熶骇璁㈠崟瀹屾垚杩涘害缁熻澶辫触:', error)
 	})
 }
+// 璐㈠姟缁熻
+// const accountStatisticsInfo = () => {
+// 	listPageAnalysis().then((res) => {
+// 		xAxis3.value[0].data = res.data.days
+// 		barSeries11.value[0].data = res.data.totalIncome
+// 	})
+// }
 const getNum = () => {
 	const params = {
 		pageNum: -1,
@@ -783,6 +915,163 @@
 
 // 鑷姩杞崲鍛ㄣ�佹湀銆佸搴︾殑瀹氭椂鍣�
 const autoSwitchTimer = ref(null)
+
+// 璁剧疆琛屽紩鐢�
+const setRowRef = (el, index) => {
+	if (el) {
+		tableRowRefs.value[index] = el
+	}
+}
+
+// 鍒ゆ柇琛屾槸鍚﹀湪琛ㄥご涓嬫柟
+const isRowUnderHeader = (index) => {
+	return rowsUnderHeader.value.has(index)
+}
+
+// 澶勭悊琛ㄦ牸婊氬姩浜嬩欢
+const handleTableScroll = () => {
+	const tableContainer = progressTableRef.value
+	if (!tableContainer) return
+	
+	const thead = tableContainer.querySelector('thead')
+	if (!thead) return
+	
+	const theadHeight = thead.offsetHeight
+	const containerRect = tableContainer.getBoundingClientRect()
+	const containerTop = containerRect.top
+	const theadBottom = containerTop + theadHeight
+	
+	// 娓呯┖涔嬪墠鐨勮褰�
+	rowsUnderHeader.value.clear()
+	
+	// 妫�鏌ユ瘡涓�琛屾槸鍚﹀湪琛ㄥご涓嬫柟锛堣琛ㄥご閬尅锛�
+	tableRowRefs.value.forEach((row, index) => {
+		if (row) {
+			const rowRect = row.getBoundingClientRect()
+			const rowTop = rowRect.top
+			const rowBottom = rowRect.bottom
+			
+			// 濡傛灉琛屼笌琛ㄥご鏈夐噸鍙狅紙琛屽湪琛ㄥご涓嬫柟琚伄鎸★級
+			// 琛岀殑椤堕儴鍦ㄨ〃澶村簳閮ㄤ笅鏂癸紝浣嗚鐨勫簳閮ㄥ湪琛ㄥご搴曢儴涓婃柟锛岃鏄庤閬尅
+			if (rowTop < theadBottom && rowBottom > containerTop) {
+				rowsUnderHeader.value.add(index)
+			}
+		}
+	})
+	
+	// 娓呴櫎涔嬪墠鐨勫畾鏃跺櫒
+	if (tableScrollTimeout.value) {
+		clearTimeout(tableScrollTimeout.value)
+	}
+	
+	// 婊氬姩鍋滄鍚庢竻绌烘贰鍖栨爣璁�
+	tableScrollTimeout.value = setTimeout(() => {
+		rowsUnderHeader.value.clear()
+	}, 150)
+}
+
+// 鍒濆鍖栫敓浜ц鍗曡繘搴﹁〃鏍兼粴鍔ㄥ姛鑳�
+const initProgressTableScroll = () => {
+	const tableContainer = progressTableRef.value
+	if (!tableContainer) return
+	
+	// 娓呯悊涔嬪墠鐨勬粴鍔ㄥ姩鐢诲拰瀹氭椂鍣�
+	if (progressTableScrollTimer.value) {
+		cancelAnimationFrame(progressTableScrollTimer.value)
+		progressTableScrollTimer.value = null
+	}
+	if (tableContainer._pauseTimer) {
+		clearInterval(tableContainer._pauseTimer)
+		tableContainer._pauseTimer = null
+	}
+	
+	const tbody = tableContainer.querySelector('tbody')
+	if (!tbody) return
+	
+	// 娓呯悊涔嬪墠鍙兘瀛樺湪鐨勫厠闅嗚锛堜繚鐣欏師濮嬫暟鎹锛�
+	// 鍘熷鏁版嵁琛岀殑鏁伴噺搴旇绛変簬 progressTableData.value.length
+	const originalCount = progressTableData.value.length
+	const allRows = Array.from(tbody.querySelectorAll('tr'))
+	if (allRows.length > originalCount) {
+		// 绉婚櫎鎵�鏈夎秴杩囧師濮嬫暟閲忕殑琛岋紙杩欎簺鏄厠闅嗙殑琛岋級
+		for (let i = originalCount; i < allRows.length; i++) {
+			allRows[i].remove()
+		}
+	}
+	
+	const scrollItems = Array.from(tbody.querySelectorAll('tr'))
+	if (scrollItems.length === 0) return
+	
+	// 鑾峰彇鍘熷鏁版嵁椤规暟閲�
+	const originalItemCount = scrollItems.length
+	
+	// 璁$畻瀹瑰櫒楂樺害鍜岃〃澶撮珮搴�
+	const thead = tableContainer.querySelector('thead')
+	const theadHeight = thead ? thead.offsetHeight : 40
+	const containerHeight = tableContainer.clientHeight
+	const visibleHeight = containerHeight - theadHeight
+	
+	// 璁$畻鍘熷鏁版嵁鐨勬�婚珮搴�
+	const itemHeight = scrollItems[0]?.offsetHeight || 40
+	const totalContentHeight = itemHeight * originalItemCount
+	
+	// 濡傛灉鏁版嵁閲忎笉澶燂紝瀹瑰櫒鍙互瀹屽叏鏄剧ず鎵�鏈夋暟鎹紝灏变笉闇�瑕佹粴鍔ㄥ拰鍏嬮殕
+	if (totalContentHeight <= visibleHeight) {
+		// 鏁版嵁閲忓皯锛屼笉闇�瑕佹粴鍔紝鐩存帴杩斿洖
+		return
+	}
+	
+	// 鏁版嵁閲忚冻澶燂紝闇�瑕佹粴鍔紝杩涜鍏嬮殕浠ュ疄鐜版棤缂濇粴鍔�
+	const cloneCount = Math.ceil(visibleHeight / itemHeight) + 2
+	
+	// 鍏嬮殕鍓嶅嚑涓」鐩苟娣诲姞鍒板垪琛ㄦ湯灏撅紝瀹炵幇鏃犵紳婊氬姩
+	for (let i = 0; i < cloneCount; i++) {
+		const clone = scrollItems[i % originalItemCount].cloneNode(true)
+		tbody.appendChild(clone)
+	}
+	
+	let scrollPosition = 0
+	const scrollSpeed = 1.5
+	const pauseTime = 3000
+	let isPaused = false
+	let lastTimestamp = 0
+	
+	// 杩炵画婊氬姩鍔ㄧ敾鍑芥暟
+	function scrollAnimation(timestamp) {
+		if (!lastTimestamp) lastTimestamp = timestamp
+		const deltaTime = timestamp - lastTimestamp
+		lastTimestamp = timestamp
+		
+		if (!isPaused) {
+			scrollPosition += scrollSpeed * (deltaTime / 16)
+			
+			// 璁$畻鏈�澶ф粴鍔ㄤ綅缃紙鍘熷鍐呭鐨勯珮搴︼級
+			const maxScroll = itemHeight * originalItemCount
+			
+			// 褰撴粴鍔ㄨ秴杩囧師濮嬪唴瀹归暱搴︽椂锛岄噸缃綅缃疄鐜版棤缂濇粴鍔�
+			if (scrollPosition >= maxScroll) {
+				scrollPosition = 0
+				tableContainer.scrollTop = 0
+			} else {
+				tableContainer.scrollTop = scrollPosition
+			}
+		}
+		
+		progressTableScrollTimer.value = requestAnimationFrame(scrollAnimation)
+	}
+	
+	// 鍚姩婊氬姩鍔ㄧ敾
+	progressTableScrollTimer.value = requestAnimationFrame(scrollAnimation)
+	
+	// 璁剧疆婊氬姩-鏆傚仠-婊氬姩鐨勫惊鐜晥鏋�
+	const pauseTimer = setInterval(() => {
+		isPaused = !isPaused
+	}, pauseTime)
+	
+	// 娓呯悊瀹氭椂鍣�
+	tableContainer._pauseTimer = pauseTimer
+}
+
 // 鍒濆鍖栧緟鍔炰簨椤瑰垪琛ㄦ粴鍔ㄥ姛鑳�
 const initTodoListScroll = () => {
 	const todoList = refTodoList.value
@@ -881,9 +1170,9 @@
   updateTime()
   timer.value = setInterval(updateTime, 1000)
 }
-// 鍏ㄥ睆鍔熻兘瀹炵幇 - 閽堝data-dashboard鍏冪礌
+// 鍏ㄥ睆鍔熻兘瀹炵幇 - 閽堝scale-container鍏冪礌
 const toggleFullscreen = () => {
-	const element = document.querySelector('.data-dashboard')
+	const element = document.querySelector('.scale-container')
 	
 	if (!element) return
 	
@@ -911,7 +1200,12 @@
   const fullscreenElement = document.fullscreenElement || 
                            document.webkitFullscreenElement || 
                            document.msFullscreenElement
-  isFullscreen.value = fullscreenElement && fullscreenElement.classList.contains('data-dashboard')
+  isFullscreen.value = fullscreenElement && fullscreenElement.classList.contains('scale-container')
+  
+  // 鍏ㄥ睆鐘舵�佸彉鍖栨椂锛屽欢杩熼噸鏂拌绠楃缉鏀炬瘮渚嬶紙纭繚DOM鏇存柊瀹屾垚锛�
+  setTimeout(() => {
+    calculateScale()
+  }, 200)
 }
 
 // 鐢熷懡鍛ㄦ湡閽╁瓙
@@ -919,8 +1213,11 @@
   initTime()
   // 浣跨敤nextTick纭繚DOM瀹屽叏娓叉煋鍚庡啀鍒濆鍖栧浘琛�
   nextTick(() => {
-    // 鍒濆鍖朼utofit鑷�傚簲
-    autofit.init({ dh: 800, dw: 1280, el: '.data-dashboard', resize: true }, false)
+    // 璁$畻鍒濆缂╂斁姣斾緥
+    calculateScale()
+    
+    // 鍒濆鍖朼utofit鑷�傚簲锛堝鏋滈渶瑕佷繚鐣檃utofit锛屽彲浠ヤ繚鐣欙紝浣嗕富瑕佺缉鏀剧敱scale-container鎺у埗锛�
+    // autofit.init({ dh: 800, dw: 1280, el: '.data-dashboard', resize: true }, false)
     
     // 娣诲姞鑷姩婊氬姩鍔ㄧ敾鏁堟灉 - 瀹㈡埛淇℃伅鍒楄〃
     const contractList = refContractList.value
@@ -980,9 +1277,13 @@
   })
   
   window.addEventListener('resize', handleResize)
+  window.addEventListener('fullscreenchange', handleFullscreenChange)
+  window.addEventListener('webkitfullscreenchange', handleFullscreenChange)
+  window.addEventListener('MSFullscreenChange', handleFullscreenChange)
   analysisCustomer()
   qualityStatisticsInfo()
-	accountStatisticsInfo()
+	// accountStatisticsInfo()
+	progressStatisticsInfo()
   getNum()
   getLedgerNum()
   todoInfoS()
@@ -1023,6 +1324,25 @@
     }
   }
   
+  // 娓呯悊鐢熶骇璁㈠崟杩涘害琛ㄦ牸鐨勫姩鐢诲拰瀹氭椂鍣�
+  const progressTable = progressTableRef.value
+  if (progressTable) {
+    if (progressTableScrollTimer.value) {
+      cancelAnimationFrame(progressTableScrollTimer.value)
+      progressTableScrollTimer.value = null
+    }
+    if (progressTable._pauseTimer) {
+      clearInterval(progressTable._pauseTimer)
+      progressTable._pauseTimer = null
+    }
+  }
+  
+  // 娓呯悊琛ㄦ牸婊氬姩瀹氭椂鍣�
+  if (tableScrollTimeout.value) {
+    clearTimeout(tableScrollTimeout.value)
+    tableScrollTimeout.value = null
+  }
+  
   // 娓呯悊鑷姩杞崲鍛ㄣ�佹湀銆佸搴︾殑瀹氭椂鍣�
   if (autoSwitchTimer.value) {
     clearInterval(autoSwitchTimer.value)
@@ -1045,43 +1365,58 @@
 </script>
 
 <style scoped>
+/* 澶栭儴缂╂斁瀹瑰櫒 - 鍗犳嵁鏁翠釜瑙嗗彛 */
+.scale-container {
+  position: relative;
+	width: 100%;
+	/* 椤甸潰鍦ㄥ父瑙勫竷灞�涓嬶紙鏈夐《鏍忥級榛樿鍑忓幓 84px锛岄伩鍏嶅唴瀹硅瑁佸垏 */
+	height: calc(100vh - 84px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #000;
+	overflow: hidden;
+}
+
+/* 鍐呴儴鍐呭鍖哄煙 - 鍥哄畾璁捐灏哄 */
 .data-dashboard {
   position: relative;
-  width: 100%;
-	height: 100%;
+  width: 1920px;
+  height: 1080px;
 	background-image: url("@/assets/BI/backImage@2x.png");
 	background-size: cover;
 	background-position: center;
 	background-repeat: no-repeat;
+	transform-origin: center center;
 }
 
-/* 鍏ㄥ睆鐘舵�佺殑鏍峰紡 */
-.data-dashboard:fullscreen {
-  width: 100%;
-  height: 100%;
+/* 鍏ㄥ睆鐘舵�佺殑鏍峰紡 - 浣滅敤浜巗cale-container */
+.scale-container:fullscreen {
+	width: 100vw;
+	height: 100vh;
   margin: 0;
   padding: 0;
-  background-color: inherit;
+  background-color: #000;
   z-index: 9999;
 }
 
 /* Webkit娴忚鍣ㄥ墠缂� */
-.data-dashboard:-webkit-full-screen {
-  width: 100%;
-  height: 100%;
+.scale-container:-webkit-full-screen {
+  width: 100vw;
+  height: 100vh;
   margin: 0;
   padding: 0;
-  background-color: inherit;
+  background-color: #000;
   z-index: 9999;
 }
 
 /* MS娴忚鍣ㄥ墠缂� */
-.data-dashboard:-ms-fullscreen {
-  width: 100%;
-  height: 100%;
+.scale-container:-ms-fullscreen {
+  width: 100vw;
+  height: 100vh;
   margin: 0;
   padding: 0;
-  background-color: inherit;
+  background-color: #000;
   z-index: 9999;
 }
 
@@ -1089,10 +1424,9 @@
 .dashboard-header {
   position: relative;
   z-index: 1;
-  height: 170px;
+	height: 86px;
 	background-image: url("@/assets/BI/biaoti.png");
 	background-size: cover;
-	background-position: center;
 	background-repeat: no-repeat;
   display: flex;
   align-items: center;
@@ -1103,7 +1437,7 @@
   font-weight: 600;
 font-size: 52px;
 color: #FFFFFF;
-top: 32px;
+top: 16px;
 position: absolute;
 }
 
@@ -1136,7 +1470,7 @@
   display: flex;
   gap: 30px;
   padding: 0 30px;
-  height: calc(100% - 120px);
+	height: calc(100% - 86px);
   overflow: hidden;
 }
 
@@ -1207,7 +1541,33 @@
 }
 .quality-card.three {
 	background-image: url("@/assets/BI/chuchangyijianicon@2x.png");
-	
+}
+
+/* 璁㈠崟缁熻鍗$墖鏍峰紡 */
+.order-statistics-cards {
+	display: flex;
+	gap: 12px;
+	width: 100%;
+	height: 94px;
+	justify-content: space-between;
+	align-items: center;
+	margin-bottom: 20px;
+}
+
+.quality-card.four {
+	background-image: url("@/assets/BI/yuancailiaoyijianicon@2x.png");
+}
+
+.quality-card.five {
+	background-image: url("@/assets/BI/guochengyijianicon@2x.png");
+}
+
+.quality-card.six {
+	background-image: url("@/assets/BI/chuchangyijianicon@2x.png");
+}
+
+.quality-card.seven {
+	background-image: url("@/assets/BI/yuancailiaoyijianicon@2x.png");
 }
 .panel-title-icon {
 	width: 60px;
@@ -1490,4 +1850,84 @@
   border-color: rgba(255, 255, 255, 0.5);
   box-shadow: -1px 0 0 0 rgba(255, 255, 255, 0.5);
 }
+
+/* 鐢熶骇璁㈠崟杩涘害琛ㄦ牸鏍峰紡 */
+.progress-table-container {
+  height: 250px;
+  overflow-y: auto;
+  overflow-x: hidden;
+  margin-top: 10px;
+  scrollbar-width: none; /* Firefox */
+  -ms-overflow-style: none; /* IE鍜孍dge */
+}
+
+.progress-table-container::-webkit-scrollbar {
+  display: none; /* Chrome銆丼afari鍜孫pera */
+}
+
+.progress-table {
+  width: 100%;
+  border-collapse: collapse;
+  color: #B8C8E0;
+  font-size: 12px;
+  table-layout: fixed;
+}
+
+.progress-table thead {
+  position: sticky;
+  top: 0;
+  background-color: rgba(26, 88, 176, 0.9);
+  z-index: 10;
+}
+
+.progress-table th {
+  padding: 8px 6px;
+  text-align: left;
+  font-weight: 500;
+  border-bottom: 1px solid rgba(184, 200, 224, 0.3);
+  color: #B8C8E0;
+  font-size: 12px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.progress-table th:nth-child(1) { width: 15%; } /* 鐢熶骇璁㈠崟鍙� */
+.progress-table th:nth-child(2) { width: 15%; } /* 浜у搧鍚嶇О */
+.progress-table th:nth-child(3) { width: 15%; } /* 瑙勬牸 */
+.progress-table th:nth-child(4) { width: 12%; } /* 闇�姹傛暟閲� */
+.progress-table th:nth-child(5) { width: 12%; } /* 瀹屾垚鏁伴噺 */
+.progress-table th:nth-child(6) { width: 31%; } /* 瀹屾垚杩涘害 */
+
+.progress-table td {
+  padding: 8px 6px;
+  border-bottom: 1px solid rgba(184, 200, 224, 0.1);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-size: 12px;
+  transition: opacity 0.3s ease;
+}
+
+.progress-table tbody tr:hover {
+  background-color: rgba(184, 200, 224, 0.1);
+}
+
+.progress-table tbody tr.row-under-header {
+  opacity: 0.5;
+}
+
+/* el-progress 缁勪欢鏍峰紡璋冩暣 */
+.progress-table :deep(.el-progress) {
+  width: 100%;
+}
+
+.progress-table :deep(.el-progress-bar__outer) {
+  background-color: rgba(184, 200, 224, 0.2);
+}
+
+.progress-table :deep(.el-progress__text) {
+  color: #B8C8E0;
+  font-size: 11px;
+}
 </style>
\ No newline at end of file

--
Gitblit v1.9.3