feat(outOfStock): 发货清单添加非在售商品筛选

src/api/product.js

@@ -769,3 +769,11 @@ export function resetInventoryUse(data) {
     data
   })
 }
+
+export function getOutOfStockProduct(params) {
+  return request({
+    url: 'sale/manage/wares/list-no-sale',
+    method: 'get',
+    params
+  })
+}

src/components/Delivery/unhandeled.vue

@@ -41,6 +41,13 @@
             @click="orderDk"
           >订单抵扣</el-button>
         </div>
+        <el-alert
+          style="width: fit-content"
+          :closable="false"
+          title="默认显示【在售】商品订单，如需查询【预售】【缺货】商品，请使用【非在售商品】条件进行筛选"
+          type="info"
+          show-icon
+        />
       </div>
       <el-table
         :data="tableData"
@@ -184,11 +191,6 @@
           prop="preSaleStatusVal"
           :label="'预售状态'"
         />
-        <el-table-column
-          align="center"
-          prop="originalOrderCode"
-          :label="'原单号'"
-        />
         <el-table-column
           min-width="100px"
           align="center"

src/views/logistics/delivery/components/OutOfStockProductList.vue

@@ -0,0 +1,243 @@
+<template>
+  <el-dialog
+    title="选择非在售商品"
+    :visible.sync="dialogVisible"
+    :close-on-click-modal="false"
+    width="1000px"
+    top="50px"
+    center
+    class="out-of-stock-dialog"
+    :before-close="handleClose"
+  >
+    <div class="cpHeight">
+      <el-form ref="form" :model="queryParams" label-width="90px">
+        <el-row :gutter="20">
+          <el-col :span="8">
+            <el-form-item label="商品编号" prop="waresCode">
+              <el-input v-model="form.waresCode" clearable />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="商品名称" prop="waresName">
+              <el-input v-model="form.waresName" clearable />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="商品状态" prop="preSaleStatus">
+              <el-select
+                v-model="form.preSaleStatus"
+                clearable
+              >
+                <el-option
+                  v-for="item in presaleList"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="2">
+            <el-button type="primary" @click="getDataList">搜索</el-button>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div style="margin-bottom: 10px">
+        <el-tag v-for="item in selection" :key="item.pkId" effect="plain" size="small" closable class="tag-item" type="info" @close="removeSelectedHandle(item)">
+          {{ item.waresName }} ({{ item.waresCode }})
+        </el-tag>
+      </div>
+      <el-table
+        ref="tableRef"
+        :data="dialogList"
+        style="width: 100%"
+        row-key="pkId"
+        :header-cell-style="{ background: '#EEEEEE' }"
+        :row-class-name="tableRowClassName"
+        @selection-change="selectionChangeHandle"
+      >
+        <el-table-column
+          type="selection"
+          :reserve-selection="true"
+          width="55"
+        />
+        <el-table-column align="center" prop="cover1" :label="'产品主图'">
+          <template slot-scope="scope">
+            <img style="width: 40px; height: 40px" :src="scope.row.cover1" alt="">
+          </template>
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="waresName"
+          label="商品名称"
+        />
+        <el-table-column
+          align="center"
+          prop="waresCode"
+          label="商品编号"
+        />
+        <el-table-column
+          align="center"
+          prop="specialAreaVal"
+          label="所属专区"
+        />
+        <el-table-column
+          align="center"
+          prop="preSaleStatusVal"
+          label="预售状态"
+        />
+      </el-table>
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getDataList"
+      />
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="handleClose">{{ '取消' }}</el-button>
+      <el-button type="primary" @click="onSubmit('form')">{{
+        '确认'
+      }}</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import * as api from '@/api/product.js'
+export default {
+  name: 'OutOfStockProductList',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    selected: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      dialogList: [],
+      presaleList: [],
+      total: 0,
+      selection: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10
+      },
+      form: {
+        productName: '',
+        productCode: '',
+        preSaleStatus: ''
+      }
+    }
+  },
+  computed: {
+    dialogVisible: {
+      get() {
+        return this.visible
+      },
+      set(val) {
+        this.$emit('update:visible', val)
+      }
+    }
+  },
+  created() {
+    this.selection = [...this.selected]
+    this.getPreSaleStatus()
+  },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    getPreSaleStatus() {
+      api.presale_status().then((res) => {
+        this.presaleList = res.data
+      })
+    },
+    removeSelectedHandle(product) {
+      const tempIdx = this.selection.findIndex((item) => item.pkId === product.pkId)
+      if (~tempIdx) {
+        this.$refs.tableRef.toggleRowSelection(this.selection[tempIdx], false)
+        this.selection.splice(tempIdx, 1)
+      }
+    },
+    getList() {
+      api.getOutOfStockProduct(this.queryParams).then(
+        (res) => {
+          res.rows.forEach((item) => {
+            item.quantity = 1
+            item.isGift = 0
+          })
+          this.dialogList = res.rows
+          this.total = res.total
+          this.updateTableSelection()
+        }
+      )
+    },
+    updateTableSelection() {
+      this.$nextTick(() => {
+        if (this.selection.length) {
+          this.selection.forEach((item) => {
+            const row = this.dialogList.find((row) => row.pkId === item.pkId)
+            if (row) {
+              this.$refs.tableRef.toggleRowSelection(row, true)
+              this.$refs.tableRef.doLayout()
+            }
+          })
+        }
+      })
+    },
+    handleClose() {
+      this.dialogVisible = false
+    },
+    getDataList() {
+      this.queryParams.pageNum = 1
+      api.getOutOfStockProduct({
+        ...this.queryParams,
+        ...this.form
+      }).then((res) => {
+        res.rows.forEach((item) => {
+          item.quantity = 1
+          item.isGift = 0
+        })
+
+        this.dialogList = res.rows
+        this.total = res.total
+        this.updateTableSelection()
+      })
+    },
+    selectionChangeHandle(rows) {
+      this.selection = rows
+    },
+    tableRowClassName({ row, rowIndex }) {
+      if (rowIndex % 2 == 1) {
+        return 'warning-row'
+      } else if (rowIndex % 2 == 0) {
+        return 'success-row'
+      }
+      return ''
+    },
+    onSubmit() {
+      this.$emit('submit', this.selection)
+      this.dialogVisible = false
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.cpHeight {
+  height: 500px;
+  overflow-y: auto;
+}
+.out-of-stock-dialog {
+  ::v-deep .el-dialog__body {
+    padding-bottom: 0 !important;
+  }
+}
+
+</style>

src/views/logistics/delivery/index.vue

@@ -6,7 +6,7 @@
       :moren="moren"
     />
     <div class="thetopbox">
-      <el-form ref="form" :model="queryParams" label-width="80px">
+      <el-form ref="form" :model="queryParams" label-width="90px">
         <template v-if="activeName == 0">
           <el-row :gutter="20">
             <el-col :span="4">
@@ -64,22 +64,6 @@
             </el-col>
           </el-row>
           <el-row :gutter="20">
-            <el-col :span="4">
-              <el-form-item :label="'预售状态'" prop="preSaleStatus">
-                <el-select
-                  v-model="queryParams.preSaleStatus"
-                  clearable
-                  :placeholder="'请选择'"
-                >
-                  <el-option
-                    v-for="(item, index) in presaleStatusList"
-                    :key="index"
-                    :label="item.label"
-                    :value="item.value"
-                  />
-                </el-select>
-              </el-form-item>
-            </el-col>
             <el-col :span="4">
               <el-form-item :label="'发货方式'" prop="deliveryWay">
                 <el-select
@@ -237,13 +221,8 @@
                     <el-input v-model="queryParams.recPhone" />
                   </el-form-item>
                 </el-col>
-                <el-col :span="4">
-                  <el-form-item :label="'原单号'" prop="code">
-                    <el-input
-                      v-model="queryParams.originalOrderCode"
-                    /> </el-form-item></el-col>
                 <el-col :span="8">
-                  <el-form-item :label="$t('选择产品')" prop="productIdList">
+                  <el-form-item label="非在售商品" prop="productIdList">
                     <el-input
                       v-model="productLists"
                       clearable
@@ -1049,7 +1028,7 @@
             <div class="searchbox" style="margin-left: 20px">
               <el-button class="searchbtn" @click="getSearch(1)">
                 {{ '搜索' }}</el-button>
-              <el-button @click="reChongzhi"> {{ '重置' }}</el-button>
+              <el-button @click="resetHandle"> {{ '重置' }}</el-button>
             </div>
           </el-col>
           <div class="openClose" @click="changeActive">
@@ -1076,74 +1055,14 @@
         <el-tab-pane v-if="menu3" name="2" :label="'立即发货'">
           <nowdelivery ref="nowdelivery" :params="queryParams" />
         </el-tab-pane>
-
       </el-tabs>
     </div>
-    <el-dialog
-      :title="'添加'"
+    <OutOfStockProductList
+      v-if="dialogVisible"
       :visible.sync="dialogVisible"
-      :close-on-click-modal="false"
-      width="45%"
-      center
-      :before-close="handleClose"
-    >
-      <div class="cpHeight">
-        <el-input
-          v-model="select.productName"
-          :placeholder="'请输入'"
-          prefix-icon="el-icon-search"
-          @keyup.enter.native="getDataList"
+      :selected="selectedProductList"
+      @submit="handleSubmit"
     />
-        <div style="height: 10px" />
-        <el-table
-          ref="lessonTableRef"
-          :data="dialogList"
-          style="width: 100%"
-          :row-key="
-            (row) => {
-              return row.pkProduct;
-            }
-          "
-          :header-cell-style="{ background: '#EEEEEE' }"
-          :row-class-name="tableRowClassName"
-          @selection-change="dialogChange"
-        >
-          <el-table-column
-            type="selection"
-            :reserve-selection="true"
-            width="55"
-          />
-          <el-table-column align="center" prop="cover" :label="'产品主图'">
-            <template slot-scope="scope">
-              <img class="bgImg" :src="scope.row.cover" alt="">
-            </template>
-          </el-table-column>
-          <el-table-column
-            align="center"
-            prop="productName"
-            :label="'产品名称'"
-          />
-          <el-table-column
-            align="center"
-            prop="productCode"
-            :label="'产品编号'"
-          />
-        </el-table>
-        <pagination
-          v-show="total > 0"
-          :total="total"
-          :page.sync="queryParams.pageNum"
-          :limit.sync="queryParams.pageSize"
-          @pagination="getDataList"
-        />
-      </div>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="handleClose">{{ '取消' }}</el-button>
-        <el-button type="primary" @click="onSubmit('form')">{{
-          '确认'
-        }}</el-button>
-      </span>
-    </el-dialog>
   </div>
 </template>
 
@@ -1156,14 +1075,15 @@ import yihandeled from '@/components/Delivery/yihandeled.vue'
 import nowdelivery from '@/components/Delivery/nowdelivery.vue'
 import * as del from '@/api/delivery.js'
 import { getRouters } from '@/api/settle'
-import { productList } from '@/api/product'
+import OutOfStockProductList from './components/OutOfStockProductList.vue'
 export default {
   name: 'Fhqd',
   components: {
     topBar,
     unhandeled,
     yihandeled,
-    nowdelivery
+    nowdelivery,
+    OutOfStockProductList
   },
   data() {
     return {
@@ -1175,10 +1095,8 @@ export default {
         }
       ],
       dialogVisible: false,
-      dialogList: [],
-      lsArr: [],
-      tableData: [],
-      productLists: [],
+
+      productLists: '',
       select: {},
       orderTypeList: [], // 订单类型
       orderStatusList: [], // 订单状态
@@ -1196,6 +1114,7 @@ export default {
       yesornoList: [], // 二次发货
       storehouseList: [], // 发货仓库
       total: '',
+      selectedProductList: [],
       queryParams: {
         pageNum: 1,
         pageSize: 500,
@@ -1255,84 +1174,15 @@ export default {
   },
   methods: {
     clearProduct() {
-      this.tableData = []
-      this.lsArr = []
+      this.selectedProductList = []
       this.queryParams.productIdList = []
-      this.productLists = []
+      this.productLists = ''
     },
     openDig() {
-      this.select = {}
-      productList(Object.assign({ isPutOn: 0 }, this.queryParams)).then(
-        (res) => {
-          res.rows.forEach((item) => {
-            item.quantity = 1
-            item.pkProduct = item.pkProduct
-            item.isGift = 0
-          })
-          this.dialogList = res.rows
-          this.total = res.total
-        }
-      )
       this.dialogVisible = true
+      this.select = {}
     },
-    handleClose() {
-      this.dialogVisible = false
-    },
-    getDataList() {
-      productList(
-        Object.assign({ isPutOn: 0 }, this.queryParams, this.select)
-      ).then((res) => {
-        res.rows.forEach((item) => {
-          item.quantity = 1
-          item.pkProduct = item.pkProduct
-          item.isGift = 0
-        })
-        this.dialogList = res.rows
-        this.total = res.total
-      })
-    },
-    dialogChange(val) {
-      this.lsArr = val
-    },
-    onSubmit() {
-      // this.tableData = []
-      this.lsArr.forEach((item) => {
-        this.tableData.push(item)
-      })
-      // this.tableData = this.clearArr(this.tableData)
-      this.dialogVisible = false
-      this.dialogList.forEach((row) => {
-        this.$refs.lessonTableRef.toggleRowSelection(row, false)
-      })
-      // 判断重复
-      const arr = this.tableData
-      let isTrue = false
-      for (var i = 0; i < arr.length; i++) {
-        // 首次遍历数组
-        for (var j = i + 1; j < arr.length; j++) {
-          // 再次遍历数组
-          if (arr[i].productCode == arr[j].productCode) {
-            if (arr[i].isGift == arr[j].isGift) {
-              isTrue = true
-            }
-          }
-        }
-      }
-      if (isTrue) {
-        this.$message.error('请勿选择重复的商品')
-        this.tableData = []
-        this.lsArr = []
-        this.queryParams.productIdList = []
-        this.productLists = []
-        return
-      }
-      this.queryParams.productIdList = []
-      this.productLists = []
-      this.tableData.forEach((item) => {
-        this.queryParams.productIdList.push(item.pkId)
-        this.productLists.push(item.productName)
-      })
-    },
+
     tableRowClassName({ row, rowIndex }) {
       if (rowIndex % 2 == 1) {
         return 'warning-row'
@@ -1477,7 +1327,8 @@ export default {
       })
     },
     // 重置
-    reChongzhi() {
+    resetHandle() {
+      this.selectedProductList = []
       this.queryParams = {
         pageNum: 1,
         pageSize: 500,
@@ -1488,6 +1339,11 @@ export default {
     // 展开折叠
     changeActive() {
       this.isActive = !this.isActive
+    },
+    handleSubmit(products) {
+      this.selectedProductList = [...products]
+      this.queryParams.productIdList = products.map((item) => item.pkId).join(',')
+      this.productLists = products.map((item) => item.waresName).join(',')
     }
   }
 }