<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="计划工厂编码" prop="planFactoryCode" label-width="100px">
        <el-input
          v-model="queryParams.planFactoryCode"
          placeholder="请输入计划工厂编码"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="订单号" prop="orderCode">
        <el-input
          v-model="queryParams.orderCode"
          placeholder="请输入订单号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="物料号" prop="prodCode">
        <el-input
          v-model="queryParams.prodCode"
          placeholder="请输入物料号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="物料名称" prop="prodDesc">
        <el-input
          v-model="queryParams.prodDesc"
          placeholder="请输入物料名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="拆分状态" prop="status">
        <el-select v-model="queryParams.status" placeholder="请选择拆分状态" clearable>
          <el-option
            v-for="dict in dict.type.order_status"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label-width="100px" label="计划生产日期" prop="planProDate">
        <el-date-picker clearable
                        v-model="queryParams.planProDate"
                        type="date"
                        value-format="yyyy-MM-dd"
                        placeholder="选择计划生产日期">
        </el-date-picker>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="dialogVisible = true"
          v-hasPermi="['order:order:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['mes:pro:order:add']"
        >SAP同步
        </el-button>
      </el-col>

      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['mes:pro:order:export']"
        >导出
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="info"
          plain
          icon="el-icon-sort"
          size="mini"
          @click="toggleExpandAll"
        >展开/折叠
        </el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table
      style="width: 100%"
      height="480"
      v-if="refreshTable"
      v-loading="loading"
      :data="orderList"
      row-key="orderCode"
      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
    >

      <el-table-column width="150" label="订单号" align="center" prop="orderCode" />
      <el-table-column width="180" label="物料号" align="center" prop="prodCode" />
      <el-table-column width="200" label="物料名称" align="center" prop="prodDesc" />
      <el-table-column width="90" label="订单数量" align="center" prop="quantity"/>
      <el-table-column width="70" label="单位" align="center" prop="unit"/>
      <el-table-column label="任务清单" align="center" prop="workerOrder" />
      <el-table-column width="120" label="计划生产日期" align="center" prop="planProDate" >
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.planProDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column width="120" label="计划完成日期" align="center" prop="planComplete" >
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.planComplete, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="订单状态" align="center" prop="status"/>
      <el-table-column width="100" align="center" label="计划工厂编码" prop="planFactoryCode"/>
      <el-table-column label="订单类型" align="center" prop="orderType"/>
      <el-table-column label="产品类型" align="center" prop="prodType"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width " fixed="right" >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-plus"
            @click="splitBtn(scope.row)"
            v-hasPermi="['mes:pro:order:add']"
            v-if="scope.row.parentOrder == 0"
          >拆分
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- 新增模块 -->
    <el-dialog title="新增订单" :visible.sync="dialogVisible" width="900px" append-to-body :before-close="handleClose">
      <el-form ref="form" :model="form" :rules="addrules" label-width="80px">
        <!-- 第一行 -->
        <el-row>
          <!-- 第一列 -->
          <el-col :offset="1" :span="8">
            <el-form-item label-width="100px" label="物料号" prop="prodCode">
              <el-input v-model="form.prodCode" placeholder="请输入物料号" />
            </el-form-item>
          </el-col>
          <!-- 第二列 -->
          <el-col :offset="2" :span="8">
            <el-form-item label-width="100px" label="计划生产日期" prop="planProDate">
              <el-date-picker clearable
                              v-model="form.planProDate"
                              type="date"
                              value-format="yyyy-MM-dd"
                              placeholder="选择计划生产日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 第二行 -->
        <el-row>
          <!-- 第一列 -->
          <el-col :offset="1" :span="8">
            <el-form-item label-width="100px" label="物料名称" prop="prodDesc">
              <el-input v-model="form.prodDesc" placeholder="请输入物料名称" />
            </el-form-item>
          </el-col>
          <!-- 第二列 -->
          <el-col :offset="2" :span="8">
            <el-form-item label-width="100px" label="计划完成日期" prop="planComplete">
              <el-date-picker clearable
                              v-model="form.planComplete"
                              type="date"
                              value-format="yyyy-MM-dd"
                              placeholder="选择计划完成日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 第三行 -->
        <el-row>
          <!-- 第一列 -->
          <el-col :offset="1" :span="8">
            <el-form-item  label-width="100px" label="订单数量" prop="quantity">
              <el-input v-model="form.quantity" placeholder="请输入订单数量" />
            </el-form-item>
          </el-col>
          <!-- 第二列 -->
          <el-col :offset="2" :span="9">
            <el-form-item label-width="100px" label="单位" prop="unit">
              <el-input v-model="form.unit" placeholder="请输入单位" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :offset="1" :span="8">
            <el-form-item label-width="100px" label="产品类型" prop="prodType">
              <el-select v-model="form.prodType" placeholder="请选择产品类型">
                <el-option
                  v-for="dict in dict.type.product_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 拆分模块 -->
    <el-dialog :title="title" :visible.sync="splitOpen" width="1000px" append-to-body>
      <!-- 拆分头pro -->
      <el-table
        border
        v-if="refreshProTable"
        v-loading="proLoading"
        :data="productData"
        row-key="orderCode"
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
      >
        <el-table-column width="60" align="center" label="序号" type="index" :index="indexMethod"></el-table-column>
        <el-table-column width="150" label="订单编号" prop="orderCode"/>
        <el-table-column width="380" label="产品名称" align="center" prop="prodDesc"/>
        <el-table-column width="60" label="单位" align="center" prop="unit"/>
        <el-table-column width="130" label="产品数量" align="center" prop="quantity"/>
        <el-table-column label="已拆分数量" align="center" prop="quantitySplit"/>
        <el-table-column label="拆分数量" align="center" prop="atrr1"/>
      </el-table>
      <el-form class="my-margin" :model="splitForm" ref="dynamicForm" label-width="80px">
        <!-- 编辑框 -->
        <!-- 第一行 -->
        <el-row>
          <!-- 选择产线 -->
          <el-col :span="6">
            <el-form-item label="选择机型:">
              <el-select size="small" v-model="splitForm.prodLineCode" placeholder="请选择成型机">
                <el-option v-for="item in proline" :key="item.key" :label="item.label" :value="item.key"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <!-- 拆分数量 -->
          <el-col :offset="2" :span="7">
            <el-form-item size="small" label="拆分数量:">
              <el-input required type="number" @input="splitNumChange" v-model="splitForm.splitNum"></el-input>
            </el-form-item>
          </el-col>
          <!-- 工单日期 -->
          <el-col :offset="1" :span="5">
            <el-form-item size="small" label="工单日期: ">
              <el-date-picker @change="checkDate" v-model="splitForm.productDate" type="date" placeholder="选择日期"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 第二行 -->
        <el-row>
          <el-col :span="6">
            <!-- 选择班次 -->
            <el-form-item size="small" label="选择班次:" class="my-select my-first">
              <el-select v-model="splitForm.shiftId" placeholder="请选择班次">
                <el-option v-for="item in workShift" :key="item.shiftId" :label="item.shiftDesc"
                           :value="item.shiftId"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 第三行 -->
        <el-row v-for="(item, index) in formFields" :key="index">
          <!-- 批次编号 -->
          <el-col :span="7">
            <el-form-item size="small" label="批次编号">
              <el-input @blur="batchCodeChange" v-model="item.batchCode"></el-input>
            </el-form-item>
          </el-col>
          <!-- 批次数量 -->
          <el-col :offset="1" :span="4">
            <el-form-item size="small" label="批次数量">
              <el-input required @input="inBatch" type="number" v-model="item.batchQuantity"></el-input>
            </el-form-item>
          </el-col>
          <!-- 操作 -->
          <el-col :offset="1" :span="4">
            <el-button size="small" v-if="formFields.length > 1" @click="removeField(index)" type="danger">删除
            </el-button>
            <el-button size="small" v-if="index === formFields.length - 1" @click="addField" type="primary">添加
            </el-button>
          </el-col>
        </el-row>
      </el-form>
      <!-- 拆分尾 -->
      <el-table
        border
        :data="splitData"
        v-if="refreshWorkerTable"
        v-loading="workerLoading"
        row-key="workorderCode"
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
        >
        <el-table-column width="60" align="center" label="序号" type="index" :index="indexMethod"></el-table-column>
        <el-table-column width="300" align="center" prop="workorderCode" label="工单号"></el-table-column>
        <el-table-column width="120" align="center" prop="prodLineCode" label="成型机"></el-table-column>
        <el-table-column width="120" align="center" prop="quantitySplit" label="数量"></el-table-column>
        <el-table-column width="60" label="单位" align="center" prop="unit"/>
        <el-table-column align="center" prop="batchCodeList" label="批次号"></el-table-column>
      </el-table>
      <!-- 测试 -->
      <!-- 操作按钮 -->
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="batchBtn">提 交</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import {
    getWorkOrderList,
    getOrderList,
    subSplitOrder,
    getprodLineShift,
    listOrder,
    getOrder,
    delOrder,
    addOrder,
    updateOrder
  } from "@/api/mes/pro/order";
  import Treeselect from "@riophae/vue-treeselect";
  import "@riophae/vue-treeselect/dist/vue-treeselect.css";

  export default {
    name: "Order",
    dicts: ['product_type', 'order_status'],
    components: {
      Treeselect
    },
    data() {
      return {
        // 表单参数
        form: {},
        // 新增模块
        dialogVisible: false,
        //以下为新内容
        productList:[],
        //工单遮罩层
        workerLoading: false,
        //工单重新渲染表格
        refreshWorkerTable: true,
        //订单遮罩层
        proLoading: true,
        //订单重新渲染表格
        refreshProTable: true,
        //二级换算值
        secConvert: null,
        //三级换算值
        thiConvert: null,
        //拆分头pro
        productData: [],
        //拆分下部分
        splitData: [],
        //选择产线list表
        proline: [],
        //
        splitnum: null,
        // 班次
        workShift: [],
        // 批次
        formFields: [{
          batchCode: '',
          batchQuantity: ''
        }],
        // 遮罩层
        loading: true,
        // 显示搜索条件
        showSearch: true,
        // 订单表格数据
        orderList: [],
        // 订单树选项
        orderOptions: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        splitOpen: false,
        // 是否展开，默认全部展开
        isExpandAll: true,
        // 重新渲染表格状态
        refreshTable: true,
        // 查询参数
        queryParams: {
          planFactoryCode: null,
          orderType: null,
          orderCode: null,
          prodCode: null,
          prodDesc: null,
          quantity: null,
          unit: null,
          workerOrder: null,
          planProDate: null,
          planComplete: null,
          atrr1: null,
          atrr2: null,
          atrr3: null,
          status: null,
          parentOrder: null,
          prodType: null
        },
        // 拆分表单参数
        splitForm: {
          id: null,
          prodLineCode: null,
          splitNum: null,
          productDate: null,
          shiftId: null,
          formFields: [],
        },
        // 表单校验
        rules: {},
        addrules: {}
      };
    },
    created() {

      var now = new Date();
      // 转换日期格式
      const year = now.getFullYear(); // 获取年份
      const month = String(now.getMonth() + 1).padStart(2, '0'); // 获取月份
      const day = String(now.getDate()).padStart(2, '0'); // 获取日期
      const date = `${year}-${month}-${day}`;

      this.loading = true;
      this.queryParams.status = 'o0';
      this.queryParams.planProDate = date;
      listOrder(this.queryParams).then(response => {
        this.orderList = this.handleTree(response.data, "orderCode", "parentOrder");
        this.loading = false;
      });
    },
    methods: {
      // 判空、空串
      checkNull(entity) {
        if (entity !== undefined && entity !== '' && entity !== null){
          return 1;
        }
        return 0;
      },
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            this.reset();
            done();
          })
          .catch(_ => {});
      },
      /** 提交按钮 */
      submitForm() {
        // 表单校验
        if (this.checkNull(this.form.prodCode) == 0 || this.checkNull(this.form.planProDate) == 0 || this.checkNull(this.form.prodDesc) == 0 || this.checkNull(this.form.planComplete) == 0 || this.checkNull(this.form.quantity) == 0 || this.checkNull(this.form.unit) == 0 || this.checkNull(this.form.prodType) == 0){
          this.$message({
            message:'数据不能为空！',
            type:'warning'
          })
          return;
        }
        this.$refs["form"].validate(valid => {
          if (valid) {
            if (this.form.id != null) {
              updateOrder(this.form).then(response => {
                this.$modal.msgSuccess("修改成功");
                this.dialogVisible = false;
                this.reset();
                this.getList();
              });
            } else {
              addOrder(this.form).then(response => {
                this.$modal.msgSuccess("新增成功");
                this.dialogVisible = false;
                this.reset();
                this.getList();
              });
            }
          }
        });
      },
      /** 检验批次编码是否重复 */
      batchCodeChange(e){
        if (this.formFields.length>1){
          for (let i = 0; i < this.formFields.length-1; i++){
            if (this.formFields[this.formFields.length-1].batchCode == this.formFields[i].batchCode){
              this.$message({
                message:'批次号不能重复！',
                type:'warning'
              })
              this.formFields = [{
                batchCode: '',
                batchQuantity: ''
              }]
              return;
            }
          }
        }
      },
      /** 校验日期 */
      checkDate(e) {
        var now = new Date();
        if (e < now){
          e = now;
          this.splitForm.productDate = now;
        }
      },
      /** 拆分提交按钮 */
      batchBtn() {
        // 判断数据不能为空
        if (this.splitForm.splitNum == null || this.splitForm.shiftId == null || this.splitForm.prodLineCode == null){
          this.$message({
            message:'数据不能为空！',
            type:'warning'
          })
          return;
        }
        // 判断如果拆分数量不等于拆分批次数量之和
        let sum = 0;
        for (let i = 0; i< this.formFields.length ;i++){
          sum = Number(sum) + Number(this.formFields[i].batchQuantity);
          if (this.formFields[i].batchQuantity == '' || this.formFields[i].batchQuantity ==null || this.formFields[i].batchCode ==null || this.formFields[i].batchCode ==''){
            this.$message({
              message:'批次数据不能为空',
              type: 'warning'
            })
            return;
          }
        }
        if (sum != this.productData[0].atrr1){
          this.$message({
            message: '批次数量之和不等于拆分数量',
            type: 'warning'
          })
          return;
        }

        //整理订单传入到后端
        this.splitForm.formFields = this.formFields;
        //整理数据往后端发送
        //下面是请求处理
        const data = {
          formFields : this.formFields,
          prodLineCode : this.splitForm.prodLineCode,
          productDate : this.splitForm.productDate,
          shiftId : this.splitForm.shiftId,
          splitNum : this.splitForm.splitNum,
          product : this.productData[0],
        }

        let check = 1;
        subSplitOrder(data).then(response => {
          if(response.code == 500){
            check = 0;
            this.$modal.msgError(response.msg);
            return;
          }
          this.$modal.msgSuccess("提交成功");
        });

        let id = this.productData[0].id;
        // 清除缓存
        this.splitForm = {
          id: null,
          prodLineCode: null,
          splitNum: null,
          productDate: null,
          shiftId: null,
          formFields: [],
        }
        this.formFields = [{
          batchCode: '',
          batchQuantity: ''
        }],

        // 获取该订单下的最新工单列表
        getWorkOrderList(id).then(response => {
          if(response.code == 500){
            this.$modal.msgError(response.msg);
          };
          // 设置最新数据
          this.splitData = response.data;
          // 在获取到新的数据后执行以下代码
          this.workerLoading = true; // 设置加载状态为true，表示正在加载
          this.refreshWorkerTable = false; // 先将refreshProTable设置为false，隐藏表格
          this.$nextTick(() => {
            // 使用$nextTick来等待DOM更新完成
            this.refreshWorkerTable = true; // 立即将refreshProTable设置为true，显示表格
            this.workerLoading = false; // 设置加载状态为false，表示加载完成
          });
        })

        if (check){
          setTimeout(() => {
            this.getList();
            // 等待1秒后执行的代码
            this.splitOpen = false;
          }, 500);
        }
      },
      /** 动态添加表单 */
      addField() {
        //如果批次数量大于等于拆分数量则不允许拆分
        let sum = 0;
        for (let i = 0; i < this.formFields.length; i++) {
          sum += Number(this.formFields[i].batchQuantity);
        }
        ;
        if (sum >= this.productData[0].atrr1) {
          this.$message({
            message: '无法添加！您的批次数量已满！',
            type: 'warning'
          })
          return;
        }
        ;
        this.formFields.push({batchCode: '', batchQuantity: ''});
        //自动填充
        this.formFields[this.formFields.length - 1].batchQuantity = Number(this.productData[0].atrr1) - Number(sum);
      },
      /** 动态删除表单 */
      removeField(index) {
        this.formFields.splice(index, 1);
      },
      /** 查询订单列表 */
      getList() {
        this.loading = true;
        listOrder(this.queryParams).then(response => {
          this.orderList = this.handleTree(response.data, "orderCode", "parentOrder");
          this.loading = false;
        });
      },
      /** 转换订单数据结构 */
      normalizer(node) {
        if (node.children && !node.children.length) {
          delete node.children;
        }
        return {
          id: node.orderCode,
          label: node.orderCode,
          children: node.children
        };
      },
      /** 查询订单下拉树结构 */
      getTreeselect() {
        listOrder().then(response => {
          this.orderOptions = [];
          const data = {orderCode: 0, orderCode: '顶级节点', children: []};
          data.children = this.handleTree(response.data, "orderCode", "parentOrder");
          this.orderOptions.push(data);
        });
      },
      // 取消按钮
      cancel() {
        this.dialogVisible = false;
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {
          id: null,
          planFactoryCode: null,
          orderType: null,
          orderCode: null,
          prodCode: null,
          prodDesc: null,
          quantity: null,
          unit: null,
          workerOrder: null,
          planProDate: null,
          planComplete: null,
          atrr1: null,
          atrr2: null,
          atrr3: null,
          status: null,
          parentOrder: null,
          createBy: null,
          createTime: null,
          updateBy: null,
          updateTime: null,
          prodType: null
        };
        this.resetForm("form");
      },
      /** 拆分表单重置 */
      resetBatch() {
        this.splitForm = {
          id: null,
          prodLineCode: null,
          splitNum: null,
          productDate: null,
          shiftId: null,
          formFields: [],
        }
        this.splitData = [],
        this.secConvert = null,
        this.thiConvert = null,
        this.productData = [],
        this.proline = [],
        this.splitnum = null,
        this.workShift = [],
        this.formFields = [{
          batchCode: '',
          batchQuantity: ''
        }]
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      /** 拆分按钮操作 */
      handleAdd(row) {
        this.reset();
        this.getTreeselect();
        if (row != null && row.orderCode) {
          this.splitForm.parentOrder = row.orderCode;
        } else {
          this.splitForm.parentOrder = 0;
        }
        this.splitOpen = true;
        this.title = "拆分";
      },
      /** 展开/折叠操作 */
      toggleExpandAll() {
        this.refreshTable = false;
        this.isExpandAll = !this.isExpandAll;
        this.$nextTick(() => {
          this.refreshTable = true;
        });
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        this.getTreeselect();
        if (row != null) {
          this.splitForm.parentOrder = row.orderCode;
        }
        getOrder(row.id).then(response => {
          this.splitForm = response.data;
          this.splitOpen = true;
          this.title = "修改订单";
        });
      },
      /** 拆分按钮操作 */
      splitBtn(row) {
        //数据初始化
        //一级
        row.atrr1 = 0;
        //二级
        if (row.children !== undefined) {
          for (let i = 0; i < row.children.length; i++) {
            row.children[i].atrr1 = 0;
            //三级
            if (row.children[i].children !== undefined) {
              for (let j = 0; j < row.children[i].children.length; j++) {
                row.children[i].children[j].atrr1 = 0;
              }
            }
          }
        }
        // 在获取到新的数据后执行以下代码
        this.proLoading = true; // 设置加载状态为true，表示正在加载
        // 发送请求或执行异步操作获取最新的数据
        //重置表单
        this.resetBatch();
        //将数据放入到productData中
        this.productData.push(row);
        //存放id
        this.splitForm.id = row.id;
        this.refreshProTable = false; // 先将refreshProTable设置为false，隐藏表格
        this.$nextTick(() => {
          // 使用$nextTick来等待DOM更新完成
          this.refreshProTable = true; // 立即将refreshProTable设置为true，显示表格
          this.proLoading = false; // 设置加载状态为false，表示加载完成
        });
        //初始化日期为默认今天
        this.splitForm.productDate = new Date();
        //获取成型机和班次
        getprodLineShift(row.orderType).then(response => {
          this.proline = response.data.lines;
          this.workShift = response.data.shifts;
        });
        //获取换算值
        if (row.children !== undefined){
          this.secConvert = Number(row.children[0].quantity) / Number(row.quantity);
          if (row.children[0].children !== undefined){
            this.thiConvert = Number(row.children[0].children[0].quantity) / Number(row.quantity);
          }
        }
        // getConvert().then(response => {
        //   for (let i = 0; i < response.data.length; i++) {
        //     if (response.data[i].dictSort == 2) {
        //       this.secConvert = response.data[i];
        //     } else if (response.data[i].dictSort == 3) {
        //       this.thiConvert = response.data[i];
        //     }
        //   }
        // })


        // 获取工单
        getWorkOrderList(row.id).then(response => {
          var data = response.data;
          // 循环遍历将批次编码进行换行
          // for(let fir = 0;fir < data.length;fir++){
          //   for(let i = 0;i < data[fir].batchCodeList.length;i++){
          //     // 未完成
          //     data[fir].batchCodeList[i]
          //   }
          // }
          this.splitData = data;
        })

        this.splitOpen = true;
        this.title = "拆分";
      },
      /** 拆分数量方法 */
      splitNumChange(e) {
        //打印换算值
        //不能为负数
        if (e <= 0) {
          e = 1;
          this.splitForm.splitNum = 1;
        }
        if (e != '' && e > 0) {
          let max = Number(this.productData[0].quantity) - Number(this.productData[0].quantitySplit);
          if (e > max) {
            this.$message({
              message: "最大值不能超过" + max + "!",
              type: 'warning'
            })
            this.splitForm.splitNum = max;
          }
          //前端数据同步
          // 在获取到新的数据后执行以下代码
          this.proLoading = true; // 设置加载状态为true，表示正在加载
          //一级
          this.productData[0].atrr1 = this.splitForm.splitNum;
          //二级
          if (this.productData[0].children !== undefined) {
            for (let i = 0; i < this.productData[0].children.length; i++) {
              this.productData[0].children[i].atrr1 = Number(this.splitForm.splitNum) * Number(this.secConvert);
              //三级
              if (this.productData[0].children[i].children !== undefined) {
                for (let j = 0; j < this.productData[0].children[i].children.length; j++) {
                  this.productData[0].children[i].children[j].atrr1 = Number(this.splitForm.splitNum) * Number(this.secConvert) * Number(this.thiConvert);
                }
              }
            }
          }
          this.refreshProTable = false; // 先将refreshProTable设置为false，隐藏表格
          this.$nextTick(() => {
            // 使用$nextTick来等待DOM更新完成
            this.refreshProTable = true; // 立即将refreshProTable设置为true，显示表格
            this.proLoading = false; // 设置加载状态为false，表示加载完成
          });
        } else {
          //前端数据同步
          // 在获取到新的数据后执行以下代码
          this.proLoading = true; // 设置加载状态为true，表示正在加载
          //一级
          this.productData[0].atrr1 = 0;
          //二级
          if (this.productData[0].children !== undefined) {
            for (let i = 0; i < this.productData[0].children.length; i++) {
              this.productData[0].children[i].atrr1 = 0;
              //三级
              if (this.productData[0].children[i].children !== undefined) {
                for (let j = 0; j < this.productData[0].children[i].children.length; j++) {
                  this.productData[0].children[i].children[j].atrr1 = 0;
                }
              }
            }
          }
          this.refreshProTable = false; // 先将refreshProTable设置为false，隐藏表格
          this.$nextTick(() => {
            // 使用$nextTick来等待DOM更新完成
            this.refreshProTable = true; // 立即将refreshProTable设置为true，显示表格
            this.proLoading = false; // 设置加载状态为false，表示加载完成
          });
        }
        this.product = this.productData[0];
      },
      /** 填写批次数量 */
      inBatch(e) {
        //不能为负数
        if (e <= 0) {
          this.formFields[this.formFields.length - 1].batchQuantity = 1;
        }
        //逻辑判断
        let sum = 0;
        for (let i = 0; i < this.formFields.length; i++) {
          sum += Number(this.formFields[i].batchQuantity);
        }
        //如果超过拆分数量，提示并清空当前输入
        if (sum > this.productData[0].atrr1) {
          this.$message({
            message: '你的批次数量总和不能超过拆分数量!',
            type: 'warning'
          })
          this.formFields[this.formFields.length - 1].batchQuantity = Number(this.productData[0].atrr1) - Number(Number(sum) - Number(e));
        }
        //如果拆分数量为空
        if (this.productData[0].atrr1 == '' || this.productData[0].atrr1 == null) {
          this.formFields[this.formFields.length - 1].batchQuantity = '';
        }
      }
    }
  };
</script>
<style>
  .el-row {
    margin: 0;
    padding: 0;
  }

  .el-col {
    border-radius: 4px;
  }

  .bg-purple-dark {
    background: #99a9bf;
  }

  .bg-purple {
    background: #d3dce6;
  }

  .bg-purple-light {
    background: #e5e9f2;
  }

  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }

  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }

  .my-margin {
    margin-top: 40px;
    margin-bottom: 10px;
  }
</style>
