wip在产大屏

.idea/.gitignore

@@ -0,0 +1,8 @@
+# 默认忽略的文件
+/shelf/
+/workspace.xml
+# 基于编辑器的 HTTP 客户端请求
+/httpRequests/
+# Datasource local storage ignored files
+/dataSources/
+/dataSources.local.xml

.idea/MarsCodeWorkspaceAppSettings.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="com.codeverse.userSettings.MarscodeWorkspaceAppSettingsState">
+    <option name="progress" value="1.0" />
+  </component>
+</project>

.idea/misc.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_17" default="true" project-jdk-name="17" project-jdk-type="JavaSDK">
+    <output url="file://$PROJECT_DIR$/out" />
+  </component>
+</project>

.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/screen.iml" filepath="$PROJECT_DIR$/.idea/screen.iml" />
+    </modules>
+  </component>
+</project>

.idea/screen.iml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="JAVA_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>

package.json

@@ -8,7 +8,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@jiaminghi/data-view": "^2.10.0",
+    "@kjgl77/datav-vue3": "^1.0.0",
     "axios": "^1.6.7",
     "cors": "^2.8.6",
     "echarts": "^5.6.0",

src/api/request.js

@@ -10,11 +10,31 @@ const service = axios.create({
   }
 })
 
+// 从 Cookies 获取 Token（与 klp-ui 保持一致）
+const getToken = () => {
+  const name = 'Admin-Token'
+  const value = `; ${document.cookie}`
+  const parts = value.split(`; ${name}=`)
+  if (parts.length === 2) return parts.pop().split(';').shift()
+  return null
+}
+
 service.interceptors.request.use(
   config => {
-    const token = localStorage.getItem('token')
+    let token = getToken()
+    // ========== 测试用：临时硬编码 Token ==========
+    // 如果没有从 Cookies 获取到 Token，使用测试 Token
+    if (!token) {
+      token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJsb2dpblR5cGUiOiJsb2dpbiIsImxvZ2luSWQiOiJzeXNfdXNlcjoxIiwicm5TdHIiOiJGM2w5Nm5ncGV4ZDA4d1BUYWlvVmFreWhCUDdlc2gyeCIsInVzZXJJZCI6MX0.aP06S-5aJtukzMjmYW3d5zK3v10TOKcdNpROniv5lr8'
+    }
+    // ========== 测试用结束 ==========
+
+    console.log('请求URL:', config.url)
+    console.log('使用的Token:', token ? '已设置' : '未设置')
+
     if (token) {
-      config.headers['Authorization'] = `Bearer ${token}`
+      // 尝试两种格式：Bearer 和 直接使用Token
+      config.headers['Authorization'] = token // 直接使用Token（不带Bearer前缀）
     }
     return config
   },
@@ -25,15 +45,36 @@ service.interceptors.request.use(
 
 service.interceptors.response.use(
   response => {
-    const res = response.data
+    console.log('响应数据:', response.data)
-    if (res.code !== 200) {
+
-      console.error('请求失败:', res.message)
+    let res = response.data
-      return Promise.reject(new Error(res.message || 'Error'))
+
+    // 如果响应数据为空
+    if (!res) {
+      console.error('响应数据为空')
+      return Promise.reject(new Error('响应数据为空'))
     }
-    return res.data
+
+    // 如果是字符串，尝试解析
+    if (typeof res === 'string') {
+      try {
+        res = JSON.parse(res)
+      } catch {
+        console.error('响应数据不是JSON格式:', res)
+        return res
+      }
+    }
+
+    // 检查code
+    if (res.code !== undefined && res.code !== 200) {
+      console.error('请求失败 [code=' + res.code + ']:', res.message || res.msg)
+      return Promise.reject(new Error(res.message || res.msg || '请求失败'))
+    }
+
+    return res.data !== undefined ? res.data : res
   },
   error => {
-    console.error('请求错误:', error)
+    console.error('请求错误:', error.response?.data || error.message || error)
     return Promise.reject(error)
   }
 )

src/api/wip.js

@@ -0,0 +1,10 @@
+import request from '@/utils/request'
+
+// 查询钢卷待操作列表（WIP 数据源）
+export function listPendingAction(query) {
+  return request({
+    url: '/wms/coilPendingAction/list',
+    method: 'get',
+    params: query
+  })
+}

src/api/wms/actualWarehouse.js

@@ -0,0 +1,136 @@
+import request from '@/utils/request'
+
+
+// 查询实际库区/库位自关联列表
+export function listActualWarehouse(query) {
+    return request({
+        url: '/wms/actualWarehouse/list',
+        method: 'get',
+        params: query
+    })
+}
+
+// 获取完整三级目录
+export function listActualWarehouseTree(query) {
+    return request({
+        url: '/wms/actualWarehouse/tree',
+        method: 'get',
+        params: query
+    })
+}
+
+// 查询实际库区/库位自关联详细
+export function getActualWarehouse(actualWarehouseId) {
+    return request({
+        url: '/wms/actualWarehouse/' + actualWarehouseId,
+        method: 'get'
+    })
+}
+
+// 新增实际库区/库位自关联
+export function addActualWarehouse(data) {
+    return request({
+        url: '/wms/actualWarehouse',
+        method: 'post',
+        data: data
+    })
+}
+
+// 导入实际库区/库位
+export function importActualWarehouse(data) {
+    return request({
+        url: '/wms/actualWarehouse/importData',
+        method: 'post',
+        data,
+        headers: { 'Content-Type': 'multipart/form-data' }
+    })
+}
+
+// 批量新增三级目录
+export function createActualWarehouseHierarchy(data) {
+    return request({
+        url: '/wms/actualWarehouse/hierarchy',
+        method: 'post',
+        data
+    })
+}
+
+// 修改实际库区/库位自关联
+export function updateActualWarehouse(data) {
+    return request({
+        url: '/wms/actualWarehouse',
+        method: 'put',
+        data: data
+    })
+}
+
+// 删除实际库区/库位自关联
+export function delActualWarehouse(actualWarehouseId) {
+    return request({
+        url: '/wms/actualWarehouse/' + actualWarehouseId,
+        method: 'delete'
+    })
+}
+
+// 获取两级的树结构
+export function treeActualWarehouseTwoLevel(query) {
+    return request({
+        url: '/wms/actualWarehouse/levelTwo',
+        method: 'get',
+        params: query
+    })
+}
+
+export function generateLocations(data) {
+    return request({
+        url: '/wms/actualWarehouse/generateLocations',
+        method: 'post',
+        data
+    })
+}
+
+/**
+ * 分割库区
+ */
+export function splitActualWarehouse(payload) {
+    return request({
+        url: '/wms/actualWarehouse/split',
+        method: 'post',
+        timeout: 100000,
+        data: {
+            action: 1,
+            splitType: 0,
+            ...payload
+        }
+    })
+}
+
+/**
+ * 合并库区
+ */
+export function mergeActualWarehouse(payload) {
+    return request({
+        url: '/wms/actualWarehouse/merge',
+        method: 'post',
+        timeout: 100000,
+        data: {
+            action: 0,
+            splitType: 0,
+            ...payload
+        }
+    })
+}
+
+/**
+ * 强制释放库位
+ */
+export function forceReleaseLocation(actualWarehouseId) {
+    if (!actualWarehouseId) {
+        throw new Error('actualWarehouseId is required');
+    }
+    return request({
+        url: '/wms/actualWarehouse/release/' + actualWarehouseId,
+        method: 'put',
+        timeout: 100000,
+    })
+}

src/components/DataVLayout.vue

@@ -0,0 +1,117 @@
+<template>
+  <dv-full-screen-container class="datav-container" auto-fit>
+    <div class="datav-wrapper">
+      <!-- 顶部标题栏 -->
+      <div class="datav-header">
+        <dv-decoration-10 style="width: 400px; height: 40px" />
+        <div class="header-title">
+          <dv-decoration-9 :reverse="true" />
+          <span class="title-text">{{ title || '数据可视化大屏' }}</span>
+          <dv-decoration-9 />
+        </div>
+        <dv-decoration-10 style="width: 400px; height: 40px" :reverse="true" />
+      </div>
+
+      <!-- 左侧装饰 -->
+      <div class="decoration decoration-left">
+        <dv-decoration-3 style="width: 200px; height: 100%" />
+      </div>
+
+      <!-- 右侧装饰 -->
+      <div class="decoration decoration-right">
+        <dv-decoration-3 style="width: 200px; height: 100%" :reverse="true" />
+      </div>
+
+      <!-- 主体内容区域 -->
+      <div class="datav-main">
+        <slot></slot>
+      </div>
+
+      <!-- 底部装饰 -->
+      <div class="datav-footer">
+        <dv-decoration-2 style="width: 100%; height: 30px" />
+      </div>
+    </div>
+  </dv-full-screen-container>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+
+const props = defineProps({
+  title: {
+    type: String,
+    default: ''
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+.datav-container {
+  width: 100%;
+  height: 100%;
+  background: #0a1428;
+  overflow: hidden;
+}
+
+.datav-wrapper {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+}
+
+.datav-header {
+  height: 80px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 20px;
+
+  .header-title {
+    display: flex;
+    align-items: center;
+    gap: 20px;
+
+    .title-text {
+      font-size: 32px;
+      font-weight: bold;
+      color: #00d4ff;
+      text-shadow: 0 0 20px rgba(0, 212, 255, 0.5);
+      letter-spacing: 8px;
+      white-space: nowrap;
+    }
+  }
+}
+
+.decoration {
+  position: absolute;
+  top: 80px;
+  bottom: 30px;
+  width: 15px;
+  pointer-events: none;
+  z-index: 1;
+}
+
+.decoration-left {
+  left: 0;
+}
+
+.decoration-right {
+  right: 0;
+}
+
+.datav-main {
+  flex: 1;
+  padding: 10px 30px;
+  overflow: hidden;
+  position: relative;
+  z-index: 2;
+}
+
+.datav-footer {
+  height: 30px;
+  flex-shrink: 0;
+}
+</style>

src/layout/components/AppMain.vue

@@ -14,9 +14,9 @@
 <style lang="scss" scoped>
 .app-main {
   flex: 1;
-  overflow-y: auto;
+  overflow: hidden;
-  background: #f5f7fa;
+  background: transparent;
-  padding: 16px;
+  padding: 0;
   box-sizing: border-box;
   min-height: 0;
   width: 100%;

src/layout/components/Navbar/index.vue

@@ -2,7 +2,6 @@
   <nav class="navbar">
     <div class="navbar-left">
       <hamburger @toggle-click="toggleSideBar" />
-      <span class="navbar-title">{{ title }}</span>
     </div>
     <div class="navbar-right">
       <button class="action-btn refresh-btn" @click="handleRefresh" title="刷新数据">
@@ -54,23 +53,23 @@ onUnmounted(() => {
 
 <style lang="scss" scoped>
 .navbar {
-  height: 60px;
+  height: 50px;
-  background: linear-gradient(90deg, rgba(0, 168, 204, 0.95) 0%, rgba(0, 212, 255, 0.9) 50%, rgba(0, 168, 204, 0.95) 100%);
+  background: linear-gradient(90deg, #00a8cc 0%, #00d4ff 50%, #00a8cc 100%);
   width: 100%;
   flex-shrink: 0;
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 0 24px;
+  padding: 0 16px;
   box-sizing: border-box;
-  border-bottom: 2px solid rgba(0, 212, 255, 0.4);
+  border-bottom: 1px solid rgba(0, 212, 255, 0.3);
-  box-shadow: 0 4px 20px rgba(0, 212, 255, 0.2);
 }
 
 .navbar-left {
   display: flex;
   align-items: center;
   gap: 20px;
+  width: 200px;
 }
 
 .navbar-title {

src/layout/components/Sidebar/index.vue

@@ -39,7 +39,6 @@ const activeMenu = computed(() => route.path)
 
 const iconMap = {
   'monitor': Monitor,
-  'example': PieChart,
   'order': Document,
   'cost': PieChart,
   'energy': Monitor,
@@ -53,14 +52,15 @@ const getIcon = (iconName) => {
 }
 
 const menuItems = [
-  { path: '/dashboard/demo', meta: { title: '示例大屏', icon: 'example' } },
   { path: '/dashboard/order', meta: { title: '订单大屏', icon: 'order' } },
   { path: '/dashboard/cost', meta: { title: '成本大屏', icon: 'cost' } },
   { path: '/dashboard/energy', meta: { title: '能源大屏', icon: 'energy' } },
   { path: '/dashboard/oee', meta: { title: 'OEE综合大屏', icon: 'oee' } },
   { path: '/dashboard/output', meta: { title: '产出监控大屏', icon: 'output' } },
   { path: '/dashboard/stop-analysis', meta: { title: '停机分析大屏', icon: 'stop' } },
-  { path: '/dashboard/acid-rolling', meta: { title: '酸轧数据大屏', icon: 'example' } }
+  { path: '/dashboard/acid-rolling', meta: { title: '酸轧数据大屏', icon: 'example' } },
+  { path: '/warehouse-overview', meta: { title: '库区总览大屏', icon: 'example' } },
+  { path: '/wip', meta: { title: 'WIP在产大屏', icon: 'monitor' } }
 ]
 </script>
 

src/main.js

@@ -5,6 +5,7 @@ import store from './store'
 import ElementPlus from 'element-plus'
 import 'element-plus/dist/index.css'
 import './assets/styles/index.scss'
+import DatavVue3 from '@kjgl77/datav-vue3'
 
 const app = createApp(App)
 
@@ -22,4 +23,5 @@ app.config.errorHandler = (err, instance, info) => {
 app.use(router)
 app.use(store)
 app.use(ElementPlus)
+app.use(DatavVue3)
 app.mount('#app')

src/modules/dashboardBig/views/index.vue

@@ -1,540 +0,0 @@
-<template>
-  <div class="screen-wrapper">
-    <div class="screen-content">
-      <header class="screen-header">
-        <h1 class="title">大数据可视化平台</h1>
-        <div class="header-right">
-          <span class="time">{{ currentTime }}</span>
-          <button v-if="isFullscreen" class="exit-fullscreen-btn" @click="exitFullscreen" title="退出全屏">
-            <span>⛶ 退出全屏</span>
-          </button>
-        </div>
-      </header>
-
-      <main class="screen-body">
-        <div class="kpi-grid">
-          <div class="kpi-card" v-for="card in cards" :key="card.title">
-            <div class="card-header">{{ card.title }}</div>
-            <div class="kpi-value" :style="{ color: card.color }">{{ card.value }}</div>
-            <div class="kpi-unit">{{ card.unit }}</div>
-          </div>
-        </div>
-
-        <div class="chart-row">
-          <div class="chart-box flex-1">
-            <div class="box-header">产量趋势</div>
-            <div ref="lineChartRef" class="chart"></div>
-          </div>
-          <div class="chart-box flex-1">
-            <div class="box-header">运行状态</div>
-            <div ref="pieChartRef" class="chart"></div>
-          </div>
-          <div class="chart-box flex-1">
-            <div class="box-header">班组排名</div>
-            <div class="ranking-list">
-              <div class="ranking-item" v-for="(item, index) in rankingList" :key="item.name">
-                <span class="rank" :class="'rank-' + (index + 1)">{{ index + 1 }}</span>
-                <span class="name">{{ item.name }}</span>
-                <span class="value">{{ item.value }}</span>
-                <span class="unit">吨</span>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <div class="chart-row">
-          <div class="chart-box flex-2">
-            <div class="box-header">实时告警</div>
-            <div class="alarm-list">
-              <div class="alarm-item" v-for="alarm in alarmList" :key="alarm.time">
-                <span class="alarm-icon">{{ alarm.icon }}</span>
-                <div class="alarm-content">
-                  <div class="alarm-title">{{ alarm.title }}</div>
-                  <div class="alarm-time">{{ alarm.time }}</div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </main>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref, onMounted, onBeforeUnmount, onUnmounted, nextTick } from 'vue'
-import * as echarts from 'echarts'
-
-const currentTime = ref('')
-const isFullscreen = ref(false)
-const lineChartRef = ref(null)
-const pieChartRef = ref(null)
-let lineChart = null
-let pieChart = null
-let timeInterval = null
-let resizeObserver = null
-let fullscreenChangeHandler = null
-
-const cards = ref([
-  { title: '总产量', value: '12,580', unit: '吨', color: '#00d4ff' },
-  { title: '日产量', value: '1,258', unit: '吨', color: '#00ff88' },
-  { title: '运行效率', value: '96.8', unit: '%', color: '#7c63ff' },
-  { title: '良品率', value: '99.2', unit: '%', color: '#ff9f43' }
-])
-
-const rankingList = ref([
-  { name: '甲班', value: '3,200' },
-  { name: '乙班', value: '2,980' },
-  { name: '丙班', value: '2,850' },
-  { name: '丁班', value: '2,720' }
-])
-
-const alarmList = ref([
-  { icon: '✅', title: '系统运行正常', time: '15:30:00', level: 'success' },
-  { icon: '⚠️', title: '速度损失告警', time: '14:25:00', level: 'warning' },
-  { icon: '🔴', title: '设备故障停机', time: '13:15:00', level: 'danger' }
-])
-
-const updateTime = () => {
-  currentTime.value = new Date().toLocaleString('zh-CN', {
-    year: 'numeric',
-    month: '2-digit',
-    day: '2-digit',
-    hour: '2-digit',
-    minute: '2-digit',
-    second: '2-digit'
-  })
-}
-
-const initCharts = () => {
-  if (lineChartRef.value) {
-    lineChart = echarts.init(lineChartRef.value)
-    lineChart.setOption({
-      backgroundColor: 'transparent',
-      tooltip: { 
-        trigger: 'axis',
-        backgroundColor: 'rgba(10, 20, 40, 0.9)',
-        borderColor: '#1e3a5f',
-        textStyle: { color: '#fff' }
-      },
-      grid: { top: 20, right: 20, bottom: 30, left: 50 },
-      xAxis: {
-        type: 'category',
-        data: ['08:00', '10:00', '12:00', '14:00', '16:00', '18:00'],
-        axisLine: { lineStyle: { color: '#3a5a8a' } },
-        axisTick: { show: false },
-        axisLabel: { color: '#a0c4e8' }
-      },
-      yAxis: {
-        type: 'value',
-        axisLine: { show: false },
-        splitLine: { lineStyle: { color: '#1e3a5f', type: 'dashed' } },
-        axisLabel: { color: '#a0c4e8' }
-      },
-      series: [{
-        name: '产量',
-        type: 'line',
-        smooth: true,
-        data: [820, 932, 901, 1234, 1290, 1330],
-        areaStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-            { offset: 0, color: 'rgba(0, 212, 255, 0.3)' },
-            { offset: 1, color: 'rgba(0, 212, 255, 0.05)' }
-          ])
-        },
-        lineStyle: { color: '#00d4ff', width: 2 },
-        itemStyle: { color: '#00d4ff' }
-      }]
-    })
-  }
-
-  if (pieChartRef.value) {
-    pieChart = echarts.init(pieChartRef.value)
-    pieChart.setOption({
-      backgroundColor: 'transparent',
-      tooltip: { 
-        trigger: 'item', 
-        formatter: '{b}: {c}% ({d}%)',
-        backgroundColor: 'rgba(10, 20, 40, 0.9)',
-        borderColor: '#1e3a5f',
-        textStyle: { color: '#fff' }
-      },
-      legend: { bottom: 0, textStyle: { color: '#a0c4e8' } },
-      series: [{
-        type: 'pie',
-        radius: ['45%', '75%'],
-        center: ['50%', '45%'],
-        data: [
-          { value: 65, name: '运行中', itemStyle: { color: '#00ff88' } },
-          { value: 20, name: '待机', itemStyle: { color: '#ffd43b' } },
-          { value: 10, name: '故障', itemStyle: { color: '#ff6b6b' } },
-          { value: 5, name: '维护', itemStyle: { color: '#00d4ff' } }
-        ],
-        label: { show: false }
-      }]
-    })
-  }
-}
-
-const handleResize = () => {
-  nextTick(() => {
-    lineChart?.resize()
-    pieChart?.resize()
-  })
-}
-
-onMounted(() => {
-  updateTime()
-  timeInterval = setInterval(updateTime, 1000)
-
-  nextTick(() => {
-    initCharts()
-    handleResize()
-
-    window.addEventListener('resize', handleResize)
-
-    if (window.ResizeObserver) {
-      resizeObserver = new ResizeObserver(() => {
-        handleResize()
-      })
-      const container = document.querySelector('.screen-wrapper')
-      if (container) {
-        resizeObserver.observe(container)
-      }
-    }
-  })
-  
-  window.addEventListener('refresh-data', handleRefresh)
-  
-  fullscreenChangeHandler = () => {
-    isFullscreen.value = !!document.fullscreenElement
-  }
-  document.addEventListener('fullscreenchange', fullscreenChangeHandler)
-})
-
-const handleRefresh = () => {
-  initCharts()
-}
-
-const exitFullscreen = () => {
-  if (document.fullscreenElement) {
-    document.exitFullscreen().catch(err => {
-      console.error('退出全屏失败:', err)
-    })
-  }
-}
-
-onBeforeUnmount(() => {
-  if (timeInterval) {
-    clearInterval(timeInterval)
-    timeInterval = null
-  }
-  window.removeEventListener('resize', handleResize)
-  window.removeEventListener('refresh-data', handleRefresh)
-  if (resizeObserver) {
-    resizeObserver.disconnect()
-    resizeObserver = null
-  }
-  if (fullscreenChangeHandler) {
-    document.removeEventListener('fullscreenchange', fullscreenChangeHandler)
-    fullscreenChangeHandler = null
-  }
-  if (lineChart) {
-    lineChart.dispose()
-    lineChart = null
-  }
-  if (pieChart) {
-    pieChart.dispose()
-    pieChart = null
-  }
-})
-
-onUnmounted(() => {
-  // 确保清理完成
-})
-</script>
-
-<style lang="scss" scoped>
-.screen-wrapper {
-  width: 100%;
-  min-height: 100vh;
-  height: 100%;
-  background: linear-gradient(180deg, #0a1428 0%, #0d1b34 50%, #0a1428 100%);
-  overflow-y: auto;
-  overflow-x: hidden;
-  margin: 0;
-  padding: 0;
-}
-
-.screen-content {
-  background: transparent;
-  color: #ffffff;
-  width: 100%;
-  min-height: 100vh;
-  margin: 0;
-  padding: 20px;
-  box-sizing: border-box;
-}
-
-.screen-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 16px 24px;
-  background: linear-gradient(90deg, rgba(0, 168, 204, 0.9) 0%, rgba(0, 212, 255, 0.8) 50%, rgba(0, 168, 204, 0.9) 100%);
-  margin-bottom: 20px;
-  border-bottom: 2px solid rgba(0, 212, 255, 0.4);
-
-  .title {
-    font-size: 26px;
-    font-weight: bold;
-    color: #00d4ff;
-    letter-spacing: 3px;
-    margin: 0;
-    text-shadow: 0 0 20px rgba(0, 212, 255, 0.5);
-  }
-
-  .header-right {
-    display: flex;
-    align-items: center;
-    gap: 20px;
-  }
-
-  .time {
-    font-size: 18px;
-    color: #00d4ff;
-    font-family: 'Courier New', monospace;
-    font-weight: bold;
-  }
-
-  .exit-fullscreen-btn {
-    padding: 8px 16px;
-    border: 1px solid rgba(255, 107, 107, 0.5);
-    border-radius: 6px;
-    background: rgba(255, 107, 107, 0.2);
-    color: #ff6b6b;
-    font-size: 14px;
-    cursor: pointer;
-    transition: all 0.3s ease;
-
-    &:hover {
-      background: rgba(255, 107, 107, 0.3);
-      border-color: #ff6b6b;
-      box-shadow: 0 0 15px rgba(255, 107, 107, 0.3);
-    }
-  }
-}
-
-.screen-body {
-  padding: 0;
-}
-
-.kpi-grid {
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 16px;
-  margin-bottom: 20px;
-
-  .kpi-card {
-    background: linear-gradient(180deg, rgba(14, 40, 80, 0.9) 0%, rgba(10, 20, 40, 0.95) 100%);
-    border: 1px solid rgba(0, 212, 255, 0.2);
-    border-radius: 8px;
-    padding: 0;
-    text-align: center;
-    overflow: hidden;
-    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
-
-    .card-header {
-      background: linear-gradient(90deg, #00a8cc 0%, #00d4ff 50%, #00a8cc 100%);
-      padding: 10px 15px;
-      font-size: 14px;
-      font-weight: bold;
-      color: #0a1428;
-      letter-spacing: 2px;
-    }
-
-    .kpi-value {
-      font-size: 36px;
-      font-weight: bold;
-      margin: 15px 0 5px;
-      text-shadow: 0 0 15px currentColor;
-    }
-
-    .kpi-unit {
-      font-size: 14px;
-      color: #a0c4e8;
-      margin-bottom: 15px;
-    }
-  }
-}
-
-.chart-row {
-  display: flex;
-  gap: 16px;
-  margin-bottom: 16px;
-
-  .chart-box {
-    background: linear-gradient(180deg, rgba(14, 40, 80, 0.85) 0%, rgba(10, 20, 40, 0.9) 100%);
-    border: 1px solid rgba(0, 212, 255, 0.15);
-    border-radius: 8px;
-    padding: 0;
-    display: flex;
-    flex-direction: column;
-    overflow: hidden;
-    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
-
-    &.flex-1 {
-      flex: 1;
-    }
-
-    &.flex-2 {
-      flex: 2;
-    }
-
-    .box-header {
-      background: linear-gradient(90deg, rgba(0, 168, 204, 0.8) 0%, rgba(0, 212, 255, 0.6) 100%);
-      padding: 12px 18px;
-      font-size: 14px;
-      font-weight: bold;
-      color: #0a1428;
-      letter-spacing: 2px;
-      border-bottom: 1px solid rgba(0, 212, 255, 0.3);
-    }
-
-    .chart {
-      height: 300px;
-      width: 100%;
-      padding: 15px;
-    }
-
-    .ranking-list {
-      flex: 1;
-      padding: 15px;
-      display: flex;
-      flex-direction: column;
-      gap: 12px;
-
-      .ranking-item {
-        display: flex;
-        align-items: center;
-        padding: 12px;
-        background: rgba(10, 20, 40, 0.8);
-        border: 1px solid rgba(0, 212, 255, 0.15);
-        border-radius: 6px;
-
-        .rank {
-          width: 24px;
-          height: 24px;
-          border-radius: 50%;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          font-size: 12px;
-          font-weight: bold;
-          margin-right: 12px;
-          background: #3a5a8a;
-          color: #a0c4e8;
-
-          &.rank-1 { 
-            background: linear-gradient(135deg, #ffd43b, #ff9f43); 
-            color: #0a1428; 
-          }
-          &.rank-2 { 
-            background: linear-gradient(135deg, #a0c4e8, #74c0fc); 
-            color: #0a1428; 
-          }
-          &.rank-3 { 
-            background: linear-gradient(135deg, #ffa94d, #ff6b6b); 
-            color: #fff; 
-          }
-        }
-
-        .name {
-          flex: 1;
-          font-size: 14px;
-          color: #a0c4e8;
-        }
-
-        .value {
-          font-size: 16px;
-          font-weight: bold;
-          color: #00d4ff;
-        }
-
-        .unit {
-          font-size: 13px;
-          color: #a0c4e8;
-          margin-left: 5px;
-        }
-      }
-    }
-
-    .alarm-list {
-      flex: 1;
-      padding: 15px;
-      display: flex;
-      flex-direction: column;
-      gap: 12px;
-
-      .alarm-item {
-        display: flex;
-        align-items: center;
-        padding: 15px;
-        border-radius: 6px;
-        border-left: 4px solid;
-        background: rgba(10, 20, 40, 0.8);
-        border: 1px solid rgba(0, 212, 255, 0.15);
-        border-left-width: 4px;
-
-        &.success {
-          border-color: #00ff88;
-        }
-
-        &.warning {
-          border-color: #ffd43b;
-        }
-
-        &.danger {
-          border-color: #ff6b6b;
-        }
-
-        .alarm-icon {
-          font-size: 20px;
-          margin-right: 14px;
-        }
-
-        .alarm-content {
-          flex: 1;
-
-          .alarm-title {
-            font-size: 14px;
-            color: #ffffff;
-            margin-bottom: 5px;
-          }
-
-          .alarm-time {
-            font-size: 12px;
-            color: #a0c4e8;
-          }
-        }
-      }
-    }
-  }
-}
-
-@media screen and (max-width: 1200px) {
-  .kpi-grid {
-    grid-template-columns: repeat(2, 1fr);
-  }
-
-  .chart-row {
-    flex-direction: column;
-  }
-}
-
-@media screen and (max-width: 768px) {
-  .kpi-grid {
-    grid-template-columns: 1fr;
-  }
-}
-</style>

src/router/index.js

@@ -4,7 +4,7 @@ export const constantRoutes = [
   {
     path: '/',
     component: () => import('@/layout/index.vue'),
-    redirect: '/dashboard/demo',
+    redirect: '/dashboard/acid-rolling',
     children: []
   },
   {
@@ -12,12 +12,6 @@ export const constantRoutes = [
     component: () => import('@/layout/index.vue'),
     meta: { title: '数据大屏', icon: 'monitor' },
     children: [
-      {
-        path: 'demo',
-        name: 'Demo',
-        component: () => import('@/modules/dashboardBig/views/index.vue'),
-        meta: { title: '示例大屏', icon: 'example' }
-      },
       {
         path: 'order',
         name: 'Order',
@@ -61,6 +55,18 @@ export const constantRoutes = [
         meta: { title: '酸轧数据大屏', icon: 'example' }
       }
     ]
+  },
+  {
+    path: '/warehouse-overview',
+    name: 'WarehouseOverview',
+    component: () => import('@/views/screens/warehouse-overview/index.vue'),
+    meta: { title: '库区总览大屏' }
+  },
+  {
+    path: '/wip',
+    name: 'WipOverview',
+    component: () => import('@/views/screens/wip/index.vue'),
+    meta: { title: '在产大屏' }
   }
 ]
 

src/store/modules/permission.js

@@ -36,7 +36,7 @@ const actions = {
 function filterAsyncRoutes(routes) {
   return routes.filter(route => {
     if (!route.component || route.component === '') {
-      route.component = () => import('@/modules/dashboardBig/views/index.vue')
+      route.component = () => import('@/views/screens/acid-rolling/index.vue')
     } else if (route.component !== 'Layout') {
       route.component = loadComponent(route.component)
     }
@@ -51,7 +51,6 @@ function loadComponent(componentPath) {
   const path = componentPath.replace(/^\//, '').replace(/\.vue$/, '')
   const componentMap = {
     'Layout': () => import('@/layout/index.vue'),
-    'modules/dashboardBig/views/index': () => import('@/modules/dashboardBig/views/index.vue'),
     'modules/dashboardBig/views/order': () => import('@/modules/dashboardBig/views/order.vue'),
     'modules/dashboardBig/views/cost': () => import('@/modules/dashboardBig/views/cost.vue'),
     'modules/dashboardBig/views/energy': () => import('@/modules/dashboardBig/views/energy.vue'),
@@ -60,7 +59,7 @@ function loadComponent(componentPath) {
     'modules/dashboardBig/views/stopAnalysis': () => import('@/modules/dashboardBig/views/stopAnalysis.vue'),
     'screens/acid-rolling/index': () => import('@/views/screens/acid-rolling/index.vue')
   }
-  return componentMap[path] || (() => import('@/modules/dashboardBig/views/index.vue'))
+  return componentMap[path] || (() => import('@/views/screens/acid-rolling/index.vue'))
 }
 
 export default {

src/utils/request.js

@@ -1,12 +1,41 @@
 import axios from 'axios'
 
+// klp-oa线上API地址（测试环境）
+const baseURL = 'http://140.143.206.120:8080'
+
 const service = axios.create({
-  baseURL: '',
+  baseURL: baseURL,
-  timeout: 15000
+  timeout: 30000
 })
 
+// 从 Cookies 获取 Token（与 klp-ui 保持一致）
+const getToken = () => {
+  const name = 'Admin-Token'
+  const value = `; ${document.cookie}`
+  const parts = value.split(`; ${name}=`)
+  if (parts.length === 2) return parts.pop().split(';').shift()
+  return null
+}
+
 service.interceptors.request.use(
   config => {
+    // 携带Token
+    let token = getToken()
+
+    // ========== 测试用：临时硬编码 Token ==========
+    // 如果没有从 Cookies 获取到 Token，使用测试 Token
+    if (!token) {
+      token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJsb2dpblR5cGUiOiJsb2dpbiIsImxvZ2luSWQiOiJzeXNfdXNlcjoxIiwicm5TdHIiOiJGM2w5Nm5ncGV4ZDA4d1BUYWlvVmFreWhCUDdlc2gyeCIsInVzZXJJZCI6MX0.aP06S-5aJtukzMjmYW3d5zK3v10TOKcdNpROniv5lr8'
+    }
+    // ========== 测试用结束 ==========
+
+    console.log('请求URL:', config.url)
+    console.log('使用的Token:', token ? '已设置' : '未设置')
+
+    if (token) {
+      // 直接使用Token（不带Bearer前缀）
+      config.headers['Authorization'] = "Bearer " + token
+    }
     return config
   },
   error => {
@@ -18,16 +47,22 @@ service.interceptors.request.use(
 service.interceptors.response.use(
   response => {
     const res = response.data
-    if (res.code === 200) {
+    // 兼容多种返回格式
-      return res.data
+    if (res && res.code !== undefined) {
-    } else {
+      if (res.code === 200) {
-      console.error('Response error:', res.message)
+        return res.data !== undefined ? res.data : res
-      return Promise.reject(new Error(res.message || 'Error'))
+      } else {
+        console.warn('API error:', res.message)
+        return res.data || []
+      }
     }
+    // 如果没有 code 字段，直接返回数据
+    return res
   },
   error => {
     console.error('Response error:', error.message)
-    return Promise.reject(error)
+    // 返回空数组作为默认值，避免页面崩溃
+    return Promise.resolve([])
   }
 )
 

tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["src/*"]
+    }
+  }
+}

vite.config.js

@@ -12,27 +12,27 @@ export default defineConfig({
   server: {
     proxy: {
       '/api': {
-        target: 'http://localhost:3000',
+        target: 'http://localhost:8080',
         changeOrigin: true
       },
       '/da': {
-        target: 'http://localhost:3000',
+        target: 'http://localhost:8080',
         changeOrigin: true
       },
       '/pocket': {
-        target: 'http://localhost:3000',
+        target: 'http://localhost:8080',
         changeOrigin: true
       },
       '/l2': {
-        target: 'http://localhost:3000',
+        target: 'http://localhost:8080',
         changeOrigin: true
       },
       '/wms': {
-        target: 'http://localhost:3000',
+        target: 'http://localhost:8080',
         changeOrigin: true
       },
       '/oee': {
-        target: 'http://localhost:3000',
+        target: 'http://localhost:8080',
         changeOrigin: true
       }
     }