- 添加 .dockerignore 和 .env.example 配置文件 - 添加 .gitignore 忽略规则配置 - 创建服务端代理API路由(_file、_modules、_server) - 集成 Ant Design Vue 组件库并配置SSR样式提取 - 定义API响应类型封装 - 创建基础布局组件(blank、console) - 实现应用中心页面和组件(AppsCenter) - 添加文章列表测试页面 - 配置控制台导航菜单结构 - 实现控制台头部组件 - 创建联系页面表单
92 lines
3.3 KiB
Vue
92 lines
3.3 KiB
Vue
<template>
|
||
<div class="mx-auto max-w-screen-xl px-4 py-12">
|
||
<a-typography-title :level="1" class="!mb-2">产品矩阵</a-typography-title>
|
||
<a-typography-paragraph class="!text-gray-600 !mb-8">
|
||
面向不同业务场景的可售卖产品,支持套餐化售卖、支付即开通、模板/插件加购与私有化交付。
|
||
</a-typography-paragraph>
|
||
|
||
<a-row :gutter="[16, 16]">
|
||
<a-col v-for="p in products" :key="p.title" :xs="24" :md="12" :lg="8">
|
||
<a-card :title="p.title">
|
||
<template #extra>
|
||
<a-tag v-if="p.recommend" color="green">推荐</a-tag>
|
||
</template>
|
||
<a-typography-paragraph class="!text-gray-600">
|
||
{{ p.desc }}
|
||
</a-typography-paragraph>
|
||
<div class="flex flex-wrap gap-2">
|
||
<a-tag v-for="t in p.tags" :key="t">{{ t }}</a-tag>
|
||
</div>
|
||
<div class="mt-4">
|
||
<a-button type="link" @click="navigateTo('/contact')">咨询开通</a-button>
|
||
</div>
|
||
</a-card>
|
||
</a-col>
|
||
</a-row>
|
||
|
||
<a-card class="mt-10" :bordered="false" style="background: #f0f5ff">
|
||
<a-row :gutter="[16, 16]" align="middle">
|
||
<a-col :xs="24" :md="16">
|
||
<a-typography-title :level="3" class="!mb-1">需要上架你的专属产品?</a-typography-title>
|
||
<a-typography-paragraph class="!mb-0 !text-gray-600">
|
||
我们可基于平台能力为你定制产品组合、套餐定价、开通初始化与交付流程。
|
||
</a-typography-paragraph>
|
||
</a-col>
|
||
<a-col :xs="24" :md="8" class="flex md:justify-end">
|
||
<a-button type="primary" size="large" @click="navigateTo('/contact')">马上联系</a-button>
|
||
</a-col>
|
||
</a-row>
|
||
</a-card>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { usePageSeo } from '@/composables/usePageSeo'
|
||
|
||
usePageSeo({
|
||
title: '产品矩阵 - 套餐售卖 / 支付即开通 / 模板&插件加购',
|
||
description: '企业官网、电商、小程序等产品矩阵,支持套餐化售卖、支付即开通、模板/插件加购与私有化交付。',
|
||
path: '/products'
|
||
})
|
||
|
||
const products = [
|
||
{
|
||
title: '企业官网',
|
||
recommend: true,
|
||
desc: '品牌展示与获客转化,支持多模板、多语言、SEO 与可视化配置。',
|
||
tags: ['模板', 'SEO', '多语言', '私有化']
|
||
},
|
||
{
|
||
title: '电商系统',
|
||
recommend: true,
|
||
desc: '商品/订单/支付/营销基础能力,插件化扩展,支持多端触达。',
|
||
tags: ['支付', '插件', '营销', '多租户']
|
||
},
|
||
{
|
||
title: '小程序/公众号',
|
||
recommend: false,
|
||
desc: '多端渠道接入与统一管理,适配常见内容与电商场景。',
|
||
tags: ['多端', '渠道', '可扩展']
|
||
},
|
||
{
|
||
title: '行业门户',
|
||
recommend: false,
|
||
desc: '内容栏目体系、推荐与搜索能力,适配资讯/政企/协会等门户需求。',
|
||
tags: ['内容管理', '栏目', '审计']
|
||
},
|
||
{
|
||
title: '管理后台',
|
||
recommend: false,
|
||
desc: '多租户管理、角色权限、组织架构与可扩展菜单体系。',
|
||
tags: ['权限', '多租户', '审计']
|
||
},
|
||
{
|
||
title: '模板/插件市场',
|
||
recommend: false,
|
||
desc: '支持模板与插件购买、授权与更新,形成生态与增值体系。',
|
||
tags: ['市场', '授权', '更新', '变现']
|
||
}
|
||
]
|
||
</script>
|
||
|