<style>
  @import "../../../assets/css/newTravelManager.css";

</style>
<template>
  <div class="flexOne quoTation">
    <div class="query-box">
      <ul>
        <li>
          <span>
            <em>所属线路</em>
            <el-select v-model="queryData.LineId" class='w200' filterable :placeholder="$t('pub.pleaseSel')" @change="getLineTeamList()">
              <el-option :label="$t('pub.unlimitedSel')" :value='noLimit'></el-option>
              <el-option v-for="item in LineList" :label='item.LineName' :value='item.LineID' :key='item.LineID'>
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span>
            <em>所属系列</em>
            <el-select v-model="queryData.LineteamId" class='w200' filterable :placeholder="$t('pub.pleaseSel')">
              <el-option :label="$t('pub.unlimitedSel')" :value='noLimit'></el-option>
              <el-option v-for="item in LineTeamList" :label='item.LtName' :value='item.LtID' :key='item.LtID'>
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span>
            <em>报价单状态</em>
            <el-select v-model="queryData.TravelState" filterable :placeholder="$t('pub.pleaseSel')">
              <el-option :label="$t('pub.unlimitedSel')" :value='noLimit'></el-option>
              <el-option v-for='item in TravelStateList' :key="item.Id" :label="item.label" :value="item.Id">
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span>
            <em>开团状态</em>
            <el-select v-model="queryData.OpenState" filterable :placeholder="$t('pub.pleaseSel')">
              <el-option :label="$t('pub.unlimitedSel')" :value='noLimit'></el-option>
              <el-option v-for='item in OpenStateList' :key="item.Id" :label="item.label" :value="item.Id">
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <button class="hollowFixedBtn" @click="getList(),resetPageIndex()">查询</button>
        </li>
      </ul>
    </div>
    <div class="commonContent" v-loading="loading">
      <ul class="_content">
        <li v-for="item in dataList" :key="item.subCode" :data-id="item.ID">
          <div class="_left">
            <div class="QT_Style">
              <span v-if="item.IsDirect==1">直</span>
              <span v-else>非</span>
            </div>
            <div>
              <p class="quoListName" @click="getJourney(item.ID,item.Title)">
                <el-tooltip popper-class="max-w250" effect="dark" :content="item.Title" placement="top-start">
                  <span>{{item.Title}}</span>
                </el-tooltip>
              </p>
              <p class="Quo_Content"><i v-if="item.ProductRecommend" class="iconfont icon-richeng"></i>
                <span>{{item.ProductRecommend}}</span>
              </p>
            </div>
          </div>
          <div class="_cent">
            <div class="stayDays">{{item.DayNum}}天{{item.NightNum}}晚</div>
            <div class="">
              销售定价
              <el-popover popper-class="salsSetPrice" trigger="click">
                <div class="priceContentDiv">
                  <div v-for="salesItem in SalesPriceList">
                    <div>成人</div>
                    <div class="priceList">
                      <div>
                        <span class="pLeftPrice">同业会员：￥{{salesItem.B2BMemberPrice}}</span>
                        <span class="pRightPrice">同业：￥{{salesItem.B2BPrice}}</span>
                      </div>
                      <div class="priceDivCon">
                        <span class="pLeftPrice">直客会员：￥{{salesItem.B2CMemberPrice}}</span>
                        <span class="pRightPrice">直客：￥{{salesItem.B2CPrice}}</span>
                      </div>
                    </div>
                    <div>小孩</div>
                    <div class="priceList">
                      <div>
                        <span class="pLeftPrice">占床：￥{{salesItem.ChildNeedPrice}}</span>
                        <span class="pRightPrice">不占床：￥{{salesItem.ChildNoNeedPrice}}</span>
                      </div>
                      <div class="priceDivCon">
                        <span class="pLeftPrice">婴儿：￥{{salesItem.BabyPrice}}</span>
                        <span class="pRightPrice">附加费：￥{{salesItem.BabyChargePrice}}</span>
                      </div>
                    </div>
                    <div>老人</div>
                    <div class="priceList">
                      <div>
                        <span class="pLeftPrice">附加费：￥{{salesItem.OldManChargePrice}}</span>
                      </div>
                    </div>
                    <div>杂费</div>
                    <div class="priceList">
                      <div>
                        <span class="pLeftPrice">签证：￥{{salesItem.VisaPrice}}</span>
                        <span class="pRightPrice">单房差：￥{{salesItem.SingleRoomPrice}}</span>
                      </div>
                      <div class="priceDivCon">
                        <span class="pLeftPrice">杂费：￥{{salesItem.OtherPrice}}</span>
                      </div>
                    </div>
                    <div>单项报价</div>
                    <div class="priceList">
                      <div>
                        <span class="pLeftPrice">单地接：￥{{salesItem.SingleDMCPrice}}</span>
                      </div>
                    </div>
                    <div>优惠</div>
                    <div class="priceList">
                      <div>
                        <span class="pLeftPrice">同行返佣：￥{{salesItem.RebatePrice}}</span>
                        <span class="pRightPrice">早鸟优惠：￥{{salesItem.DiscountPrice}}</span>
                      </div>
                    </div>
                  </div>
                </div>
                <span slot="reference" class="diPrice" @click="getSalsPrice(item.ID)">{{item.SalesPrice}}<span class="qi">起</span></span>
              </el-popover>
            </div>
            <div class="QT_CodeNum">
              编号：{{item.ID}}
            </div>
          </div>
          <div class="_right">
            <div class="AuditUserInfo clearfix aa">
              <div class="AuditDanHeader">
                <img v-if="item.CreateUserPhoto" :src="item.CreateUserPhoto" alt="">
                <img v-else src="../../../assets/img/default_head_img.jpg" alt="">
              </div>
              <div class="AU_creatName">
                <div>{{item.CreateUserName}}</div>
              </div>
            </div>
            <div>
              <span>报价单状态</span>
              <span v-if="item.TravelState==1">草稿</span>
              <span v-else-if="item.TravelState==2">待审核</span>
              <span v-else-if="item.TravelState==3">审核通过</span>
              <span v-else-if="item.TravelState==4">审核拒绝</span>
              <span v-else-if="item.TravelState==5">已撤销</span>
            </div>
            <div>
            <span class="openGroup opbd" @click="goUrl('CoastPriceNew')">
              <el-tooltip class="item" effect="dark" content="报价单" placement="top-start" popper-class="max-w250">
                <i class="iconfont icon-web-icon-"></i>
              </el-tooltip>
            </span>
            </div>
          </div>
        </li>
      </ul>
      <div class="noData" v-show="noData">
        {{$t('system.content_noData')}}
      </div>
    </div>
    <el-pagination background @current-change="handleCurrentChange" :current-page.sync="queryData.currentPage" layout="total,prev, pager, next, jumper"
      :page-size="queryData.pageSize" :total="queryData.total">
    </el-pagination>
    <el-dialog custom-class='ComTeamPlan_info_box' :title="tripTitle" :visible.sync="outerVisible" center>
      <commonTeamInfo ref="comDialog"></commonTeamInfo>
    </el-dialog>
  </div>
</template>
<script>
  import commonTeamInfo from "../../commonPage/commonTeamInfo.vue";

  export default {
    data() {
      return {
        queryData: {
          LineId: 0,
          LineteamId: 0,
          TravelState: 0,
          OpenState: 0,
          PageIndex: 1,
          PageSize: 10,
          total: 0,
          currentPage: 1
        },
        loading: true,
        //报价单状态
        TravelStateList: [{
            Id: 1,
            label: "草稿"
          },
          {
            Id: 2,
            label: "待审核"
          },
          {
            Id: 3,
            label: "审核通过"
          },
          {
            Id: 4,
            label: "审核拒绝"
          },
          {
            Id: 5,
            label: "已撤销"
          }
        ],
        //开团状态
        OpenStateList: [{
            Id: 1,
            label: "已开团"
          },
          {
            Id: 2,
            label: "未开团"
          }
        ],
        //线路列表
        LineList: "",
        noLimit: 0,
        //系列列表
        LineTeamList: "",
        //是否有数据
        noData: false,
        dataList: "",
        SalesPriceList: [],
        CostList: [],
        outerVisible: false,
        tripTitle: ""
      };
    },
    components: {
      commonTeamInfo: commonTeamInfo
    },
    methods: {
      handleCurrentChange(val) {
        this.queryData.pageIndex = val;
        this.getList();
      },
      resetPageIndex() {
        this.queryData.pageIndex = 1;
        this.queryData.currentPage = 1;
      },
      //获取线路列表
      getLineList() {
        this.apipost("line_post_GetList", {}, res => {
          if (res.data.resultCode == 1) {
            this.LineList = res.data.data;
          }
        });
      },
      //获取系列列表
      getLineTeamList() {
        this.queryData.LineteamId = 0;
        let msg = {
          lineID: this.queryData.LineId,
          isTOOP: 1
        };
        this.apipost("team_post_GetList", msg, res => {
          if (res.data.resultCode == 1) {
            this.LineTeamList = res.data.data;
          }
        });
      },
      //初始化表格数据
      getList() {
        this.loading = true;
        this.apipost("travel_get_GetTravelQuotationList", this.queryData, res => {
          this.loading = false;
          if (res.data.resultCode == 1) {
            this.queryData.total = res.data.data.count;
            this.noData = !this.queryData.total > 0;
            this.dataList = res.data.data.pageData;
          }
        });
      },
      //点击销售定价获取数据
      getSalsPrice(ID) {
        this.SalesPriceList = [];
        this.apipost(
          "travel_get_GetTravelQuotationPrice", {
            ID: ID
          },
          res => {
            if (res.data.resultCode == 1) {
              this.SalesPriceList = res.data.data;
            }
          }
        );
      },
      //点击地接成本获取数据
      getCostPrice(ID) {
        this.CostList = [];
        this.apipost(
          "travel_get_GetTravelOfferPrice", {
            ID: ID
          },
          res => {
            if (res.data.resultCode == 1) {
              if (res.data.data[0] != undefined || res.data.data[0] != null) {
                let cost = res.data.data[0];
                let dayNum = 0;
                cost.LocalOfferPriceList.forEach(x => {
                  if (x.DayNum > dayNum) {
                    dayNum = x.DayNum;
                  }
                });
                let offerPriceList = [];
                for (let i = 1; i <= dayNum; i++) {
                  let dayOfferPriceList = [];
                  let totalPrice = 0;
                  cost.LocalOfferPriceList.forEach(x => {
                    if (x.DayNum == i) {
                      dayOfferPriceList.push(x);
                      totalPrice += x.OfferPrice;
                    }
                  });
                  let offerPrice = {
                    day: i,
                    dayOfferPriceList,
                    totalPrice
                  };
                  offerPriceList.push(offerPrice);
                }
                cost["offerPriceList"] = offerPriceList;
                this.CostList.push(cost);
              }
            }
          }
        );
      },
      //删除报价单
      delQuotation(ID) {
        var that = this;
        this.Confirm("删除过后数据不能恢复，请谨慎操作", function () {
          let msg = {
            ID: ID,
          };
          that.apipost(
            "travel_post_RemoveConfig",
            msg,
            res => {
              if (res.data.resultCode == 1) {
                that.Success("删除成功");
                that.getList();
              } else {
                that.Error(res.data.message);
              }
            },
            null
          );
        });
      },
      getJourney(id, title) {
        //根据ID 获取行程内容
        var that = this;
        this.tripTitle = title;
        this.$nextTick(() => {
          that.$refs.comDialog.GetTrip(id);
        });
        that.outerVisible = true;
      },
      //调整到产品列表
      goUrl(path) {
        this.$router.push({
          path: path,
          query: {
            blank:'y',
            tab:'报价单'
          }
        });
      },
    },

    mounted() {
      this.getLineList();
      this.getList();
      let isNoOffer = this.$route.params.isNoOffer;
      if (isNoOffer) {
        this.Warning("行程中含有未完善的报价信息，请在需求中心查看！");
      }
    },
    created() {
      if (this.$route.query.hasOwnProperty("cache")) {
        if (this.$store.state.pageCondition != null) {
          this.queryData = this.$store.state.pageCondition;
        }
      }
      this.getList();
    }
  };

</script>