tire-platform-ui/src/views/landTransportation/placeAnOrder/detailPage.vue

<template>
  <div>
    <div class="customer-head">
      <div class="customer-back">
        <el-button
            type="danger"
            style="border: none;background: none;color: red"
            icon="el-icon-arrow-left"
            @click="backToList"
        >返回列表
        </el-button>
      </div>
      <div>
        <el-button
            class="el-button--small-yh add-customer-btn"
            type="success"
            v-if="goodsForm.status === 0"
            size="small"
            style="margin-right: 70px;"
            @click="submit(true)"
        >提交
        </el-button>
        <el-button
            class="el-button--small-yh add-customer-btn"
            type="success"
            v-if="goodsForm.status === 1"
            size="small"
            style="margin-right: 70px;"
            @click="submit(false)"
        >取消提交
        </el-button>
        <el-button
            class="el-button--small-yh add-customer-btn"
            type="primary"
            :disabled="goodsForm.status === 1"
            size="small"
            @click="editCustomer"
        >保存
        </el-button>
      </div>
    </div>
    <containerTitle
        title="起止地信息"
        style="margin-top: 50px"></containerTitle>
    <basic-container>
      <el-table
          ref="singleTable"
          :data="tableData"
          size="mini"
          :header-cell-style="{color:'#000',background:'#fafafa'}"
          style="width: 100%">
        <el-table-column
            align="center"
            v-if="goodsForm.status !== 1"
            width="40">
          <template slot-scope="scope">
            <el-tooltip className="item" v-if="scope.$index === tableData.length-1" effect="dark" content="增加途径地址"
                        placement="top">
              <el-button type="primary" icon="el-icon-plus" size="mini" circle @click="addAddress"
                         style="margin-right: 1.25rem;"></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column
            property="date"
            align="center"
            width="40">
          <template slot-scope="scope">
            <span v-if="scope.$index == 0">
              <el-button type="primary" size="mini" circle>起</el-button>
            </span>
            <span v-else-if="scope.$index === tableData.length-1">
              <el-button type="success" size="mini" circle>止</el-button>
            </span>
            <span v-else>
              <el-button v-if="goodsForm.status === 1" type="warning" size="mini" circle>途</el-button>
              <el-tooltip v-else class="item" effect="dark" content="删除" placement="right">
                  <el-button type="danger" icon="el-icon-delete" size="mini" circle
                             @click="deleteAddress(scope)"></el-button>
              </el-tooltip>
            </span>
          </template>
        </el-table-column>
        <el-table-column
            type="index"
            label="序号"
            align="center"
            width="60">
        </el-table-column>
        <el-table-column
            property="corpId"
            label="发货工厂"
            align="center"
            :render-header="customTitle"
            width="280">
          <template slot-scope="scope">
            <crop-select
                :disabled="goodsForm.status === 1"
                v-model="scope.row.corpId"
                @getCorpData="(row)=>{withAddress(row,scope)}"/>
          </template>
        </el-table-column>
        <el-table-column
            property="province"
            label="省市区"
            align="center"
            :render-header="customTitle"
            width="280">
          <template slot-scope="scope">
            <el-cascader
                size="small"
                style="width: 100%;"
                :key="scope.row.key"
                :disabled="goodsForm.status === 1"
                :props="treeOption"
                v-model="scope.row.region"></el-cascader>
          </template>
        </el-table-column>
        <el-table-column
            property="address"
            align="center"
            :render-header="customTitle"
            label="详细地址">
          <template slot-scope="scope">
            <el-input v-model="scope.row.address" :disabled="goodsForm.status === 1" size="small"
                      placeholder="请输入内容"></el-input>
          </template>
        </el-table-column>
      </el-table>
    </basic-container>
    <containerTitle title="箱信息"></containerTitle>
    <basic-container v-if="goodsForm.status === 0 || !goodsForm.status">
      <avue-crud :data="entrustList"
                 :option="entrustOptionTwo"
                 @row-save="(row,done,loading)=>{rowSave(row,0,done,loading)}"
                 @row-update="rowSave"
                 @row-del="rowDel">
        <template slot="ctnTypeHeader" slot-scope="{column}">
          {{column.label}}<span style="color:#F56C6C">*</span>
        </template>
        <template slot="ctnQuantityHeader" slot-scope="{column}">
          {{column.label}}<span style="color:#F56C6C">*</span>
        </template>
        <template slot="landWeightHeader" slot-scope="{column}">
          {{column.label}}<span style="color:#F56C6C">*</span>
        </template>
        <template slot="landAmountDHeader" slot-scope="{column}">
          {{column.label}}<span style="color:#F56C6C">*</span>
        </template>
      </avue-crud>
    </basic-container>
    <basic-container v-if="goodsForm.status !== 0 && goodsForm.status">
      <avue-crud
          :data="entrustList"
          :option="entrustOptionTwoT"
          ref="entrustTwoT"
          @row-save="(row,done,loading)=>{rowSaveT(row,0,done,loading)}"
          @row-update="rowSaveT">
        <template slot="fleetId" slot-scope="{ row, index }">
          <crop-select
              v-if="row.$cellEdit"
              v-model="row.fleetId"
              :cropIndex="index"
              @getCorpData="(data)=>{getfleetIdT(data,row)}"
          ></crop-select>
          <span v-else>{{ row.fleetName }}</span>
        </template>
      </avue-crud>
    </basic-container>
    <containerTitle title="委托信息"></containerTitle>
    <basic-container>
      <avue-form :option="goodsOptionForm" ref="goodsForm" v-model="goodsForm">
        <template slot-scope="scope" slot="corpId">
          <crop-select
              :disabled="goodsForm.status === 1"
              v-model="goodsForm.corpId"
              @getCorpData="getCorpData"
          ></crop-select>
        </template>
      </avue-form>
    </basic-container>
    <containerTitle title="费用明细"></containerTitle>
    <basic-container>
      <el-tabs v-model="activeIndex" @tab-click="handleSelect">
        <el-tab-pane label="应收" name="1"></el-tab-pane>
        <el-tab-pane label="应付" name="2"></el-tab-pane>
      </el-tabs>
      <avue-crud
          v-if="activeIndex === '1'"
          :data="collectionList"
          :option="collectionOption"
          ref="collection"
          @row-save="(row,done,loading)=>{rowSave(row,0,done,loading)}"
          @row-update="rowSave"
          @row-del="makeDel">
        <template slot-scope="{row}" slot="corpId">
          <crop-select
              v-if="row.$cellEdit"
              v-model="row.corpId"
              @getCorpData="(data)=>{getfleetId(data,row)}"
          ></crop-select>
          <span v-else>{{ row.corpName }}</span>
        </template>
        <template slot-scope="{row}" slot="feeId">
          <breakdown-select
              v-if="row.$cellEdit"
              v-model="row.feeId"
              @selectValue="(value) => selectValue(value,row)"
              :configuration="breakConfiguration"
          >
          </breakdown-select>
          <span v-else>{{ row.feeName }}</span>
        </template>
        <template slot-scope="{row,index}" slot="menu">
          <el-button
              type="text"
              size="small"
              :icon="row.$cellEdit?'el-icon-circle-plus-outline':'el-icon-edit'"
              @click="rowCell(row,index)"
          >{{ row.$cellEdit ? '保存' : '编辑' }}
          </el-button>
          <el-button type="text"
                     icon="el-icon-delete"
                     size="small"
                     @click="$refs.collection.rowDel(row,index)"
          >删除
          </el-button>
        </template>
        <template slot="menuLeft">
          <el-button type="primary" icon="el-icon-plus" @click="addRowCollection" size="small">录入明细</el-button>
        </template>
      </avue-crud>
      <avue-crud
          v-if="activeIndex === '2'"
          :data="paymentList"
          :option="paymentOption"
          ref="payment"
          @row-save="(row,done,loading)=>{rowSave(row,0,done,loading)}"
          @row-update="rowSave"
          @row-del="feeDel"
      >
        <template slot-scope="{row}" slot="corpId">
          <crop-select
              v-if="row.$cellEdit"
              v-model="row.corpId"
              @getCorpData="(data)=>{getfleetId(data,row)}"
          ></crop-select>
          <span v-else>{{ row.corpName }}</span>
        </template>
        <template slot-scope="{row}" slot="feeId">
          <breakdown-select
              v-if="row.$cellEdit"
              v-model="row.feeId"
              @selectValue="(value) => selectValue(value,row)"
              :configuration="breakConfiguration"
          >
          </breakdown-select>
          <span v-else>{{ row.feeName }}</span>
        </template>
        <template slot-scope="{row,index}" slot="menu">
          <el-button
              type="text"
              size="small"
              :icon="row.$cellEdit?'el-icon-circle-plus-outline':'el-icon-edit'"
              @click="paymentRowCell(row,index)"
          >{{ row.$cellEdit ? '保存' : '编辑' }}
          </el-button>
          <el-button type="text"
                     icon="el-icon-delete"
                     size="small"
                     @click="$refs.payment.rowDel(row,index)"
          >删除
          </el-button>
        </template>
        <template slot="menuLeft">
          <el-button type="primary" icon="el-icon-plus" @click="addRowPayment" size="small">录入明细</el-button>
        </template>
      </avue-crud>
    </basic-container>
    <containerTitle title="上传附件"></containerTitle>
    <c-upload
        typeUpload="CD"
        :data="orderFilesList"
        :enumerationValue="76"
    ></c-upload>
  </div>
</template>

<script>
import {getLazyTree} from "@/api/base/region";
import {
  saveDelegationList,
  detailDelegationList,
  removeCollection,
  saveSaveList,
  addressList, cancelSubmission
} from "@/api/landTransportation";

export default {
  props: {
    id: {
      type: String
    }
  },
  data() {
    return {
      activeIndex: '1',
      goodsForm: {},
      modelKey: 1,
      orderFilesList: [],
      roleName: localStorage.getItem("roleName").split(',')[0],
      breakConfiguration: {
        multipleChoices: false,
        multiple: false,
        disabled: false,
        searchShow: true,
        collapseTags: false,
        clearable: true,
        placeholder: '请点击右边按钮选择',
        dicData: []
      },
      advantageProjectData: [],
      treeOption: {
        label: 'title',
        value: 'id',
        lazy: true,
        lazyLoad(node, resolve) {
          const parentId = node.level === 0 ? '00' : node.data.id;
          getLazyTree(parentId).then(res => {
            resolve(
                res.data.data.map(item => {
                  return {
                    ...item,
                    leaf: !item.hasChildren
                  };
                })
            );
          });
        }
      },
      tableData: [],
      entrustListT: [],
      entrustOptionTwoT: {
        align: 'center',
        menuAlign: 'center',
        index: true,
        cellBtn: true,
        addBtn: false,
        addRowBtn: false,
        delBtn: false,
        showSummary: true,
        summaryText: "合计",
        sumColumnList: [
          {
            name: 'landWeight',
            type: 'sum',
            decimals: 6
          }, {
            name: 'landAmountC',
            type: 'sum',
            decimals: 2
          }, {
            name: 'landAmountD',
            type: 'sum',
            decimals: 2
          }, {
            name: 'ctnQuantity',
            type: 'sum',
            decimals: 0
          }],
        column: [{
          label: '尺寸箱型',
          width: 100,
          prop: 'ctnType'
        }, {
          label: '箱量',
          width: 50,
          prop: 'ctnQuantity'
        }, {
          label: '重量',
          width: 160,
          prop: 'landWeight',
          controls: false,
          precision: 6,
          type: 'number'
        }, {
          label: '应收陆运费',
          prop: 'landAmountD'
        }, {
          label: '备注',
          cell: true,
          prop: 'remarks'
        }
        ]
      },
      entrustList: [],
      goodsOptionForm: {
        menuBtn: false,
        disabled: false,
        column: [{
          label: '客户名称',
          formslot: true,
          prop: 'corpId',
          rules: [{
            required: true,
            message: " ",
            trigger: "change"
          }],
        }, {
          label: '所属公司',
          formslot: true,
          prop: 'belongCompany',
          rules: [{
            required: true,
            message: " ",
            trigger: "blur"
          }],
        }, {
          label: '订单号',
          prop: 'orderNo',
          disabled: true
        }, {
          label: '提单号',
          prop: 'billNo',
          rules: [{
            required: true,
            message: " ",
            trigger: "blur"
          }],
        }, {
          label: '场站',
          prop: 'station',
          rules: [{
            required: false,
            message: " ",
            trigger: "blur"
          }],
        }, {
          label: '到厂时间',
          type: "datetime",
          format: 'yyyy-MM-dd HH:mm:ss',
          valueFormat: 'yyyy-MM-dd HH:mm:ss',
          prop: 'arrivalTime',
          rules: [{
            required: true,
            message: " ",
            trigger: "blur"
          }],
        }, {
          label: '船名航次',
          prop: 'factory',
          rules: [{
            required: false,
            message: " ",
            trigger: "blur"
          }],
        }, {
          label: '货物名称',
          prop: 'goods',
          rules: [{
            required: false,
            message: " ",
            trigger: "blur"
          }],
        }, {
          label: '备注',
          prop: 'remarks'
        }
        ]
      },
      entrustOptionTwo: {
        align: 'center',
        menuAlign: 'center',
        addBtnText: '录入箱信息',
        index: true,
        cellBtn: true,
        addBtn: false,
        addRowBtn: true,
        showSummary: true,
        summaryText: "合计",
        sumColumnList: [
          {
            name: 'landWeight',
            type: 'sum',
            decimals: 6
          }, {
            name: 'landAmountD',
            type: 'sum',
            decimals: 2
          }, {
            name: 'ctnQuantity',
            type: 'sum',
            decimals: 0
          }],
        column: [{
          // label: '尺寸箱型',
          label: '尺寸箱型',
          cell: true,
          prop: 'ctnType',
          type: 'select',
          width: 100,
          dicUrl: "/api/blade-system/dict-biz/dictionary?code=boxType",
          props: {
            label: "dictValue",
            value: "dictValue"
          },
        }, {
          label: '箱量',
          cell: true,
          prop: 'ctnQuantity',
          controls: false,
          precision: 0,
          width: 100,
          maxRows:999,
          minRows:1,
          type: 'number'
        }, {
          label: '总重量(吨)',
          cell: true,
          prop: 'landWeight',
          controls: false,
          width: 200,
          precision: 6,
          type: 'number'
        }, {
          label: '应收陆运费',
          cell: true,
          prop: 'landAmountD',
          controls: false,
          width: 200,
          precision: 2,
          type: 'number'
        }, {
          label: '备注',
          cell: true,
          prop: 'remarks'
        }]
      },
      collectionList: [],
      collectionOption: {
        align: 'center',
        menuAlign: 'center',
        index: true,
        cancelBtn: false,
        editBtn: false,
        delBtn: false,
        cellBtn: false,
        addBtn: false,
        addRowBtn: false,
        showSummary: true,
        addBtnText: '录入明细',
        summaryText: "合计",
        sumColumnList: [{
          name: 'price',
          type: 'sum',
          decimals: 2
        }, {
          name: 'amount',
          type: 'sum',
          decimals: 2
        }, {
          name: 'quantity',
          type: 'sum',
          decimals: 1
        }],
        column: [{
          label: '客户名称',
          slot: true,
          prop: 'corpId'
        }, {
          label: '费用名称',
          slot: true,
          prop: 'feeId'
        }, {
          label: '计价单位',
          cell: true,
          prop: 'unit',
          type: "select",
          dicUrl: "/api/blade-system/dict-biz/dictionary?code=unit",
          props: {
            label: "dictValue",
            value: "dictKey"
          }
        }, {
          label: '数量',
          cell: true,
          prop: 'quantity'
        }, {
          label: '单价',
          cell: true,
          prop: 'price'
        }, {
          label: '金额',
          cell: true,
          prop: 'amount'
        }, {
          label: '税率(默认6)',
          cell: true,
          prop: 'taxRate'
        }, {
          label: '币别',
          cell: true,
          prop: 'currency',
          type: "select",
          dicUrl: "/api/blade-system/dict-biz/dictionary?code=currency",
          props: {
            label: "dictValue",
            value: "dictKey"
          },
        }
        ]
      },
      paymentList: [],
      paymentOption: {
        align: 'center',
        menuAlign: 'center',
        index: true,
        cancelBtn: false,
        editBtn: false,
        delBtn: false,
        cellBtn: false,
        addBtn: false,
        addRowBtn: false,
        showSummary: true,
        addBtnText: '录入明细',
        summaryText: "合计",
        sumColumnList: [{
          name: 'price',
          type: 'sum',
          decimals: 2
        }, {
          name: 'amount',
          type: 'sum',
          decimals: 2
        }, {
          name: 'quantity',
          type: 'sum',
          decimals: 1
        }],
        column: [{
          label: '客户名称',
          slot: true,
          prop: 'corpId'
        }, {
          label: '费用名称',
          slot: true,
          prop: 'feeId'
        }, {
          label: '计价单位',
          cell: true,
          prop: 'unit',
          type: "select",
          dicUrl: "/api/blade-system/dict-biz/dictionary?code=unit",
          props: {
            label: "dictValue",
            value: "dictKey"
          }
        }, {
          label: '数量',
          cell: true,
          prop: 'quantity'
        }, {
          label: '单价',
          cell: true,
          prop: 'price'
        }, {
          label: '金额',
          cell: true,
          prop: 'amount'
        }, {
          label: '税率(默认6)',
          cell: true,
          prop: 'taxRate'
        }, {
          label: '币别(默认RMB)',
          cell: true,
          prop: 'currency',
          type: "select",
          dicUrl: "/api/blade-system/dict-biz/dictionary?code=currency",
          props: {
            label: "dictValue",
            value: "dictKey"
          },
        }
        ]
      }
    };
  },
  created() {
    if (this.id) {
      detailDelegationList({id: this.id, kind: '1'}).then(res => {
        this.goodsForm = res.data.data
        this.tableData = res.data.data.orderAddressList
        this.entrustList = res.data.data.orderItemList
        this.goodsList = res.data.data.orderItemList
        if (res.data.data.orderFeeList.length > 0) {
          res.data.data.orderFeeList.forEach(item => {
            if (item.type == 1) {
              this.collectionList.push(item)
            } else {
              this.paymentList.push(item)
            }
          })
        }
        this.goodsOptionForm.disabled = this.goodsForm.status === 1
        delete this.goodsForm.orderAddressList
        delete this.goodsForm.orderItemList
        delete this.goodsForm.orderFeeList
        this.tableData.forEach(item => {
          if (item.region) item.region = item.region.split(',')
        })
      })
    } else {
      this.tableData = [{
        region: [],
        address: ''
      }, {
        region: [],
        address: ''
      }]
      this.entrustList = [{$cellEdit: true}]
    }
  },
  methods: {
    //刷新数据
    refreshData() {
      detailDelegationList({id: this.id, kind: '1'}).then(res => {
        this.goodsForm = res.data.data
        this.tableData = res.data.data.orderAddressList
        this.entrustList = res.data.data.orderItemList
        this.goodsList = res.data.data.orderItemList
        if (res.data.data.orderFeeList.length > 0) {
          res.data.data.orderFeeList.forEach(item => {
            if (item.type == 1) {
              this.collectionList.push(item)
            } else {
              this.paymentList.push(item)
            }
          })
        }
        this.goodsOptionForm.disabled = this.goodsForm.status === 1
        delete this.goodsForm.orderAddressList
        delete this.goodsForm.orderItemList
        delete this.goodsForm.orderFeeList
        this.tableData.forEach(item => {
          if (item.region) item.region = item.region.split(',')
        })
      })
    },
    //提交委托
    submit(type) {
      if (type){
        saveDelegationList({
          id: this.goodsForm.id
        }).then(res => {
          this.$message.success('提交成功');
          this.refreshData()
        })
      }else {
        cancelSubmission({
          id: this.goodsForm.id
        }).then(res => {
          this.$message.success('取消成功');
          this.refreshData()
        })
      }
    },
    //切换收付费
    handleSelect(tab, event) {
      this.activeIndex = tab.name
    },
    //箱信息保存
    rowSaveT(row, index, done, loading) {
      row.$cellEdit = false
      done()
    },
    //箱信息选择车队
    getfleetIdT(data, row) {
      this.$set(row, 'fleetName', data.cname)
    },
    //地址新增
    addAddress() {
      this.tableData.splice(this.tableData.length - 1, 0, {leas: 1111})
    },
    //返回主列表
    backToList() {
      this.goodsForm = {}
      this.$emit('backToList')
    },
    //删除途径地址
    deleteAddress(scope) {
      this.tableData.splice(scope.$index, 1);
    },
    //箱信息保存
    rowSave(row, index, done, loading) {
      row.$cellEdit = false
      done()
    },
    rowCell(row, index) {
      this.$refs.collection.rowCell(row, index)
    },
    paymentRowCell(row, index) {
      this.$refs.payment.rowCell(row, index)
    },
    //箱信息移除
    rowDel(row, index) {
      this.$confirm('此操作将永久删除该单据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.entrustList.splice(index, 1);
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    //保存
    editCustomer() {
      this.$refs['goodsForm'].validate((valid,done) => {done()})
      for (let item in this.tableData){
        if (!this.tableData[item].corpId) return this.$message.error('请选择第'+ Number(Number(item)+1) +'行发货工厂');
        if (!this.tableData[item].address) return this.$message.error('请输入第'+ Number(Number(item)+1) +'行详细地址');
      }
      for (let item in this.entrustList){
        if (!this.entrustList[item].ctnType) return this.$message.error('请选择第'+ Number(Number(item)+1) +'行尺寸箱型');
        if (!this.entrustList[item].ctnQuantity) return this.$message.error('请输入第'+ Number(Number(item)+1) +'行箱量');
        if (!this.entrustList[item].landWeight) return this.$message.error('请输入第'+ Number(Number(item)+1) +'行总重量');
        if (!this.entrustList[item].landAmountD) return this.$message.error('请输入第'+ Number(Number(item)+1) +'陆运费');
      }
      this.$refs['goodsForm'].validate((valid,done) => {
        done();
        if (valid) {
          let data = JSON.parse(JSON.stringify(this.tableData))
          data.forEach((item, index) => {
            item.sort = index + 1
            if (item.region.length !== 0) item.region = item.region.join(',')
          })
          saveSaveList({
            ...this.goodsForm,
            kind: '1',
            orderAddressList: data,
            orderItemList: this.entrustList,
            orderFeeList: this.collectionList.concat(this.paymentList)
          }).then(res => {
            this.$message.success('保存成功');
            this.goodsForm = {}
            if (!this.goodsForm.id) {
              this.id = res.data.data
              this.refreshData()
            } else {
              this.refreshData()
            }
          })
        } else {
          return false;
        }
      });
    },
    //收费新增
    addRowCollection() {
      this.$refs.collection.rowCellAdd({
        currency: '1',
        type: '1',
        $cellEdit: true
      });
    },
    //付费新增
    addRowPayment() {
      this.$refs.payment.rowCellAdd({
        currency: '1',
        type: '2',
        $cellEdit: true
      });
    },
    //选择费用
    selectValue(value, row) {
      this.$set(row, 'feeName', value.cname)
    },
    //选择客户信息触发
    getfleetId(data, row) {
      this.$set(row, 'corpName', data.cname)
    },
    //收款信息移除
    makeDel(row, index) {
      this.$confirm('此操作将永久删除该单据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        if (row.id) removeCollection(row.id)
        this.collectionList.splice(index, 1);
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    //付款信息移除
    feeDel(row, index) {
      this.$confirm('此操作将永久删除该单据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        if (row.id) removeCollection(row.id)
        this.paymentList.splice(index, 1);
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    //选择客户名称带出所属公司
    getCorpData(row) {
      this.goodsForm.belongCompany = row.belongCompany
    },
    //选择地址客户带出地址
    withAddress(row, scope) {
      if (!scope.row.key) scope.row.key = 0
      this.tableData[scope.$index].corpName = row.cname
      this.tableData[scope.$index].address = row.attn
      if (row.tel) {
        if (!row.attn) {
          this.tableData[scope.$index].address += row.tel
        } else {
          this.tableData[scope.$index].address += '—' + row.tel
        }
      }
      if (row.storageAddr) {
        if (!row.tel && !row.attn) {
          this.tableData[scope.$index].address += row.storageAddr
        } else {
          this.tableData[scope.$index].address += '—' + row.storageAddr
        }
      }
      if (row.belongtoarea) {
        addressList(row.belongtoarea).then(res => {
          this.tableData[scope.$index].region = [res.data.data.provinceCode, res.data.data.parentId, res.data.data.districtCode]
          scope.row.key++
        })
      }
    },
    //自定义表头
    renderHeader(h) {
      return (
          <div>
            <el-tooltip className="item" effect="dark" content="增加途径地址" placement="top">
              <el-button type="primary" icon="el-icon-plus" size="mini" circle onClick={() => this.addAddress()}
                         style="margin-right: 1.25rem;"></el-button>
            </el-tooltip>
          </div>
      )
    },
    //自定义表头
    customTitle(h, { column, $index }) {
      let text = column.label
      return (
          <div>
            {{text}}<span style="color:#F56C6C">*</span>
          </div>
      )
    }
  }
}
</script>
<style scoped>

</style>