kd-aiot-frontend/src/views/material/product/detail.vue

<template>
  <div class="ele-body">
    <el-card shadow="never">
      <el-form label-width="100px" ref="manageForm" :model="form" :rules="rules">
        <headerTitle title="基本信息">
          <el-button @click="cancel">返回</el-button>
          <el-button type="primary" @click="submit" :loading="loading">保存
          </el-button>
        </headerTitle>

        <el-row :gutter="24">
          <el-col :span="8">
            <el-form-item label="分类" prop="categoryLevelName">
              <el-input v-model="form.categoryLevelName" @click.native="openCategory" />
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="编码" prop="code">
              <el-input v-if="ruleCode == '自定义'" v-model="form.code" readonly @click.native="openCode"
                :disabled="status == 0" />
              <el-input v-else v-model="form.code" :disabled="status == 0" />
            </el-form-item>
          </el-col>


          <el-col :span="8">
            <el-form-item label="名称" prop="name">
              <el-input v-model="form.name" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="存货类型:" prop="attributeType">
              <el-select v-model="form.attributeType" filterable class="ele-block">
                <el-option v-for="item in attributeList" :key="item.value" :value="item.value"
                  :label="item.label"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <div>
              <el-form-item label="属性类型" prop="componentAttribute">
                <el-select style="width: 100%" v-model="form.componentAttribute" filterable multiple>
                  <el-option v-for="item in lbjtList" :key="item.value" :value="item.value"
                    :label="item.label"></el-option>
                </el-select>
              </el-form-item>
            </div>

          </el-col>
          <el-col :span="8">
            <div>
              <el-form-item label="生产类型" prop="produceType">
                <el-select style="width: 100%" v-model="form.produceType" filterable>
                  <el-option v-for="item in dictList" :key="item.value" :value="item.value"
                    :label="item.label"></el-option>
                </el-select>
              </el-form-item>
            </div>

          </el-col>


          <el-col :span="8">
            <!-- v-if="
            [1, 23, 9, 28].includes(
              Number(categoryLevelPathId || $route.query.rootTreeId)
            )
          " -->
            <el-form-item label="加工类型" prop="isConsumable">
              <el-select v-model="form.isConsumable" style="width: 100%" @change="changeConsumable">
                <el-option :value="1" label="批量"></el-option>
                <el-option :value="0" label="单件"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="牌号" prop="brandNum">
              <el-input v-model="form.brandNum" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="型号" prop="modelType">
              <el-input v-model="form.modelType" />
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="规格" prop="specification">
              <el-input v-model="form.specification" @input="inputSpe" />
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="计量类型" prop="measureType">
              <el-select v-model="form.measureType" style="width: 100%" @change="changeMeasureType">
                <el-option v-for="item in measureTypeList" :key="item.value" :value="item.value"
                  :label="item.label"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="计量单位" prop="measuringUnit">
              <DictSelection dictName="计量单位" clearable v-model="form.measuringUnit" @change="changeUnit">
              </DictSelection>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="重量单位" prop="weightUnit">
              <DictSelection dictName="重量单位" clearable v-model="form.weightUnit" @change="changeWeightUnit">
              </DictSelection>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="包装单位" prop="packingUnit">
              <DictSelection dictName="包装单位" clearable v-model="form.packingUnit" @change="changeUnit">
              </DictSelection>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="图号/件号" prop="imgCode">
              <el-input v-model="form.imgCode" />
            </el-form-item>
          </el-col>


          <el-col :span="8">
            <el-form-item label="毛重">
              <div class="form-line">
                <el-input v-model="form.roughWeight" @input="handleInput2" />
              </div>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="净重" prop="netWeight"
              :rules="{ required: form.measuringUnit == form.weightUnit, trigger: ['blur', 'change'], message: '请输入净重', }">
              <div class="form-line">
                <el-input v-model="form.netWeight" @input="handleInput3" />
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="体积">
              <div class="form-line">
                <el-input v-model="form.volume" style="width: calc(100% - 100px)" />
                <!-- @input="handleInput1" -->
                <DictSelection dictName="体积单位" clearable v-model="form.volumeUnit" style="width: 100px">
                </DictSelection>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="级别">
              <template>
                <el-select style="width: 100%" v-model="form.level" placeholder="请选择">
                  <el-option v-for="item in levelOptions" :label="item.label" :value="item.value" :key="item.value">
                  </el-option>
                </el-select>
              </template>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="状态">
              <template>

                <el-switch v-model="form.isEnabled" :active-text="form.isEnabled == 1 ? '启用' : '停用'" :active-value="1"
                  :inactive-value="0">
                </el-switch>


              </template>
            </el-form-item>
          </el-col>

          <el-col :span="8" v-for="(f, idx) in fileList" :key="idx">
            <el-form-item :label="f.label">
              <template>
                <div class="form-line">

                  <component :is="f.tagType" v-model="form.extField[f.prop]" :disabled="f.extAttribute?.disabled"
                    clearable :isProhibit="f.modelType == 'dict' ? f.extAttribute?.disabled : false
                      " :dictName="f.modelType == 'dict' ? f.label : ''"></component>
                </div>
              </template>
            </el-form-item>
          </el-col>


        </el-row>
      </el-form>
    </el-card>
    <el-card shadow="never">
      <headerTitle title="标签"></headerTitle>
      <!-- {{ form.extTagField }} -->
      <el-form label-width="100px"  >
        <el-form-item label="是否消耗品">
          <el-radio-group v-model="form.extTagField.isConsumables">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
    </el-card>

    <!--  自定义编码 -->
    <CodeDialog ref="codeRefs" v-if="codeShow" @close="codeShow = false" @chooseCode="chooseCode" />
    <!-- 分类选择弹窗 -->
    <CategoryDialog ref="categoryRefs" @chooseCategory="confirmCategory" />
    <!-- 仓储配置 -->
    <WarehouseInfo ref="warehouseRefs" v-if="isShow" :form="categoryWms" :measuringUnit="form.measuringUnit"
      :packingUnit="form.packingUnit" :packageDispositionVOList="packageDispositionVOList"
      @change="changePackagingSpecification" />
    <!-- 销售配置 -->
    <SalesInfos ref="salesRefs" :form="categorySales" />
    <!-- 采购信息 -->
    <PurchasingInfo ref="PurchasingInfoRefs" :form="categoryPurchase" />
    <!-- 生产信息 -->
    <ProductionInfo ref="productionRefs" :form="categoryMes" />
    <!-- 计划 -->
    <PlanInfo ref="planRefs" :form="categoryAps" />
    <!-- 质量配置 -->
    <QualityInfo ref="qualityRefs" :form="categoryQms" />
    <!-- 舟皿信息 -->
    <BoatInfo ref="qualityRefs" :form="categoryPallet" />
    <!-- 周转车信息 -->
    <TurnoverInfo ref="turnoverRefs" :form="categoryVehicle" />
    <!-- 模具信息 -->
    <MoldInfo ref="moldRefs" :form="categoryMold" />
    <!-- 备注信息 -->
    <RemarkInfo ref="remarkRefs" :form="remarkform" />
    <!-- 关联信息 -->
    <linkMsg ref="linkMsgRef" :id="$route.query.id" :categoryLevelId="form.categoryLevelId"
      :categoryLevelGroupId="form.categoryLevelGroupId" :code="form.code" />
  </div>
</template>

<script>
import SalesInfos from './components/SalesInfos.vue';
import PurchasingInfo from './components/PurchasingInfo.vue';
import GroupDialog from './components/GroupDialog.vue';
import CodeDialog from './components/codeDialog.vue';
import CategoryDialog from './components/CategoryDialog.vue';
import WarehouseInfo from './components/WarehouseInfo.vue';
import ProcureInfo from './components/ProcureInfo.vue';
import ProductionInfo from './components/ProductionInfo.vue';
import PlanInfo from './components/PlanInfo.vue';
import SalesInfo from './components/SalesInfo.vue';
import QualityInfo from './components/QualityInfo.vue';
import BoatInfo from './components/BoatInfo.vue';
import TurnoverInfo from './components/TurnoverInfo.vue';
import MoldInfo from './components/MoldInfo.vue';
import RemarkInfo from './components/RemarkInfo.vue';
import deptSelect from '@/components/CommomSelect/dept-select.vue';
import personSelect from '@/components/CommomSelect/person-select.vue';
import linkMsg from './components/link-msg.vue';
import { getDetails } from '@/api/classifyManage/itemInformation';
import { getByCode } from '@/api/system/dictionary-data';
import { getCode, rootCategoryCode, fieldModel } from '@/api/codeManagement';

import { addMaterial } from '@/api/material/list.js';
import { deepClone } from '@/utils/index';
import { finishPageTab, reloadPageTab } from '@/utils/page-tab-util';

export default {
  name: 'product',
  components: {
    SalesInfos,
    PurchasingInfo,
    linkMsg,
    GroupDialog,
    deptSelect,
    personSelect,
    WarehouseInfo,
    ProcureInfo,
    ProductionInfo,
    PlanInfo,
    SalesInfo,
    QualityInfo,
    BoatInfo,
    TurnoverInfo,
    MoldInfo,
    RemarkInfo,
    CategoryDialog,
    CodeDialog
  },
  data() {
    return {
      isShow: true,
      packagingSpecificationList: [],
      loading: false,
      measureTypeList: [
        {
          label: '数量',
          value: 1
        },
        {
          label: '重量',
          value: 2
        },
        {
          label: '体积',
          value: 3
        }, {
          label: '容积',
          value: 4
        },
        {
          label: '面积',
          value: 5
        },
      ],
      levelOptions: [
        {
          label: '特级',
          value: '特级'
        },
        {
          label: '一级',
          value: '一级'
        },
        {
          label: '二级',
          value: '二级'
        },
        {
          label: '三级',
          value: '三级'
        }
      ],
      form: {
        categoryLevelGroupName: '',
        componentAttribute: [],
        categoryLevelName: '',
        isConsumable: 0,
        measuringUnit: '',
        netWeight: '',
        attributeType: 1,
        weightUnit: '',
        packingUnit: '',
        isEnabled: 1,
        extField: {},
        // isConsumables:2,
        extTagField: {
          isConsumables: 0,
        },

      },
      lbjtList: [
        {
          label: '自制件',
          value: 1
        },
        {
          label: '采购件',
          value: 2
        },
        {
          label: '外协件',
          value: 3
        }, {
          label: '受托件',
          value: 4
        }
      ],
      attributeList: [
        {
          label: '总装',
          value: 1
        },
        {
          label: '部件',
          value: 2
        },
        {
          label: '零件',
          value: 3
        }, {
          label: '原材料',
          value: 4
        }
      ],
      remarkform: {
        remarkAttach: []
      },
      categorySales: {},
      categoryPurchase: { purchaseMultiplier: 1, measuringUnit: '' },
      categoryAps: {},
      categoryMes: { productionDays: '1' },
      categoryMold: {},
      categoryPallet: {},
      categoryQms: {
        isComeCheck: '1'
      },
      categoryVehicle: {},
      categoryWms: {
        isUnpack: 1,
        isWarn: 1,
        inventoryMode: '',
        secureInventory: '1',
        minInventory: '1',
        maxInventory: '1',
      },
      packageDispositionVOList: [],
      categoryLevelPathId: null,

      dictList: [
        {
          label: '加工',
          value: 1
        },
        {
          label: '装配',
          value: 3
        },
      ],
      fileList: [],
      // 表单验证规则
      rules: {
        measureType: [
          { required: true, message: '请选择计量类型', trigger: 'change' }
        ],
        categoryLevelGroupName: [
          { required: true, message: '请选择所属物料组', trigger: 'change' }
        ],
        code: [{ required: true, message: '请输入编码', trigger: 'blur' }],
        name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
        produceType: [
          { required: true, message: '请选择生产类型', trigger: 'change' }
        ],
        componentAttribute:[
         { required: true, message: '请选择生产类型', trigger: 'change' }
        ],
        attributeType: [
          { required: true, message: '请选择属性类型', trigger: 'change' }
        ],
        categoryLevelName: [
          { required: true, message: '请选择所属分类', trigger: 'change' }
        ],
        measuringUnit: [
          { required: true, message: '请选择计量单位', trigger: 'change' }
        ],

        weightUnit: [
          { required: true, message: '请选择重量单位', trigger: 'change' }
        ],

        packingUnit: [
          { required: true, message: '请选择包装单位', trigger: 'change' }
        ],

        netWeight: [
          { required: true, message: '请输入净重', trigger: 'blur' }
        ]
      },
      PathInfo: {},
      id: null,

      ruleCode: null,
      codeShow: false,

      status: null
    };
  },
  watch: {
    '$route.query.id': {
      handler(id) {
        if (id) {
          this._getDetails();
        } else {
          let { lyType } = this.$route.query;

          let arrId = '';
          if (lyType == "wp") {
            arrId = 3
          }
          if (lyType == "cp") {
            arrId = 1
          }

          this.form = {
            categoryLevelGroupName: '',
            // categoryLevelName: '',
            componentAttribute: [],
            isConsumable: 0,
            attributeType: arrId,
            measuringUnit: '',
            netWeight: '',
            weightUnit: '',
            packingUnit: '',
            extField: {},
            extTagField: {
              isConsumables: 0,
            },
            measureType: 1,
            isEnabled: 1,

          };

          console.log(this.form);

          this.categorySales = {};
          this.purchaseInfo = {};
          this.remarkform = {
            remarkAttach: []
          };
          this.categoryAps = {};
          this.categoryMes = { productionDays: '20', isCompleteSet: 0, isModify: 0, isRework: 0, isRematerial: 0, isByProduct: 0, isWaste: 0, isDefective: 0 };
          this.categoryMold = {};
          this.categoryPallet = {};
          this.categoryQms = {};
          this.categoryVehicle = {};
          this.categoryWms = {
            isUnpack: 1,
            isWarn: 1,
            inventoryMode: this.form.isConsumable,
            minPackageCell: '',
            secureInventory: '10',
            minInventory: '10',
            maxInventory: '10',
          };
          this.packageDispositionVOList = [];
          this.categoryLevelPathId = null;

          // this.dictList = [];

          this.fileList = [];
        }
      },
      deep: true,
      immediate: true
    }
  },
  async activated() {
    this.status = this.$route.query.status;
    this.form.categoryLevelId = this.$route.query.categoryLevelId;
    this.form.categoryLevelName = this.$route.query.categoryLevelName;
    this.form.categoryLevelPath = this.$route.query.categoryLevelPath;
    this.form.categoryLevelPathId = this.$route.query.categoryLevelPathId;

    this.ruleCode = this.$route.query.ruleCode;
    if (this.ruleCode && this.ruleCode != '自定义' && this.status != 0) {
      const code = await getCode(this.ruleCode);
      this.$set(this.form, 'code', code);
    }

    this.getFieldModel();

    // this.getDictList('zeroPartPros');
  },
  async created() {
    //新增

    this.$set(
      this.form,
      'categoryLevelId',
      this.$route.query.categoryLevelId
    );
    this.$set(
      this.form,
      'categoryLevelName',
      this.$route.query.categoryLevelName
    );
    this.$set(
      this.form,
      'categoryLevelPath',
      this.$route.query.categoryLevelPath
    );
    this.$set(
      this.form,
      'categoryLevelPathId',
      this.$route.query.categoryLevelPathId
    );
    this.status = this.$route.query.status;
    this.ruleCode = this.$route.query.ruleCode;
    if (this.ruleCode && this.ruleCode != '自定义' && this.status != 0) {
      const code = await getCode(this.ruleCode);
      this.$set(this.form, 'code', code);
    }

    this.getFieldModel();

    this.getDictList('zeroPartPros');
  },
  methods: {
    inputSpe(val) {
      if (this.form.measuringUnit == '立方') {
        if (!val || typeof val !== 'string') {
          this.form.volume = 0;
          return;
        };

        let modelArr = val.split('*');
        let modelLong = modelArr[0]; // model规格长度
        let modeWide = modelArr[1]; // model规格宽度
        let modeHight = modelArr[2]?.substr(0, modelArr[2].indexOf('cm')); // model规格高度
        modeHight = Number(modeHight);

        let aa = (modelLong * modeWide * modeHight) / 1000000;
        console.log(aa, 'aa')
        this.form.volume = aa;
      } else {
        this.form.volume = '';
      }

    },
    changeMeasureType() {
      if (this.form.measureType == 1) {
        this.$set(this.categoryWms, 'isUnpack', 1);
      } else {
        this.$set(this.categoryWms, 'isUnpack', 0);
      }

    },
    handleInput(value) {
      // this.form.volume = this.$handleInputPublicHasPoint(value);
    },
    handleInput2(value) {
      this.form.roughWeight = this.$handleInputPublicHasPoint(value);
    },
    handleInput3(value) {
      // this.form.netWeight = this.$handleInputPublicHasPoint(value);
      if (this.form.weightUnit == this.form.measuringUnit) {
        this.$refs.warehouseRefs.changeNetWeight(this.form.netWeight);
      }
    },
    changeConsumable() {
      this.$set(this.categoryWms, 'inventoryMode', this.form.isConsumable);
    },
    changeWeightUnit() {
      if (this.form.measuringUnit && this.form.packingUnit && this.form.netWeight) {
        this.$refs.warehouseRefs.changeNetWeight(this.form.netWeight);
      }
    },
    changeUnit() {
      if (this.$route.query.id == '' || this.$route.query.id == null) {

        if (this.form.measuringUnit) {
          // 计量单位是‘立方’   体积单位默认是‘立方’
          if (this.form.measuringUnit == '立方' && this.form.specification != '') {
            this.form.volumeUnit = '立方';
            this.inputSpe(this.form.specification)
          } else {
            this.form.volume = 0;
          }
          this.categoryPurchase.measuringUnit = this.form.measuringUnit;
          console.log(this.categoryPurchase.measuringUnit, '采购信息');
          // 如果有计量单位和包装单位 默认添加包装组
          if (this.form.packingUnit) {
            this.$refs.warehouseRefs.defaultBuild(this.form.packingUnit);
          }
        }
      } else {
        this.isShow = false;
        if (this.form.measuringUnit) {
          this.categoryPurchase.measuringUnit = this.form.measuringUnit;

          if (this.form.packingUnit) {
            console.log(this.form.measuringUnit, 'this.form.measuringUnit');
            console.log(this.form.packingUnit, 'this.form.packingUnit');
            if (this.packageDispositionVOList.length === 0) {
              console.log('如果没有包装组');
              this.$refs.warehouseRefs.defaultBuild(this.form.packingUnit);
            }
          }
        }
        this.isShow = true;
      }
    },

    changePackagingSpecification(val) {
      this.packagingSpecificationList = val;
    },
    async _getDetails() {

      const data = await getDetails(this.$route.query.id);


      const info = deepClone(data);
      info.category.produceType = info.category.produceType[0];

      this.form = {
        ...info.category
      };

      // if (this.form.measuringUnit && this.form.packingUnit) {
      //   this.$refs.warehouseRefs.defaultBuild(this.form.packingUnit);
      // }
      this.categoryLevelPathId = info.category.categoryLevelPathIdParent;
      this.judgeSet(info);

      if (this.status == 1) {
        rootCategoryCode(this.categoryLevelPathId).then((res) => {
          this.$set(this.form, 'code', res);
        });

        this.form.createTime = null;
      }

      this.$forceUpdate();
    },
    // 判断字段类型并赋值
    judgeSet(info) {
      console.log('info-------', info);

      if (typeof info.categoryAps == 'string') {
        this.categoryAps = {};
      } else {
        this.categoryAps = info.categoryAps;
      }
      if (typeof info.categoryMes == 'string') {
        this.categoryMes = {};
      } else {
        this.categoryMes = info.categoryMes;
      }
      if (typeof info.categoryMold == 'string') {
        this.categoryMold = {};
      } else {
        this.categoryMold = info.categoryMold;
      }
      if (typeof info.categoryPallet == 'string') {
        this.categoryPallet = {};
      } else {
        this.categoryPallet = info.categoryPallet;
      }
      if (typeof info.categorySales == 'string') {
        this.categorySales = {};
      } else {
        this.categorySales = info.categorySales;
      }

      if (typeof info.categoryPurchase == 'string') {
        this.categoryPurchase = {};
      } else {
        this.categoryPurchase = info.categoryPurchase;
      }
      if (typeof info.categoryQms == 'string') {
        this.categoryQms = {};
      } else {
        this.categoryQms = info.categoryQms;
      }
      if (typeof info.categoryVehicle == 'string') {
        this.categoryVehicle = {};
      } else {
        this.categoryVehicle = info.categoryVehicle;
      }
      if (typeof info.categoryWms == 'string') {
        this.categoryWms = {};
      } else {
        this.categoryWms = info.categoryWms;
      }
      if (typeof info.packageDispositionVOList == 'string') {
        this.packageDispositionVOList = [];
      } else {
        this.packageDispositionVOList = info.packageDispositionVOList;
        console.log(
          'this.packageDispositionVOList---!!!----',
          this.packageDispositionVOList
        );
      }
    },

    getFieldModel() {
      fieldModel({ relevance: 't_main_category' }).then((res) => {
        this.fileList = res;

        if(!this.form.extTagField){
          this.form.extTagField={
            isConsumables:0
          }; // 初始化动态模型属性

        }
        // this.$set(this.form.extTagField, 'isConsumables', 0); // 初始化动态模型属性

        this.fileList.forEach((f) => {
          this.$set(this.form.extField, f.prop, ''); // 初始化动态模型属性
          // this.$set(this.form.extTagField, f.prop, ''); // 初始化动态模型属性  
        });
      });
    },

    // 确定分类
    async confirmCategory(node, title, PathInfo, ruleCode) {
      if (this.status != 0) {
        this.$set(this.form, 'code', null);
      }
      this.categoryLevelPathId = PathInfo.categoryLevelPathId.split(',')[0];

      if (title == '选择产品分类') {
        this.$set(this.form, 'productCategoryLevelName', node.name);
        this.$set(this.form, 'productCategoryLevelId', node.id);
      } else {
        this.$set(this.form, 'categoryLevelName', node.name);
        this.$set(this.form, 'categoryLevelId', node.id);
        this.$set(this.form, 'categoryLevelPath', node.name);
        this.$set(this.form, 'categoryLevelPathId', node.id);
        this.PathInfo = PathInfo;

        this.ruleCode = ruleCode;

        if (ruleCode && ruleCode != '自定义' && this.status != 0) {
          const code = await getCode(ruleCode);
          this.$set(this.form, 'code', code);
        }
      }

      this.$forceUpdate();
    },

    async getDictList(code) {
      let { data: res } = await getByCode(code);

      console.log('res----', res);

      // this.lbjtList = res.map((item) => {
      //   let values = Object.keys(item);
      //   return {
      //     value: Number(values[0]),
      //     label: item[values[0]]
      //   };
      // });
    },

    openCategory() {
      this.$refs.categoryRefs.open();
    },

    openCode() {
      this.codeShow = true;
    },

    chooseCode(code) {
      this.$set(this.form, 'code', code);
      this.codeShow = false;
      this.$forceUpdate();
    },

    cancel() {
      // finishPageTab();
      // this.$router.go(-1);
      if (this.$route.query.rootTreeId == 9) {
        this.$router.push({
          path: '/product/oneProduct',
          query: {
            categoryLevelId: this.form.categoryLevelId
          }
        });
      } else {
        this.$router.push({
          path: '/material/product',
          query: {
            categoryLevelId: this.form.categoryLevelId
          }
        });
      }
    },

    // 保存
    submit() {

      
      this.$refs.manageForm.validate(async (valid) => {


        let productionValid = await this.$refs.productionRefs.getFormValid();
        let warehouseValid = await this.$refs.warehouseRefs.getFormValid();


        if (!valid || !productionValid || !warehouseValid) {
          return false;
        }

        let packageDispositionVOList = [];
        if (this.packagingSpecificationList.length > 0) {
          packageDispositionVOList = this.packagingSpecificationList.map(
            (item) => {
              let obj = {
                code: item.code,
                name: item.name
              };
              return [
                {
                  ...obj,
                  id: item.id0,
                  sort: 0,
                  status: item.status,
                  packageCell: 1,
                  packageUnit: item.packageUnit,
                  conversionUnit: item.packageUnit
                },
                {
                  ...obj,
                  id: item.id1,
                  sort: 1,
                  packageCell: item.minPackageCell,
                  packageUnit: item.packageUnit,
                  conversionUnit: item.minConversionUnit,
                  status: item.status
                },
                {
                  ...obj,
                  id: item.id2,
                  sort: 2,
                  packageCell: item.inPackageCell,
                  packageUnit: item.minConversionUnit,
                  conversionUnit: item.inConversionUnit,
                  status: item.status
                },
                {
                  ...obj,
                  id: item.id3,
                  sort: 3,
                  packageCell: item.outPackageCell,
                  packageUnit: item.inConversionUnit,
                  conversionUnit: item.outConversionUnit,
                  status: item.status
                }
              ];
            }
          );
          let packagingSpecificationList =
            this.packagingSpecificationList.filter(
              (item) => item.status == 1
            );
          this.form.extField.packingSpecification = packagingSpecificationList


            .map((item) => {
              return [
                `${item.minPackageCell}${item.packageUnit}/${item.minConversionUnit}`,
                `${item.inPackageCell}${item.minConversionUnit}/${item.inConversionUnit}`,
                `${item.outPackageCell}${item.inConversionUnit}/${item.outConversionUnit}`
              ];
            })
            .flat()
            .join(',');
        } else {
          this.form.extField.packingSpecification = '';
        }

        this.loading = true;
        // const imgList = this.remarkform.imgList;
        // const arr = [];
        // if (imgList.length) {
        //   imgList.map((item) => {
        //     arr.push(item.storePath);
        //   });
        //   this.form.remarkAttach = arr.join(',');
        // }
        // this.form.remark = this.remarkform.remark
        //   ? this.remarkform.remark
        //   : '';

        const data = {
          categorySales: this.categorySales,
          categoryPurchase: this.categoryPurchase,
          categoryWms: this.categoryWms,
          categoryAps: this.categoryAps,
          categoryMes: this.categoryMes,
          categoryMold: this.categoryMold,
          categoryPallet: this.categoryPallet,
          categoryQms: this.categoryQms,
          categoryVehicle: this.categoryVehicle,
          category: {
            ...this.form,
            ...this.remarkform,
            ...this.PathInfo
          },
          packageDispositionVOList: packageDispositionVOList.flat()
        };

        if (this.$route.query.status == 1) {
          data.categorySales.id = null;
          data.categoryPurchase.id = null;
          data.category.id = null;
          data.categoryWms.id = null;
          data.categoryAps.id = null;
          data.categoryMes.id = null;
          data.categoryMold.id = null;
          data.categoryPallet.id = null;
          data.categoryQms.id = null;
          data.categoryVehicle.id = null;
          data.packageDispositionVOList = data.packageDispositionVOList.map(
            (item) => {
              return {
                ...item,
                id: null
              };
            }
          );
        }
        console.log('保存', data);

        data.category.produceType = [data.category.produceType];

        addMaterial(data)
          .then((msg) => {
            this.loading = false;
            this.$message.success(msg);
            // reloadPageTab({ fullPath: '/material/product' });
            // this.$router.go(-1);
            this.cancel();
            // if (this.$route.query.rootTreeId == 9) {
            //   this.$router.push({
            //     path: '/product/oneProduct',
            //     query: {
            //       categoryLevelId: this.form.categoryLevelId
            //     }
            //   });
            // } else {
            //   this.$router.push({
            //     path: '/material/product',
            //     query: {
            //       categoryLevelId: this.form.categoryLevelId
            //     }
            //   });
            // }
          })
          .catch((e) => {
            this.loading = false;
          });
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.ele-page-header {
  border: none;
}

.body-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;

  .top-left {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-left: -25px;

    .el-form-item {
      margin-bottom: 0;
    }
  }
}

.divider {
  margin: 20px 0;

  .title {
    display: flex;
    align-items: center;
    margin-bottom: 10px;

    div {
      width: 8px;
      height: 20px;
      margin-right: 10px;
    }

    span {
      font-size: 20px;
    }
  }

  .ele-width {
    width: 100%;
    height: 2px;
  }
}

.form-line {
  display: flex;
  align-items: center;
  justify-content: space-between;

  .line-select {
    margin-left: 15px;
  }
}
</style>