<style>
 @import url('../../../assets/css/domestic/TicketingModule.css');
 .sanjiao-box{
    position: relative;
 }
  .sanjiao-box .Receipt_table td{
    padding: 0 10px;
  }
  .hover_text span{
    cursor: pointer;
    text-decoration: underline;
  }
  .czBillModule td{
      text-align: center!important;
      padding:6px 0!important;
  }
  .cd_btn {
    cursor: pointer;
    color: #2AAEF2;
  }
  .cd_btn:hover {
    color: aqua;
  }
</style>
<template> 
   <div class="m_TicketingModule">
        <div  v-if="OtherType==7||OtherType==65||details.MatchFrId>0">
            <div class="_tit">
                <span class="_text">预付款单据</span>
                <div>
                    <span class="_btn" v-if="tableShow" @click="tableShow=false">收起 <i class="iconfont icon-gengduo _rotate"></i> </span>
                    <span class="_btn" v-else @click="tableShow=true">展开 <i class="iconfont icon-gengduo"></i> </span>
                </div>
            </div>
            <div v-show="tableShow" class="sanjiao-box _padding_20_15">
                <table border="1" class="czBillModule _border_color_b Receipt_table" bordercolor="#c94052" style="border-collapse:collapse;width: 100%;" v-loading='loading'>
                    <tr>
                        <th>单号</th>
                        <th>公司</th>
                        <th>费用类型</th>
                        <th>币种</th>
                        <th>汇率</th>
                        <th>金额</th>
                        <th>冲抵金额</th>
                    </tr>
                    <tr class="_color_b" v-for="(item,index) in czList" :key="index">
                        <td class="hover_text" @click="goDetail(item.FrID)" ><span>{{item.FrID}}</span></td>
                        <td>{{item.BranchName}}</td>
                        <td>{{item.CostTypeName}}</td>
                        <td>{{item.CurrencyName}}</td>
                        <td>{{item.Rate}}</td>
                        <td>{{item.Money}}</td>
                        <td>{{item.MatchMoney}}</td>
                    </tr>
                </table>
            </div>
        </div>
        <div v-if="IsAdvanceFinance==1" style="border-top: 1px solid #DDDDDD;">
            <div class="_tit">
                <span class="_text">冲抵单据</span>
                <div>
                    <span class="_btn" v-if="tableShow1" @click="tableShow1=false">收起 <i class="iconfont icon-gengduo _rotate"></i> </span>
                    <span class="_btn" v-else @click="tableShow1=true">展开 <i class="iconfont icon-gengduo"></i> </span>
                </div>
            </div>
            <div v-show="tableShow1" class="sanjiao-box _padding_20_15">
                <div v-if="IsFinancePermission">
                    <span class="cd_btn" @click="sureAccount()">对账确认 &nbsp;&nbsp;</span>
                    <!-- <span class="cd_btn" @click="advanceToExcel()">导出Excel</span> -->
                </div>
                <table border="1" class="czBillModule _border_color_b Receipt_table" bordercolor="#c94052" style="border-collapse:collapse;width: 100%;" v-loading='loading'>
                    <tr>
                        <th>单号</th>
                        <th>公司</th>
                        <th>费用类型</th>
                        <th>币种</th>
                        <th>原币金额</th>
                        <th>汇率</th>
                        <th>状态</th>
                        <th>金额</th>
                    </tr>
                    <tr class="_color_b" v-for="(item,index) in czTableList" :key="index">
                        <td class="hover_text">
                            <el-checkbox v-if="item.ClientTypeCateId !=1 && IsFinancePermission" v-model="item.checked" style="margin-right:2px ;"></el-checkbox>
                            <span @click="goDetail(item.FrID)" >{{item.FrID}}</span>
                        </td>
                        <td>{{item.BranchName}}</td>
                        <td>{{item.CostTypeName}}</td>
                        <td>{{item.CurrencyName}}</td>
                        <td>{{item.WBMoney}}</td>
                        <td>{{item.Rate}}</td>
                        <td>
                            <span v-if="item.ClientTypeCateId ==1 && IsFinancePermission" style="color:#FF9600">已对账</span>
                            <span v-else>{{item.StatusStr}}</span>
                        </td>
                        <td>
                            {{item.Money}}
                            <span v-if="item.OtherType&&item.OtherType==65" 
                            style="font-size: 12px;margin-left: 3px;color: #FF9600;">(退)</span>
                        </td>
                        
                    </tr>
                    <tr class="_color_b">
                        <td colspan="4">原币合计</td>
                        <td>{{ybtotal}}</td>
                        <td colspan="2">合计</td>
                        <td>{{cdtotal}}</td>
                    </tr>
                </table>
            </div>
        </div>
        <div v-if="LeaderRefundDetailList && LeaderRefundDetailList.length>0 && LeaderState">
           <div class="_tit">
                <span class="_text">领队领款单据</span>
                <div>
                    <span class="_btn" v-if="tableShow2" @click="tableShow2=false">收起 <i class="iconfont icon-gengduo _rotate"></i> </span>
                    <span class="_btn" v-else @click="tableShow2=true">展开 <i class="iconfont icon-gengduo"></i> </span>
                </div>
            </div>
            <div v-show="tableShow2" class="sanjiao-box _padding_20_15">
                <table border="1" class="czBillModule _border_color_b Receipt_table" bordercolor="#c94052" style="border-collapse:collapse;width: 100%;" v-loading='loading'>
                    <tr>
                        <th>单号</th>
                        <th>公司</th>
                        <th>费用类型</th>
                        <th>原币</th>
                        <th>汇率</th>
                        <th>本位币</th>
                        <th>备注</th>
                        <th>制单人</th>
                        
                    </tr>
                    <tr class="_color_b" v-for="(item,index) in LeaderRefundDetailList" :key="index">
                        <td class="hover_text" @click="goDetail(item.FinanceId)" ><span>{{item.FinanceId}}</span></td>
                        <td>{{item.BName}}</td>
                        <td>{{item.CostTypeName}}</td>
                        <td>{{item.OriginalMoney}}</td>
                        <td>{{item.Rate}}</td>
                        <td>{{item.Money}}</td>
                        <td>{{item.Remark}}</td>
                        <td>{{item.EmName}}</td>
                        
                    </tr>
                </table>
            </div>
        </div>
        <div v-if="ReceiptModel && ReceiptModel.Id>0 && LeaderState">
           <div class="_tit">
                <span class="_text">财务收据</span>
                <div>
                    <span class="_btn" v-if="tableShow2" @click="tableShow2=false">收起 <i class="iconfont icon-gengduo _rotate"></i> </span>
                    <span class="_btn" v-else @click="tableShow2=true">展开 <i class="iconfont icon-gengduo"></i> </span>
                </div>
            </div>
            <div v-show="tableShow2" class="sanjiao-box _padding_20_15">
                <table border="1" class="czBillModule _border_color_b Receipt_table" bordercolor="#c94052" style="border-collapse:collapse;width: 100%;" v-loading='loading'>
                    <tr>
                        <th>ID</th>
                        <th>团号</th>
                        <th>账户</th>
                        <th>原币</th>
                        
                    </tr>
                    <tr class="_color_b">
                        <td class="hover_text" @click="goDetailDoc(ReceiptModel.Id)" ><span>{{ReceiptModel.Id}}</span></td>
                        <td><span>{{ReceiptModel.TCNUM}}（{{ReceiptModel.TCID}}）</span></td>
                        <td>{{ReceiptModel.AccountName}}</td>
                        <td>{{ReceiptModel.WBMoney}}</td>
                        
                    </tr>
                </table>
            </div>
        </div>
        <!-- 电商商品 -->
        <div v-if="OtherType==9 && ECommerceGoodsModel.Id>0 && LeaderState">
           <div class="_tit">
                <span class="_text">电商商品</span>
                <div>
                    <span class="_btn" v-if="tableShow3" @click="tableShow3=false">收起 <i class="iconfont icon-gengduo _rotate"></i> </span>
                    <span class="_btn" v-else @click="tableShow3=true">展开 <i class="iconfont icon-gengduo"></i> </span>
                </div>
            </div>
            <div v-show="tableShow3" class="sanjiao-box _padding_20_15">
                <table border="1" class="czBillModule _border_color_b Receipt_table" bordercolor="#c94052" style="border-collapse:collapse;width: 100%;" v-loading='loading'>
                    <tr>
                        <th width="35%">编号</th>
                        <th>名称</th>
                        
                    </tr>
                    <tr class="_color_b">
                        <td class="hover_text" @click="goElectricityGoods(ECommerceGoodsModel.Id)" ><span>{{ECommerceGoodsModel.Id}}</span></td>
                        <td @click="goElectricityGoods(ECommerceGoodsModel.Id)">
                            <span>{{ECommerceGoodsModel.Name}}</span>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <!-- 电商商品 关联团团号信息 -->
        <div v-if="OtherType==9 && details.TCID>0 && LeaderState">
           <div class="_tit">
                <span class="_text">关联团号信息</span>
                <div>
                    <span class="_btn" v-if="tableShow4" @click="tableShow4=false">收起 <i class="iconfont icon-gengduo _rotate"></i> </span>
                    <span class="_btn" v-else @click="tableShow4=true">展开 <i class="iconfont icon-gengduo"></i> </span>
                </div>
            </div>
            <div v-show="tableShow4" class="sanjiao-box _padding_20_15">
                <table border="1" class="czBillModule _border_color_b Receipt_table" bordercolor="#c94052" style="border-collapse:collapse;width: 100%;" v-loading='loading'>
                    <tr>
                        <th width='35%'>团ID</th>
                        <th>团号</th>
                        
                    </tr>
                    <tr class="_color_b">
                        <td class="hover_text" @click="goTravelControlList(details.TCID)" ><span>{{details.TCID}}</span></td>
                        <td @click="goTravelControlList(details.TCID)">
                        <span>{{details.TCNUM}}</span>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    props:["FrID"],
    data(){
        return{
          tableShow: true,
          tableShow1: true,
          tableShow2: true,
          tableShow3: true,
          tableShow4: true,
          tit: '',
          details:{},
          loading: true,
          czList:[],
          czTableList:[],
          GetDetail:{},
          OtherType:0,
          ReFinanceId:0,
          IsAdvanceFinance:-1,
          cdtotal:0,
          ybtotal:0,
          LeaderRefundDetailList:[],
          LeaderState:false,
          ECommerceGoodsModel:{},
          ReceiptModel:{},
          IsFinancePermission:false,
        }
    },watch:{
        
    },created(){
        
      
      
    },mounted(){
        this.getDataDes();
        // 查询财务权限
        let userInfo = this.getLocalStorage();
        if (userInfo.ActionMenuCode.indexOf('F_AccountantFinanceMerge') != -1) {
            this.IsFinancePermission = true;
        }
    },
    methods:{
        sureAccount(){
            // 确认单据对账
            let flag = false;
            let financeIds ='';
            this.czTableList.forEach(x => {
                if (x.checked) {
                    flag=true
                    financeIds += x.FrID + ','
                }
            })
            if (!flag) {
                this.$message.error("请选择财务单据！")
                return
            }
            this.apipost("Financial_post_SetAdvanceMatchChecked", {FinanceIds: financeIds}, res => {
                if (res.data.resultCode == 1) {
                    this.$message.success(res.data.message);
                    this.getczTableList();
                }
            });
        },
        advanceToExcel(){
            let userInfo = this.getLocalStorage();
            let msg={
                pageIndex:1,
                pageSize:1000,
                ReFinanceId:this.FrID,
                EmployeeId:userInfo.EmployeeId
            };
            this.GetLocalFile("Financial_get_DownLoadAdvanceMatchFinance", msg,this.FrID + "预付款冲抵导出.xls");
        },
        getDataDes(){
          this.apipost('Financial_post_GetDetail', {ID:this.FrID,Type:1}, res => {
            this.loading = false
            if (res.data.resultCode == 1) {
                let data=res.data.data;
                this.LeaderRefundDetailList=data.LeaderRefundDetailList;
                this.ReceiptModel=data.ReceiptModel;
                this.LeaderState=true;
                this.OtherType=data.OtherType;
                this.ReFinanceId=data.ReFinanceId;
                this.IsAdvanceFinance=data.IsAdvanceFinance;
                this.ECommerceGoodsModel=data.ECommerceGoodsModel;
                this.details=data;
                if(this.OtherType==7||this.details.MatchFrId>0){
                    this.getDetails()
                }else if(this.OtherType==65){
                    this.getyfTableList()
                } else{
                    this.getczTableList();
                }
            }
        }, err => {})
          
      },
      goTravelControlList(id){
        this.$router.push({ name: 'TravelControlList',query:{"TCID":id,blank:'y',tab:'团控列表'} })
      },
      goDetailDoc(id){
        this.$router.push({ name: 'DocumentStatistics',query:{"id":id,blank:'y',tab:'单据详情'} })
      },
      goDetail(id){
        this.$router.push({ name: 'FinancialDocumentsDetail',query:{"id":id,blank:'y',tab:'单据详情'} })
      },
      goElectricityGoods(id){
        this.$router.push({ name: 'ElectricityGoods',query:{"Id":id,unEdit:true,blank:'y'} })
      },
      getczTableList(){
        this.loading = true
        let msg={
          pageIndex:1,
          pageSize:1000,
          ReFinanceId:this.FrID
        };
        this.cdtotal=0; this.ybtotal =0;
        this.apipost('Financial_get_GetAdvanceMatchFinancePageList', msg, res => {
            this.loading = false
            if (res.data.resultCode == 1) {
                let data=res.data.data.pageData;
                this.czTableList=data;
                data.forEach(item => {
                    if(item.OtherType&&item.OtherType==65){
                        this.cdtotal+=-(item.Money);
                        this.ybtotal+=-(item.WBMoney)
                    }else{
                        this.cdtotal+=item.Money;
                        this.ybtotal+=(item.WBMoney)
                    }
                    
                });
                this.cdtotal=this.cdtotal.toFixed(2);
                this.ybtotal=this.ybtotal.toFixed(2);
            }
            else{
                this.Error(res.data.message)
            }
        }, err => {})
      },
    //   OtherType=65详情 预付款退款详情
      getyfTableList(){
        this.loading = true
        let msg={
          pageIndex:1,
          pageSize:100,
          FrID:this.details.ReFinanceId,
        };
        this.cdtotal=0;
        this.apipost('Financial_get_GetAdvanceFinancePageList', msg, res => {
            
            this.loading = false
            if (res.data.resultCode == 1) {
                let data=res.data.data.pageData;
                this.czList=data;
            }
            else{
                this.Error(res.data.message)
            }
        }, err => {})
      },
    //   OtherType=7详情
      getDetails(){
        this.loading = true;
        let msg={
            pageIndex:1,
            pageSize:20,
            FrID:this.details.MatchFrId>0?this.details.MatchFrId:this.ReFinanceId,//MatchFrId单项成本冲抵单号
            CostTypeID:'',
            sTradeDate:'',
            eTradeDate:'',
        };
        
        this.apipost('Financial_get_GetAdvanceFinancePageList', msg, res=>{ 
          if(res.data.resultCode == 1) {
            this.loading = false
            let data= res.data.data.pageData; 
            this.czList = data;
          }
        }, null)
      }
    }
}
</script>