gxwebsoft/template-10586
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(homepage): 更新首页内容为破产事务服务平台

Browse Source 
- 将默认租户ID从10398更新为10586
- 更改网站名称为"行于思破产事务服务平台"
- 替换首页为破产事务相关的新闻、公告和申报系统
- 更新头部导航栏和底部信息显示新的网站名称
- 修改应用布局背景为透明
- 更新PM2配置中的应用名称和端口设置
- 调整导航栏结构，增加搜索功能和品牌展示区域
This commit is contained in:
赵忠林
2026-01-21 13:03:01 +08:00
parent 5e26fdc7fb
commit 9a1dcad104
11 changed files with 880 additions and 251 deletions
Download Patch File Download Diff File Expand all files Collapse all files

650
app/pages/index.vue
View File

@@ -1,189 +1,507 @@
<template>
<div>
<section class="relative overflow-hidden bg-gradient-to-b from-gray-950 to-gray-900 text-white">
<div class="pointer-events-none absolute left-1/2 top-[-140px] h-[420px] w-[900px] -translate-x-1/2 rounded-full bg-green-500/20 blur-3xl" />
<div class="mx-auto max-w-screen-xl px-4 py-16 sm:py-24 relative">
<a-tag color="orange" class="mb-6">v3.0 版本发布</a-tag>
<a-typography-title :level="1" class="!text-white !mb-4">
软件开发平台：SaaS + 私有化 + 模板/插件生态
</a-typography-title>
<a-typography-paragraph class="!text-gray-300 !text-lg !mb-8">
面向企业官网、电商、小程序等业务场景，提供多租户架构与模块化能力；客户下单后自动创建租户、初始化模块与基础数据，实现“支付即开通”。
</a-typography-paragraph>
<a-space size="middle" wrap>
<a-button type="primary" size="large" @click="navigateTo('/contact')">预约演示</a-button>
<a-button size="large" @click="navigateTo('/flow')">查看开通流程</a-button>
<a-button size="large" @click="navigateTo('/deploy')">私有化部署</a-button>
</a-space>
<a-row class="mt-10" :gutter="[16, 16]">
<a-col :xs="12" :md="6">
<a-statistic title="平台定位" value="SaaS" />
</a-col>
<a-col :xs="12" :md="6">
<a-statistic title="交付模式" value="私有化" />
</a-col>
<a-col :xs="12" :md="6">
<a-statistic title="能力" value="模板/插件" />
</a-col>
<a-col :xs="12" :md="6">
<a-statistic title="开通" value="自动化" />
</a-col>
</a-row>
</div>
</section>
<section class="mx-auto max-w-screen-xl px-4 py-14">
<a-typography-title :level="2" class="!mb-2">核心能力</a-typography-title>
<a-typography-paragraph class="!text-gray-500 !mb-8">
用一套平台能力，覆盖产品售卖、交付开通、运营升级与生态变现。
</a-typography-paragraph>
<a-row :gutter="[16, 16]">
<a-col v-for="item in capabilities" :key="item.title" :xs="24" :md="12" :lg="8">
<a-card :title="item.title">
<template #extra>
<a-tag color="green">{{ item.badge }}</a-tag>
</template>
<a-typography-paragraph class="!mb-0 !text-gray-600">
{{ item.desc }}
</a-typography-paragraph>
</a-card>
</a-col>
</a-row>
</section>
<section class="bg-gray-50">
<div class="mx-auto max-w-screen-xl px-4 py-14">
<a-row :gutter="[24, 24]">
<a-col :xs="24" :lg="12">
<a-typography-title :level="2" class="!mb-2">支付即开通</a-typography-title>
<a-typography-paragraph class="!text-gray-600 !mb-6">
客户选择产品并支付后，平台自动完成：创建租户、初始化模块、写入默认配置与基础数据、生成管理员账号并交付访问入口。
</a-typography-paragraph>
<a-button type="primary" @click="navigateTo('/flow')">查看全流程</a-button>
</a-col>
<a-col :xs="24" :lg="12">
<a-card>
<a-steps direction="vertical" :current="-1" size="small">
<a-step title="选择产品/套餐" description="支持产品矩阵、模板/插件加购、增值项" />
<a-step title="下单支付" description="支付成功触发开通任务编排" />
<a-step title="创建租户" description="租户隔离、域名/应用信息绑定、管理员生成" />
<a-step title="模块初始化" description="按所购产品加载模块与菜单权限，写入基础数据/示例数据" />
<a-step title="交付上线" description="SaaS 直接可用；私有化交付镜像/部署文档/验收清单" />
</a-steps>
</a-card>
</a-col>
</a-row>
</div>
</section>
<section class="mx-auto max-w-screen-xl px-4 py-14">
<a-typography-title :level="2" class="!mb-2">模板与插件生态</a-typography-title>
<a-typography-paragraph class="!text-gray-500 !mb-8">
通过模板加速交付，通过插件扩展能力；支持购买、授权、更新与版本管理。
</a-typography-paragraph>
<a-tabs>
<a-tab-pane key="template" tab="模板">
<a-row :gutter="[16, 16]">
<a-col :xs="24" :md="12">
<a-card title="行业模板">
<a-typography-paragraph class="!mb-0 !text-gray-600">
按行业/场景提供成套页面与配置，支持一键套用、二次编辑与多版本管理。
</a-typography-paragraph>
</a-card>
</a-col>
<a-col :xs="24" :md="12">
<a-card title="交付标准化">
<a-typography-paragraph class="!mb-0 !text-gray-600">
模板与初始化脚本配套，让“开通后的默认站点”可直接验收。
</a-typography-paragraph>
</a-card>
</a-col>
</a-row>
</a-tab-pane>
<a-tab-pane key="plugin" tab="插件">
<a-row :gutter="[16, 16]">
<a-col :xs="24" :md="12">
<a-card title="能力扩展">
<a-typography-paragraph class="!mb-0 !text-gray-600">
支付、会员、营销、工单、数据统计等能力按需加购，随买随用。
</a-typography-paragraph>
</a-card>
</a-col>
<a-col :xs="24" :md="12">
<a-card title="升级与授权">
<a-typography-paragraph class="!mb-0 !text-gray-600">
支持版本升级、授权校验、到期续费与灰度发布。
</a-typography-paragraph>
</a-card>
</a-col>
</a-row>
</a-tab-pane>
</a-tabs>
<div class="mt-6">
<a-button @click="navigateTo('/market')">了解模板/插件市场</a-button>
</div>
</section>
<section class="bg-gray-950 text-white">
<div class="mx-auto max-w-screen-xl px-4 py-12 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
<div>
<div class="text-xl font-semibold">想快速搭建并交付一个可运营的产品？</div>
<div class="mt-1 text-gray-300">预约演示，我们将按你的业务场景给出方案与报价。</div>
<main class="home">
<section class="mx-auto max-w-screen-xl px-4 py-6">
<div class="grid grid-cols-12 gap-6">
<div class="col-span-12 lg:col-span-7">
<div class="panel">
<a-image :src="featured.image" :preview="false" class="featured-image" />
<div class="p-4">
<div class="featured-title">{{ featured.title }}</div>
<div class="featured-meta">{{ featured.date }}</div>
</div>
</div>
</div>
<div class="col-span-12 lg:col-span-5">
<div class="panel notice">
<div class="notice-head">
<div class="notice-title">
<NotificationOutlined />
公告
</div>
<a class="notice-more" href="#" @click.prevent>更多</a>
</div>
<div class="notice-list">
<a
v-for="n in notices"
:key="n.title"
class="notice-item"
href="#"
@click.prevent
>
<div class="notice-item-title">{{ n.title }}</div>
<div class="notice-item-desc">{{ n.desc }}</div>
</a>
</div>
</div>
</div>
</div>
<div class="mt-6 grid grid-cols-12 gap-6">
<div class="col-span-12 lg:col-span-7">
<div class="panel">
<div class="section-pill">
<span class="pill-left">
<FileTextOutlined />
申报指南
</span>
<span class="pill-right">Declaration Guide</span>
</div>
<div class="mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2">
<a-card
v-for="g in guides"
:key="g.title"
class="guide-card"
:bordered="true"
hoverable
@click="navigateTo(g.to)"
>
<a-space>
<a-avatar :size="44" class="guide-icon">
<component :is="g.icon" />
</a-avatar>
<div>
<div class="guide-title">{{ g.title }}</div>
<div class="guide-desc">{{ g.desc }}</div>
</div>
</a-space>
</a-card>
</div>
</div>
</div>
<div class="col-span-12 lg:col-span-5">
<div class="panel login">
<div class="login-hero">
<div class="login-hero-title">破产重整债权申报系统</div>
<div class="login-hero-sub">SUBMIT REQUIREMENTS</div>
</div>
<div class="p-4">
<a-space direction="vertical" class="w-full" size="middle">
<a-button type="primary" block size="large" @click="navigateTo('/login')">
<template #icon><LoginOutlined /></template>
用户登录申报
</a-button>
<a-button block size="large" @click="navigateTo('/create-app')">
<template #icon><UserAddOutlined /></template>
新用户注册申报
</a-button>
<div class="flex items-center justify-between text-sm text-gray-500">
<span>申报审核系统</span>
<a href="#" class="text-red-600" @click.prevent>忘记密码？</a>
</div>
</a-space>
</div>
</div>
</div>
<a-space>
<a-button size="large" @click="navigateTo('/products')">看产品矩阵</a-button>
<a-button type="primary" size="large" @click="navigateTo('/contact')">马上联系</a-button>
</a-space>
</div>
</section>
</div>
<section class="banner">
<div class="mx-auto max-w-screen-xl px-4 py-10">
<div class="banner-title">致力于专业破产事务服务</div>
</div>
</section>
<section class="mx-auto max-w-screen-xl px-4 py-10">
<div class="section-title">
<div class="section-title-main">新闻资讯</div>
<div class="section-title-sub">NEWS INFORMATION</div>
</div>
<div class="mt-6 grid grid-cols-12 gap-6">
<div v-for="c in columns" :key="c.title" class="col-span-12 lg:col-span-4">
<div class="panel">
<div class="column-head">
<div class="column-title">{{ c.title }}</div>
<a href="#" class="column-more" @click.prevent>更多 +</a>
</div>
<div class="column-list">
<a
v-for="it in c.items"
:key="it"
class="column-item"
href="#"
@click.prevent
>
{{ it }}
</a>
</div>
</div>
</div>
</div>
<div class="mt-10">
<div class="section-title">
<div class="section-title-main">典型案例</div>
<div class="section-title-sub">CLASSIC CASE</div>
</div>
<div class="mt-6 grid grid-cols-12 gap-6">
<a-card
v-for="c in cases"
:key="c.title"
hoverable
class="case-card col-span-12 sm:col-span-6 lg:col-span-3"
@click="navigateTo(c.to)"
>
<template #cover>
<a-image :src="c.image" :preview="false" class="case-image" />
</template>
<a-typography-title :level="5" class="!mb-2 case-title">{{ c.title }}</a-typography-title>
<div class="case-meta">{{ c.date }}</div>
</a-card>
</div>
</div>
</section>
</main>
</template>
<script setup lang="ts">
import { usePageSeo } from '@/composables/usePageSeo'
import {
FileTextOutlined,
LoginOutlined,
NotificationOutlined,
ProfileOutlined,
SafetyCertificateOutlined,
UserAddOutlined
} from '@ant-design/icons-vue'
usePageSeo({
title: '软件开发平台 - SaaS / 私有化部署 / 模板&插件生态',
description:
'面向企业官网、电商、小程序等业务场景的 SaaS 开发平台，支持私有化部署与模板/插件购买；客户下单支付后自动创建租户并完成模块与数据初始化。'
})
const featured = {
image:
'https://images.unsplash.com/photo-1521737604893-d14cc237f11d?auto=format&fit=crop&w=1400&q=80',
title: '行于思清算公司受指定担任广西民族包装有限公司管理人',
date: '2023-10-11'
}
const capabilities = [
const notices = [
{
title: 'SaaS 多租户平台',
badge: '核心',
desc: '租户隔离、组织与权限体系、配置中心与审计能力，为多业务线统一底座。'
title: '关于公开招募破产清算管理主体框架及维修施工单位的公告',
desc: '南宁市中级人民法院根据有关规定...'
},
{
title: '私有化部署',
badge: '可选',
desc: '支持本地/专有云部署，提供部署文档、验收清单与升级策略，满足安全合规。'
title: '钦州市王明年丰全仓储有限公司重整投资人招募公告',
desc: '钦州市王明年丰全仓储有限公司...'
},
{
title: '模板市场',
badge: '生态',
desc: '行业模板一键套用，默认配置与初始化脚本配套，交付更标准、上线更快。'
title: '钦州市王明年丰全仓储有限公司 预重整债权申报公告',
desc: '债权申报相关材料及申报途径...'
},
{
title: '插件市场',
badge: '扩展',
desc: '支付、会员、营销、工单等能力按需加购；支持授权、更新与版本管理。'
title: '钦州市王明年丰全仓储有限公司 预重整债权申报公告（补充）',
desc: '补充说明及常见问题...'
}
]
const guides = [
{ title: '线上实名认证指南', desc: '快速完成实名认证', to: '/flow', icon: ProfileOutlined },
{ title: '债权人提交材料指南', desc: '材料清单与提交规范', to: '/articles', icon: FileTextOutlined },
{ title: '债权人网上申报指南', desc: '在线申报流程说明', to: '/login', icon: SafetyCertificateOutlined },
{ title: '公司自主清算债权登记材料范本', desc: '模板下载与填写说明', to: '/deploy', icon: FileTextOutlined }
]
const columns = [
{
title: '新闻动态',
items: [
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...'
]
},
{
title: '自动开通链路',
badge: '交付',
desc: '选品支付后自动创建租户、初始化模块/菜单/基础数据，并交付访问入口。'
title: '法律法规',
items: [
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...'
]
},
{
title: '模块化与可扩展',
badge: '开发',
desc: '支持按模块组合产品能力，插件化扩展点让二开与生态合作更高效。'
title: '权威发布',
items: [
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...',
'标题新闻标题新闻标题新闻标题新闻标题...'
]
}
]
const cases = [
{
title: '广西南院审理的印象刘三姐重整案...',
date: '2023-10-17',
to: '/articles',
image:
'https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=900&q=80'
},
{
title: '广西南院审理的印象刘三姐重整案...',
date: '2023-10-17',
to: '/articles',
image:
'https://images.unsplash.com/photo-1520607162513-77705c0f0d4a?auto=format&fit=crop&w=900&q=80'
},
{
title: '广西南院审理的印象刘三姐重整案...',
date: '2023-10-17',
to: '/articles',
image:
'https://images.unsplash.com/photo-1521790797524-b2497295b8a0?auto=format&fit=crop&w=900&q=80'
},
{
title: '广西南院审理的印象刘三姐重整案...',
date: '2023-10-17',
to: '/articles',
image:
'https://images.unsplash.com/photo-1554224155-6726b3ff858f?auto=format&fit=crop&w=900&q=80'
}
]
</script>
<style scoped>
.home {
background: #f4f6f8;
}
.panel {
background: #fff;
border: 1px solid rgba(0, 0, 0, 0.06);
border-radius: 10px;
overflow: hidden;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
}
.featured-image :deep(img) {
width: 100%;
height: 360px;
object-fit: cover;
}
.featured-title {
font-size: 16px;
font-weight: 700;
color: rgba(0, 0, 0, 0.88);
}
.featured-meta {
margin-top: 6px;
font-size: 12px;
color: rgba(0, 0, 0, 0.5);
}
.notice {
height: 100%;
}
.notice-head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 12px 14px;
background: linear-gradient(90deg, #c30000, #e11d48);
color: #fff;
}
.notice-title {
display: inline-flex;
align-items: center;
gap: 8px;
font-weight: 800;
}
.notice-more {
color: rgba(255, 255, 255, 0.9);
font-size: 12px;
}
.notice-list {
padding: 10px 14px 14px;
}
.notice-item {
display: block;
padding: 10px 0;
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
text-decoration: none;
}
.notice-item:last-child {
border-bottom: 0;
}
.notice-item-title {
font-size: 13px;
font-weight: 700;
color: rgba(0, 0, 0, 0.85);
line-height: 1.35;
}
.notice-item-desc {
margin-top: 4px;
font-size: 12px;
color: rgba(0, 0, 0, 0.55);
line-height: 1.4;
}
.section-pill {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 14px;
border-radius: 9999px;
background: linear-gradient(90deg, #c30000, #e11d48);
color: #fff;
font-weight: 800;
}
.pill-left {
display: inline-flex;
align-items: center;
gap: 8px;
}
.pill-right {
font-weight: 700;
font-size: 12px;
opacity: 0.9;
}
.guide-card {
border-radius: 10px;
}
.guide-icon {
background: rgba(195, 0, 0, 0.1);
color: #c30000;
}
.guide-title {
font-size: 14px;
font-weight: 800;
color: rgba(0, 0, 0, 0.88);
}
.guide-desc {
margin-top: 3px;
font-size: 12px;
color: rgba(0, 0, 0, 0.55);
}
.login-hero {
padding: 18px 16px;
background:
radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.22), transparent 55%),
linear-gradient(90deg, #c30000, #e11d48);
color: #fff;
}
.login-hero-title {
font-size: 18px;
font-weight: 900;
}
.login-hero-sub {
margin-top: 6px;
font-size: 12px;
letter-spacing: 0.12em;
opacity: 0.9;
}
.banner {
background:
radial-gradient(circle at 20% 30%, rgba(195, 0, 0, 0.18), transparent 55%),
linear-gradient(180deg, #ffffff, #f8fafc);
border-top: 1px solid rgba(0, 0, 0, 0.06);
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.banner-title {
text-align: center;
font-size: 28px;
font-weight: 900;
color: #c30000;
}
.section-title {
text-align: center;
}
.section-title-main {
font-size: 18px;
font-weight: 900;
color: rgba(0, 0, 0, 0.88);
}
.section-title-sub {
margin-top: 4px;
font-size: 12px;
letter-spacing: 0.12em;
color: rgba(0, 0, 0, 0.45);
}
.column-head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 14px 14px 10px;
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.column-title {
font-weight: 900;
color: rgba(0, 0, 0, 0.88);
}
.column-more {
font-size: 12px;
color: rgba(195, 0, 0, 0.95);
text-decoration: none;
}
.column-list {
padding: 10px 14px 14px;
}
.column-item {
display: block;
padding: 8px 0;
font-size: 13px;
color: rgba(0, 0, 0, 0.78);
text-decoration: none;
border-bottom: 1px dashed rgba(0, 0, 0, 0.08);
}
.column-item:last-child {
border-bottom: 0;
}
.case-card {
border-radius: 10px;
overflow: hidden;
}
.case-image :deep(img) {
width: 100%;
height: 160px;
object-fit: cover;
}
.case-title {
color: rgba(195, 0, 0, 0.95);
}
.case-meta {
font-size: 12px;
color: rgba(0, 0, 0, 0.5);
}
</style>