增加数据分析记录界面

src/api/excel.js

@@ -218,6 +218,16 @@ const downloadPickTaskRecordsExcel = (data) => {
     })
 }
 
+const downloadAnalysisRecordsExcel = (data) => {
+    return request({
+        url: '/excel/downloadAnalysisRecordsExcel',
+        method: 'post',
+        responseType: 'blob',
+        data: data,
+        timeout: 600000
+    })
+}
+
 export {
     uploadExcelStock,
     uploadExcelGoods,
@@ -241,5 +251,6 @@ export {
     uploadExcelWorkDate,
     downloadWorkFlowExcel,
     downloadKateOrdersExcel,
-    downloadPickTaskRecordsExcel
+    downloadPickTaskRecordsExcel,
+    downloadAnalysisRecordsExcel
 }

src/api/record.js

@@ -8,6 +8,15 @@ const getTaskRecords = (params) => {
     })
 }
 
+const getAnalysisRecordByPage = (params) => {
+    return request({
+        url: '/record/getAnalysisRecordByPage',
+        method: 'post',
+        data: params
+    })
+}
+
 export {
-    getTaskRecords
+    getTaskRecords,
+    getAnalysisRecordByPage
 }

src/layout/analysisRecord.vue

@@ -0,0 +1,264 @@
+<template>
+  <div style="margin-bottom: 10px; height: 100%; padding-left: 1%; padding-right: 1%;">
+    <el-config-provider :locale="zhCn">
+      <div style="display: flex;justify-content: space-between;">
+        <el-row>
+          <el-input v-model="workOrderQuery" style="width: 158px; margin-right: 10px; margin-bottom: 5px;" placeholder="工单"
+                    :suffix-icon="Search"/>
+          <el-input v-model="smallBoxQuery" style="width: 158px; margin-right: 10px; margin-bottom: 5px;" placeholder="小盒子"
+                    :suffix-icon="Search"/>
+          <el-input v-model="bigBoxQuery" style="width: 158px; margin-right: 10px; margin-bottom: 5px;" placeholder="大盒子"
+                    :suffix-icon="Search"/>
+          <el-input v-model="goodsIdQuery" style="width: 158px; margin-right: 10px; margin-bottom: 5px;" placeholder="料号"
+                    :suffix-icon="Search"/>
+          <el-input v-model="vehicleIdQuery" style="width: 158px; margin-right: 10px; margin-bottom: 5px;" placeholder="箱号"
+                    :suffix-icon="Search"/>
+          <el-input v-model="standIdQuery" style="width: 158px; margin-right: 10px; margin-bottom: 5px;" placeholder="站台"
+                    :suffix-icon="Search"/>
+          <el-date-picker v-model="startDateQuery" type="date" placeholder="开工日期" :shortcuts="shortcuts"
+                          style="width: 158px; margin-right: 10px; margin-bottom: 5px;" clearable/>
+          <el-select-v2 v-model="machineTypeQuery" style="width: 158px; margin-right: 10px; margin-bottom: 5px;"
+                        placeholder="请选择机型" :options="machineTypeOptions" @change="search()"></el-select-v2>
+          <el-button type="primary" @click="search()">搜索</el-button>
+          <el-button type="warning" @click="reset()">重置</el-button>
+        </el-row>
+        <el-row>
+          <el-button style="background-color: #00CED1; color: #000; width: 120px"
+                     @click="exportPickTaskRecords()">下载数据分析记录
+          </el-button>
+        </el-row>
+
+      </div>
+      <br/>
+      <el-table :data="pickTaskList" stripe border v-loading="loading" class="table-class" highlight-current-row
+                max-height="650px" @row-click="getCurrentRow" :header-cell-style="{ 'text-align': 'center' }"
+                :cell-style="{ 'text-align': 'center' }">
+        <el-table-column width="65px" fixed="left">
+          <template v-slot="scope">
+            <el-radio :label="scope.row.recordId" v-model="recordId">&nbsp;</el-radio>
+          </template>
+        </el-table-column>
+        <el-table-column prop="workOrder" label="工单" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="smallBox" label="小盒子" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="bigBox" label="大盒子" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="goodsId" label="料号" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="machineType" label="机型" show-overflow-tooltip min-width="120px"/>
+        <el-table-column prop="startDate" label="开工日期" :formatter="dateFormat" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="vehicleId" label="载具号" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="locationId" label="库位号" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="distributeQty" label="本次分配数量" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="standId" label="站台号" show-overflow-tooltip min-width="120px"/>
+        <el-table-column prop="arriveTime" label="到达时间" :formatter="timeFormat" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="leaveTime" label="离开时间" :formatter="timeFormat" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="lastTime" label="滞留时长" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="lightTime" label="亮灯时间" :formatter="timeFormat" min-width="120px" show-overflow-tooltip/>
+        <el-table-column prop="closeTime" label="拍灯时间" :formatter="timeFormat" show-overflow-tooltip min-width="120px"/>
+        <el-table-column prop="requireNum" label="请求数量" show-overflow-tooltip min-width="120px"/>
+        <el-table-column prop="confirmNum" label="确认数量" show-overflow-tooltip min-width="120px"/>
+      </el-table>
+      <br/>
+      <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 25, 50]"
+                     :small="false" :disabled="false" :background="false" :default-page-size="10"
+                     layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="search"
+                     @current-change="search"/>
+    </el-config-provider>
+  </div>
+</template>
+
+<script setup>
+import store from '@/store'
+import {errorBox} from '@/utils/myMessageBox.js'
+import {ElMessage} from 'element-plus'
+import {dateFormatter, timeFormatter} from '@/utils/formatter.js'
+import {Search} from '@element-plus/icons-vue'
+import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
+</script>
+<script>
+
+import {getAnalysisRecordByPage} from "@/api/record";
+import {downloadAnalysisRecordsExcel} from "@/api/excel";
+
+export default {
+  name: 'pickTaskMonitor',
+  data() {
+    return {
+      pickTaskList: [],
+      currentPage: 1,
+      pageSize: 10,
+      total: 0,
+      workOrderQuery: '',
+      smallBoxQuery: '',
+      bigBoxQuery: '',
+      goodsIdQuery: '',
+      vehicleIdQuery: '',
+      standIdQuery: '',
+      machineTypeQuery: '全部',
+      startDateQuery: null,
+      loading: true,
+      recordId: '',
+      machineTypeOptions: [
+        {
+          value: '全部',
+          label: '全部'
+        },
+        {
+          value: '装载机',
+          label: '装载机'
+        },
+        {
+          value: '平地机',
+          label: '平地机'
+        }
+      ],
+      shortcuts: [
+        {
+          text: '今天',
+          value: new Date(),
+        },
+        {
+          text: '昨天',
+          value: () => {
+            const date = new Date()
+            date.setTime(date.getTime() - 3600 * 1000 * 24)
+            return date
+          },
+        },
+      ],
+    }
+  },
+  mounted() {
+    this.search()
+  },
+  methods: {
+    search() {
+      this.loading = true
+      const request = {
+        pageNo: this.currentPage,
+        pageSize: this.pageSize,
+        workOrder: this.workOrderQuery.trim(),
+        smallBox: this.smallBoxQuery.trim(),
+        bigBox: this.bigBoxQuery.trim(),
+        goodsId: this.goodsIdQuery.trim(),
+        startDate: this.startDateQuery === null ? null : dateFormatter(this.startDateQuery),
+        vehicleId: this.vehicleIdQuery.trim(),
+        standId: this.standIdQuery.trim(),
+        machineType: this.machineTypeQuery === '全部' ? null : this.machineTypeQuery,
+        userName: store.getters.getUserName
+      }
+      getAnalysisRecordByPage(request).then(res => {
+        const tableResponse = res.data
+        if (tableResponse.code === 0) {
+          this.pickTaskList = tableResponse.returnData.lists
+          this.total = tableResponse.returnData.total
+        } else {
+          errorBox(tableResponse.message)
+        }
+      }).catch(err => {
+        console.log(err)
+        errorBox('查询数据记录错误')
+      })
+      this.loading = false
+    },
+    dateFormat: (row, column, cellValue, index) => {
+      return dateFormatter(cellValue)
+    },
+    timeFormat: (row, column, cellValue, index) => {
+      return timeFormatter(cellValue)
+    },
+    reset() {
+      this.vehicleIdQuery = ''
+      this.standQuery = ''
+      this.search()
+    },
+    getCurrentRow(row) {
+      this.recordId = row.recordId
+    },
+    // 导出拣选任务记录
+    exportPickTaskRecords() {
+      const request = {
+        workOrder: this.workOrderQuery.trim(),
+        smallBox: this.smallBoxQuery.trim(),
+        bigBox: this.bigBoxQuery.trim(),
+        goodsId: this.goodsIdQuery.trim(),
+        startDate: this.startDateQuery === null ? null : dateFormatter(this.startDateQuery),
+        vehicleId: this.vehicleIdQuery.trim(),
+        standId: this.standIdQuery.trim(),
+        machineType: this.machineTypeQuery === '全部' ? null : this.machineTypeQuery,
+        userName: store.getters.getUserName
+      }
+      downloadAnalysisRecordsExcel(request).then(res => {
+        const link = document.createElement('a');//创建a标签
+        try {
+          // let blob = new Blob([res.data],{type: 'application/vnd.ms-excel'});    //如果后台返回的不是blob对象类型，先定义成blob对象格式，该type导出为xls格式，
+          let blob = res.data    //如果后台返回的直接是blob对象类型，直接获取数据
+          // let _fileName = res.headers['content-disposition'].split(';')[1].split('=')[1]; //拆解获取文件名，如果后端有给返回文件名的话
+          let _fileName = "数据分析记录" + dateFormatter(this.dateQuery) + ".xlsx"
+          link.style.display = 'none'//隐藏
+
+          // 兼容不同浏览器的URL对象
+          const url = window.URL || window.webkitURL || window.moxURL
+          link.href = url.createObjectURL(blob)
+          link.setAttribute('download', _fileName.substring(_fileName.lastIndexOf('_') + 1))
+          document.body.appendChild(link)
+          link.click()
+          document.body.removeChild(link)
+          url.revokeObjectURL(link.href)//移除url对象
+        } catch (e) {
+          console.log(e)
+          errorBox('下载文件失败')
+        }
+      }).catch(err => {
+        console.log(err)
+        errorBox('导出失败')
+      })
+    },
+  },
+}
+</script>
+
+<style scoped>
+.el-pagination {
+  padding-left: 5px;
+}
+
+.el-row .el-button {
+  width: 72px;
+  margin-left: 0px;
+  margin-right: 5px;
+}
+
+.table-class {
+  width: 100%;
+}
+
+.el-row .el-form-item {
+  width: 10% inherit;
+  justify-content: center;
+}
+
+.el-row .el-form-item .el-select-v2 {
+  width: 100% !important;
+}
+
+.el-row .el-form-item .el-input-number {
+  width: 100% !important;
+}
+
+.el-row .el-form-item .el-button {
+  margin: auto;
+}
+
+.title-area {
+  display: flex;
+  /* min-height: 10%; */
+  max-height: max-content;
+  margin-bottom: 10px;
+  min-width: inherit;
+  border: solid 1px;
+  border-radius: 10px;
+  box-shadow: 0px 15px 10px -15px #000;
+  overflow: auto;
+  flex-direction: column;
+  padding: 10px;
+}
+</style>

src/router/index.js

@@ -1,77 +1,78 @@
-import { createRouter, createWebHashHistory } from 'vue-router'
+import {createRouter, createWebHashHistory} from 'vue-router'
 import HomeView from '@/views/HomeView.vue'
 import stock from '@/layout/stock.vue'
 import login from '@/views/login.vue'
-import systemCenter from'@/views/SystemCenter.vue'
+import systemCenter from '@/views/SystemCenter.vue'
 
 const routes = [
-  {
+    {
-    path: '/home',
+        path: '/home',
-    name: 'home',
+        name: 'home',
-    component: HomeView,
+        component: HomeView,
-    children: [
+        children: [
-      { path: '/stock', component: stock },// 库存
+            {path: '/stock', component: stock},// 库存
-      { path: '/goodsIn', component: () => import('@/layout/goodsIn.vue') },// 入库
+            {path: '/goodsIn', component: () => import('@/layout/goodsIn.vue')},// 入库
-      { path: '/goodsOut', component: () => import('@/layout/goodsOut.vue') },// 出库
+            {path: '/goodsOut', component: () => import('@/layout/goodsOut.vue')},// 出库
-      { path: '/inTaskRecord', component: () => import('@/layout/inTaskRecord.vue') },// 入库记录
+            {path: '/inTaskRecord', component: () => import('@/layout/inTaskRecord.vue')},// 入库记录
-      { path: '/outTaskRecord', component: () => import('@/layout/outTaskRecord.vue') },// 出库记录
+            {path: '/outTaskRecord', component: () => import('@/layout/outTaskRecord.vue')},// 出库记录
-      { path: '/location', component: () => import('@/layout/locationsTable.vue') },// 库位
+            {path: '/location', component: () => import('@/layout/locationsTable.vue')},// 库位
-      { path: '/goods', component: () => import('@/layout/goods.vue') },// 物料
+            {path: '/goods', component: () => import('@/layout/goods.vue')},// 物料
-      { path: '/standSettings', component: () => import('@/layout/standSettings.vue') },// 站台（库口）设置
+            {path: '/standSettings', component: () => import('@/layout/standSettings.vue')},// 站台（库口）设置
-      { path: '/config', component: () => import('@/layout/wmsConfig.vue') },// 系统配置
+            {path: '/config', component: () => import('@/layout/wmsConfig.vue')},// 系统配置
-      { path: '/taskMonitor', component: () => import('@/layout/taskMonitor.vue') },// 任务监控
+            {path: '/taskMonitor', component: () => import('@/layout/taskMonitor.vue')},// 任务监控
-      { path: '/vehicles', component: () => import('@/layout/vehicle.vue') },// 料箱监控
+            {path: '/vehicles', component: () => import('@/layout/vehicle.vue')},// 料箱监控
-      { path: '/inventory', component: () => import('@/layout/inventory.vue') },// 盘点
+            {path: '/inventory', component: () => import('@/layout/inventory.vue')},// 盘点
-      { path: '/inventoryRecord', component: () => import('@/layout/inventoryRecord.vue') },// 盘点记录
+            {path: '/inventoryRecord', component: () => import('@/layout/inventoryRecord.vue')},// 盘点记录
-      { path: '/wmsLog', component: () => import('@/layout/wmsLog.vue') },// 日志
+            {path: '/wmsLog', component: () => import('@/layout/wmsLog.vue')},// 日志
-      { path: '/testDoKitting', component: () => import('@/layout/doKitting.vue') },// 备料执行
+            {path: '/testDoKitting', component: () => import('@/layout/doKitting.vue')},// 备料执行
-      { path: '/testFinishKitting', component: () => import('@/layout/finishKitting.vue') },// 备料完成
+            {path: '/testFinishKitting', component: () => import('@/layout/finishKitting.vue')},// 备料完成
-      { path: '/testCallEmptyVehicle', component: () => import('@/layout/callEmptyVehicle.vue') },// 呼叫空箱
+            {path: '/testCallEmptyVehicle', component: () => import('@/layout/callEmptyVehicle.vue')},// 呼叫空箱
-      { path: '/testSortBoxs', component: () => import('@/layout/sortBoxs.vue') },// 整理盒子
+            {path: '/testSortBoxs', component: () => import('@/layout/sortBoxs.vue')},// 整理盒子
-      { path: '/uploadDbs', component: () => import('@/layout/dbsTable.vue') },// 上传DBS
+            {path: '/uploadDbs', component: () => import('@/layout/dbsTable.vue')},// 上传DBS
-      { path: '/uploadOrders', component: () => import('@/layout/kateOrdersTable.vue') },// 上传工单
+            {path: '/uploadOrders', component: () => import('@/layout/kateOrdersTable.vue')},// 上传工单
-      { path: '/stationConfig', component: () => import('@/layout/stationConfig.vue') },// 工站配置
+            {path: '/stationConfig', component: () => import('@/layout/stationConfig.vue')},// 工站配置
-      { path: '/workFlow', component: () => import('@/layout/workFlow.vue') },// 工作流
+            {path: '/workFlow', component: () => import('@/layout/workFlow.vue')},// 工作流
-      { path: '/workSummary', component: () => import('@/layout/workSummary.vue') },// 工作总结
+            {path: '/workSummary', component: () => import('@/layout/workSummary.vue')},// 工作总结
-      { path: '/pickTask', component: () => import('@/layout/pickTaskMonitor.vue') },// 拣选任务
+            {path: '/pickTask', component: () => import('@/layout/pickTaskMonitor.vue')},// 拣选任务
-      { path: '/eLocationConfig', component: () => import('@/layout/eLocationConfig.vue') },// 标签配置
+            {path: '/eLocationConfig', component: () => import('@/layout/eLocationConfig.vue')},// 标签配置
-      { path: '/eLocationMonitor', component: () => import('@/layout/eLocationTable.vue') },// 标签库位监控
+            {path: '/eLocationMonitor', component: () => import('@/layout/eLocationTable.vue')},// 标签库位监控
-      { path: '/goodsToStation', component: () => import('@/layout/goodsToStation.vue') },// 站台要料
+            {path: '/goodsToStation', component: () => import('@/layout/goodsToStation.vue')},// 站台要料
-      { path: '/clcNoPlan', component: () => import('@/layout/clcNoPlan.vue') },// 非计划领料
+            {path: '/clcNoPlan', component: () => import('@/layout/clcNoPlan.vue')},// 非计划领料
-      { path: '/clcKanban', component: () => import('@/layout/clcKanban.vue') },// 需求看板
+            {path: '/clcKanban', component: () => import('@/layout/clcKanban.vue')},// 需求看板
-      { path: '/goodsInQR', component: () => import('@/layout/goodsInQR.vue') },// 二维码入库
+            {path: '/goodsInQR', component: () => import('@/layout/goodsInQR.vue')},// 二维码入库
-      { path: '/stockUpdateRecord', component: () => import('@/layout/stockUpdateRecord.vue') },// 库存更新记录
+            {path: '/stockUpdateRecord', component: () => import('@/layout/stockUpdateRecord.vue')},// 库存更新记录
-      { path: '/roleUser', component: () => import('@/layout/role_user.vue') },// 角色——用户列表
+            {path: '/roleUser', component: () => import('@/layout/role_user.vue')},// 角色——用户列表
-      { path: '/rolePermission', component: () => import('@/layout/role_permission.vue') },// 角色——权限列表
+            {path: '/rolePermission', component: () => import('@/layout/role_permission.vue')},// 角色——权限列表
-      { path: '/workDateTable', component: () => import('@/layout/workDateTable.vue') },// 工作日历
+            {path: '/workDateTable', component: () => import('@/layout/workDateTable.vue')},// 工作日历
-      { path: '/stockForInv', component: () => import('@/layout/stockForInv.vue') },// 库存（盘点用）
+            {path: '/stockForInv', component: () => import('@/layout/stockForInv.vue')},// 库存（盘点用）
-    ]
+            {path: '/analysisRecord', component: () => import('@/layout/analysisRecord.vue')},// 盘点记录
-  },
+        ]
-  {
+    },
-    path: '/',
+    {
-    name: 'login',
+        path: '/',
-    component: login
+        name: 'login',
-  },
+        component: login
-  {
+    },
-    path: '/systemCenter',
+    {
-    name: 'systemCenter',
+        path: '/systemCenter',
-    component: systemCenter
+        name: 'systemCenter',
-  }
+        component: systemCenter
+    }
 ]
 
 const router = createRouter({
-  base: '/',
+    base: '/',
-  history: createWebHashHistory(),
+    history: createWebHashHistory(),
-  routes
+    routes
 })
 
 // 挂载路由导航守卫
 router.beforeEach((to, from, next) => {
-  if (to.path === '/') return next()
+    if (to.path === '/') return next()
-  // 获取token
+    // 获取token
-  const user = sessionStorage.getItem('user')
+    const user = sessionStorage.getItem('user')
-  if (!user) return next('/')
+    if (!user) return next('/')
-  next()
+    next()
 })
 
 export default router