<template>
    <div>
    <div class="dia_body">
        <div class="dialog_top" style="width: 1210px;">
          <div style="margin-top: 10px;margin-left: 50px;">
            <el-form label-position="right" label-width="120px" :model="formLabelAlign">
              <el-form-item :label="$t('quota.replyNo')+'：'"  class="unabled is-disabled" >
                <el-input v-model="formLabelAlign.certificateCode" style="width:186px" :disabled="true"></el-input>
              </el-form-item>
              <el-form-item :label="$t('quota.custCode')+'：'" class="unabled is-disabled">
                <el-input v-model="formLabelAlign.custCode" style="width:186px" :disabled="true"></el-input>
              </el-form-item>
              <el-form-item :label="$t('quota.custName')+'：'" class="unabled is-disabled">
                <el-input v-model="formLabelAlign.custName" style="width:186px" :disabled="true"></el-input>
              </el-form-item>
              <el-form-item :label="$t('quota.replyDate1')+'：'" class="unabled is-disabled">
              <el-date-picker
                v-model="formLabelAlign.startDate"
                type="date"
                style="width:186px"
                :disabled="true"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
            </el-form>
          </div>
          <div style="margin-top: 10px;">
            <el-form label-position="right" label-width="170px" :model="formLabelAlign">
            <el-form-item :label="$t('quota.partialFlag')+'：'" class="unabled is-disabled">
             <el-select v-model="formLabelAlign.partialFlag" style="width:186px" disabled @change="categoryChange" placeholder="请选择">
                <el-option
                  v-for="item in partialFlagList"
                  :key="item.code"
                  :label="item.desc"
                  :value="item.code">
                  </el-option>
              </el-select>
            </el-form-item>
            <el-form-item :label="$t('quota.revolvingFlag')+'：'" class="unabled is-disabled">
              <el-select v-model="formLabelAlign.revolvingFlag" style="width:186px" disabled placeholder="请选择">
                <el-option
                  v-for="item in revolvingFlagList"
                  :key="item.code"
                  :label="item.desc"
                  :value="item.code">
                  </el-option>
              </el-select>
            </el-form-item>
            <el-form-item :label="$t('quota.collateralType')+'：'" class="unabled is-disabled">
              <el-select v-model="formLabelAlign.collateralType" style="width:186px" disabled placeholder="请选择">
                  <el-option
                  v-for="item in collateralTypeList"
                  :key="item.code"
                  :label="item.desc"
                  :value="item.code">
                  </el-option>
              </el-select>
            </el-form-item>
            <el-form-item :label="$t('quota.replyDate2')+'：'" class="unabled is-disabled">
              <el-date-picker
                v-model="formLabelAlign.endDate"
                type="date"
                style="width:186px"
                :disabled="true"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
          </el-form>
          </div>
          <div style="margin-top: 10px;">
            <el-form label-position="right" label-width="170px" :model="formLabelAlign">
            <el-form-item  :label="$t('quota.replyCurrency')+'：'" class="unabled is-disabled">
                <el-select v-model="formLabelAlign.currencyCode" style="width:186px" :disabled="true"  @change="custCodeChange" placeholder="请选择">
                    <el-option
                        v-for="item in statusList"
                        :key="item.code"
                        :label="item.desc"
                        :value="item.code">
                    </el-option>
                </el-select>
              <!-- <el-input :value="getStatus(formLabelAlign.status)" style="width:184px" :disabled="true"></el-input> -->
            </el-form-item>
            <el-form-item :label="$t('quota.approved')+'：'" class="unabled is-disabled">
              <cinput  v-model="formLabelAlign.overalLimit" style="width:186px" disabled></cinput>
            </el-form-item>
            <el-form-item :label="$t('quota.guaranteePercentage')+'(%)：'" class="unabled is-disabled">
              <el-input  v-model="formLabelAlign.colPercentNum" style="width:186px" disabled></el-input>
            </el-form-item>
            <el-form-item :label="$t('quota.amountPledge')+'：'" class="unabled is-disabled">
              <cinput  :value="formLabelAlign.overalLimit*(formLabelAlign.colPercentNum/100)" style="width:186px" disabled></cinput>
            </el-form-item>
          </el-form>
          </div>
        </div>
        <div class="dialog-footer but_icon" v-if="operatype<3" >
            <el-button  v-waves class="filter-item add_plus" type="primary" icon="el-icon-my-add" @click="addWritten">
              {{ $t('table.add') }}
            </el-button>
        </div>
        <!-- 批复书连接抵(质)押品 operatype等于3为抵质押品管理-->
        <div class="wrapper_table det_tab" :style="{'margin-top':operatype<3?'2px':'40px'}">
          <el-table
            :data="getByColData"
            fit
            stripe
            class="numtable"
            :class="operatype === 3 ? '':'connect'"
            highlight-current-row
            style="width: 100%;"
            :header-cell-class-name="headerStyle"
            :header-cell-style="{fontSize:'12px'}"
            max-height="300"
          >

            <!-- <el-table-column prop="" :label="$t('levy.colName')" show-overflow-tooltip width="120" align="left">
              <template slot-scope="scope">
                  <div style="display: flex;justify-content: space-between;align-items: center;">
                      <div v-if="scope.row.smallName">
                        {{scope.row.smallName}}
                      </div>
                      <div v-else-if="scope.row.isAdd">
                        <el-button  @click="viewdetails(scope.$index)" type="text"> 选择抵(质)押品</el-button>
                      </div>
                  </div>
              </template>
            </el-table-column> -->
            <el-table-column prop="colCode" show-overflow-tooltip :label="$t('levy.colCode')" width="140" align="left">
              <template slot-scope="scope">
                  <div style="display: flex;justify-content: space-between;align-items: center;">
                      <div v-if="scope.row.colCode">
                        {{scope.row.colCode}}
                      </div>
                      <div v-else-if="scope.row.isAdd">
                        <!-- 需要conntect类 -->
                        <el-button  @click="viewdetails(scope.$index)" type="text"> 选择抵(质)押品</el-button>
                      </div>
                  </div>
              </template>
            </el-table-column>
            <el-table-column prop="colCodeSmall" show-overflow-tooltip :label="$t('levy.colLevy')" width="120" align="left"></el-table-column>
            <el-table-column prop="largeName" width="140" show-overflow-tooltip :label="$t('levy.collateralType')" align="left" >
              <template slot-scope="{row}">{{row.largeName}}-{{row.smallName}}</template>
            </el-table-column>
            <el-table-column prop="custName" width="140" show-overflow-tooltip :label="$t('levy.custName')" align="left" >
            </el-table-column>
            <el-table-column prop="startDate" width="152" :label="$t('levy.pstartDate')"  align="left">
              <template slot-scope="scope">
                <div v-if="updateWri">
                  <el-date-picker
                    class="flex-input"
                    v-model="scope.row.startDate"
                    type="date"
                    style="width:152px"
                    @change="dataCheckList($event, scope.row, scope.$index, 'startDate')"
                    :disabled="operationType==1 || scope.row.operateStatus==9?true:false"
                    value-format="yyyy-MM-dd"
                    placeholder="选择日期">
                  </el-date-picker>
                </div>
                <div v-else-if="scope.row.startDate" :class="scope.row.startDateOriginal&&mine&&scope.row.startDate!=scope.row.startDateOriginal?'div_color':''">
                  {{formatTime(scope.row.startDate)}}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="endDate" width="152" :label="$t('levy.pendDate')" align="left">
              <template slot-scope="scope">
                <div v-if="updateWri">
                      <el-date-picker
                       class="flex-input"
                        v-model="scope.row.endDate"
                        @change="dataCheckList($event,scope.row,scope.$index,'endDate')"
                        type="date"
                        style="width:152px"
                        :disabled="operationType==1 || scope.row.operateStatus==9?true:false"
                        value-format="yyyy-MM-dd"
                        placeholder="选择日期">
                      </el-date-picker>
                </div>
                <div  v-else-if="scope.row.endDate" :class="scope.row.endDateOriginal&&mine&&scope.row.endDate!=scope.row.endDateOriginal?'div_color':''">
                  {{formatTime(scope.row.endDate)}}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="" width="150" show-overflow-tooltip  :label="$t('levy.availableBalance1')" align="left" >
              <template slot-scope="scope">
                <div v-if="scope.row.isAdd||operatype==2">
                  {{scope.row.currencyCode }} {{(scope.row.availableBalance )|numberToCurrency}}
                </div>
                <div v-else-if="mine&&isDraf==2||isDraf==0">
                  {{scope.row.currencyCode }} {{(scope.row.rateSetAmount + scope.row.colBalance) |numberToCurrency}}
                </div>
                <div v-else-if="operatype==3&&isDraf==1">
                  {{scope.row.currencyCode }} {{(scope.row.rateSetAmount + scope.row.colBalance)|numberToCurrency}}
                  <!-- {{scope.row.currencyCode }} {{scope.row.availableBalance|numberToCurrency}} -->
                  <!-- {{scope.row.currencyCode }} {{(scope.row.toplimitPrice - scope.row.loanAmount+ Number(scope.row.rateSetAmount||0) ) |numberToCurrency}} -->
                </div>
              
              <!-- <div v-else>0.00</div> -->
            </template>
            </el-table-column>
            <!-- <el-table-column prop="colPercent" :label="$t('levy.percentageGuarantee')" align="left" >
              <template slot-scope="scope">
                <div v-if="scope.row.colPercent>0">
                  {{(scope.row.colPercent *100)+'%'}}
                </div>
              </template>
            </el-table-column> -->
            <el-table-column prop="setAmount" width="180" :label="$t('levy.currencypledge')" align="left" >
              <template slot-scope="scope">
                <div v-if="updateWri" style="display: flex;align-items: center;">
                   <div style="width: 44px;">{{formLabelAlign.currencyCode}}</div>  <cinput class="flex-input" :disabled="operationType==1 || scope.row.operateStatus==9?true:false" @change="rateSetAmountNum($event,scope.$index,scope.row)" v-model="scope.row.setAmount"></cinput>
                </div>
                <div v-else :class="scope.row.setAmountOriginal&&mine&&scope.row.setAmount!=scope.row.setAmountOriginal?'div_color':''" style="display: flex;align-items: center;height: 37px;">
                    {{formLabelAlign.currencyCode}} <span v-if="scope.row.setAmount">{{scope.row.setAmount|numberToCurrency}}</span>
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="exchangeRate" :label="$t('levy.exchange')" width="150" align="left">
              <template slot-scope="scope">
                <div v-if="scope.row.isAdd">
                  <el-input class="flex-input" v-model="scope.row.exchangeRate" @change="rateSetAmountNum($event,scope.$index,scope.row, 'exchangeRate')"></el-input>
                </div>
                <div v-else>
                  {{scope.row.exchangeRate}}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="" width="180"  :label="$t('levy.collateralcurrency')" align="left" >
              <template slot-scope="scope">
                <!-- <div v-if="scope.row.rateSetAmount">
                   {{formLabelAlign.currencyCode }} {{(scope.row.availableBalance-scope.row.rateSetAmount)|numberToCurrency}}
                </div> -->
                <div v-if="scope.row.rateSetAmount">
                   {{scope.row.currencyCode }} {{scope.row.rateSetAmount|numberToCurrency}}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="" width="180"  :label="$t('levy.afterpledge')" align="left" >
              <template slot-scope="scope">
                <!-- <div v-if="mine&&isDraf==2||isDraf==0">
                    {{scope.row.currencyCode }} {{(scope.row.toplimitPrice - scope.row.loanAmount - scope.row.rateSetAmount)|numberToCurrency}}
                </div> -->
                <div v-if="scope.row.isAdd||operatype==2">
                  {{scope.row.currencyCode }} {{(scope.row.availableBalance  - Number(scope.row.rateSetAmount||0) ) |numberToCurrency}}
                </div>
                <div v-else-if="mine&&isDraf==2||isDraf==0">
                  {{scope.row.currencyCode }} {{(scope.row.colBalance) |numberToCurrency}}
                </div>
                <div v-else-if="operatype==3&&isDraf==1">
                  <!-- {{scope.row.currencyCode }} {{(scope.row.toplimitPrice - scope.row.loanAmount - Number(scope.row.rateSetAmount||0) ) |numberToCurrency}} -->
                  {{scope.row.currencyCode }} {{(scope.row.colBalance) |numberToCurrency}}
                </div>
                <div v-else>0.00</div>
              </template>
            </el-table-column>
            <el-table-column :label="$t('table.actions')" align="center" v-if="operatype<3"  >
              <template slot-scope="scope">
                <div class="but_list" >
                    <el-button v-waves class=""  v-if="scope.row.isAdd||scope.row.operateStatus==1" type="text" icon="el-icon-my-del-y" @click="handleDelete(scope.row,scope.$index)">
                      {{ $t('table.delete') }}
                    </el-button>
                    <el-button v-waves class="" v-else-if="scope.row.operateStatus==0||scope.row.operateStatus==2"  type="text" icon="el-icon-my-del-y" @click="handleDelete(scope.row,scope.$index)">
                      {{ $t('table.unbound') }}
                    </el-button>
                    <el-button v-waves class="" v-else-if="scope.row.operateStatus==9" type="text" icon="el-icon-my-huilong" @click="reduction(scope.row,scope.$index)">
                      {{$t('table.reduction')}}
                    </el-button>

                </div>
              </template>
            </el-table-column>
            <el-table-column label="操作状态" align="center"  v-if="isDraf==2">
              <template slot-scope="scope">
                <div class="but_list" >
                   <span >{{scope.row.operateStatus==1?'新增':
                     scope.row.operateStatus==2?'修改':
                     scope.row.operateStatus==9?'解绑':
                     scope.row.operateStatus==0?'未修改':''}}</span>
                </div>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="dialog-footer but_icon"  v-if="operatype<3">
            <el-button v-waves class="filter-item flex_align" type="primary" style="width: 110px !important;" icon="el-icon-my-baocun" @click="draftSave">
                {{ $t('table.draft') }}
            </el-button>
            <el-button v-waves class="filter-item flex_align" type="primary" icon="el-icon-my-quxiao" @click="cancelBut">
                {{ $t('table.cancel') }}
            </el-button>

        </div>
      </div>
      <el-dialog
        :title="form.operateStatus==1?'删除':'解绑'"
        :append-to-body="true"
        :visible.sync="deldialogVisible"
        v-el-drag-dialog
        :close-on-click-modal="false"
        width="499px">
        <div class="add_info">
            <div class="add_l">
                <span>批复书编号：</span>
                <span>抵(质)押品编号：</span>
            </div>
            <div class="add_r">
                <el-input :disabled="true" v-model="form.certificateCode"  class="filter-item input_item"    />
                <el-input :disabled="true" v-model="form.colCode" class="filter-item input_item"    />
            </div>
        </div>
        <span slot="footer" class="dialog-footer">
            <el-button v-waves class="filter-item flex_align" type="primary" icon="el-icon-my-delete" @click="deletetab">
                {{ form.operateStatus==1?$t('table.delete'):'解绑'  }}
            </el-button>
            <el-button v-waves class="filter-item flex_align" type="primary" icon="el-icon-my-quxiao" @click="deldialogVisible=false">
                {{ $t('table.cancel') }}
            </el-button>
        </span>
    </el-dialog>
    <el-dialog
      title="选择抵(质)押品"
      :append-to-body="true"
      :visible.sync="dbpdialogVisible"
      v-el-drag-dialog
      :close-on-click-modal="false"
      width="1130px">
        <el-table
        :data="tableData"
        fit
        stripe
        class="numtable choose"
        highlight-current-row
        style="width: 100%;padding: 20px;"
        :header-cell-class-name="headerStyle"
        :max-height="400"
        :cell-style="{ textAlign: 'left' }"
        :header-cell-style="{textAlign: 'left'}"
        @row-click="handleTab"
      >
        <el-table-column prop="custCode" show-overflow-tooltip :label="$t('levy.custCode')" width="120" align="left" ></el-table-column>
        <el-table-column prop="custName" show-overflow-tooltip width="150" :label="$t('levy.custName')" align="left"></el-table-column>
        <el-table-column prop="colCode" show-overflow-tooltip :label="$t('levy.colCode')"  align="left"></el-table-column>
        <el-table-column prop="colCodeSmall" show-overflow-tooltip :label="$t('levy.colLevy')"  align="left"></el-table-column>
        <!-- <el-table-column prop="colCodeSmallName" show-overflow-tooltip :label="$t('levy.colName')"  align="left"></el-table-column> -->
        <el-table-column show-overflow-tooltip :label="$t('levy.collateralType')"  align="left">
          <template slot-scope="{row}">{{row.colCodeLargeName}}-{{row.colCodeSmallName}}</template>
        </el-table-column>
        <el-table-column prop="latestPrice" show-overflow-tooltip :label="$t('levy.unitPriceNew')" width="160" align="left">
            <template slot-scope="scope">
              <div>
                {{scope.row.latestPrice|numberToCurrency}}
              </div>
            </template>
        </el-table-column>
        <el-table-column prop="availableBalance" show-overflow-tooltip :label="$t('levy.availableBalance1')" align="left" >
           <template slot-scope="scope">
              <div>
                {{(scope.row.availableBalance)|numberToCurrency}}
                <!-- {{(scope.row.toplimitPrice - scope.row.loanAmount)|numberToCurrency}} -->
              </div>
            </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    </div>
</template>

<script>
import elDragDialog from '@/directive/el-drag-dialog'
import waves from '@/directive/waves' // waves directive
import http from '@/api/http'
import reply from '../quota/replywritten.vue'
import cinput from '../collateral/cinput.vue'
import { validatenull } from '@/utils/validate.js'
import { returnNumFloat } from '@/utils'
export default {
    name: '',
    components: { reply,cinput},
    directives: { waves, elDragDialog },
    props: {
        data: Object,
        item:Object,
        // type:Number,
        formData:Object,
        operatype:Number,
        mine:Boolean,
        isDraf:Number
    },
    data() {
        return {
        formLabelAlign:this.data,
        options:[],
        categoryList:[],
        subclassData:[],
        currencyData:[],
        currentType:'1',
        currencyList:[],
        dataFormVisible:false,
        getByColData:[],
        warehouseFormVisible:false,
        operationType:this.type==5?1:this.type,
        radio:'',
        coustHand:true,
        smallList:[],
        statusList:[{desc:'有效',code:1},{desc:'无效',code:8},{desc:'删除',code:9}],
        writtenList:[],
        deldialogVisible:false,
        form:{
            colCode:'',
            certificateCode:this.data.certificateCode
        },
        // replydialogVisible:false,
        // operatype:0,
        lookData:{},
        dbpdialogVisible:false,
        tableData:[],
        collateralTypeList:[{code:1,desc:'全额担保'},{code:2,desc:'纯信用'},{code:3,desc:'担保信用混合模式'}],
        liabilityList:[{code:1,desc:'流用'},{code:2,desc:'分享'}],
        partialFlagList:[{code:1,desc:'单张'},{code:2,desc:'分批'}],
        revolvingFlagList:[{code:1,desc:'循环'},{code:2,desc:'非循环'}],
        updateWri:false,
        digits: 4, // 汇率 小数点保留位数

    }
  },
  created() {

    this.getByCol()
    this.getOptions()
    this.getCategory()
    this.getCurrency()
  },

  mounted() {
    if(this.operatype==2){
      this.updateWri = true
    }
    // console.log(this.operatype,this.isDraf)
  },
  methods: {
    getByCol(){
      // debugger
      let url =`/liabilityCol/getByLibDraft`
      if(this.mine&&this.isDraf==2){
        url =`/liabilityCol/getByLibLog`
      }else if(this.isDraf==0){
        url =`/liabilityCol/getByLib`
      }
      console.log('id:'+this.data.id);
      http.post(url,{id:this.data.id}).then((res)=>{
        for(let item of res.data){
          item.isAdd = false
          if(this.operatype==2){
            item.availableBalance = item.availableBalance  + Number(item.rateSetAmount)
          }
        }
        this.getByColData = res.data
        // console.log(this.getByColData);
      }).catch(err=>{});
    },
    getOptions(){
      http.post(`/cust/queryLists`,{cpage:1,pageSize:99}).then((res)=>{
        this.options = res.data.list;
      }).catch(err=>{});
    },
    getCategory(){
      http.post(`/collateral/list`,{code:0}).then((res)=>{
          this.categoryList = res.data;
      }).catch(err=>{});
    },
    categoryChange(code){
      http.post(`/collateral/list`,{code}).then((res)=>{
          this.subclassData = res.data;
      }).catch(err=>{});
    },
    queryChange(code){
      http.post(`/collateral/list`,{code}).then((res)=>{
          this.smallList = res.data;
      }).catch(err=>{});
    },
    getCurrency(){
      http.post(`/share/currency/queryList`,{cpage:1,pageSize:99}).then((res)=>{
        this.currencyList = res.data.list;
      }).catch(err=>{});
    },

    custCodeChange(data){
      for(let item of this.options){
        if(item.id==data){
          this.formLabelAlign.orgCode = item.orgCode
          this.formLabelAlign.orgId = item.orgId
          // this.formLabelAlign.enterPname = item.enterPname
          this.formLabelAlign.custName = item.custName
          this.formLabelAlign.enterpriseId = item.id
          this.formLabelAlign.custCode = item.custCode
          this.$forceUpdate()
        }
      }
    },
    addWritten(){
      // http.post(`/colLevy/getByEnterpriseId`,{id:this.formLabelAlign.orgId}).then((res)=>{
          this.getByColData.push({isAdd:true})
          // this.writtenList = res.data
          this.updateWri = true
          this.$forceUpdate()
      // }).catch(err=>{});
    },
    handleDelete(row, index) {
        if(row.isAdd){
            this.getByColData.splice(index,1)
        }else{
            this.form.id = row.id
            this.form.index = index
            this.form.colCode = row.colCode
            this.form.operateStatus = row.operateStatus
            this.$forceUpdate()
            this.deldialogVisible = true
        }
    },
    headerStyle() {
      return 'tableStyle'
    },
    formatTime(str){
      return str.split(' ')[0]
    },
    writtenChange(v,i){
      for(let item of this.writtenList){
        if(item.certificateCode == v){
          item.isAdd = true
          this.getByColData[i] = item
          this.$forceUpdate()
          return false;
        }
      }
    },
    handleCell(row,column,cell,event) {
      console.log(row);
    },
    cancelBut(){
        this.$emit('cancelButDet');
    },

    deletetab(){
      console.log('this.form.id', this.form.id);
      console.log('this.form.operateStatus', this.form.operateStatus);
      http.post(`/liabilityCol/delColLevyDraft`,{id:this.form.id}).then((res)=>{
        this.deldialogVisible = false
        if(this.form.operateStatus==1){
          this.getByColData.splice(this.form.index,1)
        }else{
          this.getByColData[this.form.index].operateStatus = 9
          this.getByColData[this.form.index].startDate = this.getByColData[this.form.index].startDateOriginal
          this.getByColData[this.form.index].endDate  = this.getByColData[this.form.index].endDateOriginal
          this.getByColData[this.form.index].setAmount = this.getByColData[this.form.index].setAmountOriginal
          let rate;
          if(this.getByColData[this.form.index].rateType==1){
            rate = this.getByColData[this.form.index].setAmount * this.getByColData[this.form.index].exchangeRate
          }else{
            rate = this.getByColData[this.form.index].setAmount / this.getByColData[this.form.index].exchangeRate
          }
          this.getByColData[this.form.index].rateSetAmount = rate
          this.$set(this.getByColData, this.form.index, this.getByColData[this.form.index])
          this.getloanAmount()
        }
        this.$message.success('操作成功');
        this.$forceUpdate()
      }).catch(err=>{});
    },
    reduction(row,index){
      http.post(`/liabilityCol/delColLevyDraft`,{id:row.id}).then((res)=>{
          if(this.form.operateStatus==1){
            this.getByColData.splice(index,1)
          }else{
            this.getByColData[index].operateStatus = 0
            this.$set(this.getByColData, index, this.getByColData[index])
          }
          this.$message.success('操作成功');
          this.$forceUpdate()
          this.deldialogVisible = false
          // this.getByCol()
      }).catch(err=>{});
    },
    cancelButRep(){
        this.replydialogVisible = false
    },
    viewdetails(index){
      http.post(`/colLevy/getLibColLevy`,this.formLabelAlign).then((res)=>{
          this.tableData = res.data
          this.tabIndex = index
          this.dbpdialogVisible = true
      }).catch(err=>{});
    },
    getStatus(a){
      for(let item of this.statusList){
        if(item.code==a){
          return item.desc
        }
      }
    },
    handleTab(row,column,cell,event) {
      row.isAdd = true
      row.liabilityInforDraftId = this.formLabelAlign.id
      row.colLevy = row.id
      row.largeName = row.colCodeLargeName
      row.smallName = row.colCodeSmallName
      delete row.id
      // delete row.startDate
      // delete row.endDate
      row.startDate = this.formLabelAlign.startDate
      row.endDate = this.formLabelAlign.endDate
      this.$set(this.getByColData, this.tabIndex, row)

      console.log('this.getByColData', this.getByColData);
      this.$forceUpdate()
      this.getExchangeRate(row.currencyCode,this.tabIndex)
      this.dbpdialogVisible = false
    },
    getExchangeRate(sourceCode,index){
      if(sourceCode==this.formLabelAlign.currencyCode){
          this.$set(this.getByColData[index], 'exchangeRate', 1)
          this.$set(this.getByColData[index], 'rateType', 1)
          this.digits = 4 // 如果汇率是1(币种相同)控制最多4位
      }else{
        http.post(`/liabilityCol/getExchangeRate`,{sourceCode:this.formLabelAlign.currencyCode,targetCode:sourceCode,orgId:this.formLabelAlign.orgId}).then((res)=>{
          let { rate, rateType } = res.data
          this.$set(this.getByColData[index], 'exchangeRate', rate)
          this.$set(this.getByColData[index], 'rateType', rateType)
          this.digits = rate.toString().split('.')[1].length; // 后端返回是四位表示这是4个小数位
          this.$forceUpdate()
        }).catch(err=>{});
      }

    },
    rateSetAmountNum(e,index,data, name){
      if (name === 'exchangeRate') {
        data[name] = returnNumFloat(data[name], this.digits)
      }
      if( validatenull(data.setAmount) ){
        this.$message.error('按批复书币种设质金额不能为空')
        return false
      }
      if(data.exchangeRate&&data.setAmount){
        if(data.setAmount <= 0){
          this.$message.error('按批复书币种设质金额要大于0')
          data.setAmount = ''
          return false
        }
        let rate;
        if(data.rateType==1){
          rate = data.setAmount * data.exchangeRate
        }else{
          rate = data.setAmount / data.exchangeRate
        }
        data.rateSetAmount = rate
        this.$set(this.getByColData, index, data)
      } else {
        data.rateSetAmount = ""
        this.$set(this.getByColData, index, data)
      }
      this.$forceUpdate()
    },
    draftSave(){
      let ls = []
      for(let item of this.getByColData){
        if(item.colCode){
          ls.push(item)
        }
      }
      if(ls.length==0){
        this.$message.error('请选择要连接的抵(质)押品')
        return
      }
      for (let i=0;i<ls.length;i++) {
        let v = ls[i]
        if(!v.hasOwnProperty('setAmount') || validatenull(v.setAmount)){
          this.$message.error('按批复书币种设质金额不能为空')
          return false
        }
      }
      // ls.forEach(v=>{
      //   if(!v.hasOwnProperty('setAmount') || validatenull(v.setAmount)){
      //     this.$message.error('按批复书币种设质金额不能为空')
      //     return false
      //   }
      // })
      http.post(`/liabilityCol/saveColLevyList`,{list:ls,type:0}).then((res)=>{
        this.$message.success('提交成功！');
        this.$emit('cancelButDet');
      }).catch(err=>{});

    },
     dataCheckList(date,data,index,name){
      // console.log('1239999999999999999999');
      // console.log(date,data,index,name);
      if(!data.colCode){
        data[name] = ''
        this.$set(this.getByColData, index, data)
        return false
      }
      http.post(`/liabilityCol/isHoliday`,{date,id:this.formLabelAlign.enterpriseId}).then((res)=>{
        if(res.data==1){
          data[name] = ''
          this.$set(this.getByColData, index, data)
          this.$message.error('当前日期为节假日')
        }
      }).catch(err=>{});
    },
  }
}
</script>
<style  lang='scss' scoped>

  .el-table__header-wrapper{
    border-radius: 10px 10px 0 0;
  }
.but_list{
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  .but-item{
    display: flex;
    align-items: center;
    margin-right: 6px;
    cursor: pointer;
    img{
      width: 12px;
      height: 14px;
    }
    span{
      font-size: 12px;
      font-family: PingFang SC;
      font-weight: bold;
      color: #3D5596;
      margin-left: 2px;
    }
  }
}
.total_collateral{
  width: 100%;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 200px;
  margin-top: 22px;
  background: linear-gradient(180deg, rgba(149,185,250,.2), rgba(86,131,212,.2));
  box-shadow: 0px 1px 4px 0px #9CA7C5, 0px 0px 0px 0px #C3D9FF, 0px 0px 0px 0px #C3D9FF, 0px 2px 6px 0px rgba(15, 22, 45, 0.18);
}
.huiadd{

    width: 100px;
    height: 36px;
    background: url('../../assets/images/add_hui.png') no-repeat;
    background-size: 100% 100%;
    text-align: center;
    line-height: 36px;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    img{
        width: 16px;
        margin-right: 6px;
    }
    font-size: 13px;
    font-family: "SourceHanSansCN";
    font-weight: 500;
    color: #FFFFFF;
    line-height: 26px;
}
.add_info{
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 20px;
      .add_l{
          display: flex;
          align-items: flex-end;
          flex-direction: column;
          span{
              font-size: 13px;
                font-family: "SourceHanSansCN";
                font-weight: 500;
                color: #212121;
                display: inline-block;
                line-height: 40px;
          }
      }
      .add_r{
          display: flex;
          justify-content: flex-start;
          flex-direction: column;
          .input_item{
              width: 295px !important;
              margin-bottom: 4px;
              margin-top: 6px;
          }
      }
  }
  .div_color{
    border: 1px solid red;
    height: 30px !important;
}

::v-deep .choose{
  .el-table__header-wrapper{
    th{
      .cell{
        line-height: 37px !important;
      }
    }
  }
  .el-table__body-wrapper{
    .el-table__row{
      .cell{
        line-height: 37px !important;
      }
    }
  }
}
::v-deep .connect{
  .el-table__body-wrapper{
    .el-table__row{
      .cell{
        line-height: unset !important;
        padding:3.5px !important;
      }
    }
  }
}
</style>
<style lang="css" scoped>
/* .el-table--mini th, .el-table--mini td {
  padding:unset !important;
} */
  .dialog_top  .el-input__inner{
    width: 184px !important;
    box-shadow:0px -1px 2px 0px rgb(0 0 0 / 40%) !important;
    border-radius:2px !important;

  }
.det_tab /deep/.el-date-editor.el-input, .el-date-editor.el-input__inner{
    width: 130px !important;
}
.det_tab /deep/.el-input--prefix .el-input__inner{
    padding-right: 0 !important;
}
.el-date-editor .el-input__suffix ,.el-date-editor .el-input__inner{
  padding-right: 0 !important;
}
</style>
