优化完善套餐购买页面

src/components/composites/purchase/shared/feature-list.tsx

@@ -0,0 +1,35 @@
+'use client'
+
+import Image from 'next/image'
+import check from '../_assets/check.svg'
+
+const defaultFeatures = [
+  '支持高并发提取',
+  '指定省份、城市或混播',
+  '账密＋白名单验证',
+  '完备的API接口',
+  'IP时效3-30分钟(可定制)',
+  'IP资源定期筛选',
+  '包量/包时计费方式',
+  '每日去重量：500万',
+]
+
+export function FeatureList(props: {
+  items?: string[]
+}) {
+  const items = props.items || defaultFeatures
+
+  return (
+    <div className="space-y-6">
+      <h3>产品特性</h3>
+      <div className="grid grid-cols-2 md:grid-cols-3 auto-rows-fr gap-4 md:gap-y-6">
+        {items.map(item => (
+          <p key={item} className="flex gap-2 items-center">
+            <Image src={check} alt="check" aria-hidden className="w-4 h-4"/>
+            <span className="text-sm text-gray-500">{item}</span>
+          </p>
+        ))}
+      </div>
+    </div>
+  )
+}