|
@@ -0,0 +1,281 @@
|
|
|
+<template>
|
|
|
+ <a-card :bordered="false">
|
|
|
+ <!-- 搜索条件 -->
|
|
|
+ <div class="table-page-search-wrapper">
|
|
|
+ <a-form-model ref="queryForm" :model="queryParam" :rules="rules" layout="inline" @keyup.enter.native="refresh">
|
|
|
+ <a-row :gutter="48">
|
|
|
+ <a-col :lg="8" :sm="12">
|
|
|
+ <a-form-model-item prop="storeName" required label="客户名称" :label-col="{ span:4 }" :wrapper-col="{ span:12}">
|
|
|
+ <a-select
|
|
|
+ show-search
|
|
|
+ allowClear
|
|
|
+ placeholder="请输入客户名称"
|
|
|
+ option-filter-prop="children"
|
|
|
+ v-model="queryParam.storeName"
|
|
|
+ >
|
|
|
+ <a-select-option v-for="item in storeList" :key="item.id" :value="item.id">
|
|
|
+ {{ item.name }}
|
|
|
+ </a-select-option>
|
|
|
+ </a-select>
|
|
|
+ </a-form-model-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :lg="8" :sm="12">
|
|
|
+ <a-form-model-item prop="partName" label="配件名称" :label-col="{ span:4 }" :wrapper-col="{ span:12}">
|
|
|
+ <a-input class="full-width" v-model="queryParam.partName" placeholder="请输入配件名称" allowClear id="PaySettlementRecords-queryOrderDate"/>
|
|
|
+ </a-form-model-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :lg="8" :sm="12">
|
|
|
+ <a-form-model-item prop="settleNo" label="配件编码" :label-col="{ span:4 }" :wrapper-col="{ span:12}">
|
|
|
+ <a-input class="full-width" v-model="queryParam.settleNo" placeholder="产品编码/产品原厂编码" allowClear id="PaySettlementRecords-queryOrderDate"/>
|
|
|
+ </a-form-model-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="48">
|
|
|
+ <a-col :lg="8" :sm="12">
|
|
|
+ <a-form-model-item prop="status" label="是否缺货" :label-col="{ span:4 }" :wrapper-col="{ span:12}">
|
|
|
+ <v-select
|
|
|
+ v-model="queryParam.status"
|
|
|
+ ref="ledgerStatus"
|
|
|
+ id="purchasedSetmeal-status"
|
|
|
+ code="SETTLE_STATUS_ALL"
|
|
|
+ placeholder="请选择"
|
|
|
+ allowClear></v-select>
|
|
|
+ </a-form-model-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :lg="6" :sm="12">
|
|
|
+ <a-button type="primary" @click="handleSearch" id="PaySettlementRecords-refresh">查询</a-button>
|
|
|
+ <a-button style="margin-left: 8px" @click="resetSearchForm" id="PaySettlementRecords-resetSearchForm">重置</a-button>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-form>
|
|
|
+ </a-form-model></div>
|
|
|
+ <!-- 合计 -->
|
|
|
+ <div class="ftext" >
|
|
|
+ <a-button class="btn-cont" icon="unordered-list" type="primary" @click="openModal" id="PaySettlementRecords-refresh">补货清单</a-button>
|
|
|
+ </div>
|
|
|
+ <!-- 列表 -->
|
|
|
+ <div>
|
|
|
+ <s-table
|
|
|
+ ref="table"
|
|
|
+ size="default"
|
|
|
+ rowKey="id"
|
|
|
+ bordered
|
|
|
+ :columns="columns"
|
|
|
+ :data="loadData">
|
|
|
+ <!-- 操作 -->
|
|
|
+ <template slot="action" slot-scope="text, record">
|
|
|
+ <a href="#" class="action-btn" id="StockSearch-openAddBtn" @click="addReplenishmentList(record)">加入补货单</a>
|
|
|
+ <a href="#" class="action-btn" id="StockSearch-openOutInBtn" @click="openOutInModal(record)">出入库记录</a>
|
|
|
+ </template>
|
|
|
+ </s-table>
|
|
|
+ </div>
|
|
|
+ <!-- 补货清单弹窗 -->
|
|
|
+ <replenishmentList-modal
|
|
|
+ :openReplenishmentModal="openReplenishmentModal"
|
|
|
+ @close="openReplenishmentModal=false"
|
|
|
+ @refresh="$refs.table.refresh(true)">
|
|
|
+ </replenishmentList-modal>
|
|
|
+ <!-- 出入库记录弹窗 -->
|
|
|
+ <stock-outIn-modal
|
|
|
+ :showOutInModal="showOutInModal"
|
|
|
+ :partId="itemId"
|
|
|
+ :partName="partName"
|
|
|
+ @close="showOutInModal=false">
|
|
|
+ </stock-outIn-modal>
|
|
|
+ </a-card>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import moment from 'moment'
|
|
|
+import {
|
|
|
+ STable,
|
|
|
+ VSelect
|
|
|
+} from '@/components'
|
|
|
+import ReplenishmentListModal from './ReplenishmentListModal.vue'
|
|
|
+import stockOutInModal from './stockOutInModal.vue'
|
|
|
+import {
|
|
|
+ settlementRecordsList,
|
|
|
+ settlementRecordsListTotal
|
|
|
+} from '@/api/FinancialManagement'
|
|
|
+export default {
|
|
|
+ name: 'StockSearch',
|
|
|
+ components: {
|
|
|
+ VSelect,
|
|
|
+ STable,
|
|
|
+ ReplenishmentListModal,
|
|
|
+ stockOutInModal
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ openReplenishmentModal: false, // 是否打开补货清单弹窗
|
|
|
+ showOutInModal: false, // 是否打开出入库记录弹窗
|
|
|
+ partName: '', // 要查询出入库记录的配件名称
|
|
|
+ storeList: [
|
|
|
+ { id: 11, name: '常青二路店' },
|
|
|
+ { id: 112, name: '西部大道店99999999999999999' },
|
|
|
+ { id: 114, name: '渭滨路店' },
|
|
|
+ { id: 115, name: '未央店' },
|
|
|
+ { id: 116, name: '凤城八路店' }
|
|
|
+ ],
|
|
|
+ // 搜索条件
|
|
|
+ queryParam: {
|
|
|
+ // storeName: undefined, // 客户名称
|
|
|
+ // partName: '', // 配件名称
|
|
|
+ // status: '', // 分账状态
|
|
|
+ settleNo: ''
|
|
|
+ },
|
|
|
+ // 校验规则
|
|
|
+ rules: {
|
|
|
+ storeName: [{ required: true, message: '请先选择客户名称', trigger: 'change' }]
|
|
|
+ },
|
|
|
+ itemId: '', // 每条数据id
|
|
|
+ settleId: '',
|
|
|
+ replenishmentList: [], // 补货清单列表
|
|
|
+ columns: [{
|
|
|
+ title: '序号',
|
|
|
+ dataIndex: 'no',
|
|
|
+ width: 60,
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '客户名称',
|
|
|
+ dataIndex: 'settleDate',
|
|
|
+ width: 200,
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '配件名称',
|
|
|
+ dataIndex: 'settleNo',
|
|
|
+ width: 150,
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '产品编码',
|
|
|
+ dataIndex: 'orderNum',
|
|
|
+ width: 150,
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: {
|
|
|
+ customRender: 'userInfo'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '产品原厂编码',
|
|
|
+ dataIndex: 'realAmount',
|
|
|
+ align: 'center',
|
|
|
+ width: 150
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '安全库存',
|
|
|
+ dataIndex: 'code',
|
|
|
+ align: 'center',
|
|
|
+ width: 150
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '当前库存',
|
|
|
+ dataIndex: 'status',
|
|
|
+ align: 'center',
|
|
|
+ width: 150
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '差异库存',
|
|
|
+ dataIndex: 'remarks',
|
|
|
+ width: 100,
|
|
|
+ align: 'center',
|
|
|
+ customRender: (text) => {
|
|
|
+ return text || '--'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ width: 200,
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: {
|
|
|
+ customRender: 'action'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ loadData: parameter => {
|
|
|
+ const searchData = Object.assign(parameter, this.queryParam)
|
|
|
+ console.log(this.queryOrderDate, 'this.queryOrderDate')
|
|
|
+ if (this.queryOrderDate && this.queryOrderDate.length) {
|
|
|
+ searchData.beginDate = moment(this.queryOrderDate[0]).format('YYYY-MM-DD')
|
|
|
+ searchData.endDate = moment(this.queryOrderDate[1]).format('YYYY-MM-DD')
|
|
|
+ } else {
|
|
|
+ searchData.beginDate = ''
|
|
|
+ searchData.endDate = ''
|
|
|
+ }
|
|
|
+ return settlementRecordsList(searchData).then(res => {
|
|
|
+ const no = (res.data.pageNo - 1) * res.data.pageSize
|
|
|
+ for (let i = 0; i < res.data.list.length; i++) {
|
|
|
+ const _item = res.data.list[i]
|
|
|
+ _item.no = no + i + 1
|
|
|
+ }
|
|
|
+ return res.data
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 查询
|
|
|
+ handleSearch () {
|
|
|
+ this.$refs.queryForm.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
+ } else {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 重置
|
|
|
+ resetSearchForm () {
|
|
|
+ this.$refs.queryForm.resetFields()
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
+ },
|
|
|
+ // 打开补货清单弹窗
|
|
|
+ openModal () {
|
|
|
+ this.openReplenishmentModal = true
|
|
|
+ },
|
|
|
+ // 加入补货清单
|
|
|
+ addReplenishmentList (row) {
|
|
|
+ const item = row
|
|
|
+ item.number = 1
|
|
|
+ this.replenishmentList.unshift(item)
|
|
|
+ },
|
|
|
+ // 打开出入库记录弹窗
|
|
|
+ openOutInModal (item) {
|
|
|
+ this.partName = item.settleNo
|
|
|
+ this.itemId = item.id
|
|
|
+ this.showOutInModal = true
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ beforeRouteEnter (to, from, next) {
|
|
|
+ next(vm => {
|
|
|
+ vm.$refs.queryForm.resetFields()
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="less">
|
|
|
+ .ftext{
|
|
|
+ margin-bottom: 15px;
|
|
|
+ font-size: 18px;
|
|
|
+ .btn-cont{
|
|
|
+ margin-right: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .action-btn{
|
|
|
+ display: inline-block;
|
|
|
+ padding: 8px 10px;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin: 3px;
|
|
|
+ }
|
|
|
+ #StockSearch-openAddBtn{
|
|
|
+ background-color: #1890ff;
|
|
|
+ }
|
|
|
+ #StockSearch-openOutInBtn {
|
|
|
+ background-color: #00aa00;
|
|
|
+ }
|
|
|
+</style>
|