|
|
<template> <div class="mod-config"> <el-form :inline="true" label-position="top" :model="searchData"> <el-form-item label="Customer"> <el-input v-model="searchData.customer" clearable style="width: 120px"></el-input> </el-form-item> <el-form-item label="Buyer"> <el-input v-model="searchData.buyer" clearable style="width: 120px"></el-input> </el-form-item> <el-form-item label="PO No"> <el-input v-model="searchData.poNo" clearable style="width: 140px"></el-input> </el-form-item> <el-form-item label="SKU"> <el-input v-model="searchData.sku" clearable style="width: 120px"></el-input> </el-form-item> <el-form-item label="Status"> <el-select v-model="searchData.status" placeholder="请选择" style="width:100px" clearable> <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> <el-form :inline="true" label-position="top" style="margin-top:10px "> <el-form-item> <el-button type="primary" @click="getDataList()" v-if="!editMode">查询</el-button> <el-button type="primary" style="margin-left: 2px" @click="toggleEditMode"> {{ editMode ? '确定' : '编辑' }} </el-button> </el-form-item> </el-form> <el-table ref="poTable" :height="height" :data="masterRows" border highlight-current-row style="width: 100%;" @current-change="onTableCurrentChange"> <el-table-column v-for="(item, index) in visibleColumns" :key="item.serialNumber || index" :sortable="item.columnSortable" :prop="item.columnProp" :header-align="item.headerAlign" :show-overflow-tooltip="item.showOverflowTooltip && (!editMode || !item.editAble)" :align="item.align" :fixed="item.fixed === '' ? false : item.fixed" :min-width="item.columnWidth" :label="item.columnLabel"> <template slot-scope="scope"> <template v-if="editMode && item.editAble && item.columnProp==='supplierName'"> <el-select v-model="rowSupplierNo[scope.row.id]" size="mini" style="width: 100%" clearable filterable placeholder="请选择供应商" @change="(val) => handleSupplierChange(scope.row, val)"> <el-option v-for="opt in supplierOptions" :key="String(opt.value)" :label="opt.label" :value="opt.value"> </el-option> </el-select> </template> <template v-else-if="editMode && item.editAble && item.columnProp==='partNo'"> <el-select v-model="rowPartNo[scope.row.id]" size="mini" style="width: 100%" clearable filterable placeholder="请选择物料" @change="(val) => handlePartNoChange(scope.row, val)"> <el-option v-for="opt in poPartNoOptions" :key="String(opt.value)" :label="opt.label" :value="opt.value"> </el-option> </el-select> </template> <template v-else-if="editMode && item.editAble"> <!-- 下拉框 --> <el-select v-if="item.editType === 'select'" v-model="scope.row[item.columnProp]" size="mini" style="width: 100%" clearable @change="onCellChange(scope.row)"> <el-option v-for="opt in getSelectOptionsForColumn(item)" :key="String(opt.value)" :label="opt.label" :value="opt.value"> </el-option> </el-select> <!-- 数字输入框 --> <el-input v-else-if="item.editType === 'num'" v-model="scope.row[item.columnProp]" type="number" size="mini" @change="onCellChange(scope.row)"> </el-input> <!-- 时间控件 --> <el-date-picker v-else-if="item.editType === 'date'" v-model="scope.row[item.columnProp]" type="date" size="mini" style="width: 100%" value-format="yyyy-MM-dd" placeholder="选择日期" @change="onCellChange(scope.row)"> </el-date-picker> <el-date-picker v-else-if="item.editType === 'datetime'" v-model="scope.row[item.columnProp]" type="datetime" size="mini" style="width: 100%" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期时间" @change="onCellChange(scope.row)"> </el-date-picker> <!-- 普通文本输入框 --> <el-input v-else v-model="scope.row[item.columnProp]" size="mini" @change="onCellChange(scope.row)"> </el-input> </template> <span v-else>{{ scope.row[item.columnProp] }}</span> </template> </el-table-column> </el-table>
<el-pagination @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> </div></template>
<script>import { searchPoDetailPage, batchUpdatePoDetail } from '@/api/order/poOrder.js'import { getPartList } from '@/api/part/partInfo.js'import { checkSrmSupplierList } from '@/api/srm/srmSupplier.js'
export default { name: 'PoOrder', data () { return { masterRows: [], /** * 需要单独写编辑 UI 的 columnProp 填在这里，才会走模板里「自定义」分支；不在此数组的仍用默认 select/num/text - rqrq * 示例：['mPlanner', 'comments'] */ rowPartNo: {}, //存储每行选中的物料编号
rowSupplierNo: {}, //存储每行选中的供应商编号
poPartNoOptions: [], supplierOptions: [], customEditColumnProps: [],
currentRow: null, // 各列下拉：select 列通过 selectOptionsKey 指向此处；也可在列定义里写 selectOptions 数组 - rqrq
columnSelectOptions: { poStatusOptions: [ { label: '已下达', value: '已下达' }, { label: '已取消', value: '已取消' } ], poPartNoOptions: [], transportOptions: [ { label: '海运 SEA', value: 'SEA' }, { label: '空运 AIR', value: 'AIR' }, { label: '陆运 ROAD', value: 'ROAD' } ], yesNoOptions: [ { label: 'Y', value: 'Y' }, { label: 'N', value: 'N' } ] }, searchData: { site: this.$store.state.user.site, customer: '', buyer: '', poNo: '', sku: '', status: '' }, height: 200, pageIndex: 1, pageSize: 20, totalPage: 0, dataList: [], editMode: false, columnList: [ { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1Customer', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'customer', headerAlign: 'center', align: 'center', columnLabel: 'Customer', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: false, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1Buyer', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'buyer', headerAlign: 'center', align: 'center', columnLabel: 'Buyer', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 90, showOverflowTooltip: true, editAble: false, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1VendorName', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'supplierName', headerAlign: 'center', align: 'center', columnLabel: 'Vendor Name', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 120, showOverflowTooltip: true, editAble: true, editType: 'select', selectOptionsKey: 'supplierOptions', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1VShortOffice', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'shortOffice', headerAlign: 'center', align: 'center', columnLabel: 'V_Short_Office', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 110, showOverflowTooltip: true, editAble: false, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1VShortNpc', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'shortNpc', headerAlign: 'center', align: 'center', columnLabel: 'V_Short_NPC', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: false, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1PoNo', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'poNo', headerAlign: 'center', align: 'center', columnLabel: 'PO_No', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 120, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1Item', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'item', headerAlign: 'center', align: 'center', columnLabel: 'Item', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 70, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1PartNo', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'partNo', headerAlign: 'center', align: 'center', columnLabel: 'Part_No', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 90, showOverflowTooltip: true, editAble: true, editType: 'select', selectOptionsKey: 'poPartNoOptions', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1Category', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'category', headerAlign: 'center', align: 'center', columnLabel: 'Category', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 90, showOverflowTooltip: true, editAble: false, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1Sku', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'sku', headerAlign: 'center', align: 'center', columnLabel: 'SKU', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: false, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1UnitPrice', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'price', headerAlign: 'center', align: 'center', columnLabel: 'Unit_Price', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 90, showOverflowTooltip: true, editAble: true, editType: 'num', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1PQty', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'qty', headerAlign: 'center', align: 'center', columnLabel: 'P_Qty', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 80, showOverflowTooltip: true, editAble: true, editType: 'num', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1PValue', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'value', headerAlign: 'center', align: 'center', columnLabel: 'P_Value', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 90, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1AQty', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'shipQty', headerAlign: 'center', align: 'center', columnLabel: 'A_Qty', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 80, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1AValue', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'sumPrice', headerAlign: 'center', align: 'center', columnLabel: 'A_Value', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 90, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1PDeparture', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'departure', headerAlign: 'center', align: 'center', columnLabel: 'P_Departure', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1PDestination', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'destination', headerAlign: 'center', align: 'center', columnLabel: 'P_Destination', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 110, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1SMethod', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'shipVia', headerAlign: 'center', align: 'center', columnLabel: 'S_Method', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 90, showOverflowTooltip: true, editAble: true, editType: 'select', selectOptionsKey: 'transportOptions', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DIssue', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'orderDate', headerAlign: 'center', align: 'center', columnLabel: 'D_Issue', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DEnquiry', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'enquiry', headerAlign: 'center', align: 'center', columnLabel: 'D_Enquiry', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1Status', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'status', headerAlign: 'center', align: 'center', columnLabel: 'Status', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 80, showOverflowTooltip: true, editAble: true, editType: 'select', selectOptionsKey: 'poStatusOptions', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DConfirmed', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'confirmed', headerAlign: 'center', align: 'center', columnLabel: 'D_Confirmed', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DNeed', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'wantReceiveDate', headerAlign: 'center', align: 'center', columnLabel: 'D_Need', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DNarrival', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'narrival', headerAlign: 'center', align: 'center', columnLabel: 'D_Narrival', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DCrd', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'crd', headerAlign: 'center', align: 'center', columnLabel: 'D_CRD', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DInspection', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'inspection', headerAlign: 'center', align: 'center', columnLabel: 'D_Inspection', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1ACrd', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'crd', headerAlign: 'center', align: 'center', columnLabel: 'A_CRD', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1Eta', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'eta', headerAlign: 'center', align: 'center', columnLabel: 'ETA', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1Flexid', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'flexid', headerAlign: 'center', align: 'center', columnLabel: 'FLEXID', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 90, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1AObd', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'obd', headerAlign: 'center', align: 'center', columnLabel: 'A_OBD', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DocSent', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'docSent', headerAlign: 'center', align: 'center', columnLabel: 'Doc_Sent', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 90, showOverflowTooltip: true, editAble: true, editType: 'select', selectOptionsKey: 'yesNoOptions', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1TelexRelease', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'telexRelease', headerAlign: 'center', align: 'center', columnLabel: 'Telex_Release', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'select', selectOptionsKey: 'yesNoOptions', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1AdvancePayment', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'advancePayment', headerAlign: 'center', align: 'center', columnLabel: 'Advance_Payment', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 120, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1AdvancePaid', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'advancePaid', headerAlign: 'center', align: 'center', columnLabel: 'Advance_Paid', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'select', selectOptionsKey: 'yesNoOptions', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DCreate', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'createTime', headerAlign: 'center', align: 'center', columnLabel: 'D_Create', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1MPlanner', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'planner', headerAlign: 'center', align: 'center', columnLabel: 'M_Planner', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1DEdit', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'edit', headerAlign: 'center', align: 'center', columnLabel: 'D_Edit', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'date', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1EPlanner', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'endPlanner', headerAlign: 'center', align: 'center', columnLabel: 'E_Planner', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1RemarkDelay', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'remarkDelay', headerAlign: 'center', align: 'center', columnLabel: 'Remark_Delay', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 110, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null }, { userId: this.$store.state.user.name, functionId: 812003, serialNumber: '812003Table1Comments', tableId: '812003Table1', tableName: 'PO Order', columnProp: 'remark', headerAlign: 'center', align: 'center', columnLabel: 'Comments', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 140, showOverflowTooltip: true, editAble: true, editType: 'text', selectOptionsKey: '', selectOptions: null } ] } }, computed: { visibleColumns () { return this.columnList.filter(c => !c.columnHidden) } }, created () { this.getDataList() }, mounted () { this.$nextTick(() => { this.height = window.innerHeight - 180 }) }, methods: { /** * 表格当前行变化：将选中行深拷贝到 currentRow；取消选中时为 null - rqrq */ onTableCurrentChange (row) { if (!row) { this.currentRow = null return } this.currentRow = row },
/** * 解析列对应的下拉选项：优先列上 selectOptions，其次 columnSelectOptions[selectOptionsKey] */ getSelectOptionsForColumn (item) { if (item.selectOptions && item.selectOptions.length) { return item.selectOptions } const key = item.selectOptionsKey if (key && this.columnSelectOptions[key]) { return this.columnSelectOptions[key] } return [] }, getDataList() { this.loading = true const params = { ...this.searchData, page: this.pageIndex, limit: this.pageSize } searchPoDetailPage(params).then(({ data }) => { if (data.code === 0) { this.dataList = data.page.list // 将 dataList 深拷贝到 masterRows，并为每行添加 changeFlag
this.masterRows = this.dataList.map(row => ({ ...row, changeFlag: 0 // 初始化变更标记
})) this.initRowEditValues() this.pageIndex = data.page.currPage this.pageSize = data.page.pageSize this.totalPage = data.page.totalCount } else { this.$message.error((data && data.msg) || '获取列表失败') } this.loading = false }).catch(() => { this.loading = false this.$message.error('请求失败') }) }, sizeChangeHandle (val) { this.pageSize = val this.pageIndex = 1 this.getDataList() }, currentChangeHandle (val) { this.pageIndex = val this.getDataList() }, onCellChange (row) { this.$set(row, 'changeFlag', 1) },
handleSupplierChange(row, supplierNo) { console.log('供应商变更:', supplierNo, '行ID:', row.id) const selectedOption = this.supplierOptions.find(opt => opt.value === supplierNo) if (selectedOption) { this.$set(row, 'supplierName', selectedOption.label) this.$set(row, 'supplierNo', selectedOption.value) this.$set(row, 'shortOffice', selectedOption.shortOffice || '') this.$set(row, 'shortNpc', selectedOption.shortNpc || '') this.$set(row, 'changeFlag', 1) } else if (!supplierNo) { this.$set(row, 'supplierName', '') this.$set(row, 'supplierNo', '') this.$set(row, 'shortOffice', '') this.$set(row, 'shortNpc', '') this.$set(row, 'changeFlag', 1) this.$set(this.rowSupplierNo, row.id, '') } },
handlePartNoChange(row, partNo) { console.log('物料变更:', partNo, '行ID:', row.id) // 根据 partNo 找到对应的物料信息
const selectedOption = this.poPartNoOptions.find(opt => opt.value === partNo) if (selectedOption) { // 更新物料相关信息
this.$set(row, 'partNo', selectedOption.label) //同时更新 category 和 sku
this.$set(row, 'category', selectedOption.category || '') this.$set(row, 'sku', selectedOption.sku || '') this.$set(row, 'changeFlag', 1) } else if (!partNo) { // 清空选择
this.$set(row, 'partNo', '') this.$set(row, 'category', '') this.$set(row, 'sku', '') this.$set(row, 'changeFlag', 1) // 清除存储的物料编号
this.$set(this.rowPartNo, row.id, '') } }, toggleEditMode () { if (!this.editMode) { this.editMode = true this.initRowEditValues() this.getSupplierOptions() this.getPartNoOptions() return } const changed = this.masterRows.filter(r => r.changeFlag === 1) this.batchUpdatePoOrder(changed) }, initRowEditValues () { this.rowSupplierNo = {} this.rowPartNo = {} this.masterRows.forEach(row => { if (row && row.id != null) { this.$set(this.rowSupplierNo, row.id, row.supplierNo || '') this.$set(this.rowPartNo, row.id, row.partNo || '') } }) }, getPartNoOptions() { console.log('获取分类选项') getPartList( { site: this.$store.state.user.site } ).then(({data}) => { if (data && data.code === 0) { console.log('接口返回的rows:', data.rows) // 查看返回数据
this.poPartNoOptions = (data.rows || []).map(item => ({ label: item.partNo, value: item.partNo, partNo: item.partNo, category: item.category, sku: item.sku })) } else { this.$message.error(data.msg || '操作失败') } }).catch(error => { this.$message.error('操作失败: ' + error.message) }) }, getSupplierOptions(){ console.log('获取供应商选项') checkSrmSupplierList( { site: this.$store.state.user.site } ).then(({data}) => { if (data && data.code === 0) { console.log('接口返回的rows:', data.rows) // 查看返回数据
this.supplierOptions = (data.rows || []).map(item => ({ label: item.supplierName, value: item.supplierNo, supplierNo: item.supplierNo, supplierName: item.supplierName, shortOffice: item.cshortOffice, shortNpc: item.cshortNpc })) } else { this.$message.error(data.msg || '操作失败') } }).catch(error => { this.$message.error('操作失败: ' + error.message) }) }, // 保存订单信息
batchUpdatePoOrder(changed) {
// 构建批量修改的数据
const updateData = changed.map(row => ({ id: row.id, ...row })) // 调用批量修改接口
batchUpdatePoDetail(updateData) .then(({ data }) => { if (data && data.code === 0) { this.$message({ message: `已提交 ${updateData.length} 行变更`, type: 'success', duration: 2000 }) changed.forEach(r => { this.$set(r, 'changeFlag', 0) }) this.editMode = false this.getDataList() } else { this.$message.error(data.msg || '操作失败') } }) .catch(error => { this.$message.error('操作失败: ' + error.message) }) } }}</script>
<style scoped lang="scss">.el-table /deep/ .cell { height: auto; line-height: 1.5;}</style>
|
