32 lines
974 B
Vue
32 lines
974 B
Vue
<script setup lang="ts">
|
|
// 用默认插槽写富内容：把 Radio 当「卡片选择器」用
|
|
import { ref } from 'vue'
|
|
import { G3Radio, G3RadioGroup } from '@g3soft/ui'
|
|
|
|
const plan = ref('pro')
|
|
</script>
|
|
|
|
<template>
|
|
<G3RadioGroup v-model="plan" style="align-items: flex-start; gap: 12px">
|
|
<G3Radio
|
|
value="basic"
|
|
style="flex: 1; padding: 12px; border: 1px solid #d9d9d9; border-radius: 8px"
|
|
>
|
|
<span style="display: block">
|
|
<strong>基础版</strong>
|
|
<span style="display: block; color: #6b7280; font-size: 12px">单项目 · 1GB 存储</span>
|
|
</span>
|
|
</G3Radio>
|
|
|
|
<G3Radio
|
|
value="pro"
|
|
style="flex: 1; padding: 12px; border: 1px solid #d9d9d9; border-radius: 8px"
|
|
>
|
|
<span style="display: block">
|
|
<strong>专业版</strong>
|
|
<span style="display: block; color: #6b7280; font-size: 12px">多项目 · 100GB 存储</span>
|
|
</span>
|
|
</G3Radio>
|
|
</G3RadioGroup>
|
|
</template>
|