You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1379 lines
41 KiB
1379 lines
41 KiB
<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>
|