<template>
  <div class="cardclewContent assignAwaitDetail">
    <div class="info">
      客资线索：
      <!-- 待分配页面和跟进页面展示不一样 -->
      <template v-if="source == 'assignPage'">
        <span>{{ infoData.jzCustomerDescription }}</span>
      </template>
      <template v-else>
        <span v-if="infoData.cid == 3">申请代理</span>
        <span v-if="infoData.cid == 4">开设门店</span>
        <span v-if="infoData.cid == 5">批量采购</span>
        <span v-if="infoData.cid == 7">家装客资</span>
      </template>
    </div>
    <!-- 跟进页面增加客资类型 -->
    <div class="info" v-if="source == 'JZfollowUp'">
      客资类型：
      <span v-if="customerClassify.length && infoData.customerClassify">{{
        filterClassify(infoData.customerClassify)
      }}</span>
    </div>
    <div class="info">公司名称：{{ infoData.clueCompanyName }}</div>
    <div class="info">角色：{{ infoData.capacity }}</div>
    <div class="info">区域：{{ infoData.companyName }}</div>
    <div class="info">省：{{ infoData.provinceName }}</div>
    <div class="info">市：{{ infoData.cityName }}</div>
    <div class="info">区/县：{{ infoData.countryName }}</div>
    <div class="info">姓名：{{ infoData.name }}</div>
    <div class="info">
      来电电话：<a
        style="color: #0057ba; font-weight: bold; text-decoration: underline"
        :href="'tel:' + infoData.phone"
        >{{ infoData.phone }}<van-icon name="phone"
      /></a>
    </div>
    <div class="info" v-if="infoData.createTime">首次接入时间：{{ infoData.createTime }}</div>
    <slot></slot>
  </div>
</template>

<script>
import { getDictOption } from '@/api/index';
export default {
  name: 'assignAwaitDetail',
  props: {
    infoData: {
      type: Object,
      default: {},
    },
    source: {
      // assignPage 拥有家装分配权限
      type: String,
    },
  },
  data() {
    return {
      customerClassify: [],
    };
  },
  watch: {
    source: {
      handler(val) {
        if (val == 'JZfollowUp') {
          this.getCustomerClassify();
        }
      },
      immediate: true,
    },
  },
  created() {},
  methods: {
    async getCustomerClassify() {
      let option = await getDictOption({}, 'customer_classify');
      this.customerClassify = option.data || [];
    },
    filterClassify(customerClassify) {
      let item = this.customerClassify.find((val) => val.dictValue == customerClassify);
      return item.dictLabel || '';
    },
  },
};
</script>
<style scoped lang="scss">
.cardclewContentCell {
  margin: 0 10px;
}
.cardclewContent {
  background: #fff;
  box-sizing: border-box;
  padding: 10px 16px;
  margin: 6px 10px 10px;
}
.cardclewContent .info {
  font-size: 14px;
  color: #444;
  line-height: 28px;
}
.cardclewContent .title p {
  padding: 0;
  margin: 0;
}
.cardclewContent .title .textLeft {
  display: inline-block;
  padding-bottom: 10px;
}
</style>
