<template>
  <div class="customer-management-information-content">
    <div v-for="(item, index) in itemData" :key="index" class="customer-data-list">
      <div class="ValueCls">
        <div class="keyValueCls">初筛日期：</div>
        <div class="dataInfoCls">{{ item.filter_date }}</div>
      </div>
      <div class="ValueCls">
        <div class="keyValueCls">初筛人：</div>
        <div class="dataInfoCls">{{ item.filter_id_displayname }}</div>
      </div>
      <div class="ValueCls">
        <div class="keyValueCls">禁入项初筛结果：</div>
        <div class="dataInfoCls" :style="{ color: getTextColor(item.deny_result_cnName) }">{{ item.deny_result_cnName }}</div>
      </div>
      <div class="ValueCls">
        <div class="keyValueCls">警示项初筛结果：</div>
        <div class="dataInfoCls" :style="{ color: getTextColor(item.warn_result_cnName) }">{{ item.warn_result_cnName }}</div>
      </div>
      <div class="ValueCls">
        <div class="keyValueCls">禁入项初筛概要：</div>
        <div class="dataInfoCls" :style="{ color: getTextColor(item.deny_result_cnName) }">
          <div class="dot" v-if="item.deny_desc != ''" v-for="(desc, index) in item.deny_desc.split('\n')" :key="index">
            <span>●</span><span>{{ desc }}</span>
          </div>
        </div>
      </div>
      <div class="ValueCls">
        <div class="keyValueCls">警示项初筛概要：</div>
        <div class="dataInfoCls" :style="{ color: getTextColor(item.warn_result_cnName) }">
          <div class="dot" v-if="item.warn_desc != ''" v-for="(desc, index) in item.warn_desc.split('\n')" :key="index">
            <span>●</span><span>{{ desc }}</span>
          </div>
        </div>
      </div>
<!--      <table-single-view :keyValue="keyValueDouble" :data="item"></table-single-view>-->
    </div>
  </div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import nettyApi from "@/constants/api/ms-netty/netty.api.ts";
import IF from "@/public/factory/InterFaceFactory";
import { NativeUI } from "@/public/ts/NativeUI";
import TableSingleView from '@/public/TableSingleView.vue';
/**
 * @Description 客户初筛历史
 * @Author JiangTao
 * @Date 2021-11-10 下午 04:21
 */
@Component({
  name: "PreliminaryScreeningOfHistory",
  components: { TableSingleView },
})
export default class PreliminaryScreeningOfHistory extends Vue {
  itemData = [];
  keyValueDouble = {
    filter_date: '初筛日期',
    filter_id_displayname: '初筛人',
    deny_result_cnName: '禁入项初筛结果',
    warn_result_cnName: '警示项初筛结果',
    deny_desc: '禁入项初筛概要',
    warn_desc: '警示项初筛概要',
  }
  activated() {
    this.selectCustInfo();
  }
  getTextColor(Tp: any) {
    let res = '';
    if (Tp == '通过') {
      res = 'green';
    } else if (Tp == '不通过') {
      res = 'red';
    }
    return res;
  };
  selectCustInfo() {
    let param = {
      cus_id: this.$store.getters.getCusInfo.cus_id || this.$route.params.cus_id,
      tc: nettyApi.TRADE_CODE.selectCSLS,
    };
    NativeUI.showWaiting("正在查询...");
    return IF.transferDataInter(nettyApi.commonRq, param).then((res: any) => {
      NativeUI.closeWaiting();
      if (res.rc == "1") {
        if (res.CusFilterHistoryList.length != 0) {
          this.itemData = res.CusFilterHistoryList;
          for (let i = 0; i < this.itemData.length; i++) {
            let data_one = (this.itemData[i] as any).deny_desc.substring((this.itemData[i] as any).deny_desc.length - 1);
            if (data_one == "\n") {
              (this.itemData[i] as any).deny_desc = (this.itemData[i] as any).deny_desc.substring(0, (this.itemData[i] as any).deny_desc.length - 1);
            }
            let data_two = (this.itemData[i] as any).warn_desc.substring((this.itemData[i] as any).warn_desc.length - 1);
            if (data_two == "\n") {
              (this.itemData[i] as any).warn_desc = (this.itemData[i] as any).warn_desc.substring(0, (this.itemData[i] as any).warn_desc.length - 1);
            }
          }
        }
      } else {
        NativeUI.toast(res.msg);
      }
    });
  }
}
</script>

<style scoped>
::v-deep .ValueCls {
  grid-template-columns: 1fr 7fr;
}
.ValueCls {
  padding: 8px 0;
  display: grid;
  grid-template-columns: 1fr 3fr;
}
.keyValueCls {
  width: 100%;
  color: #999999;
  text-align: right;
  font-size: 16px;
  white-space: nowrap;
}
.dataInfoCls {
  width: 100%;
  color: #333333;
  text-align: left;
  font-size: 16px;
  word-break: break-all;
}
.dot {
  height: 24px;
}
.customer-data-list {
  display: grid;
  grid-template-columns: repeat(2, 50%);
}
</style>