<template>
  <view class="mt-[30rpx] bg-white rounded-[20rpx] p-[30rpx]">
    <TitleBar :title="title" />
    <view class="text-[26rpx] text-[#666] mt-[10rpx] text-left">
      <text
        class="text-[22rpx] px-[12rpx] py-[4rpx] rounded-[20rpx] bg-[rgba(250,142,35,0.15)] text-[#FA8E23]"
      >
        {{ item.notes }}
      </text>
      <view class="mt-[20rpx] text-left">
        <view class="text-[#000] text-[26rpx] font-700">学习风格表现</view>
        <view class="mt-[10rpx]" v-for="(sonItem, index) in item.learning_performance" :key="index">
          {{ sonItem }}
        </view>
      </view>
      <view class="mt-[20rpx] text-left">
        <view class="text-[#000] text-[26rpx] font-700">学习风格特点</view>
        <view class="mt-[10rpx]" v-for="(sonItem, index) in item.features" :key="index">
          {{ sonItem }}
        </view>
      </view>
    </view>
  </view>
</template>
<script lang="ts" setup>
import TitleBar from './TitleBar.vue'
defineProps({
  item: {
    type: Object,
    default: () => {},
  },
  title: {
    type: String,
    default: '',
  },
})
</script>
