<template>
  <view v-if="features && features.length > 0" class="rounded-xl bg-white p-4 shadow">
    <view class="mb-3 text-base font-semibold flex items-center text-gray-800">
      <view class="w-1 h-5 rounded-full mr-2 bg-primary" />
      报告包含内容
    </view>
    <view class="grid grid-cols-4 gap-2">
      <view
        v-for="(feature, index) in features"
        :key="feature.id || index"
        class="aspect-square rounded-xl text-center text-sm text-gray-700 font-medium flex flex-col items-center justify-center p-2 bg-gray-50"
      >
        <text class="text-xs leading-tight break-all">{{ feature.name }}</text>
      </view>
    </view>
  </view>
</template>

<script setup>
defineProps({
  features: {
    type: Array,
    default: () => [],
  },
})
</script>
