<template>
  <div class="flex flex-col h-full">
    <div class="bg-white info flex-1 overflow-y-auto cellnormall">
      <van-cell title="线索名称" :value="info.clueName" />
      <van-cell title="线索来源" :value="info.clueSourceValue" />
      <van-cell title="电话号码" :value="info.phone" />
      <van-cell title="邮箱" :value="info.email" />
      <van-cell title="客户行业" :value="info.customerIndustryValue" />
      <van-cell title="客户级别" :value="info.customerLevelValue" />
      <van-cell title="客户地址" :value="info.address" />
      <van-cell title="负责人">
        <template #default>
          <TranslationComponent :openId="info.inchargerName" />
        </template>
      </van-cell>
      <van-cell title="备注" :value="info.remark" />
    </div>
    <div class="bottomButton">
      <van-button type="primary" class="w-full block">转移线索</van-button>
      <van-button type="warning" class="w-full block">转为商机</van-button>
    </div>
  </div>
</template>

<script setup>
import { ref } from 'vue';
import { useLifecycle } from '@hooks/useCommon.js';

const props = defineProps({
  info: {
    type: Object,
    required: true,
    default: () => ({})
  }
})

useLifecycle({
  load: () => {
    // 添加加载逻辑
  }
});
</script>

<style lang='scss' scoped>
  .bottomButton {
    margin: 0 14px;
    padding-bottom: 30px;
    :deep(.van-button) {
      margin-bottom: 20px;
    }
  }
  .info {
    margin: 8px 14px 30px 14px;
    padding: 14px;
  }
</style>