<template>
  <div class="app-container">
    <div v-show="viewState == 1">
      <!--标题按钮部分开始-->
      <div class="tab-header webtop">
        <!--标题-->
        <div>{{ viewTitle }}</div>
        <!--start 添加修改按钮-->
        <div>
          <el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
        </div>
      </div>
      <!--标题按钮部分结束-->
      <!--Start 新增修改部分-->
      <div class="listconadd">
        <div class="titwu"><span>返利分配选择车辆</span></div>
        <el-form ref="form_obj" :model="formobj" :rules="rules" class="formadd">
          <el-row style="border-top: 1px solid #E0E3EB">
            <el-col :span="2" class="tleftb">
              <span>品牌</span>
            </el-col>
            <el-col :span="4">
              <el-form-item>
                <span>{{ formobj.brandName }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="2" class="tleftb">
              <span>回款金额</span>
            </el-col>
            <el-col :span="4">
              <el-form-item>
                <span>{{ formobj.collectionMoney }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="2" class="tleftb">
              <span>车辆台数</span>
            </el-col>
            <el-col :span="4">
              <el-form-item>
                <span>{{ formobj.number }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="2" class="tleftb">
              <span>厂家结算价合计</span>
            </el-col>
            <el-col :span="4">
              <el-form-item>
                <span>{{ formobj.constPrice }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <div class="title">
            <div style="text-align: right">
              <el-button type="primary" size="mini" icon="el-icon-plus" class="btntopblueline" @click="handleSelect()">选择</el-button>
              <el-button type="primary" size="mini" class="btntopblueline" @click="handleRebate()">确定</el-button>
            </div>
          </div>
          <el-table :key="tableKey" :data="formobj.scmCollectionRebateDistributionVehs" :index="index" border style="width: 100%">
            <el-table-column fixed width="80px" label="序号" type="index" :index="index + 1" align="center"/>
            <el-table-column fixed width="80" label="操作" align="center">
              <template slot-scope="scope">
                <el-button type="danger" size="mini" @click="dataDelete(scope)">删除</el-button>
              </template>
            </el-table-column>
            <el-table-column label="车型" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.carModelName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="车架号" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.vinNo }}</span>
              </template>
            </el-table-column>
            <el-table-column label="厂家结算价" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.costPrice }}</span>
              </template>
            </el-table-column>
            <el-table-column label="入库日期" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.priceDate }}</span>
              </template>
            </el-table-column>
            <el-table-column label="销售日期" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.salesDate }}</span>
              </template>
            </el-table-column>
          </el-table>
        </el-form>
      </div>
    </div>
    <!--End 添加修改部分-->
    <collectionrebateallotSelectVehicle v-show="viewState == 2" ref="divSelect" @backData="backData" @doback="resetState"/>
    <collectionrebateallotAdd v-show="viewState == 3" ref="divAdd" @doback="reset"/>
  </div>
</template>

<script>
import req from '@/api/manufacturerrebates/collectionrebateallot'
import { fetchBySid } from '@/api/cheliang/dictcommons'
import collectionrebateallotSelectVehicle from './relation/collectionrebateallotSelectVehicle'
import collectionrebateallotAdd from './collectionrebateallotAdd'

export default {
  name: 'HuiKuanFanLiFenPeiByVehicleAdd',
  components: {
    collectionrebateallotSelectVehicle,
    collectionrebateallotAdd
  },
  data() {
    return {
      viewTitle: '',
      index: 0,
      tableKey: 0,
      viewState: 1,
      aggregate: '',
      // 表单数据
      formobj: {
        sid: '',
        brandName: '',
        brandSid: '',
        number: '',
        constPrice: '',
        estimateRebate: '',
        collectionMoney: '',
        withholdingApply: '',
        useOrgName: '',
        useOrgSid: '',
        createOrgName: '',
        createOrgSid: '',
        scmCollectionRebateDistributionVehs: []
      },
      rules: {},
      submitdisabled: false
    }
  },
  methods: {
    init() {
      fetchBySid(this.formobj.createOrgSid).then((res) => {
        if (res.success) {
          this.formobj.createOrgName = res.data.name
          this.formobj.useOrgName = res.data.name
        }
      })
    },
    showEdit(row, createOrgSid) {
      this.$nextTick(() => {
        this.$refs['form_obj'].clearValidate()
        this.init()
      })
      this.formobj.createOrgSid = createOrgSid
      this.formobj.useOrgSid = createOrgSid
      req.fetchBySid(row.sid).then((resp) => {
        if (resp.success) {
          this.formobj = resp.data
        }
      })
      this.viewTitle = '【编辑】回款返利'
    },
    handleSelect() {
      this.viewState = 2
      this.$refs['divSelect'].showData(this.formobj.scmCollectionRebateDistributionVehs, this.formobj.brandSid)
    },
    // 明细表删除一行数据
    dataDelete(index) {
      this.formobj.scmCollectionRebateDistributionVehs.splice(index, 1)
      if (this.formobj.scmCollectionRebateDistributionVehs.length === 0) {
        this.formobj.number = ''
        this.formobj.constPrice = ''
      } else {
        this.formobj.number = this.formobj.scmCollectionRebateDistributionVehs.length
        for (var i = 0; i < this.formobj.scmCollectionRebateDistributionVehs.length; i++) {
          if (this.formobj.scmCollectionRebateDistributionVehs[i].costPrice !== '' && i === 0) {
            this.formobj.constPrice = parseFloat(this.formobj.scmCollectionRebateDistributionVehs[i].costPrice)
          } else {
            this.formobj.constPrice = parseFloat(this.formobj.scmCollectionRebateDistributionVehs[i].costPrice) + parseFloat(this.formobj.constPrice)
          }
        }
      }
    },
    // 车型常用配置列表--新增确定返回的数据
    backData(value) {
      this.viewState = 1
      if (value.length > 0) {
        value.forEach((e) => {
          this.formobj.scmCollectionRebateDistributionVehs.push({
            carModelName: e.vehicleAlias,
            carModelSid: e.carModelSid,
            vinNo: e.vinNo,
            costPrice: e.guidedPrice,
            priceDate: e.priceDate,
            salesDate: e.salesDate,
            distributionCollectionRebate: '',
            mainSid: '',
            sid: ''
          })
        })
        this.formobj.number = value.length
        for (var i = 0; i < this.formobj.scmCollectionRebateDistributionVehs.length; i++) {
          if (this.formobj.scmCollectionRebateDistributionVehs[i].costPrice !== '' && i === 0) {
            this.formobj.constPrice = parseFloat(this.formobj.scmCollectionRebateDistributionVehs[i].costPrice)
          } else {
            this.formobj.constPrice = parseFloat(this.formobj.scmCollectionRebateDistributionVehs[i].costPrice) + parseFloat(this.formobj.constPrice)
          }
        }
      }
    },
    handleRebate() {
      if (this.formobj.scmCollectionRebateDistributionVehs.length === 0) {
        this.$message({ showClose: true, type: 'error', message: '请选择需要返利分配的车辆' })
        return
      } else {
        if (parseFloat(this.formobj.estimateRebate) - parseFloat(this.formobj.constPrice) < 0) {
          this.$message({ showClose: true, type: 'error', message: '厂家结算价之和不应大于回款金额' })
          return
        }
        this.viewState = 3
        this.$refs['divAdd'].showEdit(this.formobj)
      }
    },
    resetState() {
      this.viewState = 1
    },
    reset() {
      this.viewState = 1
      this.handleReturn('true')
    },
    // 返回（===既判断）
    handleReturn(isreload) {
      if (isreload === 'true') this.$emit('reloadlist')
      // 表单数据
      this.formobj = {
        sid: '',
        brandName: '',
        brandSid: '',
        number: '',
        constPrice: '',
        withholdingApply: '',
        estimateRebate: '',
        collectionMoney: '',
        useOrgName: '',
        useOrgSid: '',
        createOrgName: '',
        createOrgSid: '',
        scmCollectionRebateDistributionVehs: []
      }
      this.$refs['form_obj'].resetFields()
      this.$emit('doback')
    }
  }
}
</script>
<style scoped>
.title {
  padding: 7px;
}
</style>

