<template>
  <!-- 客户信息 -->
  <div class="card bg-white rounded p-4" @click="$emit('click')">
    <!-- 客户信息 -->
    <div class="flex items-start">
      <app-icon
        icon-name="avator"
        class-name="h-10 w-10 flex-shrink-0"
      />
      <div class="ml-2.5 overflow-hidden">
        <div class="truncate">客户名称客户名称客户名称客户名称客户名称客户名称</div>
        <div class="text-text-secondary text-xs">最后跟进时间：03-19 12:23</div>
      </div>
    </div>
    <!-- 跟进 -->
    <div class="flex pt-3.5 pb-2.5">
      <div class="text-text-secondary text-sm mr-5">跟进</div>
      <div class="">
        <div class="flex items-center">
          <app-icon
            icon-name="avator"
            class-name="h-5 w-5"
          />
          <div class="text-sm ml-1.5">姓名</div>
        </div>
      </div>
    </div>
    <!-- 标签 -->
    <div class="tags flex">
      <c-tag class="mr-1.5" label="客户" />
      <c-tag
        class="mr-1.5"
        label="重要"
        color="orange"
      />
      <c-tag
        label="洽谈"
        color="green"
      />
    </div>
  </div>
</template>

<script lang="ts">
import Vue from 'vue'

export default Vue.extend({
  name: 'ClientCard',
  components: {
    'app-icon': () => import('@/components/common/Icon.vue'),
    'c-tag': () => import('@/components/common/c-tag.vue')
  },
  data() {
    return {

    }
  },
  created() {
    // console.log(Mock, 'mock')
  },
  methods: {

  }
})
</script>

<style lang="less">

</style>
