-
+
+
-
@@ -152,40 +152,40 @@ onMounted(async () => {
// 立即开始更新时间
updateTime()
timeTimer = setInterval(updateTime, 1000)
-
+
try {
// 加载配置
console.log('App.vue: 开始加载配置')
config.value = await configManager.loadConfig()
console.log('App.vue: 配置加载完成', config.value)
-
+
// 设置CSS变量
console.log('App.vue: 设置CSS变量')
configManager.setCSSVariables()
-
+
// 等待CSS变量生效和DOM更新
await nextTick()
-
+
// 再等待一帧确保样式完全应用
await new Promise(resolve => requestAnimationFrame(resolve))
console.log('App.vue: CSS变量已生效')
-
+
// 加载数据配置
console.log('App.vue: 开始加载数据配置')
const loadedData = await dataManager.loadData()
console.log('App.vue: 数据配置加载完成', loadedData)
-
+
// 标记布局准备完成，开始渲染组件
console.log('App.vue: 布局准备完成，开始渲染组件')
isLayoutReady.value = true
-
+
console.log('Dashboard 完全初始化完成')
} catch (error) {
console.error('Failed to initialize dashboard:', error)
// 使用默认配置
config.value = configManager.getDefaultConfig()
configManager.setCSSVariables()
-
+
// 等待DOM更新后显示页面
await nextTick()
await new Promise(resolve => requestAnimationFrame(resolve))
@@ -432,7 +432,12 @@ onUnmounted(() => {
}
@keyframes spin {
- 0% { transform: rotate(0deg); }
- 100% { transform: rotate(360deg); }
+ 0% {
+ transform: rotate(0deg);
+ }
+
+ 100% {
+ transform: rotate(360deg);
+ }
}
\ No newline at end of file
diff --git a/src/components/ChinaMap.vue b/src/components/ChinaMap.vue
index 9282cd4..fbc18f3 100644
--- a/src/components/ChinaMap.vue
+++ b/src/components/ChinaMap.vue
@@ -46,20 +46,26 @@
- | 区域名称 |
- 交易数量 |
- 采购商户 |
- 收货地 |
- 交易时间 |
+ 检疫编号 |
+ 货主 |
+ 启运地点 |
+ 到达地点 |
+ 车牌号 |
+ 牦牛数量 |
+ 联系人 |
+ 联系方式 |
- | {{ item.areaName }} |
- {{ item.quantity }}头 |
- {{ item.buyer }} |
+ {{ item.quarantineNo }} |
+ {{ item.owner }} |
+ {{ item.origin }} |
{{ item.destination }} |
- {{ item.tradeTime }} |
+ {{ item.vehiclePlate }} |
+ {{ item.yakCount }}头 |
+ {{ item.contactPerson }} |
+ {{ item.contactPhone }} |
@@ -415,46 +421,64 @@ const generateDetailData = (cityName) => {
// 模拟交易明细数据
const baseData = [
{
- areaName: '若尔盖县',
- quantity: 120,
- buyer: '成都牧业有限公司',
+ quarantineNo: 'JY2024010001',
+ owner: '阿坝县扎西畜牧专业合作社',
+ origin: '阿坝县若尔盖草原',
destination: '成都市双流区',
- tradeTime: '2024-01-15'
+ vehiclePlate: '川A·12345',
+ yakCount: 120,
+ contactPerson: '扎西多吉',
+ contactPhone: '138****1234'
},
{
- areaName: '阿坝县',
- quantity: 95,
- buyer: '重庆畜牧贸易公司',
+ quarantineNo: 'JY2024010002',
+ owner: '红原县草原牧业有限公司',
+ origin: '红原县安曲镇',
destination: '重庆市渝北区',
- tradeTime: '2024-01-14'
+ vehiclePlate: '川A·23456',
+ yakCount: 95,
+ contactPerson: '次仁德勒',
+ contactPhone: '139****2345'
},
{
- areaName: '红原县',
- quantity: 80,
- buyer: '西安草原食品',
+ quarantineNo: 'JY2024010003',
+ owner: '若尔盖县牧民专业合作社',
+ origin: '若尔盖县花湖草原',
destination: '西安市雁塔区',
- tradeTime: '2024-01-13'
+ vehiclePlate: '川U·34567',
+ yakCount: 80,
+ contactPerson: '旺久多杰',
+ contactPhone: '136****3456'
},
{
- areaName: '松潘县',
- quantity: 65,
- buyer: '兰州牧场合作社',
+ quarantineNo: 'JY2024010004',
+ owner: '松潘县高原牧业合作社',
+ origin: '松潘县川主寺镇',
destination: '兰州市城关区',
- tradeTime: '2024-01-12'
+ vehiclePlate: '川A·45678',
+ yakCount: 65,
+ contactPerson: '桑杰嘉措',
+ contactPhone: '137****4567'
},
{
- areaName: '马尔康市',
- quantity: 55,
- buyer: '昆明高原牧业',
+ quarantineNo: 'JY2024010005',
+ owner: '马尔康市康巴牧业有限公司',
+ origin: '马尔康市梭磨乡',
destination: '昆明市西山区',
- tradeTime: '2024-01-11'
+ vehiclePlate: '川A·56789',
+ yakCount: 55,
+ contactPerson: '格桑旺堆',
+ contactPhone: '135****5678'
},
{
- areaName: '壤塘县',
- quantity: 45,
- buyer: '贵阳绿色食品',
+ quarantineNo: 'JY2024010006',
+ owner: '壤塘县藏区牧业专业合作社',
+ origin: '壤塘县中壤塘镇',
destination: '贵阳市观山湖区',
- tradeTime: '2024-01-10'
+ vehiclePlate: '川A·67890',
+ yakCount: 45,
+ contactPerson: '洛桑扎西',
+ contactPhone: '134****6789'
}
]
@@ -465,9 +489,13 @@ const generateDetailData = (cityName) => {
// 为其他城市生成相应的数据
return baseData.map((item, index) => ({
...item,
- buyer: `${cityName}${['牧业集团', '畜牧公司', '贸易有限公司', '草原合作社'][index % 4]}`,
+ quarantineNo: `JY2024${String(Math.floor(Math.random() * 9000) + 1000).substr(0, 4)}${String(index + 1).padStart(3, '0')}`,
+ owner: `${cityName}${['畜牧专业合作社', '高原牧业有限公司', '牧民专业合作社', '草原牧业集团'][index % 4]}`,
+ origin: `${cityName}${['草原', '镇', '乡', '县'][index % 4]}`,
destination: `${cityName}${['经开区', '高新区', '市中区', '新城区'][index % 4]}`,
- tradeTime: `2024-01-${15 - index}`
+ vehiclePlate: `${['川A', '川B', '川C', '川U'][index % 4]}·${Math.floor(Math.random() * 90000) + 10000}`,
+ contactPerson: ['扎西', '次仁', '旺久', '桑杰', '格桑', '洛桑'][index % 6] + ['多吉', '德勒', '多杰', '嘉措', '旺堆', '扎西'][Math.floor(Math.random() * 6)],
+ contactPhone: `${['138', '139', '136', '137', '135', '134'][index % 6]}****${Math.floor(Math.random() * 9000) + 1000}`
}))
}
}
@@ -987,7 +1015,7 @@ onUnmounted(() => {
bottom: 20px;
transform: translateX(-50%);
width: 80%;
- max-width: 900px;
+ max-width: 1200px;
max-height: 400px;
background: rgba(15, 25, 45, 0.98);
border: 1px solid #00d4ff;
diff --git a/src/components/ExchangeMonitor.vue b/src/components/ExchangeMonitor.vue
index 82fb958..9881dd2 100644
--- a/src/components/ExchangeMonitor.vue
+++ b/src/components/ExchangeMonitor.vue
@@ -181,12 +181,12 @@ onUnmounted(() => {
}
.service-icon {
- font-size: 24px;
+ font-size: 32px;
display: flex;
align-items: center;
justify-content: center;
- width: 40px;
- height: 40px;
+ width: 50px;
+ height: 50px;
background: rgba(64, 158, 255, 0.1);
border-radius: 8px;
flex-shrink: 0;
@@ -199,14 +199,14 @@ onUnmounted(() => {
}
.service-label {
- font-size: 14px;
+ font-size: 16px;
color: #a0a8b8;
font-weight: 500;
line-height: 1.2;
}
.service-value {
- font-size: 20px;
+ font-size: 24px;
font-weight: bold;
color: #ffffff;
line-height: 1.2;
@@ -242,13 +242,13 @@ onUnmounted(() => {
}
.service-unit {
- font-size: 11px;
+ font-size: 14px;
color: #8cc8ff;
font-weight: normal;
}
.service-status {
- font-size: 14px;
+ font-size: 16px;
padding: 2px 6px;
border-radius: 4px;
font-weight: 500;