|
|
<template> <div class="mod-config"> <!-- 条件查询 --> <el-form :inline="true" label-position="top" :model="searchData"> <el-form-item :label="'单据号'"> <el-input v-model="searchData.orderNo" clearable style="width: 120px"></el-input> </el-form-item> <el-form-item :label="'单据类型'"> <el-select v-model="searchData.orderType" clearable style="width: 100px"> <el-option label="采购退货" value="采购退货"></el-option> <el-option label="销售出库" value="销售出库"></el-option> <el-option label="其他出库" value="其他出库"></el-option> </el-select> </el-form-item> <el-form-item :label="'单据状态'"> <el-select multiple collapse-tags v-model="searchData.orderStatusList" clearable style="width: 160px"> <el-option label="草稿" value="草稿"></el-option> <el-option label="待检验" value="待检验"></el-option> <el-option label="编辑中" value="编辑中"></el-option> <el-option label="待包装" value="待包装"></el-option> <el-option label="待出库" value="待出库"></el-option> <el-option label="已完成" value="已完成"></el-option> <el-option label="已关闭" value="已关闭"></el-option> <el-option label="已归档" value="已归档"></el-option> </el-select> </el-form-item> <el-form-item :label="'要求出库日期'"> <el-date-picker style="width: 120px" v-model="searchData.startDate" type="date" value-format="yyyy-MM-dd" placeholder="选择日期"> </el-date-picker> </el-form-item> <el-form-item style="margin-top: 23px;"> <laber style="margin-left: -9px;font-size: 19px">➞</laber> </el-form-item> <el-form-item :label="' '"> <el-date-picker style="width: 120px" v-model="searchData.endDate" type="date" value-format="yyyy-MM-dd" placeholder="选择日期"> </el-date-picker> </el-form-item> <el-form-item :label="' '"> <el-button v-if="!authSearch" type="primary" :loading="searchLoading" @click="getDataList()">查询</el-button> <el-button v-if="!authSave" type="primary" @click="saveModal()">新增</el-button> <el-button v-if="!authDelete" type="primary" @click="deleteModal()">删除</el-button> <el-button v-if="!authArchive" type="primary" @click="archiveModal()">归档</el-button> </el-form-item> <el-form-item :label="' '"> <el-button @click="exportExcel()" type="primary" style="margin-left: 2px">{{'导出'}}</el-button> <el-button @click="packingModal()" type="primary" style="margin-left: 2px">包装</el-button> </el-form-item> </el-form>
<!-- 展示列表 --> <el-table :height="height" :data="dataList" border v-loading="searchLoading" ref="outboundTable" :row-style="rowStyle" @row-click="inboundClickRow" @current-change="changeCurrentRow" @selection-change="selectionInbound" style="width: 100%;"> <el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column> <el-table-column v-for="(item,index) in columnList" :key="index" :sortable="item.columnSortable" :prop="item.columnProp" :header-align="item.headerAlign" :show-overflow-tooltip="item.showOverflowTooltip" :align="item.align" :fixed="item.fixed==''?false:item.fixed" :min-width="item.columnWidth" :label="item.columnLabel"> <template slot-scope="scope"> <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span> <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span> </template> </el-table-column> <el-table-column fixed="right" header-align="center" align="center" width="120" label="操作"> <template slot-scope="scope"> <template v-if="!authUpdate"> <el-link v-if="scope.row.orderStatus === '草稿' || scope.row.orderStatus === '待检验' || scope.row.orderStatus === '编辑中'" style="cursor: pointer" @click="updateModal(scope.row)">编辑</el-link> </template> <template v-if="!authClose"> <el-link v-if="scope.row.orderStatus !== '草稿' && scope.row.orderStatus !== '已关闭'" style="cursor: pointer" @click="closeModal(scope.row)">关闭</el-link> </template> <template v-if="!authIssue"> <el-link v-if="scope.row.orderStatus === '草稿' || scope.row.orderStatus === '编辑中'" style="cursor: pointer" @click="issueModal(scope.row)">下达</el-link> </template> </template> </el-table-column> </el-table>
<!-- 分页栏 --> <el-pagination style="margin-top: 0px" @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex" :page-sizes="[20, 50, 100, 200, 500]" :page-size="pageSize" :total="totalPage" layout="total, sizes, prev, pager, next, jumper"> </el-pagination>
<!-- 拣货出库通知新增/修改 --> <el-dialog title="拣货出库通知" :close-on-click-modal="false" v-drag :visible.sync="modalFlag" width="525px"> <el-form :inline="true" label-position="top" :model="modalData" :rules="rules" style="margin-left: 7px;margin-top: -5px;"> <el-form-item label="BU" prop="bu"> <el-select v-model="modalData.bu" placeholder="请选择" :disabled="modalDisableFlag" style="width: 100px"> <el-option v-for = "i in userBuList" :key = "i.buNo" :label = "i.sitename" :value = "i.buNo"> <span style="float: left;width: 60px">{{ i.sitename }}</span> <span style="float: right; color: #8492a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; font-size: 11px;width: 70px"> {{ i.buDesc }} </span> </el-option> </el-select> </el-form-item> <el-form-item label="单据类型" prop="orderType"> <el-select v-model="modalData.orderType" :disabled="modalDisableFlag" @change="onOrderTypeChange" style="width: 100px"> <el-option label="采购退货" value="采购退货"></el-option> <el-option label="其他出库" value="其他出库"></el-option> </el-select> </el-form-item> <el-form-item label="要求出库日期" prop="requiredOutboundDate"> <el-date-picker style="width: 120px" v-model="modalData.requiredOutboundDate" type="date" value-format="yyyy-MM-dd"> </el-date-picker> </el-form-item> </el-form> <el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px"> <!-- 采购退货时显示供应商 --> <el-form-item v-if="modalData.orderType === '采购退货'"> <span style="cursor: pointer" slot="label" @click="getBaseList(506)"><a href="#">供应商</a></span> <el-input v-model="modalData.customerId" @change="customerBlur(506)" style="width: 100px"></el-input> <el-input v-model="modalData.customerName" disabled style="width: 380px"></el-input> </el-form-item> <!-- 其他出库时显示直接客户 --> <el-form-item v-else-if="modalData.orderType === '其他出库'"> <span style="cursor: pointer" slot="label" @click="getBaseList(507)"><a href="#">直接客户</a></span> <el-input v-model="modalData.customerId" @change="customerBlur(507)" style="width: 100px"></el-input> <el-input v-model="modalData.customerName" disabled style="width: 380px"></el-input> </el-form-item> </el-form> <el-form :inline="true" label-position="top" style="margin-left: 7px"> <el-form-item :label="'备注'"> <el-input type="textarea" v-model="modalData.remarks" :rows="3" resize='none' show-word-limit style="width: 485px;height: 20px"></el-input> </el-form-item> </el-form> <el-footer style="height:35px;margin-top: 55px;text-align:center"> <el-button type="primary" :loading="saveLoading" @click="saveData()">保存</el-button> <el-button type="primary" @click="modalFlag = false">关闭</el-button> </el-footer> </el-dialog>
<!-- 页签 --> <el-tabs v-model="activeTable" style="width: 100%" :style="{height: secondHeight + 'px'}" type="border-card" @tab-click="tabClick" class="customer-tab"> <el-tab-pane label="出库明细" name="outboundDetail"> <el-form label-position="top" style="margin-left: 2px;"> <el-button type="primary" @click="addOutboundDetailModal()" icon="el-icon-plus">新增</el-button> <el-button type="primary" @click="deleteOutboundDetail()" icon="el-icon-minus">删除</el-button> <el-button v-if="!editBatchVisible" @click="editBatchModel">批量编辑</el-button> <el-button v-if="editBatchVisible" @click="batchModel" :loading="saveLoading">批量保存</el-button> <el-button v-if="editBatchVisible" @click="editBatchVisible = false" type="info">取消编辑</el-button> </el-form> <el-table :data="detailList" :height="secondHeight - 68" border @selection-change="selectionInboundDetail" style="width: 100%;"> <el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column> <el-table-column v-for="(item,index) in columnDetailList" :key="index" :sortable="item.columnSortable" :prop="item.columnProp" :header-align="item.headerAlign" :show-overflow-tooltip="item.showOverflowTooltip" :align="item.align" :fixed="item.fixed===''?false:item.fixed" :min-width="item.columnWidth" :label="item.columnLabel"> <template slot-scope="scope"> <span v-if="!item.columnHidden">{{scope.row[item.columnProp]}}</span> <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span> </template> </el-table-column> <el-table-column prop="requiredQty" header-align="center" align="right" min-width="100" label="要求出库数量"> <template slot-scope="scope"> <span v-if="editBatchVisible"> <el-input :controls="false" v-model="scope.row.requiredQty" @input="value => scope.row.requiredQty = value.match(/^(\d+\.?\d*|\.\d+)$/) ? value : ''" style="height: 11px; width: 98%;"> </el-input> </span> <span v-else> <span>{{scope.row[scope.column.property]}}</span> </span> </template> </el-table-column> <el-table-column prop="outWarehouseName" header-align="center" align="center" min-width="180" label="出库仓库"> <template slot-scope="scope"> <span v-if="editBatchVisible"> <el-button type="text" @click="chooseWareHouse(scope.row)" style="width:18%;padding: 3px 7px">选择</el-button> <el-input v-model="scope.row.outWarehouseName" readonly style="width:77%"></el-input> </span> <span v-else> <span>{{scope.row[scope.column.property]}}</span> </span> </template> </el-table-column> <el-table-column prop="actualStockOutQty" header-align="center" align="right" min-width="100" label="实际出库数量"> </el-table-column> <el-table-column fixed="right" header-align="center" align="center" width="90" label="操作"> <template slot-scope="scope"> <el-link style="cursor: pointer" @click="outboundDetailModal(scope.row)">出库明细</el-link> </template> </el-table-column> </el-table> </el-tab-pane> </el-tabs>
<!-- 拣货出库单明细新增 --> <el-dialog title="拣货出库单明细" :close-on-click-modal="false" v-drag :visible.sync="detailModal" width="900px"> <div style="font-size: 12px"> <el-form :inline="true" label-position="top" :model="detailSearchData"> <el-form-item :label="'物料编码'"> <el-input v-model="detailSearchData.partNo" clearable style="width: 120px"></el-input> </el-form-item> <el-form-item :label="'物料名称'"> <el-input v-model="detailSearchData.partDesc" clearable style="width: 120px"></el-input> </el-form-item> <template v-if="detailSearchData.orderType === '采购退货'"> <el-form-item :label="'采购订单'"> <el-input v-model="detailSearchData.relatedOrderNo" clearable style="width: 120px"></el-input> </el-form-item> <el-form-item :label="'行号'"> <el-input v-model="detailSearchData.relatedOrderLineNo" clearable style="width: 120px"></el-input> </el-form-item> <el-form-item :label="'状态'"> <el-select v-model="detailSearchData.closeFlag" clearable style="width: 80px"> <el-option label="启用" value="N"></el-option> <el-option label="关闭" value="Y"></el-option> </el-select> </el-form-item> </template> <el-form-item label=" "> <el-button type="primary" @click="searchTypeChange">查询</el-button> </el-form-item> </el-form> </div> <el-container v-if="detailSearchData.orderType === '其他出库'"> <el-header style="width: 880px;height: 200px;padding: 0 0 0 0"> <span style="font-size: 12px" >可选物料</span> <el-table height="200px" :data="partList1" border ref="partTable1" @selection-change="selectionPart1" highlight-current-row style="width: 100%"> <el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column> <el-table-column prop="partNo" header-align="center" align="left" min-width="120" label="物料编码"> </el-table-column> <el-table-column prop="partDesc" header-align="center" align="left" min-width="200" label="物料名称"> </el-table-column> <el-table-column prop="umName" header-align="center" align="center" min-width="100" label="物料单位"> </el-table-column> </el-table> <!-- 分页--> <el-pagination style="margin-top: 5px" @size-change="sizeChangeHandle2" @current-change="currentChangeHandle2" :current-page="pageIndex2" :page-sizes="[20, 50, 100, 200, 500]" :page-size="pageSize2" :total="totalPage2" layout="total, sizes, prev, pager, next, jumper"> </el-pagination> </el-header> <el-main style="width: 880px;height: 27px;margin-top: 70px;padding: 0 0 0 0;text-align:center"> <div> <el-button type="primary" @click="addPart">添加>></el-button> <el-button type="primary" @click="deletePart">删除<<</el-button> </div> </el-main> <el-footer style="width: 880px;height: 200px;padding: 0 0 0 0;"> <span style="font-size: 12px" >已选物料</span> <div class="rq"> <el-table height="200px" :data="partList2" border ref="partTable2" @selection-change="selectionPart2" highlight-current-row style="width: 100%"> <el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column> <el-table-column prop="partNo" header-align="center" align="center" min-width="80" label="物料编码"> </el-table-column> <el-table-column prop="partDesc" header-align="center" align="left" min-width="120" label="物料名称"> </el-table-column> <el-table-column prop="" header-align="center" align="center" min-width="100" label="要求出库数量"> <template slot-scope="scope"> <el-input :controls="false" v-model="scope.row.requiredQty" @input="value => scope.row.requiredQty = value.match(/^(\d+\.?\d*|\.\d+)$/) ? value : ''" style="height: 11px; width: 98%;"> </el-input> </template> </el-table-column> </el-table> </div> </el-footer> </el-container>
<el-container v-else-if="detailSearchData.orderType === '采购退货'"> <el-header style="width: 880px;height: 200px;padding: 0 0 0 0"> <span style="font-size: 12px" >可选物料</span> <el-table height="200px" :data="partList1" border ref="partTable1" @selection-change="selectionPart1" highlight-current-row style="width: 100%"> <el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column> <el-table-column prop="relatedOrderNo" header-align="center" align="left" min-width="150" label="采购订单"> </el-table-column> <el-table-column prop="relatedOrderLineNo" header-align="center" align="left" min-width="200" label="行号"> </el-table-column> <el-table-column prop="partNo" header-align="center" align="left" min-width="120" label="物料编码"> </el-table-column> <el-table-column prop="partDesc" header-align="center" align="left" min-width="200" label="物料名称"> </el-table-column> <el-table-column prop="umName" header-align="center" align="center" min-width="100" label="物料单位"> </el-table-column> <el-table-column prop="requiredQty" header-align="center" align="right" min-width="100" label="可出库数"> </el-table-column> </el-table> <!-- 分页--> <el-pagination style="margin-top: 5px" @size-change="sizeChangeHandle2" @current-change="currentChangeHandle2" :current-page="pageIndex2" :page-sizes="[20, 50, 100, 200, 500]" :page-size="pageSize2" :total="totalPage2" layout="total, sizes, prev, pager, next, jumper"> </el-pagination> </el-header> <el-main style="width: 880px;height: 27px;margin-top: 70px;padding: 0 0 0 0;text-align:center"> <div> <el-button type="primary" @click="addPart">添加>></el-button> <el-button type="primary" @click="deletePart">删除<<</el-button> </div> </el-main> <el-footer style="width: 880px;height: 200px;padding: 0 0 0 0;"> <span style="font-size: 12px" >已选物料</span> <div class="rq"> <el-table height="200px" :data="partList2" border ref="partTable2" @selection-change="selectionPart2" highlight-current-row style="width: 100%"> <el-table-column type="selection" header-align="center" align="center" width="50"> </el-table-column> <el-table-column prop="relatedOrderNo" header-align="center" align="center" min-width="80" label="采购订单"> </el-table-column> <el-table-column prop="partNo" header-align="center" align="center" min-width="80" label="物料编码"> </el-table-column> <el-table-column prop="partDesc" header-align="center" align="left" min-width="150" label="物料名称"> </el-table-column> <el-table-column prop="" header-align="center" align="center" min-width="100" label="要求出库数量"> <template slot-scope="scope"> <el-input :controls="false" v-model="scope.row.requiredQty" @input="value => scope.row.requiredQty = value.match(/^(\d+\.?\d*|\.\d+)$/) ? value : ''" style="height: 11px; width: 98%;"> </el-input> </template> </el-table-column> </el-table> </div> </el-footer> </el-container> <el-footer style="height:30px;margin-top: 35px;text-align:center"> <el-button type="primary" :loading="saveLoading" @click="saveOutboundDetail">保存</el-button> <el-button type="primary" @click="detailModal = false">关闭</el-button> </el-footer> </el-dialog>
<!-- 出库明细 --> <el-dialog title="出库明细" :close-on-click-modal="false" v-drag :visible.sync="detailModal2" width="900px"> <el-table height="400px" :data="detailList2" border style="width: 100%;"> <el-table-column v-for="(item,index) in columnDetailList2" :key="index" :sortable="item.columnSortable" :prop="item.columnProp" :header-align="item.headerAlign" :show-overflow-tooltip="item.showOverflowTooltip" :align="item.align" :fixed="item.fixed===''?false:item.fixed" :min-width="item.columnWidth" :label="item.columnLabel"> </el-table-column> </el-table> <el-footer style="height:35px;margin-top: 15px;text-align:center"> <el-button type="primary" @click="detailModal2 = false">关闭</el-button> </el-footer> </el-dialog>
<Chooselist ref="baseList" @getBaseData="getBaseData"></Chooselist>
</div></template>
<script> import { searchOutboundNotification, // 查询拣货出库单
saveOutboundNotification, // 新增拣货出库单
updateOutboundNotification, // 编辑拣货出库单
deleteOutboundNotification, // 删除拣货出库单
closeOutboundNotification, // 关闭拣货出库单
issueOutboundNotification, // 下达拣货出库单
getOutboundDetail, // 查询拣货出库明细
saveOutboundDetail, // 新增拣货出库单明细
deleteOutboundDetail, // 删除拣货出库单明细
getOutboundPartList, // 查物料
updateOutboundDetail, // 批量编辑明细
getOutboundDetail2, // 获取出库明细
} from "@/api/qc/outbound_notification.js" import { getSiteAndBuByUserName, } from "@/api/qc/qc.js" import {getTableDefaultListLanguage, getTableUserListLanguage} from "@/api/table.js" import Chooselist from '@/views/modules/common/Chooselist_eam' import {userFavoriteList, saveUserFavorite, removeUserFavorite} from '@/api/userFavorite.js' import excel from "@/utils/excel-util.js" import {verifyData} from "@/api/chooselist/chooselist.js" export default { components: { Chooselist, }, data () { return { columnsProp:['createBy', 'updateBy'], // 是否收藏
favorite: false, // 导出 start
exportData: [], exportName: "拣货出库" + this.dayjs().format('YYYYMMDDHHmmss'), exportHeader: ["拣货出库"], exportFooter: [], exportList: [], // 导出 end
tagNo: '', tagType: '', searchData: { site: '', userName: this.$store.state.user.name, orderNo: '', orderType: '', orderStatus: '', orderStatusList: ['草稿'], startDate: '', endDate: '', page: 1, limit: 10, }, detailSearchData: { site: '', buNo: '', orderNo: '', partNo: '', partDesc: '', partNos: '', orderType: '', relatedOrderNo: '', relatedOrderLineNo: '', closeFlag: '', page: 1, limit: 10, }, height: 200, secondHeight: 200, pageIndex: 1, pageSize: 20, totalPage: 0, pageIndex2: 1, pageSize2: 20, totalPage2: 0, modalFlag: false, modalDisableFlag: false, modalData: { site: '', bu: '', buNo: '', flag: '', orderNo: '', orderType: '', orderStatus: '', requiredOutboundDate: '', customerId: '', customerName: '', remarks: '', createdBy: '', updatedBy: '', }, dataList: [], detailList: [], userBuList: [], outboundSelection: [], outboundDetailSelection: [], partSelections1: [], partSelections2: [], partList1: [], partList2: [], dataListLoading: false, // 展示列集
columnList: [ { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1OrderNo', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'orderNo', headerAlign: "center", align: "center", columnLabel: '单据号', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 120, }, { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1OrderType', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'orderType', headerAlign: "center", align: "center", columnLabel: '单据类型', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1OrderStatus', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'orderStatus', headerAlign: "center", align: "left", columnLabel: '单据状态', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1CustomerId', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'customerId', headerAlign: "center", align: "left", columnLabel: '客户 / 供应商编码', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 120, }, { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1CustomerName', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'customerName', headerAlign: "center", align: "left", columnLabel: '客户 / 供应商名称', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 200, }, { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1RequiredInboundDate', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'requiredOutboundDate', headerAlign: "center", align: "center", columnLabel: '要求出库日期', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 150, }, { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1CreatedDate', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'createdDate', headerAlign: "center", align: "center", columnLabel: '创建时间', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 170, }, { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1CreatedBy', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'createdBy', headerAlign: "center", align: "center", columnLabel: '创建人', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1UpdatedDate', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'updatedDate', headerAlign: "center", align: "center", columnLabel: '更新时间', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 170, }, { userId: this.$store.state.user.name, functionId: 620, serialNumber: '620Table1UpdatedBy', tableId: "620Table1", tableName: "拣货出库任务表", columnProp: 'updatedBy', headerAlign: "center", align: "center", columnLabel: '更新人', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, ], columnDetailList: [ { columnProp: 'relatedOrderNo', headerAlign: "center", align: "left", columnLabel: '关联单号', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { columnProp: 'relatedOrderLineNo', headerAlign: "center", align: "left", columnLabel: '关联单行号', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { columnProp: 'partNo', headerAlign: "center", align: "left", columnLabel: '物料编码', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 120, }, { columnProp: 'partDesc', headerAlign: "center", align: "left", columnLabel: '物料名称', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 200, }, { columnProp: 'umName', headerAlign: "center", align: "center", columnLabel: '单位', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 80, }, ], columnDetailList2: [ { columnProp: 'subNo', headerAlign: "center", align: "left", columnLabel: '标签条码', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { columnProp: 'subQty', headerAlign: "center", align: "right", columnLabel: '出库数量', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { columnProp: 'orderRef4', headerAlign: "center", align: "left", columnLabel: '出库仓库', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 150, }, { columnProp: 'orderRef5', headerAlign: "center", align: "left", columnLabel: '出库库位', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 150, }, { columnProp: 'userName', headerAlign: "center", align: "left", columnLabel: '操作员', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { columnProp: 'transDate', headerAlign: "center", align: "center", columnLabel: '操作时间', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 170, }, ], rules: { bu: [ { required: true, message: ' ', trigger: ['blur','change'] } ], orderType: [ { required: true, message: ' ', trigger: ['blur','change'] } ], requiredOutboundDate: [ { required: true, message: ' ', trigger: ['blur','change'] } ] }, searchLoading: false, saveLoading: false, activeTable: 'outboundDetail', detailModal: false, authSearch: false, authSave: false, authUpdate: false, authDelete: false, authArchive: false, authClose: false, authIssue: false, editBatchVisible: false, menuId: this.$route.meta.menuId, tempWareHouseRow: {}, detailList2: [], detailModal2: false, currentRow: {} } },
mounted () { this.$nextTick(() => { this.height = window.innerHeight / 2 - 100 /*第二个表格高度的动态调整*/ this.secondHeight = window.innerHeight - this.height - 170 }) },
created () { // 按钮控制
this.getButtonAuthData() // 获取用户的 site 和 bu
this.getSiteAndBuByUserName() // 校验用户是否收藏
this.favoriteIsOk() // 动态列
this.getTableUserColumn(this.$route.meta.menuId+'table1',1) this.getTableUserColumn(this.$route.meta.menuId+'table2',2) if (!this.authSearch) { // 获取数据列表
this.getDataList() } },
methods: { // 获取用户的bu
getSiteAndBuByUserName () { let tempData = { username: this.$store.state.user.name, } getSiteAndBuByUserName(tempData).then(({data}) => { if (data.code === 0) { this.userBuList = data.rows } }) },
// 获取数据列表
getDataList () { this.searchData.limit = this.pageSize this.searchData.page = this.pageIndex this.searchData.orderStatus = this.searchData.orderStatusList.join(',') this.searchLoading = true searchOutboundNotification(this.searchData).then(({data}) => { if (data.code === 0) { this.dataList = data.page.list this.pageIndex = data.page.currPage this.pageSize = data.page.pageSize this.totalPage = data.page.totalCount // 判断是否全部存在数据
if (this.dataList.length > 0) { // 设置选中行
this.$refs.outboundTable.setCurrentRow(this.dataList[0]) this.inboundClickRow(this.dataList[0]) } else { this.currentRow = {} this.refreshCurrentTabTable() } } }).finally(()=>{ this.searchLoading = false }) },
// 每页数
sizeChangeHandle (val) { this.pageSize = val this.pageIndex = 1 this.getDataList() },
// 当前页
currentChangeHandle (val) { this.pageIndex = val this.getDataList() },
// 子明细每页数
sizeChangeHandle2 (val) { this.pageSize2 = val this.pageIndex2 = 1 this.searchTypeChange() },
// 子明细当前页
currentChangeHandle2 (val) { this.pageIndex2 = val this.searchTypeChange() },
saveModal () { this.modalData = { flag: '1', site: '', bu: this.userBuList[0].buNo, buNo: '', orderNo: '', orderType: '采购退货', // 默认为采购退货
orderStatus: '草稿', requiredOutboundDate: '', customerId: '', customerName: '', remarks: '', createdBy: this.$store.state.user.name, } this.modalDisableFlag = false this.modalFlag = true },
updateModal (row) { if (this.currentRow.orderType === '销售出库') { this.$message.warning('销售出库单据不能编辑!') return } this.modalData = { flag: '2', site: row.site, bu: row.site + '_' + row.buNo, buNo: row.buNo, orderNo: row.orderNo, orderType: row.orderType, requiredOutboundDate: row.requiredOutboundDate, customerId: row.customerId, customerName: row.customerName, remarks: row.remarks, updatedBy: this.$store.state.user.name, } this.modalDisableFlag = true this.modalFlag = true },
saveData () { if (this.modalData.bu === '' || this.modalData.bu == null) { this.$message.warning('请选择BU!') return } if (this.modalData.orderType === '' || this.modalData.orderType == null) { this.$message.warning('请选择单据类型!') return } if (this.modalData.requiredOutboundDate === '' || this.modalData.requiredOutboundDate == null) { this.$message.warning('请选择要求出库日期!') return } this.saveLoading = true if (this.modalData.flag === '1') { // 新增
saveOutboundNotification(this.modalData).then(({data}) => { if (data && data.code === 0) { this.getDataList() this.modalFlag = false this.$message.success('操作成功') } else { this.$message.error(data.msg) } }).finally(()=>{ this.saveLoading = false }) } else { // 修改
updateOutboundNotification(this.modalData).then(({data}) => { if (data && data.code === 0) { this.getDataList() this.modalFlag = false this.$message.success('操作成功') } else { this.$message.error(data.msg) } }).finally(()=>{ this.saveLoading = false }) } },
// 删除
deleteModal () { if (this.currentRow.orderType === '销售出库') { this.$message.warning('销售出库单据不能编辑!') return } if (this.outboundSelection.length === 0) { this.$message.warning('请勾选要删除的单据!') return } this.$confirm(`是否删除该 `+ this.outboundSelection.length +` 条记录?`, '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { let tempData = { submitList: this.outboundSelection } deleteOutboundNotification(tempData).then(({data}) => { if (data && data.code === 0) { this.getDataList() this.outboundSelection = [] this.$message.success('操作成功') } else { this.$message.error(data.msg) } }) }) },
// 归档
archiveModal () {
},
// 包装
packingModal () { // 校验是否选择了单据
if (this.outboundSelection.length === 0) { this.$message.warning('请勾选要包装的单据!') return }
// 校验选中的单据是否都是"销售出库"类型且状态为"待出库"
const invalidOrders = this.outboundSelection.filter(item => { return item.orderType !== '销售出库' || item.orderStatus !== '待出库' })
if (invalidOrders.length > 0) { this.$message.warning('只能对"销售出库"类型且状态为"待出库"的单据进行包装操作!') return }
// 确认操作
this.$confirm(`是否重新包装"?`, '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { // 调用后端接口更新状态
const updateList = this.outboundSelection.map(item => ({ site: item.site, buNo: item.buNo, orderNo: item.orderNo, orderStatus: '待包装' }))
this.batchUpdateOrderStatus(updateList) }).catch(() => { // 用户取消操作
}) },
// 批量更新单据状态
batchUpdateOrderStatus (updateList) { // 这里需要调用后端API,暂时使用循环调用单个更新接口
let successCount = 0 let errorCount = 0 const totalCount = updateList.length
const updatePromises = updateList.map(item => { return this.$http({ url: this.$http.adornUrl('/outbound/updateOrderStatus'), method: 'post', data: this.$http.adornData(item) }).then(({data}) => { if (data && data.code === 0) { successCount++ } else { errorCount++ } }).catch(() => { errorCount++ }) })
Promise.all(updatePromises).then(() => { if (errorCount === 0) { this.$message.success(`成功更新 ${successCount} 条单据状态为"待包装"`) } else { this.$message.warning(`成功 ${successCount} 条,失败 ${errorCount} 条`) } this.getDataList() this.outboundSelection = [] }) },
// 关闭
closeModal (row) { if (this.currentRow.orderType === '销售出库') { this.$message.warning('销售出库单据不能编辑!') return } closeOutboundNotification(row).then(({data}) => { if (data && data.code === 0) { this.getDataList() this.$message.success('操作成功') } else { this.$message.error(data.msg) } }) },
// 下达
issueModal (row) { if (this.currentRow.orderType === '销售出库') { this.$message.warning('销售出库单据不能编辑!') return } issueOutboundNotification(row).then(({data}) => { if (data && data.code === 0) { this.getDataList() this.$message.success('操作成功') } else { this.$message.error(data.msg) } }) },
// 列表表格选择替换
tabClick (tab, event) { // 刷新列表数据
this.refreshCurrentTabTable() },
// 当前值发生变化的时候修改
changeCurrentRow (row, oldRow) { // 判断是否是获取焦点的事件
if (row) { this.currentRow = JSON.parse(JSON.stringify(row)) //刷新当前页表
this.refreshCurrentTabTable() } },
// 复选
selectionInbound (val) { this.outboundSelection = val },
// 明细复选
selectionInboundDetail (val) { this.outboundDetailSelection = val },
rowStyle ({row}) { if (this.currentRow.orderNo === row.orderNo) { return { 'background-color': '#E8F7F6', cursor: 'pointer' } } },
// 单机选中信息
inboundClickRow (row,column) { this.currentRow = JSON.parse(JSON.stringify(row)) },
// 刷新页签的table数据
refreshCurrentTabTable () { if (this.activeTable === 'outboundDetail') { this.getOutboundDetail() } },
// 查询物料缺陷跟踪
getOutboundDetail () { let templateData = { site: this.currentRow.site, buNo: this.currentRow.buNo, orderNo: this.currentRow.orderNo, } getOutboundDetail(templateData).then(({data}) => { this.detailList = data.rows }) },
// 新增明细
addOutboundDetailModal () { if (this.currentRow.orderType === '销售出库') { this.$message.warning('销售出库单据不能编辑!') return } this.detailSearchData = { site: this.currentRow.site, buNo: this.currentRow.buNo, orderNo: this.currentRow.orderNo, orderType: this.currentRow.orderType, relatedOrderNo: '', relatedOrderLineNo: '', closeFlag: '', partNo: '', partDesc: '', partNos: '', page: 1, limit: 10, } this.partSelections1 = [] this.partSelections2 = [] this.partList1 = [] this.partList2 = [] this.pageIndex2 = 1 this.pageSize2 = 20 this.totalPage2 = 0 if (this.currentRow.orderType === '采购退货') { this.detailSearchData.closeFlag = 'N' } this.handleGetProjectPartList() },
handleGetProjectPartList () { this.detailSearchData.limit = this.pageSize2 this.detailSearchData.page = this.pageIndex2 getOutboundPartList(this.detailSearchData).then(({data}) => { if (data && data.code === 0){ this.partList1 = data.page.list this.pageIndex2 = data.page.currPage this.pageSize2 = data.page.pageSize this.totalPage2 = data.page.totalCount this.detailModal = true } }) },
// 可选物料
partClickRow1 (row) { this.$refs.partTable1.toggleRowSelection(row) },
// 已有物料
partClickRow2 (row) { this.$refs.partTable2.toggleRowSelection(row) },
selectionPart1 (val) { this.partSelections1 = val },
selectionPart2 (val) { this.partSelections2 = val },
// 改变事件
searchTypeChange () { // 使用 map 提取 partNo 并加上单引号
let partNos = this.partList2.map(part => part.partNo) // 使用 join 将 partNo 连接成一个字符串
this.detailSearchData.partNos = partNos.join(",") this.handleGetProjectPartList() },
// 添加物料
addPart () { if (this.partSelections1 == null || this.partSelections1.length === 0) { this.$message.warning('请选择可选物料!') return } this.partSelections1.forEach(item => { this.partList2.push(item) }) this.searchTypeChange() },
// 删除物料
deletePart () { if(this.partSelections2 == null || this.partSelections2.length === 0) { this.$message.warning('请选择已选物料!') return } this.partSelections2.forEach(item => { // 使用 filter 过滤掉 partList2 中与 selection.part_no 相同的项
this.partList2 = this.partList2.filter(part => part.partNo !== item.partNo) }) this.searchTypeChange() },
// 新增明细
saveOutboundDetail () { let tempData = { orderNo: this.detailSearchData.orderNo, createdBy: this.$store.state.user.name, partList: this.partList2, } this.saveLoading = true saveOutboundDetail(tempData).then(({data}) => { if (data && data.code === 0) { this.getOutboundDetail() this.detailModal = false this.$message.success('操作成功') } else { this.$message.error(data.msg) } }).finally(()=>{ this.saveLoading = false }) },
// 删除物料缺陷跟踪
deleteOutboundDetail () { if (this.currentRow.orderType === '销售出库') { this.$message.warning('销售出库单据不能编辑!') return } if (this.outboundDetailSelection.length === 0) { this.$message.warning('请勾选要删除的单据!') return } this.$confirm(`是否删除该 `+ this.outboundDetailSelection.length +` 条记录?`, '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { let tempData = { submitList: this.outboundDetailSelection } deleteOutboundDetail(tempData).then(({data}) => { if (data && data.code === 0) { this.getOutboundDetail() this.outboundDetailSelection = [] this.$message.success('操作成功') } else { this.$message.error(data.msg) } }) }) },
// 批量编辑模态框
editBatchModel() { if (this.currentRow.orderType === '销售出库') { this.$message.warning('销售出库单据不能编辑!') return } if (this.editBatchVisible) { this.editBatchVisible = false } else { this.editBatchVisible = true } },
// 批量保存
batchModel() { let params = [] params = this.detailList this.saveLoading = true updateOutboundDetail(params).then(({data}) => { if (data && data.code === 0) { this.getOutboundDetail() this.$message.success('操作成功') this.editBatchVisible = false } else { this.$message.error(data.msg) } }).finally(() => { this.saveLoading = false }) },
// 出库明细
outboundDetailModal (row) { let tempData = { ...row, orderType: this.currentRow.orderType } getOutboundDetail2(tempData).then(({data}) => { if (data && data.code === 0) { this.detailList2 = data.rows } else { this.detailList2 = [] } }) this.detailModal2 = true },
// 客户/供应商输入校验
customerBlur (tagNo) { let tempData = { tagno: tagNo, conditionSql: '' } if (tagNo === 506) { // 供应商校验
tempData.conditionSql = " and SupplierID = '" + this.modalData.customerId + "'" + " and site = '" + this.modalData.site + "'" } else if (tagNo === 507) { // 客户校验
tempData.conditionSql = " and CustomerID = '" + this.modalData.customerId + "'" + " and site = '" + this.modalData.site + "'" } verifyData(tempData).then(({data}) => { if (data && data.code === 0) { if (data.baseListData.length > 0) { if (tagNo === 506) { this.modalData.customerId = data.baseListData[0].SupplierID this.modalData.customerName = data.baseListData[0].SupplierName } else if (tagNo === 507) { this.modalData.customerId = data.baseListData[0].CustomerID this.modalData.customerName = data.baseListData[0].CustomerName } } else { this.modalData.customerName = '' } } }) },
// 单据类型变更时清空客户/供应商信息
onOrderTypeChange () { this.modalData.customerId = '' this.modalData.customerName = '' },
chooseWareHouse (row) { this.tempWareHouseRow = row this.getBaseList(20) },
// 获取基础数据列表S
getBaseList (val, type) { this.tagNo = val this.tagType = type this.$nextTick(() => { let strVal = '' if (val === 506) { // 供应商列表
strVal = this.modalData.customerId this.$refs.baseList.init(val, strVal) } if (val === 507) { // 直接客户列表
strVal = this.modalData.customerId this.$refs.baseList.init(val, strVal) } if (val === 20) { strVal = this.tempWareHouseRow.outWarehouse this.$refs.baseList.init(val, strVal) } }) },
// 列表方法的回调
getBaseData (val) { if (this.tagNo === 506) { // 供应商回调
this.modalData.customerId = val.SupplierID this.modalData.customerName = val.SupplierName } if (this.tagNo === 507) { // 直接客户回调
this.modalData.customerId = val.CustomerID this.modalData.customerName = val.CustomerName } if (this.tagNo === 20) { this.tempWareHouseRow.outWarehouse = val.WareHouseID this.tempWareHouseRow.outWarehouseName = val.WareHouseName console.log(this.tempWareHouseRow) } },
// 校验用户是否收藏
favoriteIsOk () { let userFavorite = { userId: this.$store.state.user.id, languageCode: this.$i18n.locale } userFavoriteList(userFavorite).then(({data}) => { for (let i = 0; i < data.list.length; i++) { if (this.$route.meta.menuId === data.list[i].menuId) { this.favorite = true } } }) },
// 收藏 OR 取消收藏
favoriteFunction () { let userFavorite = { userId: this.$store.state.user.id, functionId: this.$route.meta.menuId, } if (this.favorite) { removeUserFavorite(userFavorite).then(({data}) => { this.$message.success('操作成功') this.favorite = false }) } else { // 收藏
saveUserFavorite(userFavorite).then(({data}) => { this.$message.success('操作成功') this.favorite = true }) } },
async exportExcel() { this.searchData.limit = -1 this.searchData.page = 1 excel.exportTable({ url: "/inbound/searchOutboundNotification", columnMapping: this.columnList, //可以直接用table,不需要的列就剔除
mergeSetting: [],//需要合并的列
params: this.searchData, fileName: this.exportName+".xlsx", rowFetcher: res => res.data, columnFormatter: [], dropColumns: [], }) },
// 动态列开始 获取 用户保存的 格式列
async getTableUserColumn (tableId, columnId) { let queryTableUser = { userId: this.$store.state.user.name, functionId: this.$route.meta.menuId, tableId: tableId, status: true, languageCode: this.$i18n.locale } await getTableUserListLanguage(queryTableUser).then(({data}) => { if (data.rows.length > 0) { switch (columnId) { case 1: this.columnList = data.rows break; } } else { this.getColumnList(tableId, columnId) } }) },
// 获取 tableDefault 列
async getColumnList (tableId, columnId) { let queryTable = { functionId: this.$route.meta.menuId, tableId: tableId, languageCode: this.$i18n.locale } await getTableDefaultListLanguage(queryTable).then(({data}) => { if (data.rows.length !== 0) { switch (columnId) { case 1: this.columnList = data.rows break; } } }) },
//获取按钮的权限数据
getButtonAuthData () { let searchFlag = this.isAuth(this.menuId + ":search") let saveFlag = this.isAuth(this.menuId + ":save") let updateFlag = this.isAuth(this.menuId + ":update") let deleteFlag = this.isAuth(this.menuId + ":delete") let archiveFlag = this.isAuth(this.menuId + ":archive") let closeFlag = this.isAuth(this.menuId + ":close") let issueFlag = this.isAuth(this.menuId + ":issue") //处理页面的权限数据
this.authSearch = !searchFlag this.authSave = !saveFlag this.authUpdate = !updateFlag this.authDelete = !deleteFlag this.authArchive = !archiveFlag this.authClose = !closeFlag this.authIssue = !issueFlag }, } }</script><style scoped>/deep/ .customer-tab .el-tabs__content { padding: 5px !important;}
.el-table /deep/ .cell{ height: auto; line-height: 1.5;}</style>
|