131 lines
4.1 KiB
Vue
131 lines
4.1 KiB
Vue
<template>
|
|
<div>
|
|
<el-row style="margin-bottom: 10px;">
|
|
<el-col :span="12">
|
|
<OrderSelect @change="handleOrderChange" />
|
|
</el-col>
|
|
<el-col :span="12" style="text-align: right;">
|
|
<el-button type="primary" @click="handleCreate">确认创建</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-table :data="orderItems" style="width: 100%;">
|
|
<el-table-column label="产品">
|
|
<template slot-scope="scope">
|
|
<ProductInfo :productId="scope.row.productId" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="规格">
|
|
<template slot-scope="scope">
|
|
<el-button type="text" @click="handleSpec(scope.row)">查看规格</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="制造规格">
|
|
<template slot-scope="scope">
|
|
<el-select v-model="scope.row.manufacturingSpecIds" placeholder="请选择制造规格" multiple>
|
|
<el-option v-for="item in manufacturingSpecList" :key="item.specId" :label="item.specName" :value="item.specId" />
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<el-dialog title="产品规范" :visible.sync="specDialogVisible" width="600px" append-to-body>
|
|
<ProductSpec v-if="form.groupId" :groupId="form.groupId" :readonly="false"/>
|
|
<div v-else>
|
|
<el-select placeholder="请选择产品规范" @change="handleChangeSpec" style="width: 100%;">
|
|
<el-option v-for="item in productSpecList.filter(item => item.productId != this.form.productId)" :key="item.groupId" :label="item.groupName" :value="item.groupId" />
|
|
<template #empty>
|
|
<el-button type="primary" @click="handleAddSpec">新增产品规范</el-button>
|
|
</template>
|
|
</el-select>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import OrderSelect from "../components/OrderSelect";
|
|
import { listOrderDetail, updateOrderDetail } from "@/api/wms/orderDetail";
|
|
import ProductInfo from "@/components/KLPService/Renderer/ProductInfo";
|
|
import MSpecSelect from "@/views/work/components/MSpecSelect";
|
|
import ProductSpec from "@/views/wms/order/panels/spec.vue";
|
|
|
|
import { listManufacturingSpec } from "@/api/work/manufacturingSpec";
|
|
import { listProductSpecGroup } from "@/api/work/productSpecGroup";
|
|
|
|
export default {
|
|
name: 'CreateByOrder',
|
|
components: {
|
|
OrderSelect,
|
|
ProductInfo,
|
|
MSpecSelect,
|
|
ProductSpec
|
|
},
|
|
created() {
|
|
listManufacturingSpec().then(res => {
|
|
this.manufacturingSpecList = res.rows;
|
|
})
|
|
listProductSpecGroup().then(response => {
|
|
this.productSpecList = response.rows;
|
|
});
|
|
},
|
|
data() {
|
|
return {
|
|
order: null,
|
|
orderItems: [],
|
|
specDialogVisible: false,
|
|
form: {
|
|
groupId: undefined
|
|
},
|
|
manufacturingSpecList: [],
|
|
productSpecList: [],
|
|
}
|
|
},
|
|
methods: {
|
|
handleOrderChange(order) {
|
|
this.order = order;
|
|
listOrderDetail({
|
|
orderId: order.orderId
|
|
}).then(res => {
|
|
this.orderItems = res.rows
|
|
})
|
|
},
|
|
handleCreate() {
|
|
console.log(this.orderItems);
|
|
if (this.orderItems.length === 0) {
|
|
this.$message.error('请选择订单');
|
|
return;
|
|
}
|
|
for (const item of this.orderItems) {
|
|
if (item.groupId && item.manufacturingSpecIds.length === 0) {
|
|
this.$message.error('请选择制造规格');
|
|
return;
|
|
}
|
|
}
|
|
this.$emit('create', this.orderItems);
|
|
},
|
|
handleSpec(row) {
|
|
this.specDialogVisible = true;
|
|
this.form = row;
|
|
},
|
|
handleChangeSpec(groupId) {
|
|
// 确认更换
|
|
this.$modal && this.$modal.confirm('是否确认更换产品规范？').then(() => {
|
|
this.form.groupId = groupId;
|
|
updateOrderDetail(this.form).then(response => {
|
|
this.$modal && this.$modal.msgSuccess("修改成功");
|
|
this.open = false;
|
|
this.getList();
|
|
}).finally(() => {
|
|
this.buttonLoading = false;
|
|
});
|
|
});
|
|
},
|
|
handleAddSpec() {
|
|
this.$router.push({
|
|
path: '/production/pspec',
|
|
});
|
|
}
|
|
}
|
|
}
|
|
</script> |