刀具寿命界面修改+国际化

2026-06-11 17:43:00 +08:00
parent 2ac9e1f66e
commit 0f3343f0e9
3 changed files with 127 additions and 45 deletions
--- a/src/lang/en-US.js
+++ b/src/lang/en-US.js
@@ -659,6 +659,38 @@ export default {
    importSuccess: 'Import succeeded!',
    importFailed: 'Import failed!'
  },
+  toolLife: {
+    stationLabel: 'Equipment/Station:',
+    selectAllPlaceholder: 'Leave empty to view all equipment/stations',
+    search: 'Search',
+    totalTools: 'Total Tools',
+    pieceUnit: 'pcs',
+    normalTools: 'Normal Tools',
+    warningTools: 'Warning Tools',
+    scrapTools: 'Scrap Tools',
+    statusOverview: 'Status Overview',
+    statusOverviewSubtitle: 'Tool status summary by equipment',
+    normalRate: 'Normal Rate',
+    warningRate: 'Warning Rate',
+    scrapRate: 'Scrap Rate',
+    detailTitle: 'Tool Details',
+    detailSubtitle: 'Life and status of each tool under the current equipment',
+    sequence: 'No.',
+    stationColumn: 'Equipment/Station',
+    toolCode: 'Tool Code',
+    ratedLife: 'Rated Life',
+    usedLife: 'Used Life',
+    warningValue1: 'Warning Value',
+    remainingLife: 'Remaining Life',
+    lifeProgress: 'Life Progress',
+    status: 'Status',
+    statusNormal: 'Normal',
+    statusWarning: 'Warning',
+    statusScrap: 'Scrap',
+    allStations: 'All Equipment/Stations',
+    noData: 'No tool life data in the current scope',
+    queryFailed: 'Failed to query tool life data'
+  },
  tagsView: {
    refresh: 'Refresh',
    closeCurrent: 'Close Current',
--- a/src/lang/zh-CN.js
+++ b/src/lang/zh-CN.js
@@ -659,6 +659,38 @@ export default {
    importSuccess: '导入成功！',
    importFailed: '导入失败！'
  },
+  toolLife: {
+    stationLabel: '设备/工位：',
+    selectAllPlaceholder: '不选则统计全部设备/工位',
+    search: '查询',
+    totalTools: '刀具总数',
+    pieceUnit: '把',
+    normalTools: '正常刀具',
+    warningTools: '预警刀具',
+    scrapTools: '报废刀具',
+    statusOverview: '状态概览',
+    statusOverviewSubtitle: '按设备统计刀具状态',
+    normalRate: '正常占比',
+    warningRate: '预警占比',
+    scrapRate: '报废占比',
+    detailTitle: '刀具明细',
+    detailSubtitle: '该设备下每把刀的寿命与状态',
+    sequence: '序号',
+    stationColumn: '设备/工位',
+    toolCode: '刀具代码',
+    ratedLife: '额定寿命',
+    usedLife: '已用寿命',
+    warningValue1: '预警值',
+    remainingLife: '剩余寿命',
+    lifeProgress: '寿命进度',
+    status: '状态',
+    statusNormal: '正常',
+    statusWarning: '预警',
+    statusScrap: '报废',
+    allStations: '全部设备/工位',
+    noData: '当前范围没有刀具寿命数据',
+    queryFailed: '刀具寿命数据查询失败'
+  },
  tagsView: {
    refresh: '重新加载',
    closeCurrent: '关闭当前',
--- a/src/views/EquipmentOperationAnalysis/EquipmentToolLife/index.vue
+++ b/src/views/EquipmentOperationAnalysis/EquipmentToolLife/index.vue
@@ -3,15 +3,16 @@
    <el-card class="toolbar-card" shadow="never">
      <div class="toolbar">
        <div class="toolbar-left">
-          <span class="toolbar-label">设备/工位：</span>
+          <span class="toolbar-label">{{ $t('toolLife.stationLabel') }}</span>
          <el-select
            v-model="machineCode"
            clearable
            filterable
-            placeholder="不选则统计全部设备/工位"
+            :placeholder="$t('toolLife.selectAllPlaceholder')"
            size="small"
            style="width: 260px"
-            @change="handleMachineChange">
+            @change="handleMachineChange"
+            @clear="handleMachineChange">
            <el-option
              v-for="item in machineOptions"
              :key="item.value"
@@ -24,7 +25,7 @@
            size="small"
            style="margin-left: 10px"
            type="primary"
-            @click="searchData">查询
+            @click="searchData">{{ $t('toolLife.search') }}
          </el-button>
        </div>
        <div class="toolbar-right" v-if="selectedMachineName">
@@ -37,29 +38,38 @@
      <el-row :gutter="16" class="summary-row">
        <el-col :span="6">
          <div class="summary-card total">
-            <div class="summary-title">刀具总数</div>
-            <div class="summary-value">{{ summaryInfo.totalCount }}</div>
+            <div class="summary-title">{{ $t('toolLife.totalTools') }}</div>
+            <div class="summary-main">
+              <div class="summary-value">{{ summaryInfo.totalCount }}</div>
+              <div class="summary-unit">{{ $t('toolLife.pieceUnit') }}</div>
+            </div>
          </div>
        </el-col>
        <el-col :span="6">
          <div class="summary-card normal">
-            <div class="summary-title">正常刀具</div>
-            <div class="summary-value">{{ summaryInfo.normalCount }}</div>
-            <div class="summary-unit">{{ normalRateText }}</div>
+            <div class="summary-title">{{ $t('toolLife.normalTools') }}</div>
+            <div class="summary-main">
+              <div class="summary-value">{{ summaryInfo.normalCount }}</div>
+              <div class="summary-unit">{{ normalRateText }}</div>
+            </div>
          </div>
        </el-col>
        <el-col :span="6">
          <div class="summary-card warning">
-            <div class="summary-title">预警刀具</div>
-            <div class="summary-value">{{ summaryInfo.warningCount }}</div>
-            <div class="summary-unit">{{ warningRateText }}</div>
+            <div class="summary-title">{{ $t('toolLife.warningTools') }}</div>
+            <div class="summary-main">
+              <div class="summary-value">{{ summaryInfo.warningCount }}</div>
+              <div class="summary-unit">{{ warningRateText }}</div>
+            </div>
          </div>
        </el-col>
        <el-col :span="6">
          <div class="summary-card scrap">
-            <div class="summary-title">报废刀具</div>
-            <div class="summary-value">{{ summaryInfo.scrapCount }}</div>
-            <div class="summary-unit">{{ scrapRateText }}</div>
+            <div class="summary-title">{{ $t('toolLife.scrapTools') }}</div>
+            <div class="summary-main">
+              <div class="summary-value">{{ summaryInfo.scrapCount }}</div>
+              <div class="summary-unit">{{ scrapRateText }}</div>
+            </div>
          </div>
        </el-col>
      </el-row>
@@ -69,8 +79,8 @@
          <el-card class="panel-card overview-card" shadow="never">
            <div slot="header" class="panel-header">
              <div style="height:32px;align-items: center;display: flex;justify-content: space-between;width:100%;color:#243447">
-                <span>状态概览</span>
-                <span class="panel-subtitle">按设备统计刀具状态</span>
+                <span>{{ $t('toolLife.statusOverview') }}</span>
+                <span class="panel-subtitle">{{ $t('toolLife.statusOverviewSubtitle') }}</span>
              </div>

            </div>
@@ -79,7 +89,7 @@
              <div class="status-ring" :style="statusRingStyle">
                <div class="status-ring-inner">
                  <div class="status-ring-total">{{ summaryInfo.totalCount }}</div>
-                  <div class="status-ring-label">刀具总数</div>
+                  <div class="status-ring-label">{{ $t('toolLife.totalTools') }}</div>
                </div>
              </div>
            </div>
@@ -88,7 +98,7 @@
            <div class="bar-group">
              <div class="bar-item">
                <div class="bar-label">
-                  <span>正常占比</span>
+                  <span>{{ $t('toolLife.normalRate') }}</span>
                  <span>{{ normalRateText }}</span>
                </div>
                <el-progress
@@ -99,7 +109,7 @@
              </div>
              <div class="bar-item">
                <div class="bar-label">
-                  <span>预警占比</span>
+                  <span>{{ $t('toolLife.warningRate') }}</span>
                  <span>{{ warningRateText }}</span>
                </div>
                <el-progress
@@ -110,7 +120,7 @@
              </div>
              <div class="bar-item">
                <div class="bar-label">
-                  <span>报废占比</span>
+                  <span>{{ $t('toolLife.scrapRate') }}</span>
                  <span>{{ scrapRateText }}</span>
                </div>
                <el-progress
@@ -125,8 +135,8 @@

        <el-col :span="17" style="padding: 0">
          <div slot="header" class="panel-header">
-            <span>刀具明细</span>
-            <span class="panel-subtitle">该设备下每把刀的寿命与状态</span>
+            <span>{{ $t('toolLife.detailTitle') }}</span>
+            <span class="panel-subtitle">{{ $t('toolLife.detailSubtitle') }}</span>
          </div>
          <el-table
            :data="tableData"
@@ -135,13 +145,13 @@
            height="520"
            size="mini"
            style="width: 100%">
-            <el-table-column align="center" label="序号" type="index" width="60"/>
-            <el-table-column align="center" label="设备/工位" min-width="120">
+            <el-table-column :label="$t('toolLife.sequence')" align="center" type="index" width="60"/>
+            <el-table-column :label="$t('toolLife.stationColumn')" align="center" min-width="120">
              <template slot-scope="scope">
                {{ scope.row.设备编号 || '-' }}
              </template>
            </el-table-column>
-            <el-table-column align="center" label="刀具代码" min-width="120">
+            <el-table-column :label="$t('toolLife.toolCode')" align="center" min-width="120">
              <template slot-scope="scope">
                {{ scope.row.刀具代码 || '-' }}
              </template>
@@ -156,27 +166,27 @@
 <!--                  {{ scope.row.刀具组号 || '-' }}-->
 <!--                </template>-->
 <!--              </el-table-column>-->
-            <el-table-column align="center" label="额定寿命" min-width="100">
+            <el-table-column :label="$t('toolLife.ratedLife')" align="center" min-width="100">
              <template slot-scope="scope">
                {{ formatNumber(scope.row.额定寿命) }}
              </template>
            </el-table-column>
-            <el-table-column align="center" label="已用寿命" min-width="100">
+            <el-table-column :label="$t('toolLife.usedLife')" align="center" min-width="100">
              <template slot-scope="scope">
                {{ formatNumber(scope.row.已用寿命) }}
              </template>
            </el-table-column>
-            <el-table-column align="center" label="预警值1" min-width="100">
+            <el-table-column :label="$t('toolLife.warningValue1')" align="center" min-width="100">
              <template slot-scope="scope">
                {{ formatNumber(scope.row.预警值1) }}
              </template>
            </el-table-column>
-            <el-table-column align="center" label="剩余寿命" min-width="100">
+            <el-table-column :label="$t('toolLife.remainingLife')" align="center" min-width="100">
              <template slot-scope="scope">
                {{ formatNumber(getRemainingLife(scope.row)) }}
              </template>
            </el-table-column>
-            <el-table-column align="center" label="寿命进度" min-width="150">
+            <el-table-column :label="$t('toolLife.lifeProgress')" align="center" min-width="150">
              <template slot-scope="scope">
                <div class="table-progress">
                  <el-progress
@@ -187,7 +197,7 @@
                </div>
              </template>
            </el-table-column>
-            <el-table-column align="center" label="状态" min-width="90">
+            <el-table-column :label="$t('toolLife.status')" align="center" min-width="90">
              <template slot-scope="scope">
                <el-tag :type="getRowStatus(scope.row).type" size="mini">
                  {{ getRowStatus(scope.row).text }}
@@ -199,7 +209,7 @@
      </el-row>

      <div v-if="!loading && !tableData.length" class="empty-block">
-        当前范围没有刀具寿命数据
+        {{ $t('toolLife.noData') }}
      </div>
    </div>
  </div>
@@ -270,21 +280,22 @@ export default {
            })
          }
        }
-        this.selectedMachineName = '全部设备/工位'
+        this.selectedMachineName = this.$t('toolLife.allStations')
        this.searchData()
      })
    },
    handleMachineChange(value) {
      if (!value) {
-        this.selectedMachineName = '全部设备/工位'
+        this.selectedMachineName = this.$t('toolLife.allStations')
+        this.searchData()
        return
      }
      const current = this.machineOptions.find(item => item.value === value)
      this.selectedMachineName = current ? current.machineName : ''
+      this.searchData()
    },
    searchData() {
      this.loading = true
-      this.handleMachineChange(this.machineCode)
      var param = []
      param[0] = ['设备编号', this.machineCode || '']
      var Data = this.CreateData('11', '设备管理_刀具寿命_明细_查询', param)
@@ -297,7 +308,7 @@ export default {
        this.loading = false
        this.tableData = []
        this.resetSummary()
-        this.$message.error('刀具寿命数据查询失败')
+        this.$message.error(this.$t('toolLife.queryFailed'))
      })
    },
    buildSummary(list) {
@@ -371,18 +382,18 @@ export default {
      const warning = this.toNumber(row.预警值1)
      if (rated > 0 && used >= rated) {
        return {
-          text: '报废',
+          text: this.$t('toolLife.statusScrap'),
          type: 'danger'
        }
      }
      if (warning > 0 && used >= warning) {
        return {
-          text: '预警',
+          text: this.$t('toolLife.statusWarning'),
          type: 'warning'
        }
      }
      return {
-        text: '正常',
+        text: this.$t('toolLife.statusNormal'),
        type: 'success'
      }
    },
@@ -456,9 +467,10 @@ export default {
 .summary-card {
  border-radius: 18px;
  color: #fff;
-  min-height: 138px;
+  height: 100px;
+  min-height: 100px;
  overflow: hidden;
-  padding: 22px 20px;
+  padding: 14px 18px;
  position: relative;
 }

@@ -494,17 +506,23 @@ export default {
  opacity: 0.92;
 }

+.summary-main {
+  align-items: flex-end;
+  display: flex;
+  justify-content: space-between;
+  margin-top: 10px;
+}
+
 .summary-value {
-  font-size: 36px;
+  font-size: 28px;
  font-weight: 700;
  line-height: 1.2;
-  margin-top: 16px;
 }

 .summary-unit {
  font-size: 13px;
-  margin-top: 8px;
  opacity: 0.88;
+  text-align: right;
 }

 .detail-row {