vxe-table使用

1.<vxe-toolbar ref="toolbarRef" custom></vxe-toolbar> 列设置保存

 2.column-config 列设置； resizable: true可拖动列宽设置

3.align="center" 居中

4.mouse-config 鼠标设置 selected:true 开启单元格选中功能（只对 edit-config.mode=cell 有效）

5.keyboard-config 键盘导航上下左右enter键等

6.edit-config 可编辑配置项 trigger: dblclick 键盘导航单击click是选择单元格，这里用双击dblclick,mode: 'cell'编辑模式,配合键盘导航需要cell,不能用row

7.size="mini"最小单元格

8.row-config 行配置，isCurrent当鼠标点击行时，是否要高亮当前行；isHover当鼠标移到行时，是否要高亮当前行

9.scroll-y纵向虚拟滚动配置（不支持展开行）

10.edit-rules校验规则配置项

11.checkbox-config 复选框配置项 开启复选框范围选择功能

12.show-footer :footer-method=" footerMethod" 合计行配置

13.custom-config 列配置，是否启用 localStorage 本地保存；checkMethod：自定义列是否允许列选中的方法；updateStore 只对 storage 有效，重写默认的保存方法，比如需要将自定义列信息保持到服务器时可能会用到，表格必须有唯一的id;

14.@resizable-change="resizableChangeEvent" 当列宽拖动发生变化时会触发该事件

 

<template>
  <div class="app-container" style="padding-top:0 !important;">
    <el-button plain size="mini" type="primary" v-if="!isView" @click="handleLoad" style="margin:0px 10px 10px 0px;padding: 5px 15px;">导入
    </el-button>
    <el-button plain size="mini" type="primary" v-if="!isView" @click="handleCustomerLoad" style="margin:0px 10px 10px 0px;padding: 5px 15px;">按客户产品编码导入
    </el-button>
    <el-button plain size="mini" type="primary" icon="el-icon-plus" style="margin:0px 10px 10px 0px;padding: 5px 15px;" @click="handlePrice()" v-hasPermi="['oms:'+per+':add']"
      :disabled="leftToolBar.multiple">刷新价格
    </el-button>
    <el-button plain size="mini" type="danger" v-if="!isView" icon="el-icon-delete" style="margin:0px 10px 10px 0px;padding: 5px 15px;" @click="delOrderDtl()" :disabled="ids.length === 0">删除并保存
    </el-button>

    <!-- 1.<vxe-toolbar ref="toolbarRef" custom></vxe-toolbar> 列设置保存
    2.:column-config 列设置； resizable: true可拖动列宽设置
    3.align="center" 居中
    4.mouse-config 鼠标设置 selected:true 开启单元格选中功能（只对 edit-config.mode=cell 有效）
    5.keyboard-config 键盘导航上下左右enter键等
    6.edit-config 可编辑配置项 trigger: dblclick 键盘导航单击click是选择单元格，这里用双击dblclick,mode: 'cell'编辑模式,配合键盘导航需要cell,不能用row
    7.size="mini"最小单元格
    8.row-config 行配置，isCurrent当鼠标点击行时，是否要高亮当前行；isHover当鼠标移到行时，是否要高亮当前行
    9.scroll-y纵向虚拟滚动配置（不支持展开行）
    10.edit-rules校验规则配置项
    11.checkbox-config 复选框配置项 开启复选框范围选择功能
    12.show-footer :footer-method=" footerMethod" 合计行配置
    13.custom-config 列配置，是否启用 localStorage 本地保存；checkMethod：自定义列是否允许列选中的方法；updateStore 只对 storage 有效，重写默认的保存方法，比如需要将自定义列信息保持到服务器时可能会用到，表格必须有唯一的id;
    14.@resizable-change="resizableChangeEvent" 当列宽拖动发生变化时会触发该事件 -->

    <vxe-toolbar ref="toolbarRef" custom></vxe-toolbar>
    <vxe-table border show-overflow sync-resize :column-config="{resizable: true}" align="center" :loading="loading" :data="orderDtlList" :mouse-config="{selected:true}"
      :keyboard-config="{isArrow: true, isDel: true, isEnter: true, isTab: true, isEdit: true, isChecked: true}" :edit-config="!isView?{trigger: 'dblclick', mode: 'cell'}:{enabled:true}" ref="xTable"
      :height="tableHeight" size="mini" :row-config="{isHover: true,isCurrent:true}" :scroll-y="{enabled: true}" :edit-rules="validRules" show-footer :footer-method=" footerMethod"
      :custom-config="{storage: true, checkMethod: checkColumnMethod,updateStore: updateColumnStore}" id="orderDtl1" @resizable-change="resizableChangeEvent">
      <vxe-column type="checkbox" fixed="left" width="60"></vxe-column>
      <vxe-column type="seq" width="60" fixed="left">
      </vxe-column>
      <vxe-column title="发货状态" v-if="isView" align="center" field="arrivalStatus" :formatter="arrivalStatusFormat" fixed="left" width="100" />
      <vxe-column title="售后状态" v-if="isView" align="center" field="afterSalesStatus_dictText" min-width="100" fixed="left" width="100" />
      <vxe-column field="product.itemno" title="产品编码" width="120" fixed="left">
      </vxe-column>
      <vxe-column title="产品名称" align="center" field="cdesc" width="220" fixed="left" :edit-render="{autofocus: '.vxe-input--inner'}">
        <template #edit="{ row }">
          <div class="copy-flex">
            <!--  @focus="cdescFocus(row)" @blur="cdescBlur(row)"-->
            <vxe-input v-model="row.cdesc" type="text" placeholder="请输入编码/名称" style="width: 150px;" @focus="cdescFocus(row)"></vxe-input>
            <vxe-button status="primary" content="选择" @click="handleAddPro(row)" v-hasPermi="['oms:'+per+':add']" size="mini" style="width: 40px;margin-left: 5px;padding: 5px;"></vxe-button>
          </div>
          <el-popover placement="bottom" trigger="click" :ref="'showSel'+$refs.xTable.getVMRowIndex(row,$refs.xTable.getVMRowIndex(row))" :key="$refs.xTable.getVMRowIndex(row)">
            <el-table :data="productList" border @row-click="(row,column,e)=>proRowClick(row,column,e)" width="700" height="300px" :highlight-current-row="true">
              <el-table-column label="产品编码" align="center" prop="itemno" width="150" />
              <el-table-column label="产品规格" align="center" prop="itemnoa" width="150" />
              <el-table-column label="产品名称" align="center" prop="cdesc" width="200" />
              <el-table-column label="品牌" align="center" prop="brand" width="150" />
            </el-table>
          </el-popover>
        </template>
      </vxe-column>
      <vxe-column title="客户产品编码" align="center" field="customerProductCode" width="160" show-overflow-tooltip v-if="isView"></vxe-column>
      <vxe-column title="客户产品名称" align="center" field="customerProductName" width="160" show-overflow-tooltip v-if="isView" />
      <vxe-column title="产品规格" align="center" field="product.itemnoa" show-overflow-tooltip width="100" />
      <vxe-column title="订单数量" align="center" field="orderQty" width="160" :render-header="addRedStar" :edit-render="{autofocus: '.vxe-input--inner'}" :footer-slot="true">
        <template #edit="{row}">
          <vxe-input v-model="row.orderQty" type="float" :min="0.1" :max="9999999.9999" :digits="4" :controls="false" @blur="orderQtyChange(row)" @input="updateFooterEvent"></vxe-input>
        </template>
      </vxe-column>
      <vxe-column title="应发数量" align="center" field="qty" v-if="isView" width="100" :footer-slot="true">
        <template #default="{row}">
          {{numFormat1(row.qty,4)||0}}
        </template>
      </vxe-column>
      <vxe-column title="实到数量" align="center" field="actQty" v-if="isView" width="100" :footer-slot="true">
        <template #default="{row}">
          {{numFormat1(row.actQty,4)}}
        </template>
      </vxe-column>
      <vxe-column title="销售单位" align="center" field="soUnit_dictText" width="100" :edit-render="{autofocus: '.vxe-input--inner'}">
        <template #edit="{row}">
          <vxe-select @change="utChange(row)" v-model="row.soUnit" placeholder="销售单位">
            <vxe-option v-for="a in row.baseProductUtList" :key="a.id" :value="a.utSecond" :label="a.utCname">{{a.utCname}}</vxe-option>
          </vxe-select>
        </template>
      </vxe-column>
      <vxe-column title="每箱数量" align="center" field="percartonQty" width="100">
        <template #default="{row}">
          {{ numFormat1(row.percartonQty,4)}}
        </template>
      </vxe-column>
      <vxe-column title="应发箱数" align="center" field="cartons" width="160" :render-header="addRedStar" v-if="isView" :footer-slot="true">
        <template #default="{row}">
          {{numFormat1(row.cartons,1)}}
        </template>
      </vxe-column>
      <vxe-column title="最小包装数" align="center" field="minPackQty" min-width="120" show-overflow-tooltip :edit-render="{autofocus: '.vxe-input--inner'}">
        <template #edit="{row}">
          <vxe-input v-model="row.minPackQty" type="float" :min="0" :max="9999.99" :digits="4" :controls="false" @blur="minPackQtyBlur(row)"></vxe-input>
        </template>
      </vxe-column>
      <vxe-column title="份数" align="center" field="copies" width="80">
        <template #default="{row}">
          <span>{{ numFormat1(row.copies,2) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="含税单价" align="center" field="soPrice" width="100" :edit-render="{autofocus: '.vxe-input--inner'}">
        <template #edit="{row}">
          <vxe-input v-model="row.soPrice" type="float" :min="0" :max="999999999.999999" :digits="6" :controls="false" @blur="soPriceChange(row)"></vxe-input>
        </template>
      </vxe-column>
      <vxe-column title="销售税率" align="center" field="outTaxrate" width="90" :edit-render="{autofocus: '.vxe-input--inner'}">
        <template #default="{row}">
          {{row.outTaxrate}}%
        </template>
        <template #edit="{row}">
          <div class="copy-flex">
            <vxe-input v-model="row.outTaxrate" type="float" :min="0" :max="99999.99" :digits="2" :controls="false" @blur="outTaxrateChange(row)">
            </vxe-input><span>%</span>
          </div>
        </template>
      </vxe-column>
      <vxe-column title="不含税单价" align="center" field="soCost" width="100" :edit-render="{autofocus: '.vxe-input--inner'}">
        <template #edit="{row}">
          <vxe-input v-model="row.soCost" type="float" :min="0" :max="999999999.999999" :digits="6" :controls="false" @blur="soCostChange(row)"></vxe-input>
        </template>
      </vxe-column>
      <vxe-column title="折扣" align="center" field="discount" width="100" :edit-render="{autofocus: '.vxe-input--inner'}">
        <template slot-scope="{}" slot="header">
          <span>折扣</span>
          <el-tooltip class="item" effect="dark" placement="top">
            <i class="el-icon-question" style="font-size: 14px; vertical-align: middle;"></i>
            <div slot="content">
              折扣0-10，折扣为10代表不打折
            </div>
          </el-tooltip>
        </template>
        <template #edit="{row}">
          <vxe-input v-model="row.discount" type="float" :min="0.01" :max="10" :digits="2" :controls="false" @blur="discountChange(row)"></vxe-input>
        </template>
      </vxe-column>
      <!-- ------------------ -->
      <vxe-column title="报价单编号" align="center" field="quotationCode" show-overflow-tooltip width="100"> </vxe-column>
      <vxe-column title="报价单名称" align="center" field="quotationName" show-overflow-tooltip width="100"> </vxe-column>
      <vxe-column title="报价单价格" align="center" field="quotationPrice" width="100"> </vxe-column>
      <vxe-column title="含税金额" align="center" field="inAmount" width="100" :footer-slot="true">
        <template #default="{row}">
          <span>{{ numFormat1(row.inAmount,2) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="折扣金额" align="center" field="discountAmount" width="100" :footer-slot="true">
        <template #default="{row}">
          <span>{{ numFormat1( row.discountAmount,2)||0  }}</span>
        </template>
      </vxe-column>
      <vxe-column title="订单折后金额" align="center" field="orderSoAmount" width="100" :footer-slot="true">
        <template #default="{row}">
          <span>{{numFormat1(row.orderSoAmount,2)}}</span>
        </template>
      </vxe-column>
      <vxe-column title="应付金额" align="center" field="soAmount" width="100" :footer-slot="true">
        <template #default="{row}">
          <span>{{ numFormat1(row.soAmount,2) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="单件返佣金额" align="center" field="singleRebateAmount" width="100">
        <template #default="{row}">
          <span>{{ numFormat1(row.singleRebateAmount,2) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="起批量" align="center" field="minOrderQty" width="100">
        <template #default="{row}">
          <span>{{numFormat1(row.minOrderQty,4)}}</span>
        </template>
      </vxe-column>
      <vxe-column title="售后金额" align="center" field="refundAmount" min-width="100">
        <template #default="{row}">
          <span>￥{{ numFormat1(row.refundAmount, 2) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="备注" align="center" width="130" field="remark" :edit-render="{autofocus: '.vxe-input--inner'}">
        <template #edit="{row}">
          <vxe-input v-model="row.remark" type="text" placeholder="请输入备注"></vxe-input>
        </template>
      </vxe-column>
    </vxe-table>

    <!-- 产品列表   -->
    <BaseProductDtl :ut-label="'库存单位'" :product='row' :key="row.uuid" ref="BaseProductDtl" @addProductList="addProductList" :customerCode="orderDtl.customerCode" />

  </div>
</template>

<script>
import {
  listOrderDtl,
  listOrderNewList,
  delOrderDtl,
  addOrderDtl,
  updateOrderDtl,
  selectSumFour,
  deleteAndSave,
  omsRefreshPrice,
} from '@/api/oms/orderDtl'
import { listBySpHavePrice } from '@/api/baseData/product'
import InputNumber from '@/components/el-input-number-master/input-number'
import BaseProductDtl from '@/views/publicComponents/baseProductDtl'
import { listProduct } from '@/api/baseData/product'
import { Row } from 'element-ui'

export default {
  name: 'OrderDtl',
  props: {
    orderDtl: {
      type: Object,
    },
    formId: {
      type: String,
    },
    per: {
      type: String,
    },
    isView: {
      type: Boolean,
    },
    mainShowSearch: {
      type: Boolean,
    },
    copy: {
      type: Boolean,
    },
  },
  components: {
    InputNumber,
    BaseProductDtl,
  },
  data() {
    return {
      //左侧按钮组参数
      leftToolBar: {
        // 非多个禁用
        multiple: true,
      },
      //表格高度
      tableHeight: 300,
      lastSoUnit: null,
      picArray: [],
      proArray: [],
      //原行对象
      row: {},
      //原行数据（深拷贝）
      rowStr: '{}',
      //当前行行号
      line: 0,
      //图片前路径
      prvImageUrl: this.$global.imgUrl,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      //通用数组
      arr: [],
      // 状态字典
      stateOptions: [],
      // 总条数
      total: 0,
      // 订单明细表格数据
      orderDtlList: [],
      tableToolbar: {
        refresh: true,
        zoom: true,
        custom: true,
        slots: {
          buttons: 'toolbar_buttons',
        },
      },
      // 是否显示弹出层
      open: false,
      // 产品列表是否弹出
      productListOpen: false,
      // 产品列表数据
      productList: [],
      // 查询参数
      orderDtlParams: {
        //pageNum: 1,
        //pageSize: 10,
        orderByColumn: 'a.line',
        isAsc: 'asc',
        uuid: null,
        productId: null,
        soCurrercy: null,
        soPrice: null,
        soCost: null,
        qty: null, // 应发数量
        outTaxrate: null,
        discount: null,
        soAmount: null, // 应付金额
        status: null,
        orderId: null,
        moduleId: null,
        corpid: this.$store.state.user.corpid,
        customerCode: null,
        orderSoAmount: null, // 订单折后金额
        orderQty: null, // 订单数量
        actQty: null, // 实到数量
      },
      // 产品查询参数
      // proParams: {
      //   pageNum: 1,
      //   pageSize: 10,
      //   // moduleId: 1016,
      //   corpid: this.$store.state.user.corpid,
      //   status: 'T',
      //   searchValue: '',
      //   params: {
      //     customerCode: null,
      //   },
      // },
      proParams: {
        pageNum: 1,
        pageSize: 10,
        orderByColumn: 'a.id',
        isAsc: 'desc',
        // moduleId: 1016,
        corpid: this.$store.state.user.corpid,
        status: 'T',
        searchValue: '',
        customerCode: null,
        params: {},
      },
      // 按客户产品编码导入 销售订单导入参数
      upload: {
        // 是否显示弹出层（销售订单导入）
        open: false,
        // 弹出层标题（销售订单导入）
        title: '',
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的销售订单数据
        updateSupport: 0,
        // 设置上传的请求头部
        headers: {
          Authorization: 'Bearer ' + this.getToken(),
        },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + '/oms/salesOrder/importOrderDtl',
        //模块id
        moduleId: '8001',
        orderId: '',
      },
      // 销售订单导入参数
      upload1: {
        // 是否显示弹出层（销售订单导入）
        open: false,
        // 弹出层标题（销售订单导入）
        title: '',
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的销售订单数据
        updateSupport: 0,
        // 设置上传的请求头部
        headers: {
          Authorization: 'Bearer ' + this.getToken(),
        },
        // 上传的地址
        url:
          process.env.VUE_APP_BASE_API +
          '/oms/salesOrder/importOrderDtlByOmsProductCode',
        //模块id
        moduleId: '8001',
        orderId: '',
      },
      // 表单参数
      form: {
        arrivalStatus: null,
        afterSalesStatus: null,
        afterSalesStatus_dictText: null,
        cdesc: null,
        product: {
          itemno: null,
          itemnoa: null,
          cdesc: null,
        },
        customerProductCode: null,
        customerProductName: null,
        orderQty: null,
        qty: null,
        actQty: null,
        soUnit: null,
        soUnit_dictText: null,
        percartonQty: null,
        cartons: null,
        minPackQty: null,
        copies: null,
        soPrice: null,
        outTaxrate: null,
        soCost: null,
        discount: null,
        quotationCode: null,
        quotationName: null,
        quotationPrice: null,
        inAmount: null,
        discountAmount: null,
        orderSoAmount: null,
        soAmount: null,
        singleRebateAmount: null,
        minOrderQty: null,
        refundAmount: null,
        remark: null,
      },
      maxWidth: {
        'product.cdesc': 0,
      },
      arrivalList: [],
      clickIndex: null,
      validRules: {
        orderQty: [{ required: true, message: '请输入数量' }],
      },
    }
  },
  watch: {
    mainShowSearch(value) {
      this.getTableMaxHeight(value)
    },
  },
  //自定义指令
  directives: {
    focus: {
      inserted: function (el) {
        el.querySelector('input').focus()
        el.querySelector('input').select() // 很重要
      },
    },
  },
  created() {
    this.setOrderDtlParams(
      this.orderDtl.id,
      this.orderDtl.moduleId,
      this.orderDtl.corpid
    )

    var orderId = null
    if (this.copy) {
      orderId = this.formId
    } else {
      orderId = this.orderDtl.id
    }
    this.orderDtlParams.orderId = orderId
    if (this.orderDtlParams.orderId != null) {
      this.getList()
      this.tableHeight = this.changeHeight(350)
      // console.log('---2') // 修改
    } else {
      this.reset()
      this.form.product = {}
      // this.form.discount = this.orderDtl.discount
      // console.log('---3') // 新增
      // this.orderDtlList = this.completeArr(
      //   this.orderDtlList,
      //   JSON.parse(JSON.stringify(this.form)),
      //   5
      // )
      for (let index = this.orderDtlList.length; index < 1000; index++) {
        this.orderDtlList.push({
          ...this.form,
          id: 'aa' + index,
          soUnitBackup: this.form.soUnit,
        })
      }
      this.loading = false
    }
    this.getDicts('order_arrival_status').then((response) => {
      this.arrivalList = response.data
    })

    this.$nextTick(() => {
      // 手动将表格和工具栏进行关联
      this.$refs.xTable.connect(this.$refs.toolbarRef)
    })
  },

  // updated() {
  //   this.$nextTick(() => {
  //     this.$refs.multipleTable.doLayout()
  //   })
  // },
  mounted() {
    this.getTableMaxHeight()

    // 组件挂载后恢复列设置
    // this.restoreCustoms()
  },
  computed: {
    //计算不含税单价
    soCostCom: function () {
      this.form.soCost = this.numDiv(
        parseFloat(this.form.soPrice),
        this.numDiv(
          this.numAdd(100.0, parseFloat(this.form.outTaxrate)),
          100.0,
          6
        ),
        6
      )
      return this.numDiv(
        parseFloat(this.form.soPrice),
        this.numDiv(
          this.numAdd(100.0, parseFloat(this.form.outTaxrate)),
          100.0,
          6
        ),
        6
      )
    },
    //计算总金额
    soAmountCom: function () {
      this.form.soAmount = this.numMul(
        this.numMul(
          parseFloat(this.form.orderQty),
          parseFloat(this.form.soPrice)
        ),
        this.numDiv(this.numSub(10, parseFloat(this.form.discount)), 10, 6)
      )
      return this.numMul(
        this.numMul(
          parseFloat(this.form.orderQty),
          parseFloat(this.form.soPrice)
        ),
        this.numDiv(this.numSub(10, parseFloat(this.form.discount)), 10, 6)
      )
    },
  },
  methods: {
    checkColumnMethod({ column }) {
      if (column.field === 'role') {
        return false
      }
      return true
    },
    updateColumnStore({ id, type, storeData }) {
      debugger
    },
    // 拖动列宽（可保存数据库）
    resizableChangeEvent() {
      const columns = this.$refs.xTable.getColumns()
      const customData = columns.map((column) => {
        return {
          width: column.renderWidth,
        }
      })
      console.log(customData)
    },
    // 行产品弹框
    cdescFocus(row) {
      // 获取当前行索引
      this.clickIndex = this.$refs.xTable.getVMRowIndex(row)
      if (row.productId === null) {
        this.proParams.searchValue = null
      } else {
        this.proParams.searchValue = row.product.cdesc
      }
      this.$refs[`showSel${this.$refs.xTable.getVMRowIndex(row)}`].doShow()
      this.getListPro()
    },
    cdescBlur(row) {
      this.$refs[`showSel${this.$refs.xTable.getVMRowIndex(row)}`].doClose()
    },
    // 在值发生改变时更新表尾合计
    updateFooterEvent() {
      const $table = this.$refs.xTable
      $table.updateFooter()
    },
    meanNum(list, field) {
      const sum = list.reduce((pre, item) => {
        // return pre + Number(item[field] || 0)
        return this.add(pre, Number(item[field] || 0))
      }, 0)
      return sum
    },
    // sumNum(list, field) {
    //   let count = 0
    //   list.forEach((item) => {
    //     count += Number(item[field])
    //   })
    //   return count

    // },
    footerMethod({ columns, data }) {
      return [
        columns.map((column, columnIndex) => {
          if (columnIndex === 0) {
            return '合计'
          }
          // 未审批，待审批
          if (!this.isView) {
            // 订单数量 4位
            if (['orderQty'].includes(column.property)) {
              return this.numFormat1(this.meanNum(data, column.property), 4)
            }
            // 含税金额、折扣金额、订单折后金额、应付金额 2位
            if (
              [
                'orderQty',
                'inAmount',
                'discountAmount',
                'orderSoAmount',
                'soAmount',
              ].includes(column.property)
            ) {
              return this.numFormat1(this.meanNum(data, column.property), 2)
            }
            return null
          }
          // 已审批
          else {
            // 订单数量、应发数量、实到数量 4位
            if (['orderQty', 'qty', 'actQty'].includes(column.property)) {
              return this.numFormat1(this.meanNum(data, column.property), 4)
            }
            // 应发箱数 1位
            if (['cartons'].includes(column.property)) {
              return this.numFormat1(this.meanNum(data, column.property), 1)
            }
            // 含税金额、折扣金额、订单折后金额、应付金额 2位
            if (
              [
                'inAmount',
                'discountAmount',
                'orderSoAmount',
                'soAmount',
              ].includes(column.property)
            ) {
              return this.numFormat1(this.meanNum(data, column.property), 2)
            }

            return null
          }
        }),
      ]
    },
    //获取容器当前高度，重设表格的最大高度
    getTableMaxHeight(str) {
      this.$nextTick(function () {
        let box_clientHeight = window.innerHeight
        let height = 350
        if (this.mainShowSearch) {
          height =
            box_clientHeight - parseInt((box_clientHeight / 100) * 12) - 655
          this.$set(this, 'tableHeight', height > 350 ? height : 350)
        } else {
          height =
            box_clientHeight - parseInt((box_clientHeight / 100) * 12) - 300
          this.$set(this, 'tableHeight', height > 350 ? height : 350)
        }
      })
    },

    //导入
    handleLoad() {
      if (this.orderDtl.code != null) {
        this.upload.title = '产品清单导入'
        this.upload.open = true
        this.upload.moduleId = this.orderDtlParams.moduleId
        this.upload.orderId = this.orderDtlParams.orderId
      } else {
        this.$message.warning('请先保存数据！')
      }
    },
    //导入
    handleCustomerLoad() {
      if (this.orderDtl.code != null) {
        this.upload1.title = '按客户产品编码导入'
        this.upload1.open = true
        this.upload1.moduleId = this.orderDtlParams.moduleId
        this.upload1.orderId = this.orderDtlParams.orderId
      } else {
        this.$message.warning('请先保存数据！')
      }
    },
    /** 状态字典翻译-审批状态 */
    tranTimePointFormat(row, column) {
      return this.selectDictLabel(this.tcDeliveryTimeOptions, row.tranTimePoint)
    },
    // 状态字典翻译-发货状态
    arrivalStatusFormat(row, column) {
      return this.selectDictLabel(this.arrivalList, row.arrivalStatus)
    },
    utChange(row) {
      let that = this
      let oldUt = null
      let newUt = null
      for (const ut of row.baseProductUtList) {
        if (ut.utSecond == row.soUnitBackup) {
          oldUt = ut
          break
        }
      }
      for (const ut of row.baseProductUtList) {
        console.log('ut', ut)
        console.log('row.soUnit', row.soUnit)
        // 销售单位：row.soUnit
        if (ut.utSecond == row.soUnit) {
          ut.minPackQty = ut.minPackQty || 1
          row.utRateDen = ut.utRateDen
          row.utRateNum = ut.utRateNum
          newUt = ut
          console.log('newUt', newUt)
          break
        }
      }

      // bug6998一体化平台-销售模块-销售订单，明细列表，选择产品数据后，先编辑多单位，后编辑订单数量时，多单位的“每箱数量”的数据显示错误
      //  && row.orderQty != null，没有订单数量也可以切换单位查出每箱数量
      if (oldUt != null && newUt != null) {
        let stockQty = this.numDiv(
          this.numMul(row.orderQty, oldUt.utRateDen),
          oldUt.utRateNum,
          4
        )
        let orderQty = this.numDiv(
          this.numMul(stockQty, newUt.utRateNum),
          newUt.utRateDen,
          4
        )

        this.$set(row, 'orderQty', orderQty)
        //箱数
        // let cartons = Math.ceil(Number(this.numDiv(orderQty, row.percartonQty, 4)))
        let cartons = Number(this.numDiv(orderQty, row.percartonQty, 1)) // 数量/每箱数量
        this.$set(row, 'cartons', cartons)
        //换算率分子、分母
        if (row.baseProductUtList) {
          for (const ut of row.baseProductUtList) {
            if (row.soUnit == ut.utSecond) {
              row.soUnitBackup = ut.utSecond
              row.utRateNum = ut.utRateNum
              row.utRateDen = ut.utRateDen
              row.percartonQty = ut.percartonQty
              // console.log('row.percartonQty',row.percartonQty)
              row.quotationCode = ut.quotationCode // 报价单编号
              row.quotationName = ut.quotationName // 报价单名称
              row.quotationPrice = ut.soPrice // 报价单价格
              row.singleRebateAmount = ut.singleRebateAmount // 单件返佣金额
              row.minOrderQty = ut.minOrderQty // 起批量
              row.minPackQty = ut.minPackQty || 1 // 最小包装数
              row.soPrice = ut.soPrice // 含税单价
              row.outTaxrate = ut.outTaxrate || 0 // 销售税率
              row.soCost = ut.soCost // 不含税单价
              row.customerProductCode = ut.customerProductCode // 客户产品编码
              row.customerProductName = ut.customerProductName // 客户产品名称
              break
            }
          }
        }
        // 每箱数量
        this.$set(row, 'percartonQty', newUt.percartonQty)
        // 最小包装数 = 最小包装/(分子utRateDen/分母utRateNum)
        // let minPackQty = newUt.minPackQty/(newUt.utRateDen/newUt.utRateNum)
        // console.log('this.row.minPackQty',this.row.minPackQty)
        this.$set(row, 'quotationCode', newUt.quotationCode) // 报价单编号
        this.$set(row, 'quotationName', newUt.quotationName) // 报价单名称
        this.$set(row, 'quotationPrice', newUt.soPrice) // 报价单价格
        this.$set(row, 'singleRebateAmount', newUt.singleRebateAmount) // 单件返佣金额
        this.$set(row, 'minOrderQty', newUt.minOrderQty) // 起批量
        this.$set(row, 'minPackQty', newUt.minPackQty) // 最小包装数
        this.$set(row, 'soPrice', newUt.soPrice) // 含税单价
        this.$set(row, 'outTaxrate', newUt.outTaxrate || 0) // 销售税率
        this.$set(row, 'soCost', newUt.soCost) // 不含税单价
        this.orderQtyChange(row)
      }
      row.soUnit_dictText = this.utFormat(row)
    },
    utFormat(row) {
      if (row.baseProductUtList) {
        return this.selectByDiy(
          row.baseProductUtList,
          row.soUnit,
          'utSecond',
          'utCname'
        )
      }
      return ''
    },
    utFormat1(row) {
      if (row.baseProductUtList) {
        return this.selectByDiy(
          row.baseProductUtList,
          row.product.utCode,
          'utSecond',
          'utCname'
        )
      }
      return ''
    },
    setPic(row) {
      this.picArray = []
      this.picArray.push(this.prvImageUrl + row.thumbnailPath)
    },
    setPro(row) {
      this.proArray = []
      this.proArray.push(this.prvImageUrl + row.product.thumbnailPath)
    },
    /**折扣Change事件,折扣为undefined时设置折扣为 10 */
    discountChange(row) {
      if (
        row.discount === undefined ||
        row.discount == null ||
        row.discount == ''
      ) {
        this.$set(row, 'discount', 10)
      }
      this.$set(row, 'isDiscountSelected', !row.isDiscountSelected)
      this.setProParams(row)
    },

    // 含税单价失去焦点
    soPriceChange(row) {
      // 含税单价是0，不含税单价也是0，不参与计算
      if (row.soPrice == '0') {
        this.$set(row, 'soCost', 0)
        return
      } else if (row.outTaxrate == '0') {
        this.$set(row, 'soCost', row.soPrice)
      }
      if (
        this.praseStrEmpty(row.outTaxrate) !== '' &&
        this.praseStrEmpty(row.soPrice) !== ''
      ) {
        let soCost = Number(
          this.numDiv(
            row.soPrice,
            this.numDiv(this.numAdd(100, Number(row.outTaxrate)), 100, 4),
            6
          )
        )
        if (soCost > 999999999.999999) {
          this.$message.warning('不含税单价不能超过999999999.999999')
          this.$nextTick(() => {
            this.$set(row, 'soCost', 0)
            this.$set(row, 'soPrice', 0)
          })
        } else {
          this.$set(row, 'soCost', soCost)
        }
      }
      this.$set(row, 'isSoPriceSelected', !row.isSoPriceSelected)
      this.setProParams(row)
    },
    // 不含税单价失去焦点
    soCostChange(row) {
      // 不含税单价是0，含税单价也是0，不参与计算
      if (row.soCost == '0') {
        this.$set(row, 'soPrice', 0)
        return
      } else if (row.outTaxrate == '0') {
        this.$set(row, 'soPrice', row.soCost)
      }
      if (
        this.praseStrEmpty(row.outTaxrate) !== '' &&
        this.praseStrEmpty(row.soCost) !== ''
      ) {
        let soPrice = Number(
          this.numMul(
            row.soCost,
            this.numDiv(this.numAdd(100, row.outTaxrate), 100, 4)
          ).toFixed(6)
        )
        if (soPrice > 999999999.999999) {
          this.$message.warning('含税单价不能超过999999999.999999')
          this.$nextTick(() => {
            this.$set(row, 'soCost', 0)
            this.$set(row, 'soPrice', 0)
          })
        } else {
          this.$set(row, 'soPrice', soPrice)
        }
      }
      this.$set(row, 'isSoCostSelected', !row.isSoCostSelected)
      this.setProParams(row)
    },
    /**
     * 计算含税金额、折扣金额方法
     */
    setSoAmount(row) {
      // 原先的含税金额
      // row.soAmount = Number(
      //   Number(
      //     this.numMul(
      //       this.numMul(row.soPrice || 0, row.orderQty || 0),
      //       (row.discount || 0) / 10
      //     )
      //   ).toFixed(2)
      // )
      row.inAmount = Number(
        Number(this.numMul(row.soPrice || 0, row.orderQty || 0)).toFixed(2)
      )
      // 折扣金额 =  含税金额*(1 - 折扣/10)
      row.discountAmount = Number(
        this.mutiply(row.inAmount, this.minus(1, this.devide(row.discount, 10)))
      ).toFixed(2)
    },
    // 计算份数方法 份数 = 数量/最小包装
    setCopies(row) {
      // console.log('row.minPackQty',row.minPackQty)
      if (row.minPackQty != undefined && row.minPackQty != 0) {
        row.copies = this.devide(row.orderQty || 0, row.minPackQty || 0)
        // console.log('row.copies',row.copies)
      }
    },
    // 计算折扣金额方法 折扣金额 = 含税金额*（1-折扣）
    setDiscountAmount(row) {
      // console.log('row',row)
      // minus：减
      let aa = this.mutiply(row.inAmount, this.minus(1, row.discount / 10))
      this.$set(row, 'discountAmount', aa)
      // console.log('wwwwwww',row.discountAmount)
    },
    // 主表的折扣变 字表的折扣也变方法
    setDiscountAmount1(value) {
      for (let index = 0; index < this.orderDtlList.length; index++) {
        const item = this.orderDtlList[index]
        // console.log('item',item)
        item.discount = value
        this.setDiscountAmount(item)
        this.setDiscountedAmount(item)
      }
    },
    // 计算折后金额方法 折后金额 = 含税金额 - 折扣金额
    setDiscountedAmount(row) {
      let amount = this.minus(row.inAmount, row.discountAmount)
      // this.$set(row, 'soAmount', amount)
      this.$set(row, 'orderSoAmount', amount)
    },
    // 税率失去焦点
    outTaxrateChange(row) {
      if (this.praseStrEmpty(row.outTaxrate) == '') {
        this.$set(row, 'outTaxrate', 0)
        this.$set(row, 'soCost', Number(row.soPrice))
        return
      }
      if (
        this.praseStrEmpty(row.outTaxrate) !== '' &&
        this.praseStrEmpty(row.soPrice) !== ''
      ) {
        let soCost = Number(
          this.numDiv(
            row.soPrice,
            this.numDiv(this.numAdd(100, Number(row.outTaxrate)), 100, 4),
            6
          )
        )
        this.$set(row, 'soCost', soCost)
      } else if (
        this.praseStrEmpty(row.outTaxrate) !== '' &&
        this.praseStrEmpty(row.soCost) !== ''
      ) {
        let soPrice = Number(
          this.numMul(
            row.soCost,
            this.numDiv(this.numAdd(100, row.outTaxrate), 100, 4)
          ).toFixed(6)
        )
        if (soPrice > 999999999.999999) {
          this.$message.warning('含税单价不能超过999999999.999999')
          this.$nextTick(() => {
            this.$set(row, 'outTaxrate', 0)
            this.$set(row, 'soPrice', 0)
          })
        } else {
          this.$set(row, 'soPrice', soPrice)
        }
        this.$set(row, 'isOutTaxrateSelected', !row.isOutTaxrateSelected)
        this.setProParams(row)
      }
    },
    //获取产品列表
    getListPro() {
      // this.proParams.params.customerCode = this.orderDtl.customerCode || null
      // listProduct(this.proParams).then((res) => {
      //   this.productList = res.rows
      // })

      this.proParams.customerCode = this.orderDtl.customerCode || null
      listBySpHavePrice(this.proParams)
        .then((res) => {
          this.productList = res.rows
        })
        .catch(function () {})
    },
    //单击产品
    async proRowClick(row, column, e, index) {
      let that = this
      if (that.orderDtl.id) {
        if (row.productId != row.id) {
          row.productId = row.id
          row.product = row
          row.percartonQty = row.percartonQty || 1
          row.soUnit = row.utCode
          row.baseProductUtList = row.baseProductUtList
          row.discount = 10
          // ---------------------------------
          row.soUnit = row.utCode
          row.customerProductCode = row.customerProductCode // 客户产品编码
          row.customerProductName = row.customerProductName // 客户产品名称
          row.cdesc = row.cdesc

          //换算率分子、分母
          if (row.baseProductUtList) {
            for (const ut of row.baseProductUtList) {
              if (row.soUnit == ut.utSecond) {
                row.utRateNum = ut.utRateNum
                row.utRateDen = ut.utRateDen
                // -------------
                row.quotationCode = ut.quotationCode // 报价单编号
                row.quotationName = ut.quotationName // 报价单名称
                row.quotationPrice = ut.soPrice // 报价单价格
                row.singleRebateAmount = ut.singleRebateAmount // 单价返佣金额
                row.minOrderQty = ut.minOrderQty // 起批量
                row.minPackQty = ut.minPackQty || 1 // 最小包装数
                row.soPrice = ut.soPrice // 含税单价
                row.outTaxrate = ut.outTaxrate || 0 // 销售税率
                row.soCost = ut.soCost // 不含税单价
                break
              }
            }
          }
          // that.orderDtlList.splice(index, 0, row)
          const $table = that.$refs.xTable
          await $table.insertAt(row, that.clickIndex)
          that.proParams.searchValue = row.cdesc
          that.row = {}
          that.setProParams()
        }
      } else {
        that.msgWarning('请先保存主表数据')
      }
    },
    /** 新增行按钮操作 */
    handleAdd(row) {
      this.reset()
      this.form.product = {}
      this.orderDtlList.splice(
        row.index + 1,
        0,
        JSON.parse(JSON.stringify(this.form))
      )
    },
    /** 删除行按钮操作 */
    handleDelete(row) {
      // 删除行是当前编辑行
      if (row.index == this.row.index) {
        this.$set(this, 'row', {})
      }
      this.orderDtlList.splice(row.index, 1)
      this.setProParams()
    },
    //设置流程的三大参数
    setOrderDtlParams(orderId, moduleId, corpid) {
      this.orderDtlParams.orderId = orderId
      this.orderDtlParams.moduleId = moduleId
      this.orderDtlParams.corpid = corpid
    },
    //设置订单中的商品金额，总金额，件数，总数
    setFormFourParams() {
      selectSumFour(this.orderDtlParams).then((response) => {
        this.orderDtl.totalProductAmount = this.numDiv(
          response.data.totalProductAmount,
          1,
          6
        )
        // this.orderDtl.totalSoAmount = this.numDiv(
        //   response.data.totalSoAmount,
        //   1,
        //   6
        // )
        // 总金额要加上运费
        this.orderDtl.totalSoAmount = this.numDiv(
          this.add(this.orderDtl.freight, response.data.totalSoAmount),
          1,
          6
        )
        this.orderDtl.totalQty = this.numDiv(response.data.totalQty, 1, 6)
        this.orderDtl.totalCatQty = this.numDiv(response.data.totalCatQty, 1, 6)
        this.total = this.numDiv(response.data.totalCatQty, 1, 6)
        if (this.orderDtl.id != null) {
          this.$emit('updateForm', this.orderDtl)
        }
      })
    },
    /** 查询订单明细列表 */
    getList() {
      let that = this
      that.loading = true
      that.orderDtlParams.customerCode = this.orderDtl.customerCode
      var orderId
      if (that.copy) {
        orderId = that.formId
      } else {
        orderId = that.orderDtl.id
      }
      that.orderDtlParams.orderId = orderId
      setTimeout(() => {
      // listOrderNewList(that.orderDtlParams).then((response) => {
        // that.orderDtlList = response.rows.map((item) => {
        //   item.cdesc = item.product?.cdesc
        //   item.soUnitBackup = item.soUnit
        //   return item
        // })
        let response = {
          total: 1,
          rows: [
            {
              createBy: '240620001',
              createTime: 1724051338000,
              updateBy: '240620001',
              updateTime: 1724051345000,
              remark: '453543',
              params: {},
              variables: {},
              id: '1825429735431311362',
              productId: '1785113251753422850',
              soCurrercy: '人民币',
              soPrice: 99.54,
              soCost: 92.854478,
              outTaxrate: 7.2,
              discount: 10.0,
              inAmount: 1415.4588,
              soAmount: 1415.4588,
              discountAmount: 0.0,
              status: 'T',
              delFlag: 0,
              orderId: '1825429735380979713',
              moduleId: '8001',
              corpid: '1',
              dataDeptCode: '194',
              shipment: 1723737600000,
              qty: 14.22,
              product: {
                params: {},
                variables: {},
                id: '1785113251753422850',
                itemno: '666666',
                cdesc: '小刘六啊',
                utCode: 'DW001',
                brand: '让他',
                itemnoa: '喂',
                description: '与',
                edesc: '而',
                color: '统一',
                moduleId: '1116',
              },
              customerCode: '007',
              customerName: 'xixihaha',
              orderCode: 'XSDD20240819018',
              productCode: '666666',
              productName: '小刘六啊',
              orderTime: '2024-08-19 15:09:05',
              percartonQty: 1.0,
              cartons: 14.22,
              utRateNum: 1.0,
              utRateDen: 1.0,
              soUnit: 'DW001',
              arrivalStatus: '10',
              minPackQty: 1.0,
              copies: 14.22,
              afterSalesStatus: '0',
              customerProductCode: '',
              customerProductName: '',
              orderSoAmount: 1415.4588,
              orderQty: 14.22,
              actQty: 0.0,
              discountProductAmount: 1415.4588,
              baseProductUtList: [
                {
                  createBy: 'admin',
                  createTime: 1714439140000,
                  updateBy: 'admin',
                  updateTime: 1723776786000,
                  params: {},
                  variables: {},
                  id: '1785113252428705794',
                  utFirst: 'DW001',
                  utSecond: 'DW001',
                  utRateNum: 1.0,
                  utRateDen: 1.0,
                  status: 'F',
                  delFlag: 0,
                  productId: '1785113251753422850',
                  moduleId: '1116',
                  utCname: '千克',
                  percartonQty: 1.0,
                  soCost: 0,
                  soPrice: 0,
                  outTaxrate: 0,
                },
                {
                  createBy: 'admin',
                  createTime: 1714439154000,
                  params: {},
                  variables: {},
                  id: '1785113312323366913',
                  utFirst: 'DW001',
                  utSecond: 'DW003',
                  utRateNum: 1000.0,
                  utRateDen: 1.0,
                  status: 'F',
                  delFlag: 0,
                  productId: '1785113251753422850',
                  moduleId: '1116',
                  utCname: '克',
                  percartonQty: 1000.0,
                  soCost: 0,
                  soPrice: 0,
                  outTaxrate: 0,
                },
              ],
              tranTime: '2024-08-16',
              tranWay: 'SelfPickup',
              refundAmount: 0,
              soUnit_dictText: '千克',
              arrivalStatus_dictText: '待发货',
              afterSalesStatus_dictText: '无售后',
              tranWay_dictText: '自提点自提',
              createBy_dictText: '测试账号',
              updateBy_dictText: '测试账号',
            },
          ],
          code: 200,
          msg: '查询成功',
        }
        that.orderDtlList = response.rows
        that.orderDtlList.forEach((item, index) => {
          item.cdesc = item.product?.cdesc
          item.soUnitBackup = item.soUnit
          item.index = index
        })
        if (!that.isView) {
          that.reset()
          that.form.product = {}
          that.form.discount = 10
          // that.orderDtlList = that.completeArr(
          //   that.orderDtlList,
          //   JSON.parse(JSON.stringify(that.form)),
          //   5
          // )
          for (let index = that.orderDtlList.length; index < 1000; index++) {
            this.orderDtlList.push({
              ...that.form,
              id: 'aa' + index,
              soUnitBackup: this.form.soUnit,
            })
          }
          console.log(that.orderDtlList)
        }
        that.total = response.total
        that.loading = false
        that.maxWidth = that.getMaxWidth(that.maxWidth, that.orderDtlList)
        this.$nextTick(() => {
          if (this.$refs.multipleTable && this.$refs.multipleTable.doLayout) {
            this.$refs.multipleTable.doLayout()
          }
        })
        that.setProParams()

        this.setFormFourParams()
      // })
      }, 500)
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        uuid: this.uuidv4(),
        line: null,
        productId: null,
        soCurrercy: '人民币',
        soPrice: 0,
        soCost: 0,
        qty: 0,
        outTaxrate: 0,
        discount: 10,
        // discount: null,
        soAmount: 0,
        inAmount: null,
        status: 'F',
        delFlag: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
        orderId: this.orderDtlParams.orderId,
        moduleId: this.orderDtlParams.moduleId,
        corpid: this.$store.state.user.corpid,
        percartonQty: null,
        cartons: 0,
        minPackQty: 1,
        copies: null,
        orderSoAmount: null, // 订单折后金额
        orderQty: null, // 订单数量
        actQty: null, // 实到数量
      }
      this.resetForm('form')
    },
    /**选择产品按钮 */
    handleAddPro(row) {
      // 获取当前行索引
      this.clickIndex = this.$refs.xTable.getVMRowIndex(row)
      if (this.orderDtl.id) {
        this.selectForStock()
      } else {
        this.msgWarning('请先保存主表数据')
      }
      console.log('orderDtl', this.orderDtl)
      row.customerCode = this.orderDtl.customerCode || null
    },
    /**产品列表是否开启 */
    selectForStock() {
      this.$refs['BaseProductDtl'].openDialog()
    },
    /** 添加产品 */
    async addProductList(data, row) {
      // 赋值折扣
      let that = this
      const $table = this.$refs.xTable
      let idx = 0
      let afterFullDatas = $table.afterFullData
      // 选择产品行原来有数据，从它下一行开始插入，否则从当前行开始插入
      if (afterFullDatas[that.clickIndex].product.itemno) {
        idx = that.clickIndex + 1
      } else {
        idx = that.clickIndex
      }
      if (data.length > 0) {
        // for (let i = 0; i < data.length; i++) {
        for (let i = idx; i < idx + data.length; i++) {
          let utRateNum = null
          let utRateDen = null
          let percartonQty = null
          // -------------
          let quotationCode = null
          let quotationName = null
          let quotationPrice = null
          let singleRebateAmount = null
          let minOrderQty = null
          let minPackQty = null
          let soPrice = null
          let outTaxrate = null
          let soCost = null
          //换算率分子、分母
          if (data[i - idx].baseProductUtList) {
            for (const ut of data[i - idx].baseProductUtList) {
              if (data[i - idx].utCode == ut.utSecond) {
                utRateNum = ut.utRateNum
                utRateDen = ut.utRateDen
                percartonQty = ut.percartonQty
                quotationCode = ut.quotationCode // 报价单编号
                quotationName = ut.quotationName // 报价单名称
                quotationPrice = ut.soPrice // 报价单价格
                singleRebateAmount = ut.singleRebateAmount // 单件返佣金额
                minOrderQty = ut.minOrderQty // 起批量
                minPackQty = ut.minPackQty || 1 // 最小包装数
                soPrice = ut.soPrice // 含税单价
                outTaxrate = ut.outTaxrate || 0 // 销售税率
                soCost = ut.soCost // 不含税单价
                that.row.soUnit_dictText = that.utFormat(that.row)
                break
              }
            }
          }
          let a = JSON.parse(
            JSON.stringify({
              discount: that.orderDtl.discount,
              moduleId: that.orderDtlParams.moduleId,
              orderId: that.orderDtlParams.orderId,
              corpid: that.orderDtlParams.corpid,
              soCurrercy: '人民币',
              cdesc: data[i - idx]?.cdesc,
              productId: data[i - idx].id,
              product: data[i - idx],
              utFirst: data[i - idx].utCode,
              soUnit: data[i - idx].utCode,
              soUnit_dictText: data[i - idx].utCode_dictText,
              soUnitBackup: data[i - idx].utCode,
              utRateNum: utRateNum,
              utRateDen: utRateDen,
              baseProductUtList: data[i - idx].baseProductUtList,
              // soPrice:
              //   data[i - idx].omsProduct == null ? 0 : data[i - idx].omsProduct.soPrice,
              // soCost:
              //   data[i - idx].omsProduct == null ? 0 : data[i - idx].omsProduct.soCost,
              // outTaxrate:
              //   data[i - idx].omsProduct == null ? 0 : data[i - idx].omsProduct.outTaxrate,
              omsProductCode:
                data[i - idx].omsProduct == null
                  ? ''
                  : data[i - idx].omsProduct.code,
              discount: 10,
              // soAmount: 0,
              // inAmount: 0,
              qty: 0,
              cartons: 0,
              line: that.line + i,
              percartonQty: percartonQty,
              // -----
              quotationCode: quotationCode, // 报价单编号
              quotationName: quotationName, // 报价单名称
              quotationPrice: quotationPrice, // 报价单价格
              singleRebateAmount: singleRebateAmount, // 单件返佣金额
              minOrderQty: minOrderQty, // 起批量
              minPackQty: minPackQty, // 最小包装数
              soPrice: soPrice, // 含税单价
              outTaxrate: outTaxrate, // 销售税率
              soCost: soCost, // 不含税单价
              customerProductCode: data[i - idx].customerProductCode, // 客户产品编码
              customerProductName: data[i - idx].customerProductName, // 客户产品名称
            })
          )

          await $table.insertAt(a, i)
        }
        $table.refreshColumn()
      }
      // 选择完数据，取消行编辑状态
      // that.$set(that.orderDtlList[this.clickIndex], 'show', false)
      that.row = {}
      that.setProParams()
    },
    setQty(row) {
      //   let qty = Number(this.numMul(row.cartons, row.percartonQty))
      //   if (qty > 99999999.9) {
      //     this.$set(row, 'cartons', 1)
      //     this.$set(row, 'qty', qty)
      //     this.$message.warning('数量不能超过99999999.9999')
      //   } else {
      //     this.$set(row, 'qty', qty)
      //   }
      //   this.setProParams(row)

      if (
        row.cartons === '' ||
        row.cartons === null ||
        row.cartons === undefined
      ) {
        this.$set(row, 'cartonsError', '请输入箱数')
        this.$set(row, 'cartons', 0)
        return
      } else if (Number(row.cartons) * Number(row.percartonQty) > 9999999.9) {
        this.$set(row, 'cartonsError', '箱数过大')
        this.$set(
          row,
          'cartons',
          9999999.9 / Number(row.percartonQty).toFixed(1)
        )
      } else {
        var data = row.cartons
        // var flag = data.substr(0, 1)
        // if (flag == '.') {
        //   data = parseFloat('0' + data)
        //   this.row.cartons = data
        // }

        if (data == '0') {
          this.$set(row, 'cartonsError', '只能输入正数或小数')
          return
        }

        let reg = /^(([1-9][0-9]*)|(([0]\.\d{1,}|[1-9][0-9]*\.\d{1,})))$/
        if (!reg.test(data)) {
          this.$set(row, 'cartonsError', '只能输入正数')
          return
        }
        reg = /^(([1-9][0-9]*)|(([0]\.\d{1,1}|[1-9][0-9]*\.\d{1,1})))$/
        if (!reg.test(data)) {
          this.$set(row, 'cartonsError', '请保留1位小数')
          return
        }
      }
      //   -----------------------------------------------
      this.$set(row, 'isCartonsSelected', !row.isCartonsSelected)
      this.$set(row, 'cartonsError', '')
      this.$set(row, 'orderQtyError', '')
      let qty = Number(this.numMul(row.cartons, row.percartonQty))
      this.$set(row, 'qty', qty)
      this.setProParams(row)
    },
    /**
     * 数量改变事件
     */
    orderQtyChange(row) {
      if (
        row.orderQty === '' ||
        row.orderQty === null ||
        row.orderQty === undefined
      ) {
        this.$set(row, 'orderQtyError', '请输入数量')
        this.$set(row, 'orderQty', 0)
        return
      } else if (Number(row.orderQty) > 9999999.9999) {
        this.$set(row, 'orderQtyError', '数量过大')
        this.$set(row, 'orderQty', 9999999.9999)
      } else {
        var data = row.orderQty
        // var flag = data.substr(0, 1)
        // if (flag == '.') {
        //   data = parseFloat('0' + data)
        //   this.row.orderQty = data
        // }
        if (data == '0') {
          this.$set(row, 'orderQtyError', '只能输入正数或小数')
          return
        }

        let reg = /^(([1-9][0-9]*)|(([0]\.\d{1,}|[1-9][0-9]*\.\d{1,})))$/
        if (!reg.test(data)) {
          this.$set(row, 'orderQtyError', '只能输入正数')
          return
        }
        reg = /^(([1-9][0-9]*)|(([0]\.\d{1,4}|[1-9][0-9]*\.\d{1,4})))$/
        if (!reg.test(data)) {
          this.$set(row, 'orderQtyError', '请保留4位小数')
          return
        }
      }
      //   --------------------------------------
      this.$set(row, 'isOrderQtySelected', !row.isOrderQtySelected)
      this.$set(row, 'orderQtyError', '')
      this.$set(row, 'cartonsError', '')
      // 应发数量=订单数量
      this.$set(row, 'qty', row.orderQty)
      this.$set(
        row,
        'cartons',
        row.percartonQty
          ? (Number(row.orderQty) / Number(row.percartonQty)).toFixed(1)
          : 1
      )
      this.setProParams(row)
    },
    /** 设置总金额、商品金额、数量、件数 */
    setProParams(row) {
      if (row) {
        this.setSoAmount(row) // 计算含税金额方法
        this.setCopies(row)
        this.setDiscountAmount(row)
        this.setDiscountedAmount(row) // 计算订单折后金额
      }
      // // 计算折扣金额
      // discountAmount
      const $table = this.$refs.xTable
      // const proList = this.orderDtlList.filter(
      //   (item) => item.productId !== null
      // )
      // 修改时使用this.orderDtlList
      let proList = []
      if (this.form.id) {
        proList = $table.afterFullData.filter((item) => item.productId !== null)
      } else {
        proList = this.orderDtlList.filter((item) => item.productId !== null)
      }
      // 设置件数
      this.orderDtl.totalCatQty = proList.length
      // 总数量
      let totalQty = 0
      // 商品总金额
      let totalProductAmount = 0
      // 总金额
      let totalSoAmount = 0
      proList.forEach((item) => {
        if (
          item.orderQty !== undefined &&
          item.soPrice !== undefined &&
          item.discount !== undefined
        ) {
          totalQty = Number(this.numAdd(totalQty, item.orderQty))

          //   this.numDiv(this.numSub(100, item.discount / 10), 10)
          //   商品金额=含税单价*数量

          totalProductAmount += this.numMul(item.soPrice, item.orderQty)

          //   总金额=含税单价*数量*折扣
          totalSoAmount += this.numMul(
            this.numMul(item.soPrice, item.orderQty),
            item.discount / 10
          )
        } else {
          item.orderQty = 0
          item.copies = 0
          item.soPrice = 0
          item.soCost = 0
          item.inAmount = 0
          item.discountAmount = 0
          item.orderSoAmount = 0
        }
      })
      this.orderDtl.totalQty = totalQty
      this.orderDtl.totalProductAmount = totalProductAmount
      this.orderDtl.totalSoAmount = totalSoAmount
      this.$emit('updateForm', this.orderDtl)
    },
    sum(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计'
          return
        }
        const values = data.map((item) => Number(item[column.property]))
        // 未审批，待审批
        if (!this.isView) {
          // if (
          //   !values.every((value) => isNaN(value)) &&
          //   [6, 18, 19, 20, 21].includes(index)
          // ) {
          // 产品图片隐藏，顺序重新改
          if (
            !values.every((value) => isNaN(value)) &&
            [5, 17, 18, 19, 20].includes(index)
          ) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                // return prev + curr
                return this.add(prev, curr)
              } else {
                return prev
              }
            }, 0)
            // 5订单数量、编辑状态无 应发数量和实到数量
            if (index == 5) {
              sums[index] = this.numFormat(
                null,
                null,
                this.numDiv(sums[index], 1, 4)
              )
            }
            // 应发箱数
            else if (index == 14) {
              sums[index] = this.numFormat(
                null,
                null,
                this.numDiv(sums[index], 1, 1)
              )
            }
            // 需求：新增编辑列发生变化隐藏某些字段 查看可查看所有字段
            // 18含税金额，19折扣金额，20订单折后金额，21应付金额
            else if (index == 17 || index == 18 || index == 19 || index == 20) {
              sums[index] = this.numFormat(
                null,
                null,
                this.numDiv(sums[index], 1, 2)
              )
            }
          }
        }
        // ----------------------------
        // 已审批
        if (this.isView) {
          console.log('this.isView', 3333)
          if (
            !values.every((value) => isNaN(value)) &&
            [9, 10, 11, 14, 24, 25, 26, 27].includes(index)
          ) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                // return prev + curr
                return this.add(prev, curr)
              } else {
                return prev
              }
            }, 0)

            // 9订单数量、10应发数量,11实到数量
            if (index == 9 || index == 10 || index == 11) {
              sums[index] = this.numFormat(
                null,
                null,
                this.numDiv(sums[index], 1, 4)
              )
            }
            // 应发箱数
            else if (index == 14) {
              sums[index] = this.numFormat(
                null,
                null,
                this.numDiv(sums[index], 1, 1)
              )
            }
            // 24含税金额，25折扣金额，26订单折后金额，27应付金额
            else if (index == 24 || index == 25 || index == 26 || index == 27) {
              sums[index] = this.numFormat(
                null,
                null,
                this.numDiv(sums[index], 1, 2)
              )
            }
          }
        }
      })
      return sums
    },
    // ---------------------------------------
    selectAllEvent({ checked }) {
      const records = this.$refs.xTable.getCheckboxRecords()
      this.ids = records.map((item) => item)
      this.leftToolBar.multiple = !selection.length
      console.log(checked ? '所有勾选事件' : '所有取消事件', records)
    },
    /** 多选框选中数据 */
    selectChangeEvent({ checked }) {
      const records = this.$refs.xTable.getCheckboxRecords()
      this.ids = records.map((item) => item)
      this.leftToolBar.multiple = !records.length
      console.log(checked ? '勾选事件' : '取消事件', records)
    },
    // 删除
    delOrderDtl() {
      let that = this

      that
        .$confirm('确认删除当前数据?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        })
        .then(() => {
          const $table = this.$refs.xTable
          // const selectRecords = $table.getCheckboxRecords()
          const selectRecords = $table.getCheckboxRecords()

          // 之前删除有问题，和绪强重新对接：表格里空数据要清掉,只传有产品的数据;增加删除标志，删除的改成1，不需要删除的传0（带过来未保存数据也执行此规则即可）
          // let arr = that.orderDtlList.filter(
          //   (s) => this.praseStrEmpty(s.product.id) != ''
          // )
          let arr = $table.afterFullData.filter(
            (s) => this.praseStrEmpty(s.product.id) != ''
          )
          arr.forEach((s, idx) => {
            let index = selectRecords.findIndex(
              (n) =>
                // 删除数据索引相同，产品相同
                $table.getVMRowIndex(s) == $table.getVMRowIndex(n) &&
                n.productId == s.productId
            )
            if (index > -1) {
              s.delFlag = 1 // 删除
            } else {
              s.delFlag = 0
            }
          })
          let obj = { ...that.orderDtl }
          obj.orderDtlList = arr
          // 子表保存数据，后端删除
          deleteAndSave(obj).then((response) => {
            that.msgSuccess('删除成功')
            that.getList()
            that.ids = []
          })
        })
        .catch(() => {})
    },
    // 最小包装数失去焦点
    minPackQtyBlur(row) {
      // this.setCopies(row)
      this.setProParams(row)
    },
  },
}
</script>

<style scoped lang="scss">
:deep(.el-table__body tr.current-row > td) {
  background-color: #d0e8ff !important;
}
:deep(.el-popover) {
  position: fixed !important;
}
</style>