Merge branch 'master' of http://119.91.43.128:3001/sheng/mes-ui-d2

2026-06-22 17:30:56 +08:00
parent 2bd0e49bb6 264474eced
commit d582f9779a
9 changed files with 410 additions and 3 deletions
--- a/docs/功能测试-电池曲线.md
+++ b/docs/功能测试-电池曲线.md
@@ -0,0 +1,31 @@
+# 功能测试 - 电池曲线
+
+> 模块：数据中台 / 基础追溯 / 电池曲线 (Battery Curve)
+> 路由：`/data_middleground/produce/traceability/curve`
+
+## 测试前置条件
+
+- 测试账号具备访问“电池曲线”的菜单权限。
+- 准备至少 1 个存在曲线记录的电池条码。
+- 后端接口 `planning_production/produce/traceability/batterytraceability`、`curveread`、`export` 可正常访问。
+
+## 测试任务列表
+
+| 序号 | 测试项 | 操作步骤 | 预期结果 |
+|---:|---|---|---|
+| 1 | 页面入口 | 从菜单进入“电池曲线”，或直接访问路由 | 页面正常打开，显示电池条码输入框、查询、重置按钮、左侧记录区和右侧图表区 |
+| 2 | 有效条码查询 | 输入存在曲线记录的电池条码，点击查询 | 左侧展示批次、工序、上传时间记录，默认选中第一条记录 |
+| 3 | 曲线渲染 | 查询成功后查看右侧图表 | 图表显示电流、电压、容量三组数据，支持 tooltip、图例和图片保存 |
+| 4 | 记录切换 | 点击左侧不同曲线记录 | 右侧设备编码、电池通道和曲线数据随选中记录刷新 |
+| 5 | 图表缩放 | 在图表上使用鼠标滚轮或触控板缩放 | 曲线支持局部缩放，不影响页面布局 |
+| 6 | 整盘曲线 | 选中带有 URL 的记录，点击“查看整盘曲线” | 浏览器跳转或打开整盘曲线页面 |
+| 7 | 导出所有数据 | 选中记录后点击“导出所有数据” | 调用导出接口并触发文件下载或新窗口打开 |
+| 8 | 无数据查询 | 输入不存在曲线记录的条码并查询 | 左侧显示暂无曲线记录，右侧图表清空，页面不报错 |
+| 9 | 重置功能 | 查询后点击重置 | 输入框、记录列表、选中记录和图表数据清空 |
+| 10 | 国际化检查 | 切换中英文语言后重新进入页面 | 页面按钮、字段和图表标题随语言切换显示 |
+
+## 回归关注点
+
+- 曲线读取必须使用选中记录的 `id`。
+- 后端返回空数组时图表应清空，不应抛出异常。
+- 导出链接需要兼容相对路径和完整 URL。
--- a/docs/迁移任务列表.md
+++ b/docs/迁移任务列表.md
@@ -3,8 +3,8 @@
 > 根据 `后台Webman界面截图对照表.md` 生成。状态以当前 V2 项目中已落地的页面目录为准。

 - 总功能数：79
- 已迁移：29
- 未迁移：50
+- 已迁移：30
+- 未迁移：49

 | 状态 | 一级模块 | 二级模块 | 三级模块 | 功能说明 | V2 目标路径 |
 |:---:|---|---|---|---|---|
@@ -81,7 +81,7 @@
 | ⬜ | 质量管理 (Quality Management) | SPC计数型报表 (SPC Attribute Charts) | UChart (U Chart) |  | 待确认 |
 | ✅ | 数据中台 (Data Platform) | 基础追溯 (Traceability) | 反向追溯 (Backward Traceability) | 反向追溯 | `src/views/data-platform/traceability/backward/` |
 | ✅ | 数据中台 (Data Platform) | 基础追溯 (Traceability) | 正向追溯 (Forward Traceability) | 正向追溯 | `src/views/data-platform/traceability/forward/` |
-| ⬜ | 数据中台 (Data Platform) | 基础追溯 (Traceability) | 电池曲线 (Battery Curve) |  | 待确认 |
+| ✅ | 数据中台 (Data Platform) | 基础追溯 (Traceability) | 电池曲线 (Battery Curve) | 电池曲线 | `src/views/data-platform/traceability/battery-curve/` |
 | ⬜ | 数据中台 (Data Platform) | 基础追溯 (Traceability) | 托盘追溯 (Tray Traceability) |  | 待确认 |
 | ⬜ | 数据中台 (Data Platform) | 基础追溯 (Traceability) | 电池追溯 (Battery Traceability) |  | 待确认 |
 | ⬜ | 数据中台 (Data Platform) | 生产报表 (Production Reports) | 设备履历报表 (Equipment History Report) |  | 待确认 |
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
    "core-js": "^3.24.1",
    "countup.js": "^2.3.2",
    "dayjs": "^1.11.5",
+    "echarts": "5.1.0",
    "element-ui": "^2.15.9",
    "faker": "^4.1.0",
    "flex.css": "^1.1.7",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -38,6 +38,9 @@ importers:
      dayjs:
        specifier: ^1.11.5
        version: 1.11.21
+      echarts:
+        specifier: 5.1.0
+        version: 5.1.0
      element-ui:
        specifier: ^2.15.9
        version: 2.15.14(vue@2.7.16)
@@ -2884,6 +2887,9 @@ packages:
  ecc-jsbn@0.1.2:
    resolution: {integrity: sha512-eh9O+hwRHNbG4BLTjEl3nw044CkGm5X6LoaCf7LPp7UU8Qrt47JYNi6nPX8xjW97TKGKm1ouctg0QSpZe9qrnw==}

+  echarts@5.1.0:
+    resolution: {integrity: sha512-/X2nnN5BXW2tuA/Hv9YY279rDfwcXaBAjK9Azi//llshbKyUXXxBknsug21GJRpwTmLZbE8rjjbhchdm01bZtw==}
+
  editorconfig@1.0.7:
    resolution: {integrity: sha512-e0GOtq/aTQhVdNyDU9e02+wz9oDDM+SIOQxWME2QRjzRX5yyLAuHDE+0aE8vHb9XRC8XD37eO2u57+F09JqFhw==}
    engines: {node: '>=14'}
@@ -6514,6 +6520,9 @@ packages:
  tslib@1.14.1:
    resolution: {integrity: sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==}

+  tslib@2.0.3:
+    resolution: {integrity: sha512-uZtkfKblCEQtZKBF6EBXVZeQNl82yqtDQdv+eck8u7tdPxjLu2/lp5/uPW+um2tpuxINHWy3GhiccY7QgEaVHQ==}
+
  tslib@2.8.1:
    resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}

@@ -7113,6 +7122,9 @@ packages:
    resolution: {integrity: sha512-jcKpkthap6x63MB4TxwCyuIGkV0oYP/YRyuQU5UO0Yz/E/ZAu+653/uov+phdmO54n6BcvFRyyt0RRrWdN2mpw==}
    engines: {node: '>=4'}

+  zrender@5.1.0:
+    resolution: {integrity: sha512-c+8VRx52ycbmqwHeHLlo/BAfIHBl/JZNLM6cfDQFgzIH05yb+f5J9F/fbRsP+zGc8dW9XHuhdt8/iqukgMZSeg==}
+
 snapshots:

  '@achrinza/node-ipc@9.2.10':
@@ -10590,6 +10602,11 @@ snapshots:
      jsbn: 0.1.1
      safer-buffer: 2.1.2

+  echarts@5.1.0:
+    dependencies:
+      tslib: 2.0.3
+      zrender: 5.1.0
+
  editorconfig@1.0.7:
    dependencies:
      '@one-ini/wasm': 0.1.1
@@ -14999,6 +15016,8 @@ snapshots:

  tslib@1.14.1: {}

+  tslib@2.0.3: {}
+
  tslib@2.8.1: {}

  tty-browserify@0.0.0: {}
@@ -15813,3 +15832,7 @@ snapshots:
      is-ci: 1.2.1
      normalize-path: 1.0.0
      strip-indent: 2.0.0
+
+  zrender@5.1.0:
+    dependencies:
+      tslib: 2.0.3
--- a/src/api/data-platform/traceability/battery-curve.js
+++ b/src/api/data-platform/traceability/battery-curve.js
@@ -0,0 +1,35 @@
+import { request } from '@/api/_service'
+
+const BASE = 'planning_production/produce/traceability/'
+
+function apiParams (method, data = {}) {
+  return {
+    method,
+    platform: 'background',
+    ...data
+  }
+}
+
+export function getBatteryCurveRecords (data) {
+  return request({
+    url: BASE + 'batterytraceability',
+    method: 'get',
+    params: apiParams('planning_production_produce_traceability_batterytraceability', data)
+  })
+}
+
+export function getBatteryCurveData (data) {
+  return request({
+    url: BASE + 'curveread',
+    method: 'get',
+    params: apiParams('planning_production_produce_traceability_batterycurveread', data)
+  })
+}
+
+export function exportBatteryCurveData (data) {
+  return request({
+    url: BASE + 'export',
+    method: 'get',
+    params: apiParams('planning_production_produce_traceability_export', data)
+  })
+}
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -1318,6 +1318,24 @@
 					"cancel": "Cancel",
 					"please_select_filter_condition": "Select at least one filter condition",
 					"create_download_task_success": "Download task created successfully"
+				},
+				"battery_curve": {
+					"query": "Search",
+					"reset": "Reset",
+					"battery_code": "Battery Barcode",
+					"enter_battery_code": "Enter battery barcode",
+					"data_empty": "No curve records",
+					"batch_name": "Batch",
+					"process_name": "Process",
+					"upload_time": "Upload Time",
+					"device_code": "Device Code",
+					"battery_no": "Battery Channel",
+					"export_all_data": "Export All Data",
+					"view_full_tray_curve": "View Full Tray Curve",
+					"data_chart": "Data Chart",
+					"current": "Current",
+					"voltage": "Voltage",
+					"capacity": "Capacity"
 				}
 			}
 		}
--- a/src/locales/zh-chs.json
+++ b/src/locales/zh-chs.json
@@ -1318,6 +1318,24 @@
 					"cancel": "取消",
 					"please_select_filter_condition": "请选择筛选条件",
 					"create_download_task_success": "创建下载任务成功"
+				},
+				"battery_curve": {
+					"query": "查询",
+					"reset": "重置",
+					"battery_code": "电池条码",
+					"enter_battery_code": "请输入电池条码",
+					"data_empty": "暂无曲线记录",
+					"batch_name": "批次",
+					"process_name": "工序",
+					"upload_time": "上传时间",
+					"device_code": "设备编码",
+					"battery_no": "电池通道",
+					"export_all_data": "导出所有数据",
+					"view_full_tray_curve": "查看整盘曲线",
+					"data_chart": "数据图表",
+					"current": "电流",
+					"voltage": "电压",
+					"capacity": "容量"
 				}
 			}
 		}
--- a/src/router/modules/data-platform.js
+++ b/src/router/modules/data-platform.js
@@ -25,6 +25,12 @@ export default {
      name: `${pre}basic_traceability-positive_direction_traceability`,
      meta: { ...meta, cache: true, title: '正向追溯' },
      component: _import('data-platform/traceability/forward')
+    },
+    {
+      path: 'produce/traceability/curve',
+      name: `${pre}traceability-curve`,
+      meta: { ...meta, cache: true, title: '电池曲线' },
+      component: _import('data-platform/traceability/battery-curve')
    }
  ])('data_middleground-')
 }
--- a/src/views/data-platform/traceability/battery-curve/index.vue
+++ b/src/views/data-platform/traceability/battery-curve/index.vue
@@ -0,0 +1,275 @@
+<template>
+  <d2-container>
+    <template #header>
+      <div class="search-bar">
+        <el-form ref="searchForm" :inline="true" :model="search" size="mini">
+          <el-form-item :label="$t(key('battery_code'))" prop="battery_id">
+            <el-input
+              v-model.trim="search.battery_id"
+              :placeholder="$t(key('enter_battery_code'))"
+              clearable
+              style="width:240px"
+              @keyup.enter.native="fetchRecords"
+            />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" icon="el-icon-search" :disabled="loading" @click="fetchRecords">
+              {{ $t(key('query')) }}
+            </el-button>
+            <el-button icon="el-icon-refresh" :disabled="loading" @click="resetSearch">
+              {{ $t(key('reset')) }}
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+    </template>
+
+    <div v-loading="loading" class="curve-page">
+      <aside class="curve-list">
+        <el-empty v-if="records.length === 0" :description="$t(key('data_empty'))" :image-size="80" />
+        <el-menu v-else :default-active="String(activeIndex)" @select="selectRecord">
+          <el-menu-item v-for="(row, index) in records" :key="row.id || index" :index="String(index)">
+            <div class="curve-list__item">
+              <div>{{ $t(key('batch_name')) }}: {{ row.batch || '-' }}</div>
+              <div>{{ $t(key('process_name')) }}: {{ row.process_name || '-' }}</div>
+              <div>{{ $t(key('upload_time')) }}: {{ row.end_time || '-' }}</div>
+            </div>
+          </el-menu-item>
+        </el-menu>
+      </aside>
+
+      <main class="curve-content">
+        <div class="curve-toolbar">
+          <el-form :inline="true" size="mini" label-width="80px">
+            <el-form-item :label="$t(key('device_code'))">
+              <el-input :value="activeRecord.device_code || ''" disabled style="width:180px" />
+            </el-form-item>
+            <el-form-item :label="$t(key('battery_no'))">
+              <el-input :value="activeRecord.channel || ''" disabled style="width:180px" />
+            </el-form-item>
+            <el-form-item>
+              <el-button type="danger" icon="el-icon-download" :disabled="!activeRecord.id" @click="exportAllData">
+                {{ $t(key('export_all_data')) }}
+              </el-button>
+              <el-button type="warning" icon="el-icon-view" :disabled="!activeRecord.url" @click="viewFullTrayCurve">
+                {{ $t(key('view_full_tray_curve')) }}
+              </el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+        <div ref="chart" class="curve-chart" />
+      </main>
+    </div>
+  </d2-container>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+import { i18nMixin } from '@/composables/useI18n'
+import {
+  exportBatteryCurveData,
+  getBatteryCurveData,
+  getBatteryCurveRecords
+} from '@/api/data-platform/traceability/battery-curve'
+
+export default {
+  name: 'data-platform-traceability-battery-curve',
+  mixins: [i18nMixin('page.data_platform.traceability.battery_curve')],
+  data () {
+    return {
+      loading: false,
+      chartLoading: false,
+      search: {
+        battery_id: ''
+      },
+      records: [],
+      activeIndex: -1,
+      chart: null,
+      xAxis: [],
+      seriesData: []
+    }
+  },
+  computed: {
+    activeRecord () {
+      return this.records[this.activeIndex] || {}
+    }
+  },
+  mounted () {
+    this.initChart()
+    window.addEventListener('resize', this.resizeChart)
+  },
+  beforeDestroy () {
+    window.removeEventListener('resize', this.resizeChart)
+    if (this.chart) this.chart.dispose()
+  },
+  methods: {
+    responseData (res) {
+      return res && res.data !== undefined ? res.data : res
+    },
+    initChart () {
+      this.chart = echarts.init(this.$refs.chart)
+      this.drawChart()
+    },
+    resizeChart () {
+      if (this.chart) this.chart.resize()
+    },
+    async fetchRecords () {
+      this.loading = true
+      try {
+        const res = await getBatteryCurveRecords({
+          ...this.search,
+          action: 'battery_traceability_search'
+        })
+        const data = this.responseData(res)
+        this.records = Array.isArray(data) ? data : []
+        this.activeIndex = this.records.length ? 0 : -1
+        if (this.activeIndex > -1) {
+          await this.loadCurve(this.activeRecord.id)
+        } else {
+          this.xAxis = []
+          this.seriesData = []
+          this.drawChart()
+        }
+      } finally {
+        this.loading = false
+      }
+    },
+    resetSearch () {
+      this.search.battery_id = ''
+      this.records = []
+      this.activeIndex = -1
+      this.xAxis = []
+      this.seriesData = []
+      this.drawChart()
+    },
+    selectRecord (index) {
+      this.activeIndex = Number(index)
+      this.loadCurve(this.activeRecord.id)
+    },
+    async loadCurve (id) {
+      if (!id) return
+      this.chartLoading = true
+      if (this.chart) this.chart.showLoading()
+      try {
+        const res = await getBatteryCurveData({ id, action: 'batterycurveread' })
+        const data = this.responseData(res) || {}
+        if (Array.isArray(data)) {
+          this.xAxis = []
+          this.seriesData = []
+        } else {
+          this.xAxis = data.tm || []
+          this.seriesData = [
+            { lineStyle: { normal: { width: 1 } }, name: this.$t(this.key('current')), type: 'line', symbolSize: 0, data: data.A || [] },
+            { lineStyle: { normal: { width: 1 } }, yAxisIndex: 1, name: this.$t(this.key('voltage')), type: 'line', symbolSize: 0, data: data.V || [] },
+            { lineStyle: { normal: { width: 1 } }, yAxisIndex: 2, name: this.$t(this.key('capacity')), type: 'bar', symbolSize: 0, data: data.C || [] }
+          ]
+        }
+        this.drawChart()
+      } finally {
+        this.chartLoading = false
+        if (this.chart) this.chart.hideLoading()
+      }
+    },
+    drawChart () {
+      if (!this.chart) return
+      const option = {
+        title: { text: this.$t(this.key('data_chart')) },
+        tooltip: { trigger: 'axis' },
+        legend: {
+          data: [this.$t(this.key('current')), this.$t(this.key('voltage')), this.$t(this.key('capacity'))],
+          selected: {
+            [this.$t(this.key('current'))]: true,
+            [this.$t(this.key('voltage'))]: true,
+            [this.$t(this.key('capacity'))]: false
+          }
+        },
+        toolbox: { feature: { saveAsImage: {} } },
+        dataZoom: [
+          { type: 'inside', xAxisIndex: [0], realtime: false },
+          { type: 'inside', yAxisIndex: [0], realtime: false }
+        ],
+        xAxis: { type: 'category', boundaryGap: false, data: this.xAxis, scale: false },
+        yAxis: [
+          { type: 'value', scale: false, name: this.$t(this.key('current')), axisLabel: { formatter: '{value} mA' } },
+          { type: 'value', scale: false, name: this.$t(this.key('voltage')), axisLabel: { formatter: '{value} mV' } },
+          { type: 'value', scale: false, name: this.$t(this.key('capacity')), axisLabel: { formatter: '{value} mAH' }, position: 'right', offset: 80 }
+        ],
+        series: this.seriesData
+      }
+      this.chart.setOption(option, true)
+    },
+    viewFullTrayCurve () {
+      if (this.activeRecord.url) window.location.href = this.activeRecord.url
+    },
+    async exportAllData () {
+      if (!this.activeRecord.id) return
+      const res = await exportBatteryCurveData({
+        id: this.activeRecord.id,
+        action: 'export_all_data'
+      })
+      const data = this.responseData(res)
+      if (!data) return
+      const link = document.createElement('a')
+      link.href = process.env.VUE_APP_PRO_PUBLIC_URL ? process.env.VUE_APP_PRO_PUBLIC_URL + data : data
+      link.target = '_blank'
+      document.body.appendChild(link)
+      link.click()
+      document.body.removeChild(link)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.search-bar {
+  margin-bottom: -18px;
+}
+
+.curve-page {
+  display: grid;
+  grid-template-columns: 260px minmax(0, 1fr);
+  height: calc(100vh - 170px);
+  min-height: 560px;
+  border: 1px solid #ebeef5;
+}
+
+.curve-list {
+  overflow: auto;
+  border-right: 1px solid #ebeef5;
+  background: #fff;
+}
+
+.curve-list__item {
+  width: 100%;
+  overflow: hidden;
+  line-height: 1.5;
+  white-space: normal;
+  word-break: break-all;
+}
+
+.curve-list ::v-deep .el-menu-item {
+  height: auto;
+  min-height: 86px;
+  padding: 8px 12px !important;
+  line-height: 1.5;
+}
+
+.curve-content {
+  min-width: 0;
+  padding: 12px;
+  background: #fafafa;
+}
+
+.curve-toolbar {
+  margin-bottom: 12px;
+  padding-bottom: 10px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.curve-chart {
+  height: calc(100% - 64px);
+  min-height: 430px;
+  border: 1px solid #ebeef5;
+  background: #fff;
+}
+</style>