|
@@ -1,53 +1,53 @@
|
|
<template>
|
|
<template>
|
|
- <a-modal
|
|
|
|
- centered
|
|
|
|
- class="chooseShelf-modal"
|
|
|
|
- :footer="null"
|
|
|
|
- :maskClosable="false"
|
|
|
|
|
|
+ <a-drawer
|
|
|
|
+ :zIndex="zIndex"
|
|
:title="mtitle"
|
|
:title="mtitle"
|
|
- v-model="isShow"
|
|
|
|
- @cancel="isShow = false"
|
|
|
|
- width="80%">
|
|
|
|
|
|
+ placement="right"
|
|
|
|
+ :visible="isShow"
|
|
|
|
+ :width="width"
|
|
|
|
+ :get-container="false"
|
|
|
|
+ :wrap-style="{ position: 'absolute' }"
|
|
|
|
+ @close="isShow = false"
|
|
|
|
+ wrapClassName="chooseShelf-modal jg-drawer-wrap"
|
|
|
|
+ >
|
|
<a-spin :spinning="spinning" tip="Loading...">
|
|
<a-spin :spinning="spinning" tip="Loading...">
|
|
<a-tabs type="card">
|
|
<a-tabs type="card">
|
|
<a-tab-pane :defaultActiveKey="curTab" v-model="curTab" :key="1" tab="待补货产品">
|
|
<a-tab-pane :defaultActiveKey="curTab" v-model="curTab" :key="1" tab="待补货产品">
|
|
<!-- 搜索条件 -->
|
|
<!-- 搜索条件 -->
|
|
- <div class="table-page-search-wrapper">
|
|
|
|
|
|
+ <div ref="searchBox" class="table-page-search-wrapper">
|
|
<a-form-model
|
|
<a-form-model
|
|
ref="ruleForm"
|
|
ref="ruleForm"
|
|
class="form-model-con"
|
|
class="form-model-con"
|
|
layout="inline"
|
|
layout="inline"
|
|
:model="queryParam"
|
|
:model="queryParam"
|
|
@keyup.enter.native="$refs.table.refresh(true)" >
|
|
@keyup.enter.native="$refs.table.refresh(true)" >
|
|
- <a-row :gutter="15">
|
|
|
|
- <a-col :md="4" :sm="24">
|
|
|
|
|
|
+ <a-row type="flex" :gutter="5">
|
|
|
|
+ <a-col flex="250px">
|
|
<a-form-model-item label="产品编码">
|
|
<a-form-model-item label="产品编码">
|
|
<a-input id="chooseShelf-code" ref="searchProductCode" v-model.trim="queryParam.productCode" allowClear placeholder="请输入产品编码"/>
|
|
<a-input id="chooseShelf-code" ref="searchProductCode" v-model.trim="queryParam.productCode" allowClear placeholder="请输入产品编码"/>
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
- <a-col :md="4" :sm="24">
|
|
|
|
|
|
+ <a-col flex="250px">
|
|
<a-form-model-item label="产品名称">
|
|
<a-form-model-item label="产品名称">
|
|
<a-input id="chooseShelf-name" v-model.trim="queryParam.productName" allowClear placeholder="请输入产品名称"/>
|
|
<a-input id="chooseShelf-name" v-model.trim="queryParam.productName" allowClear placeholder="请输入产品名称"/>
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
- <a-col :md="6" :sm="24">
|
|
|
|
|
|
+ <a-col flex="250px">
|
|
<a-form-model-item label="产品分类">
|
|
<a-form-model-item label="产品分类">
|
|
<ProductType id="chooseShelf-productType" :isDealer="true" @change="changeProductType" v-model="productType"></ProductType>
|
|
<ProductType id="chooseShelf-productType" :isDealer="true" @change="changeProductType" v-model="productType"></ProductType>
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
- <a-col :md="6" :sm="24">
|
|
|
|
|
|
+ <a-col flex="370px">
|
|
<a-form-model-item label="库存情况">
|
|
<a-form-model-item label="库存情况">
|
|
- <a-checkbox-group v-model.trim="queryParam.stockStateList" :options="options" />
|
|
|
|
|
|
+ <a-select v-model.trim="queryParam.stockStateList" mode="multiple" :options="options" placeholder="请选择库存情况" />
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
- <a-col :md="4" :sm="12" style="margin-bottom: 10px;">
|
|
|
|
|
|
+ <a-col flex="auto" style="margin-bottom: 10px;">
|
|
<a-button type="primary" @click="$refs.table.refresh(true)" id="chooseShelf-refresh">查询</a-button>
|
|
<a-button type="primary" @click="$refs.table.refresh(true)" id="chooseShelf-refresh">查询</a-button>
|
|
<a-button style="margin-left: 5px" @click="resetSearchForm" id="chooseShelf-reset">重置</a-button>
|
|
<a-button style="margin-left: 5px" @click="resetSearchForm" id="chooseShelf-reset">重置</a-button>
|
|
</a-col>
|
|
</a-col>
|
|
</a-row>
|
|
</a-row>
|
|
</a-form-model>
|
|
</a-form-model>
|
|
- </div>
|
|
|
|
- <div class="chooseShelf-modal-table">
|
|
|
|
<div class="table-operator">
|
|
<div class="table-operator">
|
|
<div>
|
|
<div>
|
|
<a-button type="primary" @click="handlePlAdd">批量添加</a-button>
|
|
<a-button type="primary" @click="handlePlAdd">批量添加</a-button>
|
|
@@ -58,6 +58,8 @@
|
|
此界面仅显示货架上需要补货的产品
|
|
此界面仅显示货架上需要补货的产品
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="chooseShelf-modal-table">
|
|
<!-- 列表 -->
|
|
<!-- 列表 -->
|
|
<s-table
|
|
<s-table
|
|
class="sTable"
|
|
class="sTable"
|
|
@@ -68,8 +70,7 @@
|
|
@rowSelection="rowSelectionFun"
|
|
@rowSelection="rowSelectionFun"
|
|
:columns="columns"
|
|
:columns="columns"
|
|
:data="loadData"
|
|
:data="loadData"
|
|
- :style="{ height: '500px' }"
|
|
|
|
- :scroll="{ y: 450 }"
|
|
|
|
|
|
+ :scroll="{ y: tableHeight }"
|
|
:showPagination="false"
|
|
:showPagination="false"
|
|
bordered>
|
|
bordered>
|
|
<!-- 售价 -->
|
|
<!-- 售价 -->
|
|
@@ -123,7 +124,7 @@
|
|
</a-tab-pane>
|
|
</a-tab-pane>
|
|
<a-tab-pane :key="2" tab="全部货架产品">
|
|
<a-tab-pane :key="2" tab="全部货架产品">
|
|
<!-- 搜索条件 -->
|
|
<!-- 搜索条件 -->
|
|
- <div class="table-page-search-wrapper">
|
|
|
|
|
|
+ <div ref="searchBox1" class="table-page-search-wrapper">
|
|
<a-form-model
|
|
<a-form-model
|
|
ref="ruleForm1"
|
|
ref="ruleForm1"
|
|
class="form-model-con"
|
|
class="form-model-con"
|
|
@@ -162,8 +163,7 @@
|
|
:rowKey="(record) => record.id"
|
|
:rowKey="(record) => record.id"
|
|
:columns="columns1"
|
|
:columns="columns1"
|
|
:data="loadData1"
|
|
:data="loadData1"
|
|
- :style="{ height: '500px' }"
|
|
|
|
- :scroll="{ y: 450 }"
|
|
|
|
|
|
+ :scroll="{ y: tableHeight }"
|
|
:showPagination="false"
|
|
:showPagination="false"
|
|
bordered>
|
|
bordered>
|
|
</s-table>
|
|
</s-table>
|
|
@@ -173,7 +173,7 @@
|
|
</a-spin>
|
|
</a-spin>
|
|
<!-- 销售记录 -->
|
|
<!-- 销售记录 -->
|
|
<product-salesRecord-modal ref="salseRecord" :openModal="showRecord" @close="showRecord=false" />
|
|
<product-salesRecord-modal ref="salseRecord" :openModal="showRecord" @close="showRecord=false" />
|
|
- </a-modal>
|
|
|
|
|
|
+ </a-drawer>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
@@ -197,7 +197,15 @@ export default {
|
|
default: function () {
|
|
default: function () {
|
|
return null
|
|
return null
|
|
}
|
|
}
|
|
- }
|
|
|
|
|
|
+ },
|
|
|
|
+ width: {
|
|
|
|
+ type: [String, Number],
|
|
|
|
+ default: '80%'
|
|
|
|
+ },
|
|
|
|
+ zIndex: {
|
|
|
|
+ type: Number,
|
|
|
|
+ default: 100
|
|
|
|
+ },
|
|
},
|
|
},
|
|
data () {
|
|
data () {
|
|
return {
|
|
return {
|
|
@@ -211,6 +219,7 @@ export default {
|
|
{ label: '全部缺货', value: 'allStockout' }
|
|
{ label: '全部缺货', value: 'allStockout' }
|
|
],
|
|
],
|
|
curTab: 1,
|
|
curTab: 1,
|
|
|
|
+ tableHeight:0,
|
|
productType: [],
|
|
productType: [],
|
|
queryParam: {
|
|
queryParam: {
|
|
productCode: '', // 产品编码
|
|
productCode: '', // 产品编码
|
|
@@ -271,6 +280,7 @@ export default {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
this.spinning = false
|
|
this.spinning = false
|
|
|
|
+ this.setTableH()
|
|
return data
|
|
return data
|
|
})
|
|
})
|
|
}
|
|
}
|
|
@@ -391,9 +401,19 @@ export default {
|
|
this.productType1 = []
|
|
this.productType1 = []
|
|
this.$refs.ruleForm1.resetFields()
|
|
this.$refs.ruleForm1.resetFields()
|
|
this.$refs.table1.refresh(true)
|
|
this.$refs.table1.refresh(true)
|
|
|
|
+ },
|
|
|
|
+ setTableH () {
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
+ const searchBoxH = this.$refs.searchBox.offsetHeight
|
|
|
|
+ const searchBoxH1 = this.$refs.searchBox1.offsetHeight
|
|
|
|
+ this.tableHeight = window.innerHeight - (this.curTab == 1 ? searchBoxH : searchBoxH1) - 215
|
|
|
|
+ })
|
|
}
|
|
}
|
|
},
|
|
},
|
|
watch: {
|
|
watch: {
|
|
|
|
+ '$store.state.app.winHeight' (newValue, oldValue) { // 窗口变更时,需同时更改表格高度
|
|
|
|
+ this.setTableH()
|
|
|
|
+ },
|
|
// 父页面传过来的弹框状态
|
|
// 父页面传过来的弹框状态
|
|
openModal (newValue, oldValue) {
|
|
openModal (newValue, oldValue) {
|
|
this.isShow = newValue
|
|
this.isShow = newValue
|
|
@@ -405,6 +425,7 @@ export default {
|
|
} else {
|
|
} else {
|
|
this.$nextTick(() => {
|
|
this.$nextTick(() => {
|
|
this.curTab = 1
|
|
this.curTab = 1
|
|
|
|
+ this.setTableH()
|
|
})
|
|
})
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -414,16 +435,16 @@ export default {
|
|
|
|
|
|
<style lang="less">
|
|
<style lang="less">
|
|
.chooseShelf-modal {
|
|
.chooseShelf-modal {
|
|
- .ant-modal-body {
|
|
|
|
- padding: 0;
|
|
|
|
- .chooseShelf-modal-table{
|
|
|
|
- padding: 0 20px 10px;
|
|
|
|
- .table-operator{
|
|
|
|
|
|
+ .ant-drawer-body {
|
|
|
|
+ padding: 5px;
|
|
|
|
+ .table-operator{
|
|
padding:0 10px 10px 0;
|
|
padding:0 10px 10px 0;
|
|
display:flex;
|
|
display:flex;
|
|
justify-content: space-between;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
+ .chooseShelf-modal-table{
|
|
|
|
+ padding: 0 20px 10px;
|
|
}
|
|
}
|
|
.table-page-search-wrapper{
|
|
.table-page-search-wrapper{
|
|
padding: 5px 20px 0;
|
|
padding: 5px 20px 0;
|