<template>
  <div class="d-page d-flex flex-column">
    <title-bar title="客户近三年评级情况" @clickLeft="onClick">
      <van-icon slot="left" name="cross" size="24" />
    </title-bar>
    <!-- <div class="h-scroller"> -->
    <!-- 当前内部等级 -->
    <anchor-nav ref="anchorNav" :navList="navList">
      <template>
        <div slot="internalLevel">
          <div class="level-box">
            <current-internal-rating
              :comData="com_data"
            ></current-internal-rating>
          </div>
        </div>
        <div slot="threeYearLevel">
          <div class="level-box">
            <internal-rating-in-the-past-three-years :threeYData="threeYearData"></internal-rating-in-the-past-three-years>
          </div>
        </div>
      </template>
    </anchor-nav>
    <!-- </div> -->

    <!-- </div> -->
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import TitleBar from "@/components/general/TitleBar.vue";
import nettyApi from "@/constants/api/ms-netty/netty.api.ts";
import IF from "@/public/factory/InterFaceFactory";
import { NativeUI } from "@/public/ts/NativeUI";
import CurrentInternalRating from "@/components/customer-information/business-application-status/customer-ratings/CurrentInternalRating.vue";
import InternalRatingInThePastThreeYears from "@/components/customer-information/business-application-status/customer-ratings/InternalRatingInThePastThreeYears.vue";
/**
 * @Description 客户近三年评级情况
 * @Author JiangTao
 * @Date 2021-11-10 下午 03:16
 */
@Component({
  name: "CustomerRatings",
  components: {
    TitleBar,
    CurrentInternalRating,
    InternalRatingInThePastThreeYears,
  },
})
export default class CustomerRatings extends Vue {
  pageTitle = ""; // 页面标题
  indexList = ["当前内部评级", "近三年内部评级情况"];
  navList = [
    { key: "internalLevel", titleText: "当前内部评级" },
    { key: "threeYearLevel", titleText: "近三年内部评级情况" },
  ];
  no_data = true; //暂无数据
  //今年评级数据
  data: any = {};
  //当前年度评级占比
  num_current = 0;
  //前一年度评级占比
  num_one = 0;
  //前二年度评级占比
  num_two = 0;
  //前三年度评级占比
  num_three = 0;
  //前一年
  one_year: any = "";
  //前二年
  two_year: any = "";
  //前三年
  three_year: any = "";
  com_data: any = {
    //存储当前内部评价信息
    date: "",
    grade: "",
    gradeName: "",
  };
  threeYearData: any = {
    //存储三年内部评价信息
    oneYear: "", //前一年时间
    twoYear: "",
    threeYear: "",
    oneYearBefore: "",
    oneYearBefore_cnName: "",
    thrYearBefore: "",
    thrYearBefore_cnName: "",
    twoYearBefore: "",
    twoYearBefore_cnName: "",
  };

  // color_current = "";
  // color_one = "";
  // color_two = "";
  // color_three = "";

  onClick() {
    this.$router.go(-1);
  }
  mounted() {
    this.selectCustInfo();
  }
  activated() {
    this.pageTitle = this.$route.meta?.name;
    this.selectCustInfo();
  }
  selectCustInfo(pageNo = 1) {
    let param = {
      cus_id: this.$store.getters.getCusInfo.cus_id,
      tc: nettyApi.TRADE_CODE.selectPJQK,
    };
    NativeUI.showWaiting("正在查询...");
    IF.transferDataInter(nettyApi.commonRq, param).then((res: any) => {
      NativeUI.closeWaiting();
      if (res.rc === "1") {
        this.no_data = false;
        //年份判断
        let com_crd_dt = res.com_crd_dt;
        if (!com_crd_dt || com_crd_dt == "") {
          com_crd_dt = new Date().getFullYear();
        } else {
          com_crd_dt = res.com_crd_dt.substring(0, 4);
        }
        this.one_year = com_crd_dt - 1;
        this.two_year = com_crd_dt - 2;
        this.three_year = com_crd_dt - 3;
        //当前内部评价日期
        this.com_data.date = res.com_crd_dt;
        this.com_data.grade = res.com_crd_grade;
        this.com_data.gradeName = res.com_crd_grade_cnName;
        //近三年内部评价日期
        this.threeYearData.oneYear = this.one_year;
        this.threeYearData.twoYear = this.two_year;
        this.threeYearData.threeYear = this.three_year;
        this.threeYearData.oneYearBefore = res.oneYearBefore;
        this.threeYearData.oneYearBefore_cnName = res.oneYearBefore_cnName;
        this.threeYearData.twoYearBefore = res.twoYearBefore;
        this.threeYearData.twoYearBefore_cnName = res.twoYearBefore_cnName;
        this.threeYearData.thrYearBefore = res.thrYearBefore;
        this.threeYearData.thrYearBefore_cnName = res.thrYearBefore_cnName;
      } else {
        NativeUI.toast(res.msg);
      }
    });
  }
}
</script>

<style scoped>
/*右侧导航栏 , 控制导航位置*/
::v-deep .van-index-bar__sidebar {
  top: 130px !important;
  right: 5px !important;
  transform: unset;
}
.level-box {
  margin-left: 5%;
  width: 80%;
}
</style>