<template>
  <div>
    <table class="teamRevenueExpenditureTotalTable" border="0" cellspacing="1" cellpadding="">
      <tr>
        <th width="200">操作团号</th>
        <th width="100">机位</th>
        <th width="200">报名</th>
        <th width="100">状态</th>
        <th width="200">当团OP</th>
      </tr>
      <tr v-for="item in msgList">
        <td>{{item.TCNUM}}</td>
        <td>{{item.TotalSeat}}</td>
        <td>{{item.TotalGuest}}</td>
        <td>{{numberToWord(item.TCState)}}</td>
        <td>{{item.CreateByName}}</td>
      </tr>
    </table>
    <table class="teamRevenueExpenditureTotalTable" border="0" cellspacing="1" cellpadding="">
      <tr>
        <th width="200">地接团号</th>
        <th width="150">酒店</th>
        <th width="150">餐厅</th>
        <th width="150">门票</th>
        <th width="150">车资</th>
        <th width="150">其它</th>
        <th width="150">总计</th>
      </tr>
      <tr v-for="item in msgList">
        <td>{{item.NewCombinationNum}}</td>
        <td>{{moneyFormat(hotelPay)}}</td>
        <td>{{moneyFormat(eatPay)}}</td>
        <td>{{moneyFormat(ticketPay)}}</td>
        <td>{{moneyFormat(busPay)}}</td>
        <td>{{moneyFormat(otherPay)}}</td>
        <td>{{moneyFormat(hotelPay+eatPay+ticketPay+busPay+otherPay)}}</td>
      </tr>
    </table>
    <p class="teamRevenueExpenditureTitle">
      酒店
      <span class="fr" style="margin-top: -8px;">
        <input type="button" class="normalBtn" value="新增付款" @click="goUrl(1,2)" /><input type="button" class="normalBtn"
          value="新增收款" @click="goUrl(1,1)" />
      </span>
    </p>
    <table border="0" cellspacing="1" cellpadding="0" class="teamRevenueExpenditureTable">
      <tr>
        <th width="100">序号</th>
        <th width="10%">单号</th>
        <th width="10%">费用说明</th>
        <th width="10%">日期</th>
        <th width="20%">备注</th>
        <th width="10%">应付/应付金额</th>
        <th width="10%">业务员</th>
        <th>付款凭证</th>
        <th width="10%">状态</th>
      </tr>
      <tr v-for="(item,index) in hotelList">
        <td>{{index+1}}</td>
        <td> <a style="color:blue;cursor:pointer" @click="goFinaceURL(item.FrID)"> {{item.FrID}} </a></td>
        <td>
          <span class="padding10" v-for="i in item.CostTypeList">{{i}}</span>
        </td>
        <td>{{item.CreateDate}}</td>
        <td>
          <div v-for="childItem in item.TradeWayList">
            支付方式：{{childItem.Alias}}<span class="TB_Rate">币种：{{childItem.CurrencyName}}</span>
            <span class="Team_Coins">{{childItem.OriginalMoney}}*{{childItem.Rate}}</span>
            <span class="TB_Rate">汇率：{{childItem.Rate}}</span>
          </div>
        </td>
        <td>
          <span>￥{{item.Type === 2 ? '-' : ''}}{{moneyFormat(item.Money)}}</span>
        </td>
        <td>{{item.EmName}}</td>
        <td>
          <template v-for="(son,sIndex) in item.VorcherInos">
            <template v-if="son.Type==1||son.Type==2">
              <i class="iconfont icon-excel" @click="showUpLoadFile(son)"></i>
            </template>
            <template v-if="son.Type==3">
              <img class="vorcherInosImg" @click="showImg(item.VorcherInos)" :src="son.Content" alt="">
            </template>
          </template>
        </td>
        <td>{{item.StatusStr}}</td>
      </tr>
      <tr v-if='hotelList.length!=0'>
        <td>成本总价</td>
        <td style="text-align:left;padding-left:5px;" colspan="8">
          ￥{{getTotalMoney(hotelList)}}
        </td>
      </tr>
      <tr v-if='hotelList.length==0'>
        <td colspan="9" class="color666">没有找到你需要的财务数据</td>
      </tr>
    </table>
    <p class="teamRevenueExpenditureTitle">
      餐食
      <span class="fr" style="margin-top: -8px;">
        <input type="button" class="normalBtn" value="新增付款" @click="goUrl(2,2)" /><input type="button" class="normalBtn"
          value="新增收款" @click="goUrl(2,1)" />
      </span>
    </p>
    <table border="0" cellspacing="1" cellpadding="0" class="teamRevenueExpenditureTable">
      <tr>
        <th width="100">序号</th>
        <th width="10%">单号</th>
        <th width="10%">费用说明</th>
        <th width="10%">日期</th>
        <th width="20%">备注</th>
        <th width="10%">应付/应付金额</th>
        <th width="10%">业务员</th>
        <th>付款凭证</th>
        <th width="10%">状态</th>
      </tr>
      <tr v-for="(item,index) in eatList">
        <td>{{index+1}}</td>
        <td><a style="color:blue;cursor:pointer" @click="goFinaceURL(item.FrID)"> {{item.FrID}} </a></td>
        <td>
          <span class="padding10" v-for="i in item.CostTypeList">{{i}}</span>
        </td>
        <td>{{item.CreateDate}}</td>
        <td>
          <div v-for="childItem in item.TradeWayList">
            支付方式：{{childItem.Alias}}<span class="TB_Rate">币种：{{childItem.CurrencyName}}</span>
            <span class="Team_Coins">{{childItem.OriginalMoney}}*{{childItem.Rate}}</span>
            <span class="TB_Rate">汇率：{{childItem.Rate}}</span>
          </div>
        </td>
        <td>
          <span>￥{{item.Type === 2 ? '-' : ''}}{{moneyFormat(item.Money)}}</span>
        </td>
        <td>{{item.EmName}}</td>
        <td>
          <template v-for="(son,sIndex) in item.VorcherInos">
            <template v-if="son.Type==1||son.Type==2">
              <i class="iconfont icon-excel" @click="showUpLoadFile(son)"></i>
            </template>
            <template v-if="son.Type==3">
              <img class="vorcherInosImg" @click="showImg(item.VorcherInos)" :src="son.Content" alt="">
            </template>
          </template>
        </td>
        <td>{{item.StatusStr}}</td>
      </tr>
      <tr v-if='eatList.length!=0'>
        <td>成本总价</td>
        <td style="text-align:left;padding-left:5px;" colspan="8">
          ￥{{getTotalMoney(eatList)}}
        </td>
      </tr>
      <tr v-if='eatList.length==0'>
        <td colspan="9" class="color666">没有找到你需要的财务数据</td>
      </tr>
    </table>
    <p class="teamRevenueExpenditureTitle">
      门票
      <span class="fr" style="margin-top: -8px;">
        <input type="button" class="normalBtn" value="新增付款" @click="goUrl(3,2)" /><input type="button" class="normalBtn"
          value="新增收款" @click="goUrl(3,1)" />
      </span>
    </p>
    <table border="0" cellspacing="1" cellpadding="0" class="teamRevenueExpenditureTable">
      <tr>
        <th width="100">序号</th>
        <th width="10%">单号</th>
        <th width="10%">费用说明</th>
        <th width="10%">日期</th>
        <th width="20%">备注</th>
        <th width="10%">应付/应付金额</th>
        <th width="10%">业务员</th>
        <th>付款凭证</th>
        <th width="10%">状态</th>
      </tr>
      <tr v-for="(item,index) in ticketList">
        <td>{{index+1}}</td>
        <td><a style="color:blue;cursor:pointer" @click="goFinaceURL(item.FrID)"> {{item.FrID}} </a></td>
        <td>
          <span class="padding10" v-for="i in item.CostTypeList">{{i}}</span>
        </td>
        <td>{{item.CreateDate}}</td>
        <td>
          <div v-for="childItem in item.TradeWayList">
            支付方式：{{childItem.Alias}}<span class="TB_Rate">币种：{{childItem.CurrencyName}}</span>
            <span class="Team_Coins">{{childItem.OriginalMoney}}*{{childItem.Rate}}</span>
            <span class="TB_Rate">汇率：{{childItem.Rate}}</span>
          </div>
        </td>
        <td>
          <span>￥{{item.Type === 2 ? '-' : ''}}{{moneyFormat(item.Money)}}</span>
        </td>
        <td>{{item.EmName}}</td>
        <td>
          <template v-for="(son,sIndex) in item.VorcherInos">
            <template v-if="son.Type==1||son.Type==2">
              <i class="iconfont icon-excel" @click="showUpLoadFile(son)"></i>
            </template>
            <template v-if="son.Type==3">
              <img class="vorcherInosImg" @click="showImg(item.VorcherInos)" :src="son.Content" alt="">
            </template>
          </template>
        </td>
        <td>{{item.StatusStr}}</td>
      </tr>
      <tr v-if='ticketList.length!=0'>
        <td>成本总价</td>
        <td style="text-align:left;padding-left:5px;" colspan="8">
          ￥{{getTotalMoney(ticketList)}}
        </td>
      </tr>
      <tr v-if='ticketList.length==0'>
        <td colspan="9" class="color666">没有找到你需要的财务数据</td>
      </tr>
    </table>
    <p class="teamRevenueExpenditureTitle">
      车资
      <span class="fr" style="margin-top: -8px;">
        <input type="button" class="normalBtn" value="新增付款" @click="goUrl(5,2)" /><input type="button" class="normalBtn"
          value="新增收款" @click="goUrl(5,1)" />
      </span>
    </p>
    <table border="0" cellspacing="1" cellpadding="0" class="teamRevenueExpenditureTable">
      <tr>
        <th width="100">序号</th>
        <th width="10%">单号</th>
        <th width="10%">费用说明</th>
        <th width="10%">日期</th>
        <th width="20%">备注</th>
        <th width="10%">应付/应付金额</th>
        <th width="10%">业务员</th>
        <th>付款凭证</th>
        <th width="10%">状态</th>
      </tr>
      <tr v-for="(item,index) in busList">
        <td>{{index+1}}</td>
        <td><a style="color:blue;cursor:pointer" @click="goFinaceURL(item.FrID)"> {{item.FrID}} </a></td>
        <td>
          <span class="padding10" v-for="i in item.CostTypeList">{{i}}</span>
        </td>
        <td>{{item.CreateDate}}</td>
        <td>
          <div v-for="childItem in item.TradeWayList">
            支付方式：{{childItem.Alias}}<span class="TB_Rate">币种：{{childItem.CurrencyName}}</span>
            <span class="Team_Coins">{{childItem.OriginalMoney}}*{{childItem.Rate}}</span>
            <span class="TB_Rate">汇率：{{childItem.Rate}}</span>
          </div>
        </td>
        <td>
          <span>￥{{item.Type === 2 ? '-' : ''}}{{moneyFormat(item.Money)}}</span>
        </td>
        <td>{{item.EmName}}</td>
        <td>
          <template v-for="(son,sIndex) in item.VorcherInos">
            <template v-if="son.Type==1||son.Type==2">
              <i class="iconfont icon-excel" @click="showUpLoadFile(son)"></i>
            </template>
            <template v-if="son.Type==3">
              <img class="vorcherInosImg" @click="showImg(item.VorcherInos)" :src="son.Content" alt="">
            </template>
          </template>
        </td>
        <td>{{item.StatusStr}}</td>
      </tr>
      <tr v-if='busList.length!=0'>
        <td>成本总价</td>
        <td style="text-align:left;padding-left:5px;" colspan="8">
          ￥{{getTotalMoney(busList)}}
        </td>
      </tr>
      <tr v-if='busList.length==0'>
        <td colspan="9" class="color666">没有找到你需要的财务数据</td>
      </tr>
    </table>

    <p class="teamRevenueExpenditureTitle">
      其它
      <span class="fr" style="margin-top: -8px;">
        <input type="button" class="normalBtn" value="新增付款" @click="goUrl(14,2)" /><input type="button"
          class="normalBtn" value="新增收款" @click="goUrl(14,1)" />
      </span>
    </p>
    <table border="0" cellspacing="1" cellpadding="0" class="teamRevenueExpenditureTable">
      <tr>
        <th width="100">序号</th>
        <th width="10%">单号</th>
        <th width="10%">费用说明</th>
        <th width="10%">日期</th>
        <th width="20%">备注</th>
        <th width="10%">应付/应付金额</th>
        <th width="10%">业务员</th>
        <th>付款凭证</th>
        <th width="10%">状态</th>
      </tr>
      <tr v-for="(item,index) in otherList">
        <td>{{index+1}}</td>
        <td><a style="color:blue;cursor:pointer" @click="goFinaceURL(item.FrID)"> {{item.FrID}} </a></td>
        <td>
          <span class="padding10" v-for="i in item.CostTypeList">{{i}}</span>
        </td>
        <td>{{item.CreateDate}}</td>
        <td>
          <div v-for="childItem in item.TradeWayList">
            支付方式：{{childItem.Alias}}<span class="TB_Rate">币种：{{childItem.CurrencyName}}</span>
            <span class="Team_Coins">{{childItem.OriginalMoney}}*{{childItem.Rate}}</span>
            <span class="TB_Rate">汇率：{{childItem.Rate}}</span>
          </div>
        </td>
        <td>
          <span>￥{{item.Type === 2 ? '-' : ''}}{{moneyFormat(item.Money)}}</span>
        </td>
        <td>{{item.EmName}}</td>
        <td>
          <template v-for="(son,sIndex) in item.VorcherInos">
            <template v-if="son.Type==1||son.Type==2">
              <i class="iconfont icon-excel" @click="showUpLoadFile(son)"></i>
            </template>
            <template v-if="son.Type==3">
              <img class="vorcherInosImg" @click="showImg(item.VorcherInos)" :src="son.Content" alt="">
            </template>
          </template>
        </td>
        <td>{{item.StatusStr}}</td>
      </tr>
      <tr v-if='otherList.length!=0'>
        <td>成本总价</td>
        <td style="text-align:left;padding-left:5px;" colspan="8">
          ￥{{getTotalMoney(otherList)}}
        </td>
      </tr>
      <tr v-if='otherList.length==0'>
        <td colspan="9" class="color666">没有找到你需要的财务数据</td>
      </tr>
    </table>
    <div v-if='picIsShow' class="viewBigPicLayer" @click="picIsShow=false,picObj=[]">
      <el-carousel height="600px" :interval="5000" trigger="click">
        <el-carousel-item v-for="(item,index) in picObj" :key="index">
          <div class="inlineDiv ownScrollbarStyle"><img :src="item" /></div>
        </el-carousel-item>
      </el-carousel>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        LineId:0,
        picIsShow: false,
        picObj: [],
        msgList: [],
        hotelList: [],
        eatList: [],
        ticketList: [],
        busList: [],
        otherList: [],
        hotelPay: 0,
        eatPay: 0,
        ticketPay: 0,
        busPay: 0,
        otherPay: 0,
      }
    },
    methods: {
      //跳转到财务页面 
      goFinaceURL(id) {
        this.$router.push({
          name: 'FinancialDocumentsDetail',
          query: {
            'id': id,
            'blank': 'y',
          }
        });
      },
      numberToWord(val) {
        switch (val) {
          case 1:
            return '待完善'
            break;
          case 2:
            return '下架'
            break;
          case 3:
            return '销售中'
            break;
          case 4:
            return '取消'
            break;
          default:
            break;
        }
      },
      getTotalMoney(obj) {
        let money = 0
        obj.forEach(item => {
          if (item.Type == 1) {
            money += item.Money
          } else {
            money -= item.Money
          }
        })
        if (obj.length > 0) {
          switch (obj[0].OrderSource) {
            case 1:
              this.hotelPay = money
              break;
            case 2:
              this.eatPay = money
              break;
            case 3:
              this.ticketPay = money
              break;
            case 5:
              this.busPay = money
              break;
            case 14:
              this.otherPay = money
              break;
            default:
              break;
          }
        }
        return this.moneyFormat(money)
      },
      showUpLoadFile(i) { // 预览上传文件
        if (i.Content.substring(i.Content.lastIndexOf('.') + 1, i.Content.length).toUpperCase() == 'PDF') {
          this.previewPDF(i.Content)
        } else {
          window.open("https://view.officeapps.live.com/op/view.aspx?src=" + i.Content)
        }
      },
      showImg(obj) {
        obj.forEach(x => {
          if (x.Type == 3) {
            this.picObj.push(x.Content)
          }
        })
        this.picIsShow = true;
      },
      goUrl(_orderSource, _type) {
        let TCIDARR = []
        let id = [];
        if( this.msgList[0].LineId==this.LineId){

      if (_orderSource === 1 && _type === 2) {
                  id = [94]
                } else if (_orderSource === 2 && _type === 2) {
                  id = [95]
                } else if (_orderSource === 5 && _type === 2) {
                  id = [96]
                }
                // 门票
                else if (_orderSource === 3 && _type === 2) {
                  id = [97]
                }
        }
        else{

    // _orderSource 1 酒店   2餐厅   5 车资
            if (_orderSource === 1 && _type === 2) {
              id = [51, 52]
            } else if (_orderSource === 2 && _type === 2) {
              id = [54, 55]
            } else if (_orderSource === 5 && _type === 2) {
              id = [49, 50, 57, 58]
            }
            // 门票
            else if (_orderSource === 3 && _type === 2) {
              id = [88, 89]
            }
        }
       
        TCIDARR.push(this.$route.query.id)
        let orderObj = {
          OrderID: 0,
          OrderSource: _orderSource,
          Obj: {},
          SourceID: this.$route.query.id,
          TCIDList: TCIDARR
        }
        id = id.length > 0 ? JSON.stringify(id) : null;
        this.$router.push({
          name: 'ChoiceAddFinancialDocuments',
          query: {
            'Type': _type,
            'path': 'teamRevenueExpenditure',
            'companyID': this.msgList[0].OutBranchId,
            'templateID': id,
            'blank': 'y',
            'orderObj': JSON.stringify(orderObj),
            'OrderSource': _orderSource,
          }
        });
      },
      getTuanMsg() {
        this.apipost('dmcstatistics_post_GetTeamMoneyBaseInfo', {
          TCID: this.$route.query.id
        }, res => {
          if (res.data.resultCode == 1) {
            this.msgList = res.data.data
          
          } else {}
        }, err => {})
      },
      getList(type) {
        this.apipost('Financial_post_GetDiJieFinanceList', {
          OrderResource: type,
          TCID: this.$route.query.id
        }, res => {
          if (res.data.resultCode == 1) {
            switch (type) {
              case 1:
                this.hotelList = res.data.data
                break;
              case 2:
                this.eatList = res.data.data
                break;
              case 3:
                this.ticketList = res.data.data
                break;
              case 5:
                this.busList = res.data.data
                break;
              case 14:
                this.otherList = res.data.data
                break;
              default:
                break;

            }
          } else {
            this.Error(res.data.message)
          }
        }, err => {})
      }
    },
    mounted() {
      this.LineId = this.$route.query.lineId
      this.getList(1)
      this.getList(2)
      this.getList(3)
      this.getList(5)
      this.getList(14)
      this.getTuanMsg()
    }
  }

</script>

<style>
  .teamRevenueExpenditureTotalTable {
    background: #eee;
    margin: 30px 0;
  }

  .teamRevenueExpenditureTotalTable th {
    background: #D1D1D1;
    font-weight: normal;
    font-size: 14px;
    height: 30px;
    color: #333;
  }

  .teamRevenueExpenditureTotalTable td {
    background: #fff;
    height: 36px;
    text-align: center;
    font-size: 12px;
  }

  .teamRevenueExpenditureTitle {
    border-left: 3px solid #E95252;
    text-indent: 10px;
    font-size: 14px;
    height: 14px;
    line-height: 14px;
    margin: 20px 0 10px 0;
  }

  .teamRevenueExpenditureTable {
    background: #eee;
    width: 100%;
    margin-bottom: 30px;
  }

  .teamRevenueExpenditureTable th {
    background: #D1D1D1;
    font-weight: normal !important;
    font-size: 14px;
    height: 30px;
    color: #333;
  }

  .teamRevenueExpenditureTable td {
    background: #fff;
    height: 36px;
    text-align: center;
    font-size: 12px;
  }

  .teamRevenueExpenditureTable .seeDetail:hover {
    text-decoration: underline;
    cursor: pointer;
  }

  .teamRevenueExpenditureTable .icon-excel {
    font-size: 30px;
    text-align: center;
    color: #41D2A1;
    vertical-align: middle;
  }

  .teamRevenueExpenditureTable .vorcherInosImg {
    width: 30px;
    height: 30px;
    cursor: pointer;
    vertical-align: middle;
    margin-right: 5px;
  }

</style>
