<template>
  <div class="describe mx-auto">
    <div class="box flex p-5">
      <IconVue
        name="icon-chanpinjieshao"
        size="30"
        color="RGBA(62, 79, 175, 1)"
      />
      <div class="ml-3">
        <div class="title">产品介绍</div>
        <div class="content whitespace-pre-wrap mt-2.5">
          {{ products }}
        </div>
      </div>
    </div>
    <div class="box flex p-5">
      <IconVue
        name="icon-chanpintedian"
        size="30"
        color="RGBA(62, 79, 175, 1)"
      />
      <div class="ml-3">
        <div class="title">产品特点</div>
        <div class="content whitespace-pre-wrap mt-2.5">
          {{ features }}
        </div>
      </div>
    </div>
    <div class="box flex p-5">
      <IconVue name="icon-shiyongkehu" size="30" color="RGBA(62, 79, 175, 1)" />
      <div class="ml-3">
        <div class="title">适用客户</div>
        <div class="content whitespace-pre-wrap mt-2.5">
          {{ apply_to }}
        </div>
      </div>
    </div>
    <div class="box flex p-5">
      <IconVue
        name="icon-shenqingtiaojian"
        size="30"
        color="RGBA(62, 79, 175, 1)"
      />
      <div class="ml-3">
        <div class="title">申请条件</div>
        <div class="content whitespace-pre-wrap mt-2.5">
          {{ apply_cond }}
        </div>
      </div>
    </div>
    <div class="box flex p-5">
      <IconVue
        name="icon-tijiaotiaojian"
        size="30"
        color="RGBA(62, 79, 175, 1)"
      />
      <div class="ml-3">
        <div class="title">提交条件</div>
        <div class="content whitespace-pre-wrap mt-2.5">
          {{ submit_cond }}
        </div>
      </div>
    </div>
  </div>
</template>
<script lang="ts" setup>
import IconVue from "@/components/common/Icon.vue";
import { onMounted } from "@vue/runtime-core";

const props = defineProps({
  products: {
    type: String,
    required: true,
  },
  features: {
    type: String,
    required: true,
  },
  apply_to: {
    type: String,
    required: true,
  },
  apply_cond: {
    type: String,
    required: true,
  },
  submit_cond: {
    type: String,
    required: true,
  },
});
</script>
<style lang="less" scoped>
.describe {
  width: 335px;
  background: #ffffff;
  border-radius: 20px;
  .box {
    border-bottom: 1px solid #eaf0ff;
    &:last-of-type {
      border-bottom: 0;
    }
  }
  .title {
    font-size: 14px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #1b1f37;
  }
  .content {
    font-size: 14px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #1b1f37;
    line-height: 24px;
  }
}
</style>
