|
@@ -1,16 +1,49 @@
|
|
|
<template>
|
|
|
- <a-modal
|
|
|
- centered
|
|
|
- class="outStock-modal"
|
|
|
- :footer="null"
|
|
|
- :maskClosable="false"
|
|
|
- title="上次采购缺货产品明细"
|
|
|
- v-model="isShow"
|
|
|
- @cancel="isShow=false"
|
|
|
- :width="800">
|
|
|
+ <a-drawer
|
|
|
+ :zIndex="zIndex"
|
|
|
+ :title="title"
|
|
|
+ placement="right"
|
|
|
+ :visible="isShow"
|
|
|
+ :width="width"
|
|
|
+ :get-container="false"
|
|
|
+ :wrap-style="{ position: 'absolute' }"
|
|
|
+ @close="onCancel"
|
|
|
+ wrapClassName="outStock-modal"
|
|
|
+ >
|
|
|
<a-spin :spinning="spinning" tip="Loading...">
|
|
|
<div class="outStock-con">
|
|
|
<div>
|
|
|
+ <div ref="tableSearch" class="table-page-search-wrapper">
|
|
|
+ <a-form layout="inline" @keyup.enter.native="searchForm">
|
|
|
+ <a-row :gutter="15">
|
|
|
+ <a-col :md="8" :sm="24">
|
|
|
+ <a-form-item label="产品编码">
|
|
|
+ <a-input id="productInfoList-code" v-model.trim="queryParam.code" allowClear placeholder="请输入产品编码"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :md="8" :sm="24">
|
|
|
+ <a-form-item label="产品名称">
|
|
|
+ <a-input id="productInfoList-name" v-model.trim="queryParam.name" allowClear placeholder="请输入产品名称"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :md="8" :sm="24">
|
|
|
+ <a-form-item label="产品分类">
|
|
|
+ <ProductType id="productInfoList-productType" placeholder="请选择产品分类" :isDealer="true" @change="changeProductType" v-model="productType"></ProductType>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :md="8" :sm="24">
|
|
|
+ <a-form-item label="产品品牌">
|
|
|
+ <ProductBrand id="productInfoList-productBrandSn" placeholder="请选择产品品牌" v-model="queryParam.productBrandSn"></ProductBrand>
|
|
|
+ </a-select>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :md="8" :sm="24" style="margin-bottom: 10px;">
|
|
|
+ <a-button type="primary" @click="searchForm" :disabled="disabled" id="productInfoList-refresh">查询</a-button>
|
|
|
+ <a-button style="margin-left: 5px" @click="resetSearchForm" :disabled="disabled" id="productInfoList-reset">重置</a-button>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-form>
|
|
|
+ </div>
|
|
|
<p style="font-weight: bold;">当前已选:{{ rowSelectionInfo&&rowSelectionInfo.selectedRowKeys.length }}个</p>
|
|
|
<!-- 列表 -->
|
|
|
<s-table
|
|
@@ -35,7 +68,7 @@
|
|
|
size="large"
|
|
|
class="button-primary"
|
|
|
@click="handleSave"
|
|
|
- style="padding: 0 36px;">加入本次采购</a-button>
|
|
|
+ style="padding: 0 36px;">批量添加</a-button>
|
|
|
<a-button
|
|
|
id="outStock-cancel"
|
|
|
size="large"
|
|
@@ -44,17 +77,20 @@
|
|
|
style="padding: 0 60px;margin-left: 15px;">取消</a-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ </div>
|
|
|
</a-spin>
|
|
|
- </a-modal>
|
|
|
+ </a-drawer>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { commonMixin } from '@/utils/mixin'
|
|
|
import { STable } from '@/components'
|
|
|
import { purchaseDetailCancelList, purchaseDetailCancelSave } from '@/api/purchaseDetail'
|
|
|
+import ProductType from '../../common/productType.js'
|
|
|
+import ProductBrand from '../../common/productBrand.js'
|
|
|
export default {
|
|
|
name: 'OutStockModal',
|
|
|
- components: { STable },
|
|
|
+ components: { STable, ProductType, ProductBrand },
|
|
|
mixins: [commonMixin],
|
|
|
props: {
|
|
|
openModal: { // 弹框显示状态
|
|
@@ -72,6 +108,14 @@ export default {
|
|
|
default: () => {
|
|
|
return {}
|
|
|
}
|
|
|
+ },
|
|
|
+ width: {
|
|
|
+ type: [String, Number],
|
|
|
+ default: '70%'
|
|
|
+ },
|
|
|
+ zIndex: {
|
|
|
+ type: Number,
|
|
|
+ default: 1050
|
|
|
}
|
|
|
},
|
|
|
data () {
|
|
@@ -89,6 +133,7 @@ export default {
|
|
|
{ title: '上次缺货数量', dataIndex: 'cancelQty', width: '18%', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
|
|
|
{ title: '单位', dataIndex: 'dealerProductEntity.unit', width: '8%', align: 'center', customRender: function (text) { return text || '--' } }
|
|
|
],
|
|
|
+ title: '上次采购缺货产品明细(采购单号:' + 'XS22456789' + ')',
|
|
|
// 加载数据方法 必须为 Promise 对象
|
|
|
loadData: parameter => {
|
|
|
this.disabled = true
|
|
@@ -104,10 +149,25 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
spinning: false,
|
|
|
- rowSelectionInfo: null
|
|
|
+ rowSelectionInfo: null,
|
|
|
+ productType: [],
|
|
|
+ queryParam: { // 查询条件
|
|
|
+ code: '', // 产品编码
|
|
|
+ name: '', // 产品名称
|
|
|
+ productBrandSn: undefined, // 产品品牌
|
|
|
+ productTypeSn1: '', // 产品一级分类
|
|
|
+ productTypeSn2: '', // 产品二级分类
|
|
|
+ productTypeSn3: '' // 产品三级分类
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ // 产品分类 change
|
|
|
+ changeProductType (val, opt) {
|
|
|
+ this.queryParam.productTypeSn1 = val[0] ? val[0] : ''
|
|
|
+ this.queryParam.productTypeSn2 = val[1] ? val[1] : ''
|
|
|
+ this.queryParam.productTypeSn3 = val[2] ? val[2] : ''
|
|
|
+ },
|
|
|
// 表格选中项
|
|
|
rowSelectionFun (obj) {
|
|
|
this.rowSelectionInfo = obj || null
|
|
@@ -180,6 +240,25 @@ export default {
|
|
|
_this.$refs.table.clearSelected() // 清空表格选中项
|
|
|
}
|
|
|
})
|
|
|
+ },
|
|
|
+ onCancel () {
|
|
|
+ this.$emit('close')
|
|
|
+ this.$refs.table.clearSelected() // 清空表格选中项
|
|
|
+ },
|
|
|
+ searchForm () {
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
+ },
|
|
|
+ resetSearchForm () {
|
|
|
+ this.queryParam = {
|
|
|
+ productBrandSn: undefined,
|
|
|
+ code: '', // 产品编码
|
|
|
+ name: '', // 产品名称
|
|
|
+ productTypeSn1: '', // 产品一级分类
|
|
|
+ productTypeSn2: '', // 产品二级分类
|
|
|
+ productTypeSn3: '' // 产品三级分类
|
|
|
+ }
|
|
|
+ this.productType = []
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
@@ -190,8 +269,7 @@ export default {
|
|
|
// 重定义的弹框状态
|
|
|
isShow (newValue, oldValue) {
|
|
|
if (!newValue) {
|
|
|
- this.$emit('close')
|
|
|
- this.$refs.table.clearSelected() // 清空表格选中项
|
|
|
+ this.onCancel()
|
|
|
}
|
|
|
}
|
|
|
}
|