feat(automatedWarehouse): 托盘合并查询功能新增分页和过滤功能

- 新增最大已用数量查询条件输入框 - 集成分页组件支持页码、每页条数切换 - 添加分页相关状态变量和参数配置 - 实现分页数据请求和响应处理逻辑 - 优化SOP管理界面布局和交互流程 - 移除不必要的按钮和错误类型筛选选项 - 调整表格列宽度以适应内容显示 - 更新API调用逻辑适配分页参数格式
10 hours ago · f69aafaad9
2 changed files with 144 additions and 105 deletions
--- a/src/views/modules/automatedWarehouse/palletMergeQuery.vue
+++ b/src/views/modules/automatedWarehouse/palletMergeQuery.vue
@ -18,6 +18,15 @@
            </el-option>
          </el-select>
        </el-form-item>
+        <!-- 最大已用数量查询条件 - rqrq -->
+        <el-form-item label="最大已用数量">
+          <el-input
+            v-model="searchData.maxPositionCount"
+            placeholder="请输入"
+            style="width: 120px" type="number"
+           >
+          </el-input>
+        </el-form-item>
        <el-form-item :label="' '">
          <el-button type="primary" @click="searchTable()" :disabled="!searchData.palletType">查询</el-button>
        </el-form-item>
@ -74,6 +83,17 @@
      </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>
+
  </div>
 </template>

@ -93,9 +113,16 @@ export default {
      submitLoading: false,
      selectedRows: [],
      palletTypeOptions: [],
+      // 分页参数 - rqrq
+      pageIndex: 1,
+      pageSize: 20,
+      totalPage: 0,
      searchData: {
        site: this.$store.state.user.site || '55',
-        palletType: ''
+        palletType: '',
+        maxPositionCount: null,  // 最大已用数量 - rqrq
+        page: 1,
+        limit: 20
      },
      // 表格列配置 - rqrq
      columnList: [
@ -236,6 +263,8 @@ export default {
    handlePalletTypeChange() {
      this.dataList = []
      this.selectedRows = []
+      this.totalPage = 0
+      this.pageIndex = 1
      if (this.$refs.mainTable) {
        this.$refs.mainTable.clearSelection()
      }
@ -254,10 +283,24 @@ export default {
        this.$refs.mainTable.clearSelection()
      }

+      // 设置分页参数 - rqrq
+      this.searchData.page = this.pageIndex
+      this.searchData.limit = this.pageSize
+
      searchPalletMergeList(this.searchData).then(({ data }) => {
        this.dataListLoading = false
        if (data && data.code == 0) {
-          this.dataList = data.rows || []
+          // 支持分页返回格式 - rqrq
+          if (data.page) {
+            this.dataList = data.page.list || []
+            this.pageIndex = data.page.currPage
+            this.pageSize = data.page.pageSize
+            this.totalPage = data.page.totalCount
+          } else {
+            // 兼容旧的非分页返回格式 - rqrq
+            this.dataList = data.rows || []
+            this.totalPage = this.dataList.length
+          }
          if (this.dataList.length === 0) {
            this.$message({
              message: '没有找到需要合托的托盘',
@ -267,14 +310,27 @@ export default {
          }
        } else {
          this.dataList = []
+          this.totalPage = 0
          this.$alert(data.msg || '查询失败', '错误', { confirmButtonText: '确定' })
        }
      }).catch(() => {
        this.dataListLoading = false
        this.dataList = []
+        this.totalPage = 0
        this.$message.error('查询失败')
      })
    },
+    // 每页条数变化 - rqrq
+    sizeChangeHandle(val) {
+      this.pageSize = val
+      this.pageIndex = 1
+      this.searchTable()
+    },
+    // 当前页变化 - rqrq
+    currentChangeHandle(val) {
+      this.pageIndex = val
+      this.searchTable()
+    },
    // 行点击选中/取消选中 - rqrq
    handleRowClick(row) {
      this.$refs.mainTable.toggleRowSelection(row)
@ -341,4 +397,3 @@ export default {
  margin-right: 4px;
 }
 </style>
-
--- a/src/views/modules/automatedWarehouse/sopManagement.vue
+++ b/src/views/modules/automatedWarehouse/sopManagement.vue
@ -4,10 +4,10 @@
    <el-form :inline="true" label-position="top" style="margin-top: 1px; margin-left: 0px;">
      <!-- 三级级联选择：平台 -> 模块 -> 功能页面 - rqrq -->
      <el-form-item label="平台">
-        <el-select 
-          v-model="queryData.platform" 
-          placeholder="请选择平台" 
-          style="width: 100px" 
+        <el-select
+          v-model="queryData.platform"
+          placeholder="请选择平台"
+          style="width: 100px"
          @change="handlePlatformChange">
          <el-option
            v-for="item in platformOptions"
@ -19,10 +19,10 @@
      </el-form-item>

      <el-form-item label="模块">
-        <el-select 
-          v-model="queryData.moduleName" 
-          placeholder="请选择模块" 
-          style="width: 150px" 
+        <el-select
+          v-model="queryData.moduleName"
+          placeholder="请选择模块"
+          style="width: 150px"
          :disabled="!queryData.platform"
          @change="handleModuleChange">
          <el-option
@ -35,9 +35,9 @@
      </el-form-item>

      <el-form-item label="功能页面">
-        <el-select 
-          v-model="queryData.url" 
-          placeholder="请选择功能页面" 
+        <el-select
+          v-model="queryData.url"
+          placeholder="请选择功能页面"
          style="width: 180px"
          :disabled="!queryData.moduleName"
          @change="handlePageChange">
@ -50,31 +50,6 @@
        </el-select>
      </el-form-item>

-      <el-form-item label="按钮/功能">
-        <el-select 
-          v-model="queryData.functionButton" 
-          placeholder="全部按钮" 
-          style="width: 150px" 
-          filterable
-          clearable>
-          <el-option label="全部按钮" value=""></el-option>
-          <el-option
-            v-for="item in buttonOptions"
-            :key="item"
-            :label="item"
-            :value="item">
-          </el-option>
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="错误类型">
-        <el-select v-model="queryData.searchErrorType" placeholder="请选择" style="width: 100px" clearable>
-          <el-option label="全部" value=""></el-option>
-          <el-option label="后端" value="BACKEND"></el-option>
-          <el-option label="前端" value="FRONTEND"></el-option>
-        </el-select>
-      </el-form-item>
-
      <el-form-item label="错误信息">
        <el-input v-model="queryData.searchErrorMessage" style="width: 180px" placeholder="错误信息关键字" clearable></el-input>
      </el-form-item>
@ -86,14 +61,14 @@
    </el-form>

    <!-- 当前选中页面信息 - rqrq -->
-    <div v-if="currentUrlConfig" class="url-info-card">
+    <div v-if="false" class="url-info-card">
      <el-card shadow="never">
        <div slot="header" class="clearfix">
          <span>
            <el-tag :type="currentUrlConfig.platform === 'PC' ? 'primary' : 'success'" size="small" style="margin-right: 10px">
              {{ currentUrlConfig.platform }}
            </el-tag>
-            <i class="el-icon-document"></i> 
+            <i class="el-icon-document"></i>
            {{ currentUrlConfig.moduleName }} - {{ currentUrlConfig.pageName }}
          </span>
        </div>
@ -108,7 +83,7 @@
      highlight-current-row
      v-loading="dataListLoading"
      style="width: 100%;">
-      
+
      <el-table-column prop="functionButton" label="功能/按钮" width="150" header-align="center" align="center">
        <template slot-scope="scope">
          <el-tag type="primary" size="small">{{ scope.row.functionButton }}</el-tag>
@ -117,33 +92,27 @@

      <el-table-column prop="seqNo" label="序号" width="60" header-align="center" align="center"></el-table-column>

-      <el-table-column prop="errorMessage" label="错误信息" min-width="280" header-align="center" show-overflow-tooltip>
+      <el-table-column prop="errorMessage" label="错误信息" min-width="300" header-align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span style="color: #F56C6C">{{ scope.row.errorMessage }}</span>
        </template>
      </el-table-column>

-      <el-table-column prop="errorType" label="类型" width="80" header-align="center" align="center">
-        <template slot-scope="scope">
-          <el-tag :type="scope.row.errorType === 'BACKEND' ? 'warning' : 'info'" size="mini">
-            {{ scope.row.errorType === 'BACKEND' ? '后端' : '前端' }}
-          </el-tag>
-        </template>
-      </el-table-column>
+<!--      <el-table-column prop="errorType" label="类型" width="80" header-align="center" align="center">-->
+<!--        <template slot-scope="scope">-->
+<!--          <el-tag :type="scope.row.errorType === 'BACKEND' ? 'warning' : 'info'" size="mini">-->
+<!--            {{ scope.row.errorType === 'BACKEND' ? '后端' : '前端' }}-->
+<!--          </el-tag>-->
+<!--        </template>-->
+<!--      </el-table-column>-->

-      <el-table-column prop="errorSource" label="错误来源" width="180" header-align="center" show-overflow-tooltip>
-        <template slot-scope="scope">
-          <span style="color: #909399; font-size: 12px">{{ scope.row.errorSource }}</span>
-        </template>
-      </el-table-column>
-
-      <el-table-column prop="defaultSolution" label="默认处理方式" min-width="220" header-align="center" show-overflow-tooltip>
+      <el-table-column prop="defaultSolution" label="默认处理方式" min-width="250" header-align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span style="color: #67C23A">{{ scope.row.defaultSolution || '-' }}</span>
        </template>
      </el-table-column>

-      <el-table-column prop="userSolution" label="用户补充处理方式" min-width="220" header-align="center" show-overflow-tooltip>
+      <el-table-column prop="userSolution" label="用户补充处理方式" min-width="250" header-align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span style="color: #409EFF">{{ scope.row.userSolution || '-' }}</span>
        </template>
@ -175,7 +144,7 @@
      :close-on-click-modal="false"
      v-drag
      width="800px">
-      
+
      <el-form :model="editForm" label-position="top" style="margin-top: 1px; margin-left: 0px;">
        <el-row :gutter="20">
          <el-col :span="12">
@ -201,7 +170,7 @@
        <el-row style="margin-top: 52px">
          <el-col :span="24">
            <el-form-item label="默认处理方式">
-              <el-input type="textarea" :rows="4" resize="none" v-model="editForm.defaultSolution" placeholder="请输入默认处理方式"></el-input>
+              <el-input type="textarea" :rows="4" resize="none" v-model="editForm.defaultSolution" readonly></el-input>
            </el-form-item>
          </el-col>
        </el-row>
@ -231,7 +200,6 @@ import {
  getModuleListByPlatform,
  getPageListByPlatformAndModule,
  getErrorDetailList,
-  getFunctionButtonsByUrl,
  updateErrorDetail
 } from "@/api/sys/sop.js"

@ -245,14 +213,11 @@ export default {
      platformOptions: [],
      moduleOptions: [],
      pageOptions: [],
-      buttonOptions: [],
      currentUrlConfig: null,
      queryData: {
        platform: '',
        moduleName: '',
        url: '',
-        functionButton: '',
-        searchErrorType: '',
        searchErrorMessage: '',
        page: 1,
        limit: 20
@ -274,57 +239,91 @@ export default {
    }
  },
  mounted() {
-    this.height = window.innerHeight - 320
+    // 使用nextTick确保DOM渲染完成后设置高度 - rqrq
+    this.$nextTick(() => {
+      this.height = window.innerHeight - 220
+    })
    this.loadPlatformOptions()
  },
  methods: {
+    // 加载平台列表，默认选中PC - rqrq
    loadPlatformOptions() {
      getPlatformList({}).then(({ data }) => {
        if (data && data.code == 0) {
          this.platformOptions = data.rows || []
+          // 默认选中PC，如果没有PC则选中第一个 - rqrq
+          if (this.platformOptions.includes('PC')) {
+            this.queryData.platform = 'PC'
+          } else if (this.platformOptions.length > 0) {
+            this.queryData.platform = this.platformOptions[0]
+          }
+          // 加载模块列表
+          if (this.queryData.platform) {
+            this.loadModuleOptions(this.queryData.platform, true)
+          }
        }
      })
    },
+    // 加载模块列表 - rqrq
+    loadModuleOptions(platform, selectFirst) {
+      getModuleListByPlatform({ platform: platform }).then(({ data }) => {
+        if (data && data.code == 0) {
+          this.moduleOptions = data.rows || []
+          // 默认选中第一个模块 - rqrq
+          if (selectFirst && this.moduleOptions.length > 0) {
+            this.queryData.moduleName = this.moduleOptions[0]
+            this.loadPageOptions(platform, this.queryData.moduleName, true)
+          }
+        }
+      })
+    },
+    // 加载功能页面列表 - rqrq
+    loadPageOptions(platform, moduleName, selectFirst) {
+      getPageListByPlatformAndModule({
+        platform: platform,
+        moduleName: moduleName
+      }).then(({ data }) => {
+        if (data && data.code == 0) {
+          this.pageOptions = data.rows || []
+          // 默认选中第一个功能页面 - rqrq
+          if (selectFirst && this.pageOptions.length > 0) {
+            this.queryData.url = this.pageOptions[0].url
+            this.currentUrlConfig = this.pageOptions[0]
+            this.getDataList()
+          }
+        }
+      })
+    },
+    // 平台变化处理 - rqrq
    handlePlatformChange(platform) {
      this.queryData.moduleName = ''
      this.queryData.url = ''
      this.moduleOptions = []
      this.pageOptions = []
-      this.buttonOptions = []
      this.currentUrlConfig = null
      this.dataList = []
      this.totalPage = 0
      if (platform) {
-        getModuleListByPlatform({ platform: platform }).then(({ data }) => {
-          if (data && data.code == 0) {
-            this.moduleOptions = data.rows || []
-          }
-        })
+        // 加载模块列表并默认选中第一个 - rqrq
+        this.loadModuleOptions(platform, true)
      }
    },
+    // 模块变化处理 - rqrq
    handleModuleChange(moduleName) {
      this.queryData.url = ''
      this.pageOptions = []
-      this.buttonOptions = []
      this.currentUrlConfig = null
      this.dataList = []
      this.totalPage = 0
      if (moduleName) {
-        getPageListByPlatformAndModule({ 
-          platform: this.queryData.platform, 
-          moduleName: moduleName 
-        }).then(({ data }) => {
-          if (data && data.code == 0) {
-            this.pageOptions = data.rows || []
-          }
-        })
+        // 加载功能页面列表并默认选中第一个 - rqrq
+        this.loadPageOptions(this.queryData.platform, moduleName, true)
      }
    },
+    // 功能页面变化处理 - rqrq
    handlePageChange(url) {
-      this.buttonOptions = []
      if (url) {
        this.currentUrlConfig = this.pageOptions.find(item => item.url === url)
-        this.loadButtonOptions(url)
        this.getDataList()
      } else {
        this.currentUrlConfig = null
@ -332,13 +331,7 @@ export default {
        this.totalPage = 0
      }
    },
-    loadButtonOptions(url) {
-      getFunctionButtonsByUrl({ url: url }).then(({ data }) => {
-        if (data && data.code == 0) {
-          this.buttonOptions = data.rows || []
-        }
-      })
-    },
+    // 查询数据 - rqrq
    getDataList() {
      if (!this.queryData.url) {
        this.$message.warning('请先选择功能页面')
@ -362,25 +355,13 @@ export default {
        this.$alert('查询失败', '错误', { confirmButtonText: '确定' })
      })
    },
+    // 重置查询 - rqrq
    resetQuery() {
-      this.queryData = {
-        platform: '',
-        moduleName: '',
-        url: '',
-        functionButton: '',
-        searchErrorType: '',
-        searchErrorMessage: '',
-        page: 1,
-        limit: 20
-      }
-      this.moduleOptions = []
-      this.pageOptions = []
-      this.buttonOptions = []
-      this.currentUrlConfig = null
-      this.dataList = []
-      this.totalPage = 0
+      this.queryData.searchErrorMessage = ''
      this.pageIndex = 1
+      this.getDataList()
    },
+    // 编辑处理方式 - rqrq
    editSolution(row) {
      this.editForm = {
        url: row.url,
@ -394,6 +375,7 @@ export default {
      }
      this.editDialogVisible = true
    },
+    // 保存处理方式 - rqrq
    saveSolution() {
      this.saveLoading = true
      const updateData = {
@ -420,11 +402,13 @@ export default {
        this.saveLoading = false
      })
    },
+    // 分页 - 每页条数变化 - rqrq
    sizeChangeHandle(val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDataList()
    },
+    // 分页 - 当前页变化 - rqrq
    currentChangeHandle(val) {
      this.pageIndex = val
      this.getDataList()