1. 回退goods.vue的代码

dev_wms_client/src/excel/UploadExcelInventory.vue

@@ -10,7 +10,7 @@
 <script setup>
 import store from '@/store'
 import {ref, reactive} from 'vue';
-import {uploadExcelBaseGoods, uploadExcelInventoryRequest} from '@/api/excel.js'
+import {uploadExcelInventoryRequest} from '@/api/excel.js'
 import {ElMessage} from 'element-plus'
 import {errorBox} from '@/utils/myMessageBox';
 import {sizeFormatter} from '@/utils/formatter.js'

dev_wms_client/src/layout/goods.vue

@@ -9,11 +9,11 @@
               <el-row>
                 <el-form-item label="料号">
                   <el-input v-model="searchQueryFormEntity.goodsId" @keyup.enter="search()"
-                                        clearable />
+                            clearable/>
                 </el-form-item>
                 <el-form-item label="描述">
                   <el-input v-model="searchQueryFormEntity.goodsDesc" @keyup.enter="search()"
-                                        clearable />
+                            clearable/>
                 </el-form-item>
               </el-row>
               <div style="align-content: center;">
@@ -21,6 +21,14 @@
                   <el-button type="primary" class="btn-search" @click="search()">查询</el-button>
                   <el-button type="warning" class="btn-search" @click="clearQuery()">清除输入</el-button>
                 </el-row>
+                <el-row>
+                  <el-button style="background-color: #00CED1;" class="btn-search"
+                             @click="openUploadDialog()">导入数据
+                  </el-button>
+                  <el-button type="success" class="btn-search"
+                             @click="exportExcel()">导出excel
+                  </el-button>
+                </el-row>
               </div>
             </div>
           </el-form>
@@ -36,129 +44,44 @@
               </template>
             </el-table-column>
             <el-table-column prop="goodsId" label="料号" fixed="left" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="goodsDescription" label="描述" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="plant" label="工厂" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="vendorName" label="供应商" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="isSled" label="SLED管理" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="sledDays" label="SLED天数" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="feedingType" label="补料类型" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="boxQty" label="每盒数量" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="maxBoxNum" label="最大盒数" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="putArea" label="存放区域" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
             <el-table-column prop="hotPoint" label="热点区域" min-width="120px" sortable="custom"
-                            show-overflow-tooltip />
+                             show-overflow-tooltip/>
-                        <el-table-column fixed="right" label="操作" width="170px">
-                            <template v-slot="scope">
-                                <div style="display: inline-block; align-content: center;">
-                                    <el-button type="primary"
-                                        @click="editCurrentRowFormEntity(scope.row)">编辑</el-button>
-                                    <el-button type="danger" @click="closeGoods(scope.row)">关闭</el-button>
-                                </div>
-                            </template>
-                        </el-table-column>
           </el-table>
-                    <br />
+          <br/>
           <el-pagination v-model:current-page="baseTableQuery.currentPage"
                          v-model:page-size="baseTableQuery.pageSize" :page-sizes="[10, 25, 50]" :small="false"
                          :disabled="false" :background="false" :default-page-size="10" @size-change="search"
                          @current-change="search" layout="total, sizes, prev, pager, next, jumper"
-                        :total="baseTableQuery.total" />
+                         :total="baseTableQuery.total"/>
         </div>
-                <el-dialog v-model="rowEditFlag" title="物料信息" width="60%" draggable :show-close="false">
+        <el-dialog v-model="showUploadDialog" title="上传物料信息" width="40%" draggable :show-close="true">
-                    <el-form ref="rowEditFormRef" :model="rowFormEntity" :label-position="labelPosition"
+          <fieldset class="search-area">
-                        label-width="100px" style="max-width: 100%" status-icon>
+            <legend>导入基础信息</legend>
-                        <el-row :gutter="16">
+            <UploadExcelBaseGoods></UploadExcelBaseGoods>
-                            <el-col :span="12" :offset="0">
+          </fieldset>
-                                <el-form-item label="料号">
+          <fieldset class="search-area">
-                                    <el-input v-model="rowFormEntity.goodsId" disabled />
+            <legend>导入看板信息</legend>
-                                </el-form-item>
+            <UploadExcelKanban></UploadExcelKanban>
-                            </el-col>
+          </fieldset>
-                            <el-col :span="12">
-                                <el-form-item label="描述">
-                                    <el-input v-model="rowFormEntity.goodsDescription" disabled />
-                                </el-form-item>
-                            </el-col>
-                        </el-row>
-                        <el-row :gutter="16">
-                            <el-col :span="12" :offset="0">
-                                <el-form-item label="工厂">
-                                    <el-input v-model="rowFormEntity.plant" disabled />
-                                </el-form-item>
-                            </el-col>
-                            <el-col :span="12">
-                                <el-form-item label="供应商">
-                                    <el-input v-model="rowFormEntity.vendorName" disabled />
-                                </el-form-item>
-                            </el-col>
-                        </el-row>
-                        <el-row :gutter="16">
-                            <el-col :span="12" :offset="0">
-                                <el-form-item label="SLED管理">
-                                    <el-input v-model="rowFormEntity.isSled" disabled />
-                                </el-form-item>
-                            </el-col>
-                            <el-col :span="12">
-                                <el-form-item label="SLED天数">
-                                    <el-input v-model="rowFormEntity.sledDays" disabled />
-                                </el-form-item>
-                            </el-col>
-                        </el-row>
-                        <el-row :gutter="16">
-                            <el-col :span="12" :offset="0">
-                                <el-form-item label="补料类型">
-                                    <el-input v-model="rowFormEntity.feedingType" disabled />
-                                </el-form-item>
-                            </el-col>
-                        </el-row>
-                        
-                        <!-- 可编辑字段 -->
-                        <el-divider>可编辑字段</el-divider>
-                        
-                        <el-row :gutter="16">
-                            <el-col :span="12" :offset="0">
-                                <el-form-item label="每盒数量">
-                                    <el-input-number v-model="rowFormEntity.boxQty" controls-position="right"
-                                        :min="0" clearable />
-                                </el-form-item>
-                            </el-col>
-                            <el-col :span="12">
-                                <el-form-item label="最大盒数">
-                                    <el-input-number v-model="rowFormEntity.maxBoxNum" controls-position="right"
-                                        :min="0" clearable />
-                                </el-form-item>
-                            </el-col>
-                        </el-row>
-                        <el-row :gutter="16">
-                            <el-col :span="12" :offset="0">
-                                <el-form-item label="存放区域">
-                                    <el-input v-model="rowFormEntity.putArea" clearable />
-                                </el-form-item>
-                            </el-col>
-                            <el-col :span="12">
-                                <el-form-item label="热点区域">
-                                    <el-input v-model="rowFormEntity.hotPoint" clearable />
-                                </el-form-item>
-                            </el-col>
-                        </el-row>
-                    </el-form>
-                    <template #footer>
-                        <span class="dialog-footer">
-                            <el-button type="primary" @click="rowEditFlag = false">取消</el-button>
-                            <el-button type="success" @click="submitUpdateRow(rowFormEntity)">
-                                确定
-                            </el-button>
-                        </span>
-                    </template>
         </el-dialog>
       </div>
     </el-container>
@@ -168,13 +91,15 @@
 <script setup>
 import store from '@/store'
 import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
-import { getGoodsInfoByPage, updateGoodsInfo, closeGoodsInfo } from '@/api/goods.js'
+import {getGoodsInfoByPage} from '@/api/goods.js'
-import { timeFormatter, wmsTaskTypeFormatter, wmsTaskStatusFormatter } from '@/utils/formatter.js'
+import {ref, reactive, onMounted, nextTick, onBeforeUnmount} from 'vue'
-import { ref, reactive, onMounted, nextTick, onBeforeUnmount } from 'vue'
+import {ElMessage} from 'element-plus'
-import { ElMessage, ElMessageBox } from 'element-plus'
+import {genTableRequest} from '@/utils/generator.js'
-import { genTableRequest } from '@/utils/generator.js'
+import {labelPosition} from '@/constant/form.js'
-import { labelPosition } from '@/constant/form.js'
+import UploadExcelBaseGoods from '@/excel/UploadExcelBaseGoods.vue'
-import { loading } from '@/utils/loading'
+import UploadExcelKanban from '@/excel/UploadExcelKanban.vue'
+import {exportGoodsExcel} from "@/api/excel";
+
 /**
  * 常量定义
  */
@@ -203,6 +128,7 @@ let rowEditFlag = ref(false)
 let goodsId = ''
 let rowEditFormRef = ref()
 let rowFormEntity = reactive({})
+let showUploadDialog = ref(false)
 /**
  * 系统方法
  */
@@ -232,7 +158,7 @@ const search = () => {
   request.goodsDesc = searchQueryFormEntity.goodsDesc.trim()
   getGoodsInfoByPage(request).then((res) => {
     const response = res.data
-        if (response.code == 0) {
+    if (response.code === 0) {
       const data = response.data
       if (data != null) {
         tableData.value = data.lists
@@ -258,83 +184,45 @@ const handleSortChange = (data) => {
   if (baseTableQuery.sortBy.has(data.prop)) {
     baseTableQuery.sortBy.delete(data.prop)
   }
-    baseTableQuery.sortBy.set(data.prop, data.order == 'ascending')
+  baseTableQuery.sortBy.set(data.prop, data.order.toLowerCase() === 'ascending')
   search()
 }
+const openUploadDialog = () => {
+  showUploadDialog.value = true
+}
 const getCurrentRow = (row) => {
   goodsId = row.goodsId
 }
-const timeFormat = (row, column, cellValue, index) => {
+const exportExcel = () => {
-    return timeFormatter(cellValue)
+  const params = {
-}
+    goodsId: searchQueryFormEntity.goodsId,
-const taskTypeFormat = (row, column, cellValue, index) => {
+    goodsDesc: searchQueryFormEntity.goodsDesc,
-    return wmsTaskTypeFormatter(cellValue)
-}
-const taskStatusFormat = (row, column, cellValue, index) => {
-    return wmsTaskStatusFormatter(cellValue)
-}
-// 编辑弹框
-const editCurrentRowFormEntity = (row) => {
-    // 设置form值，复制所有字段
-    Object.assign(rowFormEntity, row)
-    // 弹出框
-    rowEditFlag.value = true
-}
-// 关闭物料
-const closeGoods = (row) => {
-    ElMessageBox.confirm(`确定要关闭物料(${row.goodsId})吗?`, '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-    }).then(() => {
-        const request = {
-            goodsId: row.goodsId,
-            standId: STAND_ID,
-            userName: USER_NAME
-        };
-        loading.open('关闭中...');
-        closeGoodsInfo(request).then(res => {
-            const response = res.data;
-            if (response.code == 0) {
-                ElMessage.success(response.message);
-                search();
-            } else {
-                ElMessage.error(response.message);
-            }
-        }).catch(err => {
-            ElMessage.error('请求异常。');
-        }).finally(() => {
-            loading.close();
-        });
-    }).catch(err => {
-        ElMessage.info('已取消关闭操作');
-    });
-}
-// 更新当前行数据
-const submitUpdateRow = (rowFormEntity) => {
-    const request = {
-        goodsId: rowFormEntity.goodsId,
-        boxQty: rowFormEntity.boxQty,
-        maxBoxNum: rowFormEntity.maxBoxNum,
-        putArea: rowFormEntity.putArea,
-        hotPoint: rowFormEntity.hotPoint,
-        standId: STAND_ID,
     userName: USER_NAME
   }
-    loading.open('更新中...')
+  exportGoodsExcel(params).then(res => {
-    updateGoodsInfo(request).then(res => {
+    const link = document.createElement('a');//创建a标签
-        if (res.data.code == 0) {
+    try {
-            ElMessage.success('更新数据成功。')
+      // let blob = new Blob([res.data],{type: 'application/vnd.ms-excel'});    //如果后台返回的不是blob对象类型，先定义成blob对象格式，该type导出为xls格式，
-            rowEditFlag.value = false
+      let blob = res.data    //如果后台返回的直接是blob对象类型，直接获取数据
-            search()
+      // let _fileName = res.headers['content-disposition'].split(';')[1].split('=')[1]; //拆解获取文件名，如果后端有给返回文件名的话
-        } else {
+      let _fileName = '物料基础信息' + dateFormatter(new Date) + '.xlsx'
-            ElMessage.error('更新数据失败。')
+      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)
+      ElMessage.error('下载文件失败')
     }
   }).catch(err => {
     console.log(err)
-        ElMessage.error('更新数据异常。')
+    ElMessage.error('导出失败')
-    }).finally(() => {
-        loading.close()
   })
 }
 </script>