From 3b2ff6b0952f5d7eb76936ffec76264b39eaa39e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B8=B8=E7=86=9F=E5=90=B4=E5=BD=A6=E7=A5=96?=
 <qi.ruan@xujiesoft.com>
Date: Wed, 8 Oct 2025 00:20:35 +0800
Subject: [PATCH] 1

---
 src/api/warehouse/interfaceCallLog.js         |   8 +
 src/api/warehouse/inventoryDiscrepancy.js     |   8 +
 .../modules/warehouse/interfaceCallLog.vue    | 533 ++++++++++++++++
 .../warehouse/inventoryDiscrepancy.vue        | 571 ++++++++++++++++++
 4 files changed, 1120 insertions(+)
 create mode 100644 src/api/warehouse/interfaceCallLog.js
 create mode 100644 src/api/warehouse/inventoryDiscrepancy.js
 create mode 100644 src/views/modules/warehouse/interfaceCallLog.vue
 create mode 100644 src/views/modules/warehouse/inventoryDiscrepancy.vue

diff --git a/src/api/warehouse/interfaceCallLog.js b/src/api/warehouse/interfaceCallLog.js
new file mode 100644
index 0000000..97d299e
--- /dev/null
+++ b/src/api/warehouse/interfaceCallLog.js
@@ -0,0 +1,8 @@
+import { createAPI } from "@/utils/httpRequest.js";
+
+// 获取接口调用日志列表 - rqrq
+export const getInterfaceCallLogList = data => createAPI('warehouse/interfaceCallLog/list', 'POST', data)
+
+// 获取状态选项 - rqrq
+export const getStatusOptions = () => createAPI('warehouse/interfaceCallLog/statusOptions', 'GET')
+
diff --git a/src/api/warehouse/inventoryDiscrepancy.js b/src/api/warehouse/inventoryDiscrepancy.js
new file mode 100644
index 0000000..bec7716
--- /dev/null
+++ b/src/api/warehouse/inventoryDiscrepancy.js
@@ -0,0 +1,8 @@
+import { createAPI } from "@/utils/httpRequest.js";
+
+// 获取库存差异记录列表 - rqrq
+export const getInventoryDiscrepancyList = data => createAPI('warehouse/inventoryDiscrepancy/list', 'POST', data)
+
+// 获取状态选项 - rqrq
+export const getStatusOptions = () => createAPI('warehouse/inventoryDiscrepancy/statusOptions', 'GET')
+
diff --git a/src/views/modules/warehouse/interfaceCallLog.vue b/src/views/modules/warehouse/interfaceCallLog.vue
new file mode 100644
index 0000000..0faccba
--- /dev/null
+++ b/src/views/modules/warehouse/interfaceCallLog.vue
@@ -0,0 +1,533 @@
+<template>
+  <div class="mod-config">
+    <!-- 查询表单 - rqrq -->
+    <el-form :inline="true" label-position="top" style="margin-top: 1px; margin-left: 0px;">
+
+      <el-form-item label="接口名称">
+        <el-input v-model="queryData.interfaceName" style="width: 120px" placeholder="接口名称" clearable></el-input>
+      </el-form-item>
+
+      <el-form-item label="方法名称">
+        <el-input v-model="queryData.methodName" style="width: 120px" placeholder="方法名称" clearable></el-input>
+      </el-form-item>
+
+      <el-form-item label="业务主键">
+        <el-input v-model="queryData.businessKey" style="width: 120px" placeholder="业务主键" clearable></el-input>
+      </el-form-item>
+
+      <el-form-item label="调用状态">
+        <el-select v-model="queryData.status" placeholder="请选择" style="width: 120px" clearable>
+          <el-option label="全部" value=""></el-option>
+          <el-option
+            v-for="item in statusOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="创建时间从">
+        <el-date-picker
+          v-model="queryData.startDate"
+          type="date"
+          style="width: 120px"
+          placeholder="开始日期"
+          value-format="yyyy-MM-dd"
+          clearable>
+        </el-date-picker>
+      </el-form-item>
+
+      <el-form-item label="创建时间至">
+        <el-date-picker
+          v-model="queryData.endDate"
+          type="date"
+          style="width: 120px"
+          placeholder="结束日期"
+          value-format="yyyy-MM-dd"
+          clearable>
+        </el-date-picker>
+      </el-form-item>
+
+      <el-form-item label=" ">
+        <el-button type="primary" @click="getDataList()">查询</el-button>
+        <el-button @click="resetQuery()">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <!-- 数据表格 - rqrq -->
+    <el-table
+      :data="dataList"
+      :height="height"
+      border
+      highlight-current-row
+      v-loading="dataListLoading"
+      style="width: 100%;">
+      <el-table-column
+        v-for="(item,index) in columnList" :key="index"
+        :sortable="item.columnSortable"
+        :prop="item.columnProp"
+        :header-align="item.headerAlign"
+        :show-overflow-tooltip="item.showOverflowTooltip"
+        :align="item.align"
+        :fixed="item.fixed==''?false:item.fixed"
+        :min-width="item.columnWidth"
+        :label="item.columnLabel">
+        <template slot-scope="scope">
+          <span v-if="item.columnProp === 'status'">
+            <el-tag
+              :type="getStatusType(scope.row.status)"
+              size="small">
+              {{ getStatusLabel(scope.row.status) }}
+            </el-tag>
+          </span>
+          <span v-else-if="item.columnProp === 'executionTime'">
+            <span :style="{color: scope.row.executionTime > 3000 ? '#F56C6C' : '#67C23A'}">
+              {{ scope.row.executionTime }} ms
+            </span>
+          </span>
+          <span v-else>{{ scope.row[item.columnProp] }}</span>
+        </template>
+      </el-table-column>
+
+      <!-- 操作列 - rqrq -->
+      <el-table-column
+        header-align="center"
+        align="center"
+        fixed="right"
+        width="150"
+        label="操作">
+        <template slot-scope="scope">
+          <a type="text" @click="viewDetail(scope.row)">查看详情</a>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页 - rqrq -->
+    <el-pagination
+      @size-change="sizeChangeHandle"
+      @current-change="currentChangeHandle"
+      :current-page="pageIndex"
+      :page-sizes="[20, 50, 100, 1000]"
+      :page-size="pageSize"
+      :total="totalPage"
+      layout="total, sizes, prev, pager, next, jumper">
+    </el-pagination>
+
+    <!-- 详情弹窗 - rqrq -->
+    <el-dialog
+      title="接口调用详情"
+      :visible.sync="detailVisible"
+      :close-on-click-modal="false"
+      v-drag
+      width="80%">
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-card class="box-card fixed-height-card">
+            <div slot="header" class="clearfix">
+              <span>基本信息</span>
+            </div>
+            <el-form label-width="120px" class="detail-form">
+              <el-form-item label="接口名称:">
+                <span>{{ detailData.interfaceName }}</span>
+              </el-form-item>
+              <el-form-item label="方法名称:">
+                <span>{{ detailData.methodName }}</span>
+              </el-form-item>
+              <el-form-item label="站点:">
+                <span>{{ detailData.site }}</span>
+              </el-form-item>
+              <el-form-item label="业务主键:">
+                <span>{{ detailData.businessKey }}</span>
+              </el-form-item>
+              <el-form-item label="调用状态:">
+                <el-tag
+                  :type="getStatusType(detailData.status)"
+                  size="small">
+                  {{ getStatusLabel(detailData.status) }}
+                </el-tag>
+              </el-form-item>
+              <el-form-item label="执行时间:">
+                <span :style="{color: detailData.executionTime > 3000 ? '#F56C6C' : '#67C23A'}">
+                  {{ detailData.executionTime }} ms
+                </span>
+              </el-form-item>
+              <el-form-item label="创建时间:">
+                <span>{{ detailData.createdTime }}</span>
+              </el-form-item>
+              <el-form-item label="创建人:">
+                <span>{{ detailData.createdBy }}</span>
+              </el-form-item>
+            </el-form>
+          </el-card>
+        </el-col>
+
+        <el-col :span="12">
+          <el-card class="box-card fixed-height-card">
+            <div slot="header" class="clearfix">
+              <span>返回信息</span>
+            </div>
+            <div class="detail-content-area">
+              <el-input
+                type="textarea"
+                :rows="13"
+                :value="detailData.errorMessage || '无错误'"
+                :readonly="true">
+              </el-input>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20" style="margin-top: 20px;">
+        <el-col :span="12">
+          <el-card class="box-card fixed-height-card">
+            <div slot="header" class="clearfix">
+              <span>请求数据</span>
+              <el-button style="float: right; padding: 3px 0" type="text" @click="copyToClipboard(detailData.requestData)">复制</el-button>
+            </div>
+            <div class="detail-content-area">
+              <pre class="json-pre">{{ formatJson(detailData.requestData) }}</pre>
+            </div>
+          </el-card>
+        </el-col>
+
+        <el-col :span="12">
+          <el-card class="box-card fixed-height-card">
+            <div slot="header" class="clearfix">
+              <span>响应数据</span>
+              <el-button style="float: right; padding: 3px 0" type="text" @click="copyToClipboard(detailData.responseData)">复制</el-button>
+            </div>
+            <div class="detail-content-area">
+              <pre class="json-pre">{{ formatJson(detailData.responseData) }}</pre>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="detailVisible = false">关闭</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  getInterfaceCallLogList,
+  getStatusOptions
+} from '@/api/warehouse/interfaceCallLog.js'
+
+export default {
+  data() {
+    return {
+      // 查询条件 - rqrq
+      queryData: {
+        site: '',
+        interfaceName: '',
+        methodName: '',
+        businessKey: '',
+        status: '',
+        startDate: '',
+        endDate: '',
+        page: 1,
+        limit: 20
+      },
+      // 表格高度 - rqrq
+      height: 450,
+      // 状态选项 - rqrq
+      statusOptions: [],
+      // 表格列配置 - rqrq
+      columnList: [
+        {
+          columnProp: "interfaceName",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "接口名称",
+          columnWidth: 150,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "methodName",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "方法名称",
+          columnWidth: 150,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "businessKey",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "业务主键",
+          columnWidth: 150,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "status",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "调用状态",
+          columnWidth: 100,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "executionTime",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "执行时间",
+          columnWidth: 120,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "site",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "站点",
+          columnWidth: 80,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "createdTime",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "创建时间",
+          columnWidth: 150,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "createdBy",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "创建人",
+          columnWidth: 100,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "remark",
+          headerAlign: "center",
+          align: "left",
+          columnLabel: "备注",
+          columnWidth: 200,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        }
+      ],
+      // 数据列表 - rqrq
+      dataList: [],
+      // 分页参数 - rqrq
+      pageIndex: 1,
+      pageSize: 20,
+      totalPage: 0,
+      dataListLoading: false,
+      // 详情弹窗 - rqrq
+      detailVisible: false,
+      detailData: {}
+    }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      // 计算表格高度 - rqrq
+      this.height = window.innerHeight - 220;
+    })
+  },
+  activated() {
+    this.getDataList()
+    this.getStatusOptions()
+  },
+  methods: {
+    // 获取数据列表 - rqrq
+    getDataList() {
+      this.dataListLoading = true
+      this.queryData.page = this.pageIndex
+      this.queryData.limit = this.pageSize
+
+      getInterfaceCallLogList(this.queryData).then(({data}) => {
+        this.dataListLoading = false
+        if (data && data.code === 0) {
+          this.dataList = data.page.list || []
+          this.totalPage = data.page.totalCount || 0
+        } else {
+          this.dataList = []
+          this.totalPage = 0
+          this.$message.error(data.msg || '查询失败')
+        }
+      }).catch(error => {
+        this.dataListLoading = false
+        console.error('查询接口调用日志失败:', error)
+        this.$message.error('查询失败')
+      })
+    },
+
+    // 获取状态选项 - rqrq
+    getStatusOptions() {
+      getStatusOptions().then(({data}) => {
+        if (data && data.code === 0) {
+          this.statusOptions = data.options || []
+        }
+      }).catch(error => {
+        console.error('获取状态选项失败:', error)
+      })
+    },
+
+    // 重置查询条件 - rqrq
+    resetQuery() {
+      this.queryData = {
+        site: '',
+        interfaceName: '',
+        methodName: '',
+        businessKey: '',
+        status: '',
+        startDate: '',
+        endDate: '',
+        page: 1,
+        limit: 20
+      }
+      this.pageIndex = 1
+      this.getDataList()
+    },
+
+    // 每页数量变化 - rqrq
+    sizeChangeHandle(val) {
+      this.pageSize = val
+      this.pageIndex = 1
+      this.getDataList()
+    },
+
+    // 当前页变化 - rqrq
+    currentChangeHandle(val) {
+      this.pageIndex = val
+      this.getDataList()
+    },
+
+    // 获取状态标签类型 - rqrq
+    getStatusType(status) {
+      const statusMap = {
+        'PROCESSING': 'warning',
+        'SUCCESS': 'success',
+        'ERROR': 'danger',
+        'TIMEOUT': 'info'
+      }
+      return statusMap[status] || 'info'
+    },
+
+    // 获取状态标签文本 - rqrq
+    getStatusLabel(status) {
+      const statusMap = {
+        'PROCESSING': '处理中',
+        'SUCCESS': '成功',
+        'ERROR': '失败',
+        'TIMEOUT': '超时'
+      }
+      return statusMap[status] || '未知'
+    },
+
+    // 查看详情 - rqrq
+    viewDetail(row) {
+      this.detailData = row
+      this.detailVisible = true
+    },
+
+    // 格式化JSON - rqrq
+    formatJson(jsonStr) {
+      if (!jsonStr) {
+        return '无数据'
+      }
+      try {
+        const obj = JSON.parse(jsonStr)
+        return JSON.stringify(obj, null, 2)
+      } catch (e) {
+        return jsonStr
+      }
+    },
+
+    // 复制到剪贴板 - rqrq
+    copyToClipboard(text) {
+      if (!text) {
+        this.$message.warning('无内容可复制')
+        return
+      }
+
+      const textarea = document.createElement('textarea')
+      textarea.value = text
+      document.body.appendChild(textarea)
+      textarea.select()
+
+      try {
+        document.execCommand('copy')
+        this.$message.success('复制成功')
+      } catch (e) {
+        this.$message.error('复制失败')
+      }
+
+      document.body.removeChild(textarea)
+    }
+  }
+}
+</script>
+
+<style scoped>
+/* 表格样式优化 - rqrq */
+.mod-config {
+  padding: 10px;
+}
+
+/* 卡片样式 - rqrq */
+.box-card {
+  margin-bottom: 20px;
+}
+
+/* 固定高度卡片 - rqrq */
+.fixed-height-card {
+  height: 380px;
+}
+
+/* 详情表单样式 - rqrq */
+.detail-form {
+  height: 320px;
+  overflow-y: auto;
+}
+
+/* 详情内容区域 - rqrq */
+.detail-content-area {
+  height: 320px;
+  overflow-y: auto;
+}
+
+/* JSON展示样式 - rqrq */
+.json-pre {
+  margin: 0;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+.clearfix:before,
+.clearfix:after {
+  display: table;
+  content: "";
+}
+
+.clearfix:after {
+  clear: both;
+}
+</style>
+
diff --git a/src/views/modules/warehouse/inventoryDiscrepancy.vue b/src/views/modules/warehouse/inventoryDiscrepancy.vue
new file mode 100644
index 0000000..721617e
--- /dev/null
+++ b/src/views/modules/warehouse/inventoryDiscrepancy.vue
@@ -0,0 +1,571 @@
+<template>
+  <div class="mod-config">
+    <!-- 查询表单 - rqrq -->
+    <el-form :inline="true" label-position="top" style="margin-top: 1px; margin-left: 0px;">
+
+      <el-form-item label="栈板ID">
+        <el-input v-model="queryData.palletId" style="width: 120px" placeholder="栈板ID" clearable></el-input>
+      </el-form-item>
+
+      <el-form-item label="任务号">
+        <el-input v-model="queryData.taskNo" style="width: 120px" placeholder="任务号" clearable></el-input>
+      </el-form-item>
+
+      <el-form-item label="物料编号">
+        <el-input v-model="queryData.partNo" style="width: 120px" placeholder="物料编号" clearable></el-input>
+      </el-form-item>
+
+      <el-form-item label="处理状态">
+        <el-select v-model="queryData.status" placeholder="请选择" style="width: 120px" clearable>
+          <el-option label="全部" value=""></el-option>
+          <el-option
+            v-for="item in statusOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="创建时间从">
+        <el-date-picker
+          v-model="queryData.startDate"
+          type="date"
+          style="width: 120px"
+          placeholder="开始日期"
+          value-format="yyyy-MM-dd"
+          clearable>
+        </el-date-picker>
+      </el-form-item>
+
+      <el-form-item label="创建时间至">
+        <el-date-picker
+          v-model="queryData.endDate"
+          type="date"
+          style="width: 120px"
+          placeholder="结束日期"
+          value-format="yyyy-MM-dd"
+          clearable>
+        </el-date-picker>
+      </el-form-item>
+
+      <el-form-item label=" ">
+        <el-button type="primary" @click="getDataList()">查询</el-button>
+        <el-button @click="resetQuery()">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <!-- 数据表格 - rqrq -->
+    <el-table
+      :data="dataList"
+      :height="height"
+      border
+      highlight-current-row
+      v-loading="dataListLoading"
+      style="width: 100%;">
+      <el-table-column
+        v-for="(item,index) in columnList" :key="index"
+        :sortable="item.columnSortable"
+        :prop="item.columnProp"
+        :header-align="item.headerAlign"
+        :show-overflow-tooltip="item.showOverflowTooltip"
+        :align="item.align"
+        :fixed="item.fixed==''?false:item.fixed"
+        :min-width="item.columnWidth"
+        :label="item.columnLabel">
+        <template slot-scope="scope">
+          <span v-if="item.columnProp === 'status'">
+            <el-tag
+              :type="getStatusType(scope.row.status)"
+              size="small">
+              {{ getStatusLabel(scope.row.status) }}
+            </el-tag>
+          </span>
+          <span v-else-if="item.columnProp === 'wmsMissingQuantity'">
+            <span :style="{color: scope.row.wmsMissingQuantity > 0 ? '#F56C6C' : '#67C23A'}">
+              {{ scope.row.wmsMissingQuantity }}
+            </span>
+          </span>
+          <span v-else-if="item.columnProp === 'wcsExtraQuantity'">
+            <span :style="{color: scope.row.wcsExtraQuantity > 0 ? '#E6A23C' : '#67C23A'}">
+              {{ scope.row.wcsExtraQuantity }}
+            </span>
+          </span>
+          <span v-else>{{ scope.row[item.columnProp] }}</span>
+        </template>
+      </el-table-column>
+      
+      <!-- 操作列 - rqrq -->
+      <el-table-column
+        header-align="center"
+        align="center"
+        fixed="right"
+        width="150"
+        label="操作">
+        <template slot-scope="scope">
+          <a type="text" @click="viewDetail(scope.row)">查看明细</a>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页 - rqrq -->
+    <el-pagination
+      @size-change="sizeChangeHandle"
+      @current-change="currentChangeHandle"
+      :current-page="pageIndex"
+      :page-sizes="[20, 50, 100, 1000]"
+      :page-size="pageSize"
+      :total="totalPage"
+      layout="total, sizes, prev, pager, next, jumper">
+    </el-pagination>
+
+    <!-- 明细弹窗 - rqrq -->
+    <el-dialog
+      title="差异明细"
+      :visible.sync="detailVisible"
+      :close-on-click-modal="false"
+      v-drag
+      width="80%">
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <span>基本信息</span>
+            </div>
+            <el-form label-width="120px">
+              <el-form-item label="栈板ID:">
+                <span>{{ detailData.palletId }}</span>
+              </el-form-item>
+              <el-form-item label="任务号:">
+                <span>{{ detailData.taskNo }}</span>
+              </el-form-item>
+              <el-form-item label="明细行号:">
+                <span>{{ detailData.itemNo }}</span>
+              </el-form-item>
+              <el-form-item label="物料编号:">
+                <span>{{ detailData.partNo }}</span>
+              </el-form-item>
+              <el-form-item label="操作时间:">
+                <span>{{ detailData.operationTime }}</span>
+              </el-form-item>
+            </el-form>
+          </el-card>
+        </el-col>
+        
+        <el-col :span="12">
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <span>数量对比</span>
+            </div>
+            <el-form label-width="120px">
+              <el-form-item label="WMS账面数量:">
+                <span>{{ detailData.wmsTotalQuantity }}</span>
+              </el-form-item>
+              <el-form-item label="WCS扫描数量:">
+                <span>{{ detailData.wcsTotalQuantity }}</span>
+              </el-form-item>
+              <el-form-item label="WMS缺失数量:">
+                <span :style="{color: detailData.wmsMissingQuantity > 0 ? '#F56C6C' : '#67C23A'}">
+                  {{ detailData.wmsMissingQuantity }}
+                </span>
+              </el-form-item>
+              <el-form-item label="WCS多余数量:">
+                <span :style="{color: detailData.wcsExtraQuantity > 0 ? '#E6A23C' : '#67C23A'}">
+                  {{ detailData.wcsExtraQuantity }}
+                </span>
+              </el-form-item>
+            </el-form>
+          </el-card>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20" style="margin-top: 20px;">
+        <el-col :span="12">
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <span>WMS账面条码列表 ({{ wmsBarcodes.length }})</span>
+            </div>
+            <div style="max-height: 300px; overflow-y: auto;">
+              <el-tag
+                v-for="(barcode, index) in wmsBarcodes"
+                :key="index"
+                :type="wmsMissingBarcodes.includes(barcode) ? 'danger' : 'success'"
+                size="small"
+                style="margin: 5px;">
+                {{ barcode }}
+              </el-tag>
+              <div v-if="wmsBarcodes.length === 0" style="text-align: center; color: #999;">
+                暂无数据
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+        
+        <el-col :span="12">
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <span>WCS扫描条码列表 ({{ wcsBarcodes.length }})</span>
+            </div>
+            <div style="max-height: 300px; overflow-y: auto;">
+              <el-tag
+                v-for="(barcode, index) in wcsBarcodes"
+                :key="index"
+                :type="wcsExtraBarcodes.includes(barcode) ? 'warning' : 'success'"
+                size="small"
+                style="margin: 5px;">
+                {{ barcode }}
+              </el-tag>
+              <div v-if="wcsBarcodes.length === 0" style="text-align: center; color: #999;">
+                暂无数据
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20" style="margin-top: 20px;">
+        <el-col :span="12">
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <span style="color: #F56C6C;">WMS有但WCS未扫到的条码 ({{ wmsMissingBarcodes.length }})</span>
+            </div>
+            <div style="max-height: 200px; overflow-y: auto;">
+              <el-tag
+                v-for="(barcode, index) in wmsMissingBarcodes"
+                :key="index"
+                type="danger"
+                size="small"
+                style="margin: 5px;">
+                {{ barcode }}
+              </el-tag>
+              <div v-if="wmsMissingBarcodes.length === 0" style="text-align: center; color: #999;">
+                无差异
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+        
+        <el-col :span="12">
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <span style="color: #E6A23C;">WCS扫到但WMS没有的条码 ({{ wcsExtraBarcodes.length }})</span>
+            </div>
+            <div style="max-height: 200px; overflow-y: auto;">
+              <el-tag
+                v-for="(barcode, index) in wcsExtraBarcodes"
+                :key="index"
+                type="warning"
+                size="small"
+                style="margin: 5px;">
+                {{ barcode }}
+              </el-tag>
+              <div v-if="wcsExtraBarcodes.length === 0" style="text-align: center; color: #999;">
+                无差异
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="detailVisible = false">关闭</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  getInventoryDiscrepancyList,
+  getStatusOptions
+} from '@/api/warehouse/inventoryDiscrepancy.js'
+
+export default {
+  data() {
+    return {
+      // 查询条件 - rqrq
+      queryData: {
+        site: '',
+        palletId: '',
+        taskNo: '',
+        partNo: '',
+        status: '',
+        startDate: '',
+        endDate: '',
+        page: 1,
+        limit: 20
+      },
+      // 表格高度 - rqrq
+      height: 450,
+      // 状态选项 - rqrq
+      statusOptions: [],
+      // 表格列配置 - rqrq
+      columnList: [
+        {
+          columnProp: "palletId",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "栈板ID",
+          columnWidth: 120,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "taskNo",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "任务号",
+          columnWidth: 150,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "itemNo",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "明细行号",
+          columnWidth: 80,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "partNo",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "物料编号",
+          columnWidth: 150,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "wmsTotalQuantity",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "WMS数量",
+          columnWidth: 100,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "wcsTotalQuantity",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "WCS数量",
+          columnWidth: 100,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "wmsMissingQuantity",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "WMS缺失",
+          columnWidth: 100,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "wcsExtraQuantity",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "WCS多余",
+          columnWidth: 100,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "operationTime",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "操作时间",
+          columnWidth: 150,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "status",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "处理状态",
+          columnWidth: 100,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        },
+        {
+          columnProp: "createdAt",
+          headerAlign: "center",
+          align: "center",
+          columnLabel: "创建时间",
+          columnWidth: 150,
+          columnSortable: false,
+          showOverflowTooltip: true,
+          fixed: ""
+        }
+      ],
+      // 数据列表 - rqrq
+      dataList: [],
+      // 分页参数 - rqrq
+      pageIndex: 1,
+      pageSize: 20,
+      totalPage: 0,
+      dataListLoading: false,
+      // 明细弹窗 - rqrq
+      detailVisible: false,
+      detailData: {},
+      wmsBarcodes: [],
+      wcsBarcodes: [],
+      wmsMissingBarcodes: [],
+      wcsExtraBarcodes: []
+    }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      // 计算表格高度 - rqrq
+      this.height = window.innerHeight - 220;
+    })
+  },
+  activated() {
+    this.getDataList()
+    this.getStatusOptions()
+  },
+  methods: {
+    // 获取数据列表 - rqrq
+    getDataList() {
+      this.dataListLoading = true
+      this.queryData.page = this.pageIndex
+      this.queryData.limit = this.pageSize
+
+      getInventoryDiscrepancyList(this.queryData).then(({data}) => {
+        this.dataListLoading = false
+        if (data && data.code === 0) {
+          this.dataList = data.page.list || []
+          this.totalPage = data.page.totalCount || 0
+        } else {
+          this.dataList = []
+          this.totalPage = 0
+          this.$message.error(data.msg || '查询失败')
+        }
+      }).catch(error => {
+        this.dataListLoading = false
+        console.error('查询库存差异记录失败:', error)
+        this.$message.error('查询失败')
+      })
+    },
+
+    // 获取状态选项 - rqrq
+    getStatusOptions() {
+      getStatusOptions().then(({data}) => {
+        if (data && data.code === 0) {
+          this.statusOptions = data.options || []
+        }
+      }).catch(error => {
+        console.error('获取状态选项失败:', error)
+      })
+    },
+
+    // 重置查询条件 - rqrq
+    resetQuery() {
+      this.queryData = {
+        site: '',
+        palletId: '',
+        taskNo: '',
+        partNo: '',
+        status: '',
+        startDate: '',
+        endDate: '',
+        page: 1,
+        limit: 20
+      }
+      this.pageIndex = 1
+      this.getDataList()
+    },
+
+    // 每页数量变化 - rqrq
+    sizeChangeHandle(val) {
+      this.pageSize = val
+      this.pageIndex = 1
+      this.getDataList()
+    },
+
+    // 当前页变化 - rqrq
+    currentChangeHandle(val) {
+      this.pageIndex = val
+      this.getDataList()
+    },
+
+    // 获取状态标签类型 - rqrq
+    getStatusType(status) {
+      const statusMap = {
+        0: 'warning',  // 待处理
+        1: 'info',     // 已确认
+        2: 'success',  // 已处理
+        3: ''          // 忽略
+      }
+      return statusMap[status] || 'info'
+    },
+
+    // 获取状态标签文本 - rqrq
+    getStatusLabel(status) {
+      const statusMap = {
+        0: '待处理',
+        1: '已确认',
+        2: '已处理',
+        3: '忽略'
+      }
+      return statusMap[status] || '未知'
+    },
+
+    // 查看明细 - rqrq
+    viewDetail(row) {
+      this.detailData = row
+      
+      // 解析JSON数据 - rqrq
+      try {
+        this.wmsBarcodes = row.wmsBarcodeList ? JSON.parse(row.wmsBarcodeList) : []
+        this.wcsBarcodes = row.wcsBarcodeList ? JSON.parse(row.wcsBarcodeList) : []
+        this.wmsMissingBarcodes = row.wmsMissingBarcodes ? JSON.parse(row.wmsMissingBarcodes) : []
+        this.wcsExtraBarcodes = row.wcsExtraBarcodes ? JSON.parse(row.wcsExtraBarcodes) : []
+      } catch (e) {
+        console.error('解析条码列表失败:', e)
+        this.$message.error('解析条码列表失败')
+        return
+      }
+      
+      this.detailVisible = true
+    }
+  }
+}
+</script>
+
+<style scoped>
+/* 表格样式优化 - rqrq */
+.mod-config {
+  padding: 10px;
+}
+
+/* 卡片样式 - rqrq */
+.box-card {
+  margin-bottom: 20px;
+}
+
+.clearfix:before,
+.clearfix:after {
+  display: table;
+  content: "";
+}
+
+.clearfix:after {
+  clear: both;
+}
+</style>
+