|
|
@@ -0,0 +1,324 @@
|
|
|
+
|
|
|
+<template>
|
|
|
+ <ele-modal width="1160px" :visible="visible" v-if="visible" :append-to-body="true" :close-on-click-modal="true"
|
|
|
+ custom-class="ele-dialog-form" title="选择物料" @update:visible="updateVisible">
|
|
|
+ <header-title title="基本信息"></header-title>
|
|
|
+ <el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="产品名称:" prop="name">
|
|
|
+ <el-input disabled v-model="form.name" readonly />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="产品编码:" prop="code">
|
|
|
+ <el-input disabled v-model="form.code" placeholder="自动带入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="型号:" prop="modelType">
|
|
|
+ <el-input disabled v-model="form.modelType" placeholder="自动带入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="牌号:" prop="brandNum">
|
|
|
+ <el-input disabled v-model="form.brandNum" placeholder="自动带入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="规格:" prop="specification">
|
|
|
+ <el-input disabled v-model="form.specification" placeholder="自动带入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="计量单位:" prop="measuringUnit">
|
|
|
+ <el-input disabled v-model="form.measuringUnit" placeholder="自动带入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <header-title title="物料BOM">
|
|
|
+ <div>
|
|
|
+ <el-button size="small" icon="el-icon-plus" class="ele-btn-icon" type="primary"
|
|
|
+ @click="handleAdd">新增</el-button>
|
|
|
+ </div>
|
|
|
+ </header-title>
|
|
|
+
|
|
|
+ <el-card v-for="(bomItem, index) in form.bomList" :key="index">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="BOM编码:">
|
|
|
+ {{ bomItem.code }}
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="BOM名称:" prop="name">
|
|
|
+ {{ bomItem.name }}
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="版本号:" prop="version">
|
|
|
+ {{ bomItem.version }}
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="状态:" prop="status">
|
|
|
+ <el-select v-model="bomItem.status" placeholder="" filterable disabled>
|
|
|
+ <el-option v-for="item in statusList" :key="item.value" :label="item.label"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="生产版本:" prop="produceVersionId">
|
|
|
+ <el-select v-model="bomItem.produceVersionId" filterable placeholder="请选择" disabled
|
|
|
+ :style="{ width: '100%' }">
|
|
|
+ <el-option v-for="item in versionList" :key="item.code" :label="item.code + '-' + item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="所属工厂:" prop="factoryId">
|
|
|
+ <factorySelect v-model="bomItem.factoryId" disabled />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="基本数量:" prop="baseCount">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ {{ bomItem.baseCount }}
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="2"> </el-col>
|
|
|
+ <el-col :span="10">
|
|
|
+ <DictSelection disabled dictName="计量单位:" v-model="bomItem.baseCountUnit" />
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row>
|
|
|
+ <div class="ele-body">
|
|
|
+ <ele-pro-table ref="table" :columns="columns" :need-page="false" row-key="id"
|
|
|
+ :datasource="bomItem.subDetailList" min-height="200px">
|
|
|
+ <template v-slot:toolbar>
|
|
|
+ <el-button type="primary" size="small" @click="openEdit(index)">编辑</el-button>
|
|
|
+
|
|
|
+ <el-popconfirm class="ele-action" title="确定要删除此物料BOM？" @confirm="remove(bomItem)">
|
|
|
+ <template v-slot:reference>
|
|
|
+ <el-button type="danger" size="small" icon="el-icon-delete">
|
|
|
+ 删除
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-popconfirm>
|
|
|
+ </template>
|
|
|
+ </ele-pro-table>
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
+ </el-card>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <!-- 物料Bom -->
|
|
|
+ <MaterialAdd :visible.sync="materialShow" :data="current" :categoryId="categoryId" @done="done"
|
|
|
+ ref="materialAddRef">
|
|
|
+ </MaterialAdd>
|
|
|
+ </ele-modal>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+
|
|
|
+import MaterialAdd from './MaterialAdd.vue';
|
|
|
+import { pageList } from '@/api/technology/version/version.js';
|
|
|
+import { getCategoryBom } from '@/api/material/product';
|
|
|
+import { bomDelete } from '@/api/material/BOM';
|
|
|
+import factorySelect from '@/components/CommomSelect/factory-select.vue';
|
|
|
+
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ MaterialAdd,
|
|
|
+ factorySelect
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ // 弹窗是否打开
|
|
|
+ visible: Boolean,
|
|
|
+ // 修改回显的数据
|
|
|
+ data: Object
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ const defaultForm = {
|
|
|
+ id: null,
|
|
|
+
|
|
|
+ code: '',
|
|
|
+ name: '',
|
|
|
+ modelType: '',
|
|
|
+ brandNum: '',
|
|
|
+ specification: '',
|
|
|
+ measuringUnit: '',
|
|
|
+
|
|
|
+ bomList: []
|
|
|
+ };
|
|
|
+ return {
|
|
|
+ defaultForm,
|
|
|
+ // 表单数据
|
|
|
+ form: {
|
|
|
+ ...defaultForm
|
|
|
+ },
|
|
|
+
|
|
|
+ versionList: [],
|
|
|
+
|
|
|
+ // 表单验证规则
|
|
|
+ rules: {
|
|
|
+ categoryName: [
|
|
|
+ { required: true, message: '请输入产品名称', trigger: 'blur' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ type: 'index',
|
|
|
+ width: 55,
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '子项编号',
|
|
|
+ prop: 'subCode',
|
|
|
+ action: 'subCode'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '物料名称',
|
|
|
+ prop: 'categoryName',
|
|
|
+ action: 'categoryName'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '物料编码',
|
|
|
+ prop: 'categoryCode'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '牌号',
|
|
|
+ prop: 'brandNum'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '型号',
|
|
|
+ prop: 'modelType'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '净重',
|
|
|
+ prop: 'count'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '重量单位',
|
|
|
+ prop: 'unit'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+
|
|
|
+ statusList: [
|
|
|
+ { label: '草稿', value: -1 },
|
|
|
+ { label: '失效', value: 0 },
|
|
|
+ { label: '生效', value: 1 }
|
|
|
+ ],
|
|
|
+
|
|
|
+ // 提交状态
|
|
|
+ loading: false,
|
|
|
+
|
|
|
+ categoryId: null,
|
|
|
+
|
|
|
+ current: null,
|
|
|
+
|
|
|
+ materialShow: false
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ // 是否开启响应式布局
|
|
|
+ styleResponsive() {
|
|
|
+ return this.$store.state.theme.styleResponsive;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ openEdit(index) {
|
|
|
+ this.current = this.form.bomList[index];
|
|
|
+ console.log(this.current);
|
|
|
+ this.materialShow = true;
|
|
|
+ },
|
|
|
+
|
|
|
+ /* 表格数据源 */
|
|
|
+ datasource({ page, limit, where }) {
|
|
|
+ return [];
|
|
|
+ },
|
|
|
+
|
|
|
+ async getVersionList() {
|
|
|
+ const res = await pageList({
|
|
|
+ pageNum: 1,
|
|
|
+ size: 100
|
|
|
+ });
|
|
|
+
|
|
|
+ this.versionList = res.list;
|
|
|
+ },
|
|
|
+
|
|
|
+ handleAdd() {
|
|
|
+ this.current = null;
|
|
|
+ this.materialShow = true;
|
|
|
+ },
|
|
|
+
|
|
|
+ /* 更新visible */
|
|
|
+ updateVisible(value) {
|
|
|
+ this.$emit('update:visible', value);
|
|
|
+ },
|
|
|
+
|
|
|
+ async getCategoryBomFn() {
|
|
|
+ const res = await getCategoryBom(this.categoryId);
|
|
|
+ this.form.bomList = res.bomList;
|
|
|
+ },
|
|
|
+
|
|
|
+ remove(row) {
|
|
|
+ bomDelete([row.id])
|
|
|
+ .then((message) => {
|
|
|
+ this.$message.success(message);
|
|
|
+ this.getCategoryBomFn();
|
|
|
+ })
|
|
|
+ .catch((e) => {
|
|
|
+ this.$message.error(e.message);
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ done() {
|
|
|
+ this.materialShow = false
|
|
|
+ this.getCategoryBomFn();
|
|
|
+ },
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ watch: {
|
|
|
+ async visible(visible) {
|
|
|
+ if (visible) {
|
|
|
+ this.getVersionList();
|
|
|
+ if (this.data) {
|
|
|
+ this.categoryId = this.data.id;
|
|
|
+ this.getCategoryBomFn();
|
|
|
+ this.$util.assignObject(this.form, {
|
|
|
+ ...this.data
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$refs.form.clearValidate();
|
|
|
+ this.form = { ...this.defaultForm };
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
ysy