<style>
    .TicketAmiba .TA_Tongji{
        margin:20px 0;
        font-size:14px;
    }
    .TicketAmiba .TA_Tongji span{
        display:inline-block;
        margin-right:20px;
    }
    .TicketAmiba .TA_TotalCost{
        color:red;
    }
    .TicketAmiba .TA_GreenSale{
        color:green;
    }
    .TA_TcNum{
      text-decoration: underline;
      cursor: pointer;
    }
    .TA_FrSpan{
      display: inline-block;
      margin-right:10px;
      color:blue;
      cursor: pointer;
      text-decoration: underline;
    }
</style>

<template>
  <div class="flexOne TicketAmiba">
    <div class="query-box">
      <ul>
        <li>
          <span>
            <em>团号</em>
            <el-input v-model='queryMsg.TCNUM' :placeholder="$t('pub.pleaseImport')" @keyup.enter.native="getList"></el-input>
          </span>
        </li>
        <li>
          <span>
                <em>发团开始日期</em>
                <el-date-picker class="w150" type="date" v-model="queryMsg.StartTime"
                :picker-options="pickerBeginDateBefore" value-format="yyyy-MM-dd" placeholder></el-date-picker>
          </span>
        </li>
        <li>
            <span>
                <em>发团结束日期</em>
                <el-date-picker class="w150" type="date" v-model="queryMsg.EndTime"
                :picker-options="pickerBeginDateAfter" value-format="yyyy-MM-dd" placeholder></el-date-picker>
            </span>
        </li>
        <li>
          <input type="button" class="hollowFixedBtn" @click="getList()" :value="$t('pub.searchBtn')" />
        </li>
      </ul>
    </div>
    <div class="TA_Tongji">
        <span>总收入：<span class="TA_GreenSale">{{TotalSale}}</span></span>
        <span>总成本：<span class="TA_TotalCost">{{TotalCost}}</span></span>
        <span>散客机票利润：<span class="TA_GreenSale">{{TotalSK}}</span></span>
        <span>总利润：<span class="TA_GreenSale">{{TotalProfit}}</span></span>
    </div>
    <table class="singeRowTable" border="0" cellspacing="0" cellpadding="0" v-loading="loading" style="margin-bottom:30px;">
      <tr>
        <th width="10%">团号</th>
        <th width="12%">收入</th>
        <th width="12%">成本</th>
        <th width="12%">散客机票数量</th>
        <th width="12%">散客机票利润</th>
        <th width="13%">关联财务单据</th>
        <th width="12%">利润</th>
        <th width="12%">业务员</th>
        <th width="8%">操作</th>
      </tr>
      <tr v-for="(item,index) in dataList">
        <td>
          <span class="TA_TcNum" @click="goAmoebaDetail(item.TCNUM,item.TCID)">{{item.TCNUM}}</span>
        </td>
        <td>{{item.SalePrice}}</td>
        <td>{{item.CostPrice}}</td>
        <td>{{item.IndividualTicketNum}}</td>
        <td>{{item.IndividualTicketMoney}}</td>
        <td>
          <span class="TA_FrSpan" @click='goDocment("FinancialDocumentsDetail",subItem)' v-for="subItem in item.FrIdList">{{subItem}}</span>
        </td>
        <td>{{item.Profit}}</td>
        <td>{{item.EmName}}</td>
        <td>
          <el-tooltip class="item" effect="dark" content="设置" placement="top">
              <el-button
              type="primary"
              @click="setAmiba(item)"
              icon="iconfont icon-menu-shezhi"
              circle
              ></el-button>
          </el-tooltip>
        </td>
      </tr>
    </table>
    <!--  -->
    <el-dialog
      width="1000px"
      title="设置团队散客机票利润"
      :visible.sync="AmibaDialog"
      center
      :before-close="closeChangeMachie"
    >
    <el-form :model="addMsg" :rules="rules" ref="addMsg" label-width="130px">
        <el-form-item style="display:inline-block" label="散客机票数量" prop="IndividualTicketNum">
          <el-input v-model="addMsg.IndividualTicketNum" @keyup.native="checkInteger(addMsg,'IndividualTicketNum')" class="w180"/>
        </el-form-item>
        <el-form-item style="display:inline-block"  label="散客机票利润" prop="IndividualTicketMoney">
          <el-input v-model="addMsg.IndividualTicketMoney" @keyup.native="checkPrice(addMsg,'IndividualTicketMoney')" class="w180"/>
        </el-form-item>
        <div>绑定财务单据</div>
        <table v-loading="checkLoad" class="singeRowTable myDocumentsTable" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <th><input v-model="isCkedAll" type="checkbox" @click='checkedAll()' /></th>
            <th>单号</th>
            <th>所属公司</th>
            <th>单据类型</th>
            <th>{{$t('fnc.fyleixing')}}</th>
            <th>交易方式</th>
            <th>{{$t('fnc.jine')}}</th>
            <th>付款对象</th>
            <th>制单人员</th>
          </tr>

          <tr v-for="(item,index) in FrIdList" :key="index+5000">
            <td>
              <input type="checkbox" :value="item.FrID" v-model="checkList" @change="ckeckedOne">
            </td>
            <td>{{item.FrID}}</td>
            <td>{{item.BranchName}}</td>
            <td>{{item.TypeName}}</td>
            <td>
              <p v-for="(i,index) in item.CostTypeList" :key="index+1000">{{i}} </p>
            </td>
            <td>
              <span v-for="(i,index) in item.TradeWayList" :key="index+2000">{{i.Alias}} <span v-if="item.TradeWayList[0]">{{item.TradeWayList[0].TypeName}}</span></span>
            </td>
            <td>
              <p>{{item.Type==1?$t('fnc.yingshou'):$t('fnc.yingfu')}}：<span>{{item.Money}}</span></p>
              <p>{{item.Type==1?$t('fnc.shishou'):$t('fnc.shifu')}}：<span>{{item.PayMoney}}</span></p>
            </td>
            <td>{{item.RemitterName}}</td>
            <td>{{item.EmName}}</td>
            
          </tr>
		    </table>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <button class="hollowFixedBtn"
          @click="AmibaDialog = false, resetForm('addMsg')"
        >{{$t('pub.cancelBtn')}}</button> &nbsp;
        <button class="normalBtn" @click="submitForm('addMsg')">{{$t('pub.saveBtn')}}</button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        checkLoad:false,
        checkAllList:[],
        checkList:[],
        isCkedAll: false,
        dataList: [],
        loading:false,
        //总成本
        TotalCost:0,
        //总收入
        TotalSale:0,
        //总利润
        TotalProfit:0,
        //散客机票利润
        TotalSK:0,
        AmibaDialog:false,
        //财务单据下拉数据
        FrList:[],
        queryMsg: {
          StartTime:'',
          EndTime: '',
          TCNUM: ''
        },
        //新增
        addMsg:{
          TCID:'',
          IndividualTicketNum:'',
          IndividualTicketMoney:'',
          FrIdList:[]
        },
        FrIdList:[],
        pickerBeginDateBefore: {
          disabledDate: time => {
            if (this.queryMsg.EndTime == null) {
              return false;
            } else {
              let endTime = new Date(this.queryMsg.EndTime)
              return endTime.getTime() < time.getTime()
            }
          }
        },
        pickerBeginDateAfter: {
          disabledDate: time => {
            let startTime = new Date(this.queryMsg.StartTime)
            return startTime.getTime() >= time.getTime()
          }
        },
        rules: {
          IndividualTicketNum: [
            { required: true, message: "请输入散客机票数量", trigger: "blur" }
          ],
          IndividualTicketMoney: [
            { required: true, message: "请输入散客机票利润", trigger: "blur" }
          ]
        },
      }
    },
    mounted() {
        //默认查询当月第一个到最后一天日期
        var now = new Date();
        var month = now.getMonth() + 1;//js获取到的是月份是 0-11 所以要加1
        var year = now.getFullYear();
        var nextMonthFirstDay = new Date([year,month + 1,1].join('-')).getTime();
        var oneDay = 1000 * 24 * 60 * 60;
        var monthLast = new Date(nextMonthFirstDay - oneDay).getDate()
        this.queryMsg.StartTime = [year,month,1].join('-');
        this.queryMsg.EndTime = [year,month,monthLast].join('-');
        this.getList()
    },
    methods: {
      ckeckedOne() {  //单选
            if(this.checkList.length < this.checkAllList.length) {
                this.isCkedAll = false
            } else {
                this.isCkedAll = true
            }
        },
        checkedAll() {  //全选
            if(this.isCkedAll == true) {
                this.checkList = [];
            } else {
                this.checkAllList.forEach(item => {
                    this.checkList.push(item)
                })
            }
        },
      getList() { //获取列表数据
        this.loading = true;
        this.apipost("sellorder_post_GetAirTicketSettlement", this.queryMsg, res => {
          this.loading = false;
          if (res.data.resultCode == 1) {
              this.dataList = res.data.data.Rlist;
              this.TotalCost = res.data.data.TotalCost;
              this.TotalSale = res.data.data.TotalSale;
              this.TotalProfit = res.data.data.TotalProfit;
              this.TotalSK = res.data.data.TotalSK;
          } else {
              this.Error(res.data.message);
          }
        }, err => {})
      },
      //跳转至阿米巴结算详情
      goAmoebaDetail(TCNUM,TCID){
        this.$router.push({
          name: "AmoebaDetail",
          query: {
            TCNUM:TCNUM,
            TCID: TCID,
            blank: "y",
            tab: "阿米巴结算详情"
          }
        });
      },
      //跳转单据详情
      goDocment(path, id) {
        this.$router.push({ name: path, query: { id: id, blank: 'y', tab: '单据详情'} });
      },
      closeChangeMachie(done) {
        //弹出框关闭初始化弹框内表单
        done();
        this.resetForm("addMsg");
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      },
      //点击取值
      setAmiba(item){
        this.AmibaDialog=true;
        let msg = {
          TCID:item.TCID,
          SourceForm:1
        }
        this.addMsg.TCID = item.TCID;
        this.addMsg.IndividualTicketNum = item.IndividualTicketNum;
        this.addMsg.IndividualTicketMoney = item.IndividualTicketMoney;
        this.addMsg.FrIdList = item.FrIdList;
        this.checkAllList=[];
        this.checkLoad=true;
        this.apipost("Financial_post_GetFinanceALLList", msg, res => {
          this.checkLoad=false;
          if (res.data.resultCode == 1) {
              let dataList = res.data.data;
              dataList.forEach(x=>{
                this.checkAllList.push(x.FrID);
              })
              this.FrIdList= res.data.data;

          } else {
              this.Error(res.data.message);
          }
        }, err => {})
      },
      //提交
      submitForm(addMsg) {
        //提交创建、修改表单
        this.$refs[addMsg].validate(valid => {
          if (valid) {
            this.addMsg.FrIdList=this.checkList;
            if(this.addMsg.IndividualTicketNum+this.addMsg.IndividualTicketMoney>0){
              if(this.addMsg.FrIdList.length==0){
                this.Error("至少选择一条单据");
                return;
              }
            }
            this.addAmibaInfo();
          } else {
            return false;
          }
        });
      },
      addAmibaInfo(){
        this.apipost("sellorder_post_SetTravelIndividualTicket", this.addMsg, res => {
          if (res.data.resultCode == 1) {
              this.Success(res.data.message);
              this.AmibaDialog = false;
              this.getList();
          } else {
              this.Error(res.data.message);
          }
        }, err => {})
      }
    }
  }
</script>