github
/
certd
mirror of https://github.com/certd/certd
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Translate other parts

pull/436/head
Lorenzo 2025-06-25 21:01:34 +02:00
parent 3ab99647aa
commit cdac12bb2f
11 changed files with 899 additions and 652 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

207
packages/ui/certd-client/src/components/tutorial/tutorial-steps.vue
View File

@ -20,14 +20,18 @@
</div> </div>
<div class="flex-center actions"> <div class="flex-center actions">
<fs-button class="m-10" icon="ion:arrow-back-outline" @click="prev()">上一步</fs-button> <fs-button class="m-10" icon="ion:arrow-back-outline" @click="prev()">{{ t('guide.buttons.prev') }}</fs-button>
<fs-button class="m-10" type="primary" icon-right="ion:arrow-forward-outline" @click="next()">下一步</fs-button> <fs-button class="m-10" type="primary" icon-right="ion:arrow-forward-outline" @click="next()">{{ t('guide.buttons.next') }}</fs-button>
</div> </div>
</div> </div>
</template> </template>
<script setup lang="tsx"> <script setup lang="tsx">
import { FsRender } from "@fast-crud/fast-crud"; import { FsRender } from "@fast-crud/fast-crud";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
import SimpleSteps from "./simple-steps.vue"; import SimpleSteps from "./simple-steps.vue";
type Step = { type Step = {
title: string; title: string;
@ -45,130 +49,151 @@ type StepItems = {
import { computed, nextTick, ref } from "vue"; import { computed, nextTick, ref } from "vue";
const steps = ref<Step[]>([ const steps = ref<Step[]>([
{ {
title: "创建证书申请流水线", title: t("guide.createCertPipeline.title"),
description: "演示证书申请任务如何配置", description: t("guide.createCertPipeline.description"),
items: [ items: [
{ {
title: "教程演示内容", title: t("guide.createCertPipeline.items.tutorialTitle"),
descriptions: ["本教程演示如何自动申请证书并部署到Nginx上", "仅需3步，全自动申请部署证书"], descriptions: [
t("guide.createCertPipeline.items.tutorialDesc1"),
t("guide.createCertPipeline.items.tutorialDesc2"),
],
body: () => { body: () => {
return <SimpleSteps></SimpleSteps>; return <SimpleSteps></SimpleSteps>;
}, },
}, },
{ {
image: "/static/doc/images/1-add.png", image: "/static/doc/images/1-add.png",
title: "创建证书流水线", title: t("guide.createCertPipeline.items.createTitle"),
descriptions: ["点击添加证书流水线，填写证书申请信息"], descriptions: [t("guide.createCertPipeline.items.createDesc")],
}, },
{ {
image: "/static/doc/images/3-add-success.png", image: "/static/doc/images/3-add-success.png",
title: "流水线创建成功", title: t("guide.createCertPipeline.items.successTitle"),
descriptions: ["点击手动触发即可申请证书"], descriptions: [t("guide.createCertPipeline.items.successDesc")],
}, },
{ {
title: "接下来演示如何自动部署证书", title: t("guide.createCertPipeline.items.nextTitle"),
descriptions: ["如果您只需要申请证书，那么到这一步就可以了"], descriptions: [t("guide.createCertPipeline.items.nextDesc")],
}, },
], ],
}, },
{ {
title: "添加部署证书任务", title: t("guide.addDeployTask.title"),
description: "这里演示部署证书到Nginx", description: t("guide.addDeployTask.description"),
items: [ items: [
{ {
image: "/static/doc/images/5-1-add-host.png", image: "/static/doc/images/5-1-add-host.png",
title: "添加证书部署任务", title: t("guide.addDeployTask.items.addTaskTitle"),
descriptions: ["这里演示自动部署证书到nginx", "本系统提供海量部署插件，满足您的各种部署需求"], descriptions: [
t("guide.addDeployTask.items.addTaskDesc1"),
t("guide.addDeployTask.items.addTaskDesc2"),
],
}, },
{ {
image: "/static/doc/images/5-2-add-host.png", image: "/static/doc/images/5-2-add-host.png",
title: "填写任务参数", title: t("guide.addDeployTask.items.fillParamsTitle"),
descriptions: ["填写主机上证书文件的路径", "选择主机ssh登录授权"], descriptions: [
t("guide.addDeployTask.items.fillParamsDesc1"),
t("guide.addDeployTask.items.fillParamsDesc2"),
],
}, },
{ {
image: "/static/doc/images/5-3-add-host.png", image: "/static/doc/images/5-3-add-host.png",
title: "让新证书生效", title: t("guide.addDeployTask.items.activateCertTitle"),
descriptions: ["执行重启脚本", "让证书生效"], descriptions: [
t("guide.addDeployTask.items.activateCertDesc1"),
t("guide.addDeployTask.items.activateCertDesc2"),
],
}, },
{ {
image: "/static/doc/images/5-4-add-host.png", image: "/static/doc/images/5-4-add-host.png",
title: "部署任务添加成功", title: t("guide.addDeployTask.items.taskSuccessTitle"),
descriptions: ["现在可以运行"], descriptions: [t("guide.addDeployTask.items.taskSuccessDesc")],
}, },
{ {
image: "/static/doc/images/5-5-plugin-list.png", image: "/static/doc/images/5-5-plugin-list.png",
title: "本系统提供茫茫多的部署插件", title: t("guide.addDeployTask.items.pluginsTitle"),
descriptions: ["您可以根据自身需求将证书部署到各种应用和平台"], descriptions: [t("guide.addDeployTask.items.pluginsDesc")],
},
],
},
{
title: "运行与测试",
description: "演示流水线运行,查看日志，成功后跳过等",
items: [
{
image: "/static/doc/images/9-start.png",
title: "运行测试一下",
descriptions: ["点击手动触发按钮，即可测试运行"],
},
{
image: "/static/doc/images/10-1-log.png",
title: "查看日志",
descriptions: ["点击任务可以查看状态和日志"],
},
{
image: "/static/doc/images/11-1-error.png",
title: "执行失败如何排查",
descriptions: ["查看错误日志"],
},
{
image: "/static/doc/images/11-2-error.png",
title: "执行失败如何排查",
descriptions: ["查看错误日志", "这里报的是nginx容器不存在，修改命令，改成正确的nginx容器名称即可"],
},
{
image: "/static/doc/images/12-1-log-success.png",
title: "执行成功",
descriptions: ["修改正确后，重新点击手动触发，重新运行一次，执行成功"],
},
{
image: "/static/doc/images/12-2-skip-log.png",
title: "成功后自动跳过",
descriptions: ["可以看到成功过的将会自动跳过，不会重复执行，只有当参数变更或者证书更新了，才会重新运行"],
},
{
image: "/static/doc/images/13-1-result.png",
title: "查看证书部署成功",
descriptions: ["访问nginx上的网站，可以看到证书已经部署成功"],
},
{
image: "/static/doc/images/13-3-download.png",
title: "还可以下载证书，手动部署",
descriptions: ["如果还没有好用的部署插件，没办法自动部署，你还可以下载证书，手动部署"],
},
],
},
{
title: "设置定时执行和邮件通知",
description: "自动运行",
items: [
{
image: "/static/doc/images/14-timer.png",
title: "设置定时执行",
descriptions: ["流水线测试成功，接下来配置定时触发，以后每天定时执行就不用管了", "推荐配置每天运行一次，在到期前35天才会重新申请新证书并部署，没到期前会自动跳过，不会重复申请。"],
},
{
image: "/static/doc/images/15-1-email.png",
title: "设置邮件通知",
descriptions: ["建议选择监听'错误时'和'错误转成功'两种即可，在意外失败时可以尽快去排查问题，（基础版需要配置邮件服务器）"],
},
{
title: "教程结束",
descriptions: ["感谢观看，希望对你有所帮助"],
}, },
], ],
}, },
{
title: t('guide.runAndTestTask.runAndTestTitle'),
description: t('guide.runAndTestTask.runAndTestDescription'),
items: [
{
image: "/static/doc/images/9-start.png",
title: t('guide.runAndTestTask.runTestOnce'),
descriptions: [t('guide.runAndTestTask.clickManualTriggerToTest')],
},
{
image: "/static/doc/images/10-1-log.png",
title: t('guide.runAndTestTask.viewLogs'),
descriptions: [t('guide.runAndTestTask.clickTaskToViewStatusAndLogs')],
},
{
image: "/static/doc/images/11-1-error.png",
title: t('guide.runAndTestTask.howToTroubleshootFailure'),
descriptions: [t('guide.runAndTestTask.viewErrorLogs')],
},
{
image: "/static/doc/images/11-2-error.png",
title: t('guide.runAndTestTask.howToTroubleshootFailure'),
descriptions: [
t('guide.runAndTestTask.viewErrorLogs'),
t('guide.runAndTestTask.nginxContainerNotExistFix'),
],
},
{
image: "/static/doc/images/12-1-log-success.png",
title: t('guide.runAndTestTask.executionSuccess'),
descriptions: [t('guide.runAndTestTask.retryAfterFix')],
},
{
image: "/static/doc/images/12-2-skip-log.png",
title: t('guide.runAndTestTask.autoSkipAfterSuccess'),
descriptions: [t('guide.runAndTestTask.successSkipExplanation')],
},
{
image: "/static/doc/images/13-1-result.png",
title: t('guide.runAndTestTask.viewCertDeploymentSuccess'),
descriptions: [t('guide.runAndTestTask.visitNginxToSeeCert')],
},
{
image: "/static/doc/images/13-3-download.png",
title: t('guide.runAndTestTask.downloadCertManualDeploy'),
descriptions: [t('guide.runAndTestTask.downloadIfNoAutoDeployPlugin')],
},
],
},
{
title: t('guide.scheduleAndEmailTask.title'),
description: t('guide.scheduleAndEmailTask.description'),
items: [
{
image: "/static/doc/images/14-timer.png",
title: t('guide.scheduleAndEmailTask.setSchedule'),
descriptions: [
t('guide.scheduleAndEmailTask.pipelineSuccessThenSchedule'),
t('guide.scheduleAndEmailTask.recommendDailyRun'),
],
},
{
image: "/static/doc/images/15-1-email.png",
title: t('guide.scheduleAndEmailTask.setEmailNotification'),
descriptions: [
t('guide.scheduleAndEmailTask.suggestErrorAndRecoveryEmails'),
t('guide.scheduleAndEmailTask.basicVersionNeedsMailServer'),
],
},
{
title: t('guide.scheduleAndEmailTask.tutorialEndTitle'),
descriptions: [t('guide.scheduleAndEmailTask.thanksForWatching')],
},
],
}
]); ]);
const current = ref(0); const current = ref(0);

35
packages/ui/certd-client/src/locales/langs/en-US/certd.ts
View File

@ -150,4 +150,39 @@ export default {
manual: "Manual Execution", manual: "Manual Execution",
timer: "Scheduled Execution", timer: "Scheduled Execution",
}, },
sysResources: {
sysRoot: "System Management",
sysConsole: "Console",
sysSettings: "System Settings",
cnameSetting: "CNAME Service Settings",
emailSetting: "Email Server Settings",
siteSetting: "Site Personalization",
headerMenus: "Top Menu Settings",
sysAccess: "System-level Authorization",
sysPlugin: "Plugin Management",
sysPluginEdit: "Edit Plugin",
sysPluginConfig: "Certificate Plugin Configuration",
accountBind: "Account Binding",
permissionManager: "Permission Management",
roleManager: "Role Management",
userManager: "User Management",
suiteManager: "Suite Management",
suiteSetting: "Suite Settings",
orderManager: "Order Management",
userSuites: "User Suites",
},
certificateRepo: {
title: "Certificate Repository",
sub: "Certificates generated from pipeline"
},
certificateNotGenerated: "Certificate not yet generated, please run the pipeline first",
viewCertificateTitle: "View Certificate",
close: "Close",
viewCert: {
title: "View Certificate"
},
download: {
title: "Download Certificate"
},
}; };

71
packages/ui/certd-client/src/locales/langs/en-US/guide.ts Normal file
View File

@ -0,0 +1,71 @@
export default {
createCertPipeline: {
title: "Create Certificate Application Pipeline",
description: "Demonstrate how to configure a certificate application task",
items: {
tutorialTitle: "Tutorial Demo Content",
tutorialDesc1: "This tutorial demonstrates how to automatically apply for a certificate and deploy it to Nginx",
tutorialDesc2: "Only 3 steps, fully automatic application and deployment",
createTitle: "Create Certificate Pipeline",
createDesc: "Click to add a certificate pipeline and fill in the certificate application information",
successTitle: "Pipeline Created Successfully",
successDesc: "Click manual trigger to apply for the certificate",
nextTitle: "Next, demonstrate how to automatically deploy the certificate",
nextDesc: "If you only need to apply for a certificate, you can stop here",
},
},
buttons: {
prev: "Previous Step",
next: "Next Step",
},
addDeployTask: {
title: "Add Deployment Certificate Task",
description: "Demonstrate deployment of certificate to Nginx",
items: {
addTaskTitle: "Add Certificate Deployment Task",
addTaskDesc1: "Demonstrate automatic deployment of certificate to nginx",
addTaskDesc2: "Our system provides numerous deployment plugins to meet your needs",
fillParamsTitle: "Fill Task Parameters",
fillParamsDesc1: "Fill in the certificate file path on the host",
fillParamsDesc2: "Select SSH login authorization for the host",
activateCertTitle: "Make New Certificate Effective",
activateCertDesc1: "Execute restart script",
activateCertDesc2: "Make the certificate effective",
taskSuccessTitle: "Deployment Task Added Successfully",
taskSuccessDesc: "Now you can run it",
pluginsTitle: "Our System Provides Numerous Deployment Plugins",
pluginsDesc: "You can deploy certificates to various applications and platforms according to your needs",
},
},
runAndTestTask: {
runAndTestTitle: "Run and Test",
runAndTestDescription: "Demonstrate pipeline running, view logs, skip on success, etc.",
runTestOnce: "Run a Test",
clickManualTriggerToTest: "Click the manual trigger button to test the run",
viewLogs: "View Logs",
clickTaskToViewStatusAndLogs: "Click the task to view status and logs",
howToTroubleshootFailure: "How to Troubleshoot Failure",
viewErrorLogs: "View error logs",
nginxContainerNotExistFix: "Shows nginx container not found error, fix by changing to correct nginx container name",
executionSuccess: "Execution Success",
retryAfterFix: "After fixing, click manual trigger again to rerun successfully",
autoSkipAfterSuccess: "Auto Skip After Success",
successSkipExplanation: "Successful runs will be skipped automatically, rerun only if parameters or certificates update",
viewCertDeploymentSuccess: "View Certificate Deployment Success",
visitNginxToSeeCert: "Visit website on nginx to see certificate deployed successfully",
downloadCertManualDeploy: "Download Certificate for Manual Deployment",
downloadIfNoAutoDeployPlugin: "If no deployment plugin available, download certificate for manual deployment",
},
scheduleAndEmailTask: {
title: "Set Scheduled Execution and Email Notifications",
description: "Automatic running",
setSchedule: "Set Scheduled Execution",
pipelineSuccessThenSchedule: "Pipeline tests succeed, then configure scheduled triggers so it runs automatically daily",
recommendDailyRun: "Recommend configuring to run once daily; new certs requested 35 days before expiry and auto-skipped otherwise",
setEmailNotification: "Set Email Notifications",
suggestErrorAndRecoveryEmails: "Suggest listening for 'On Error' and 'Error to Success' to quickly troubleshoot failures (basic version requires mail server setup)",
basicVersionNeedsMailServer: "(basic version requires configuring mail server)",
tutorialEndTitle: "Tutorial End",
thanksForWatching: "Thank you for watching, hope it helps you",
}
}

4
packages/ui/certd-client/src/locales/langs/en-US/index.ts
View File

@ -4,6 +4,7 @@ import vip from './vip';
import tutorial from './tutorial'; import tutorial from './tutorial';
import preferences from './preferences'; import preferences from './preferences';
import ui from './ui'; import ui from './ui';
import guide from './guide';
export default { export default {
certd, certd,
@ -11,5 +12,6 @@ export default {
vip, vip,
ui, ui,
tutorial, tutorial,
preferences preferences,
guide
}; };

81
packages/ui/certd-client/src/locales/langs/zh-CN/certd.ts
View File

@ -37,29 +37,29 @@ export default {
title: "框架", title: "框架",
home: "首页", home: "首页",
}, },
certd: {
title: "证书自动化", title: "证书自动化",
pipeline: "证书自动化流水线", pipeline: "证书自动化流水线",
pipelineEdit: "编辑流水线", pipelineEdit: "编辑流水线",
history: "执行历史记录", history: "执行历史记录",
certStore: "证书仓库", certStore: "证书仓库",
siteMonitor: "站点证书监控", siteMonitor: "站点证书监控",
settings: "设置", settings: "设置",
accessManager: "授权管理", accessManager: "授权管理",
cnameRecord: "CNAME记录管理", cnameRecord: "CNAME记录管理",
subDomain: "子域名托管设置", subDomain: "子域名托管设置",
pipelineGroup: "流水线分组管理", pipelineGroup: "流水线分组管理",
openKey: "开放接口密钥", openKey: "开放接口密钥",
notification: "通知设置", notification: "通知设置",
siteMonitorSetting: "站点监控设置", siteMonitorSetting: "站点监控设置",
userSecurity: "认证安全设置", userSecurity: "认证安全设置",
userProfile: "账号信息", userProfile: "账号信息",
suite: "套餐", suite: "套餐",
mySuite: "我的套餐", mySuite: "我的套餐",
suiteBuy: "套餐购买", suiteBuy: "套餐购买",
myTrade: "我的订单", myTrade: "我的订单",
paymentReturn: "支付返回", paymentReturn: "支付返回",
},
user: { user: {
greeting: "您好", greeting: "您好",
profile: "账号信息", profile: "账号信息",
@ -156,4 +156,39 @@ export default {
manual: "手动执行", manual: "手动执行",
timer: "定时执行", timer: "定时执行",
}, },
sysResources: {
sysRoot: "系统管理",
sysConsole: "控制台",
sysSettings: "系统设置",
cnameSetting: "CNAME服务设置",
emailSetting: "邮件服务器设置",
siteSetting: "站点个性化",
headerMenus: "顶部菜单设置",
sysAccess: "系统级授权",
sysPlugin: "插件管理",
sysPluginEdit: "编辑插件",
sysPluginConfig: "证书插件配置",
accountBind: "账号绑定",
permissionManager: "权限管理",
roleManager: "角色管理",
userManager: "用户管理",
suiteManager: "套餐管理",
suiteSetting: "套餐设置",
orderManager: "订单管理",
userSuites: "用户套餐",
},
certificateRepo: {
title: "证书仓库",
sub: "从流水线生成的证书"
},
certificateNotGenerated: "证书还未生成，请先运行流水线",
viewCertificateTitle: "查看证书",
close: "关闭",
viewCert: {
title: "查看证书"
},
download: {
title: "下载证书"
},
}; };

71
packages/ui/certd-client/src/locales/langs/zh-CN/guide.ts Normal file
View File

@ -0,0 +1,71 @@
export default {
createCertPipeline: {
title: "创建证书申请流水线",
description: "演示证书申请任务如何配置",
items: {
tutorialTitle: "教程演示内容",
tutorialDesc1: "本教程演示如何自动申请证书并部署到Nginx上",
tutorialDesc2: "仅需3步，全自动申请部署证书",
createTitle: "创建证书流水线",
createDesc: "点击添加证书流水线，填写证书申请信息",
successTitle: "流水线创建成功",
successDesc: "点击手动触发即可申请证书",
nextTitle: "接下来演示如何自动部署证书",
nextDesc: "如果您只需要申请证书，那么到这一步就可以了",
},
},
buttons: {
prev: "上一步",
next: "下一步",
},
addDeployTask: {
title: "添加部署证书任务",
description: "这里演示部署证书到Nginx",
items: {
addTaskTitle: "添加证书部署任务",
addTaskDesc1: "这里演示自动部署证书到nginx",
addTaskDesc2: "本系统提供海量部署插件，满足您的各种部署需求",
fillParamsTitle: "填写任务参数",
fillParamsDesc1: "填写主机上证书文件的路径",
fillParamsDesc2: "选择主机ssh登录授权",
activateCertTitle: "让新证书生效",
activateCertDesc1: "执行重启脚本",
activateCertDesc2: "让证书生效",
taskSuccessTitle: "部署任务添加成功",
taskSuccessDesc: "现在可以运行",
pluginsTitle: "本系统提供茫茫多的部署插件",
pluginsDesc: "您可以根据自身需求将证书部署到各种应用和平台",
},
},
runAndTestTask: {
runAndTestTitle: "运行与测试",
runAndTestDescription: "演示流水线运行,查看日志，成功后跳过等",
runTestOnce: "运行测试一下",
clickManualTriggerToTest: "点击手动触发按钮，即可测试运行",
viewLogs: "查看日志",
clickTaskToViewStatusAndLogs: "点击任务可以查看状态和日志",
howToTroubleshootFailure: "执行失败如何排查",
viewErrorLogs: "查看错误日志",
nginxContainerNotExistFix: "这里报的是nginx容器不存在，修改命令，改成正确的nginx容器名称即可",
executionSuccess: "执行成功",
retryAfterFix: "修改正确后，重新点击手动触发，重新运行一次，执行成功",
autoSkipAfterSuccess: "成功后自动跳过",
successSkipExplanation: "可以看到成功过的将会自动跳过，不会重复执行，只有当参数变更或者证书更新了，才会重新运行",
viewCertDeploymentSuccess: "查看证书部署成功",
visitNginxToSeeCert: "访问nginx上的网站，可以看到证书已经部署成功",
downloadCertManualDeploy: "还可以下载证书，手动部署",
downloadIfNoAutoDeployPlugin: "如果还没有好用的部署插件，没办法自动部署，你还可以下载证书，手动部署",
},
scheduleAndEmailTask: {
title: "设置定时执行和邮件通知",
description: "自动运行",
setSchedule: "设置定时执行",
pipelineSuccessThenSchedule: "流水线测试成功，接下来配置定时触发，以后每天定时执行就不用管了",
recommendDailyRun: "推荐配置每天运行一次，在到期前35天才会重新申请新证书并部署，没到期前会自动跳过，不会重复申请。",
setEmailNotification: "设置邮件通知",
suggestErrorAndRecoveryEmails: "建议选择监听'错误时'和'错误转成功'两种即可，在意外失败时可以尽快去排查问题，（基础版需要配置邮件服务器）",
basicVersionNeedsMailServer: "（基础版需要配置邮件服务器）",
tutorialEndTitle: "教程结束",
thanksForWatching: "感谢观看，希望对你有所帮助",
}
}

4
packages/ui/certd-client/src/locales/langs/zh-CN/index.ts
View File

@ -4,6 +4,7 @@ import vip from './vip';
import tutorial from './tutorial'; import tutorial from './tutorial';
import preferences from './preferences'; import preferences from './preferences';
import ui from './ui'; import ui from './ui';
import guide from './guide';
export default { export default {
certd, certd,
@ -11,5 +12,6 @@ export default {
vip, vip,
ui, ui,
tutorial, tutorial,
preferences preferences,
guide
}; };

2
packages/ui/certd-client/src/router/source/framework.ts
View File

@ -1,7 +1,7 @@
import LayoutBasic from "/@/layout/layout-basic.vue"; import LayoutBasic from "/@/layout/layout-basic.vue";
import type { RouteRecordRaw } from "vue-router"; import type { RouteRecordRaw } from "vue-router";
import i18n from '../../locales/i18n'; import i18n from '/@/locales/i18n';
import { mergeRouteModules } from "/@/vben/utils"; import { mergeRouteModules } from "/@/vben/utils";
const dynamicRouteFiles = import.meta.glob("./modules/**/*.ts*", { const dynamicRouteFiles = import.meta.glob("./modules/**/*.ts*", {

492
packages/ui/certd-client/src/router/source/modules/sys.ts
View File

@ -1,256 +1,256 @@
import LayoutPass from "/@/layout/layout-pass.vue"; import LayoutPass from "/@/layout/layout-pass.vue";
import { useSettingStore } from "/@/store/settings"; import { useSettingStore } from "/@/store/settings";
import aboutResource from "/@/router/source/modules/about"; import aboutResource from "/@/router/source/modules/about";
import i18n from '/@/locales/i18n';
export const sysResources = [ export const sysResources = [
{ {
title: "系统管理", title: i18n.global.t('certd.sysResources.sysRoot'),
name: "SysRoot", name: "SysRoot",
path: "/sys", path: "/sys",
redirect: "/sys/settings", redirect: "/sys/settings",
meta: { meta: {
icon: "ion:settings-outline", icon: "ion:settings-outline",
permission: "sys:settings:view", permission: "sys:settings:view",
order: 10, order: 10,
}, },
children: [ children: [
{ {
title: "控制台", title: i18n.global.t('certd.sysResources.sysConsole'),
name: "SysConsole", name: "SysConsole",
path: "/sys/console", path: "/sys/console",
component: "/sys/console/index.vue", component: "/sys/console/index.vue",
meta: { meta: {
show: () => { show: () => {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
return settingStore.isComm; return settingStore.isComm;
}, },
icon: "ion:speedometer-outline", icon: "ion:speedometer-outline",
permission: "sys:auth:user:view", permission: "sys:auth:user:view",
}, },
}, },
{ {
title: "系统设置", title: i18n.global.t('certd.sysResources.sysSettings'),
name: "SysSettings", name: "SysSettings",
path: "/sys/settings", path: "/sys/settings",
component: "/sys/settings/index.vue", component: "/sys/settings/index.vue",
meta: { meta: {
icon: "ion:settings-outline", icon: "ion:settings-outline",
permission: "sys:settings:view", permission: "sys:settings:view",
}, },
}, },
{ {
title: "CNAME服务设置", title: i18n.global.t('certd.sysResources.cnameSetting'),
name: "CnameSetting", name: "CnameSetting",
path: "/sys/cname/provider", path: "/sys/cname/provider",
component: "/sys/cname/provider/index.vue", component: "/sys/cname/provider/index.vue",
meta: { meta: {
icon: "ion:earth-outline", icon: "ion:earth-outline",
permission: "sys:settings:view", permission: "sys:settings:view",
keepAlive: true, keepAlive: true,
}, },
}, },
{ {
title: "邮件服务器设置", title: i18n.global.t('certd.sysResources.emailSetting'),
name: "EmailSetting", name: "EmailSetting",
path: "/sys/settings/email", path: "/sys/settings/email",
component: "/sys/settings/email/index.vue", component: "/sys/settings/email/index.vue",
meta: { meta: {
permission: "sys:settings:view", permission: "sys:settings:view",
icon: "ion:mail-outline", icon: "ion:mail-outline",
auth: true, auth: true,
}, },
}, },
{ {
title: "站点个性化", title: i18n.global.t('certd.sysResources.siteSetting'),
name: "SiteSetting", name: "SiteSetting",
path: "/sys/site", path: "/sys/site",
component: "/sys/site/index.vue", component: "/sys/site/index.vue",
meta: { meta: {
show: () => { show: () => {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
return settingStore.isComm; return settingStore.isComm;
}, },
icon: "ion:document-text-outline", icon: "ion:document-text-outline",
permission: "sys:settings:view", permission: "sys:settings:view",
}, },
}, },
{ {
title: "顶部菜单设置", title: i18n.global.t('certd.sysResources.headerMenus'),
name: "HeaderMenus", name: "HeaderMenus",
path: "/sys/settings/header-menus", path: "/sys/settings/header-menus",
component: "/sys/settings/header-menus/index.vue", component: "/sys/settings/header-menus/index.vue",
meta: { meta: {
show: () => { show: () => {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
return settingStore.isComm; return settingStore.isComm;
}, },
icon: "ion:menu", icon: "ion:menu",
permission: "sys:settings:view", permission: "sys:settings:view",
keepAlive: true, keepAlive: true,
}, },
}, },
{ {
title: "系统级授权", title: i18n.global.t('certd.sysResources.sysAccess'),
name: "SysAccess", name: "SysAccess",
path: "/sys/access", path: "/sys/access",
component: "/sys/access/index.vue", component: "/sys/access/index.vue",
meta: { meta: {
show: () => { show: () => {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
return settingStore.isComm; return settingStore.isComm;
}, },
icon: "ion:disc-outline", icon: "ion:disc-outline",
permission: "sys:settings:view", permission: "sys:settings:view",
keepAlive: true, keepAlive: true,
}, },
}, },
{ {
title: "插件管理", title: i18n.global.t('certd.sysResources.sysPlugin'),
name: "SysPlugin", name: "SysPlugin",
path: "/sys/plugin", path: "/sys/plugin",
component: "/sys/plugin/index.vue", component: "/sys/plugin/index.vue",
meta: { meta: {
icon: "ion:extension-puzzle-outline", icon: "ion:extension-puzzle-outline",
permission: "sys:settings:view", permission: "sys:settings:view",
keepAlive: true, keepAlive: true,
}, },
}, },
{ {
title: "编辑插件", title: i18n.global.t('certd.sysResources.sysPluginEdit'),
name: "SysPluginEdit", name: "SysPluginEdit",
path: "/sys/plugin/edit", path: "/sys/plugin/edit",
component: "/sys/plugin/edit.vue", component: "/sys/plugin/edit.vue",
meta: { meta: {
isMenu: false, isMenu: false,
icon: "ion:extension-puzzle", icon: "ion:extension-puzzle",
permission: "sys:settings:view", permission: "sys:settings:view",
keepAlive: true, keepAlive: true,
}, },
}, },
{ {
title: "证书插件配置", title: i18n.global.t('certd.sysResources.sysPluginConfig'),
name: "SysPluginConfig", name: "SysPluginConfig",
path: "/sys/plugin/config", path: "/sys/plugin/config",
component: "/sys/plugin/config.vue", component: "/sys/plugin/config.vue",
meta: { meta: {
show: () => { show: () => {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
return settingStore.isComm; return settingStore.isComm;
}, },
icon: "ion:extension-puzzle", icon: "ion:extension-puzzle",
permission: "sys:settings:view", permission: "sys:settings:view",
}, },
}, },
{ {
title: "账号绑定", title: i18n.global.t('certd.sysResources.accountBind'),
name: "AccountBind", name: "AccountBind",
path: "/sys/account", path: "/sys/account",
component: "/sys/account/index.vue", component: "/sys/account/index.vue",
meta: { meta: {
icon: "ion:golf-outline", icon: "ion:golf-outline",
permission: "sys:settings:view", permission: "sys:settings:view",
keepAlive: true, keepAlive: true,
}, },
}, },
{ {
title: "权限管理", title: i18n.global.t('certd.sysResources.permissionManager'),
name: "PermissionManager", name: "PermissionManager",
path: "/sys/authority/permission", path: "/sys/authority/permission",
component: "/sys/authority/permission/index.vue", component: "/sys/authority/permission/index.vue",
meta: { meta: {
icon: "ion:list-outline", icon: "ion:list-outline",
//需要校验权限 permission: "sys:auth:per:view",
permission: "sys:auth:per:view", keepAlive: true,
keepAlive: true, },
}, },
}, {
{ title: i18n.global.t('certd.sysResources.roleManager'),
title: "角色管理", name: "RoleManager",
name: "RoleManager", path: "/sys/authority/role",
path: "/sys/authority/role", component: "/sys/authority/role/index.vue",
component: "/sys/authority/role/index.vue", meta: {
meta: { icon: "ion:people-outline",
icon: "ion:people-outline", permission: "sys:auth:role:view",
permission: "sys:auth:role:view", keepAlive: true,
keepAlive: true, },
}, },
}, {
{ title: i18n.global.t('certd.sysResources.userManager'),
title: "用户管理", name: "UserManager",
name: "UserManager", path: "/sys/authority/user",
path: "/sys/authority/user", component: "/sys/authority/user/index.vue",
component: "/sys/authority/user/index.vue", meta: {
meta: { icon: "ion:person-outline",
icon: "ion:person-outline", permission: "sys:auth:user:view",
permission: "sys:auth:user:view", keepAlive: true,
keepAlive: true, },
}, },
},
{ {
title: "套餐管理", title: i18n.global.t('certd.sysResources.suiteManager'),
name: "SuiteManager", name: "SuiteManager",
path: "/sys/suite", path: "/sys/suite",
redirect: "/sys/suite/setting", redirect: "/sys/suite/setting",
meta: { meta: {
icon: "ion:cart-outline", icon: "ion:cart-outline",
permission: "sys:settings:edit", permission: "sys:settings:edit",
show: () => { show: () => {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
return settingStore.isComm; return settingStore.isComm;
}, },
keepAlive: true, keepAlive: true,
}, },
children: [ children: [
{ {
title: "套餐设置", title: i18n.global.t('certd.sysResources.suiteSetting'),
name: "SuiteSetting", name: "SuiteSetting",
path: "/sys/suite/setting", path: "/sys/suite/setting",
component: "/sys/suite/setting/index.vue", component: "/sys/suite/setting/index.vue",
meta: { meta: {
show: () => { show: () => {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
return settingStore.isComm; return settingStore.isComm;
}, },
icon: "ion:cart", icon: "ion:cart",
permission: "sys:settings:edit", permission: "sys:settings:edit",
}, },
}, },
{ {
title: "订单管理", title: i18n.global.t('certd.sysResources.orderManager'),
name: "OrderManager", name: "OrderManager",
path: "/sys/suite/trade", path: "/sys/suite/trade",
component: "/sys/suite/trade/index.vue", component: "/sys/suite/trade/index.vue",
meta: { meta: {
show: () => { show: () => {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
return settingStore.isComm; return settingStore.isComm;
}, },
icon: "ion:bag-check", icon: "ion:bag-check",
permission: "sys:settings:edit", permission: "sys:settings:edit",
keepAlive: true, keepAlive: true,
}, },
}, },
{ {
title: "用户套餐", title: i18n.global.t('certd.sysResources.userSuites'),
name: "UserSuites", name: "UserSuites",
path: "/sys/suite/user-suite", path: "/sys/suite/user-suite",
component: "/sys/suite/user-suite/index.vue", component: "/sys/suite/user-suite/index.vue",
meta: { meta: {
show: () => { show: () => {
const settingStore = useSettingStore(); const settingStore = useSettingStore();
return settingStore.isComm; return settingStore.isComm;
}, },
icon: "ion:gift-outline", icon: "ion:gift-outline",
auth: true, auth: true,
keepAlive: true, keepAlive: true,
}, },
}, },
], ],
}, },
], ],
}, },
]; ];
export default sysResources; export default sysResources;

557
packages/ui/certd-client/src/views/certd/monitor/cert/crud.tsx
View File

@ -1,5 +1,6 @@
// @ts-ignore // @ts-ignore
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
//
import { AddReq, compute, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, useFormWrapper, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud"; import { AddReq, compute, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, useFormWrapper, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
import { certInfoApi } from "./api"; import { certInfoApi } from "./api";
import dayjs from "dayjs"; import dayjs from "dayjs";
@ -10,285 +11,287 @@ import CertView from "/@/views/certd/pipeline/cert-view.vue";
import { useCertUpload } from "/@/views/certd/pipeline/cert-upload/use"; import { useCertUpload } from "/@/views/certd/pipeline/cert-upload/use";
export default function ({ crudExpose, context }: CreateCrudOptionsProps): CreateCrudOptionsRet { export default function ({ crudExpose, context }: CreateCrudOptionsProps): CreateCrudOptionsRet {
const api = certInfoApi; const { t } = useI18n();
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => { const api = certInfoApi;
return await api.GetList(query); const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
}; return await api.GetList(query);
const editRequest = async (req: EditReq) => { };
const { form, row } = req; const editRequest = async (req: EditReq) => {
form.id = row.id; const { form, row } = req;
const res = await api.UpdateObj(form); form.id = row.id;
return res; const res = await api.UpdateObj(form);
}; return res;
const delRequest = async (req: DelReq) => { };
const { row } = req; const delRequest = async (req: DelReq) => {
return await api.DelObj(row.id); const { row } = req;
}; return await api.DelObj(row.id);
};
const addRequest = async (req: AddReq) => { const addRequest = async (req: AddReq) => {
const { form } = req; const { form } = req;
const res = await api.AddObj(form); const res = await api.AddObj(form);
return res; return res;
}; };
const { openCrudFormDialog } = useFormWrapper(); const { openCrudFormDialog } = useFormWrapper();
const router = useRouter(); const router = useRouter();
const model = useModal(); const model = useModal();
const viewCert = async (row: any) => { const viewCert = async (row: any) => {
const cert = await api.GetCert(row.id); const cert = await api.GetCert(row.id);
if (!cert) { if (!cert) {
notification.error({ message: "证书还未生成，请先运行流水线" }); notification.error({ message: t("certd.certificateNotGenerated") });
return; return;
} }
model.success({ model.success({
title: "查看证书", title: t("certd.modal.viewCertificateTitle"),
maskClosable: true, maskClosable: true,
okText: "关闭", okText: t("certd.modal.close"),
width: 800, width: 800,
content: () => { content: () => {
return <CertView cert={cert}></CertView>; return <CertView cert={cert}></CertView>;
}, },
}); });
}; };
const { openUploadCreateDialog, openUpdateCertDialog } = useCertUpload(); const { openUploadCreateDialog, openUpdateCertDialog } = useCertUpload();
return { return {
crudOptions: { crudOptions: {
request: { request: {
pageRequest, pageRequest,
addRequest, addRequest,
editRequest, editRequest,
delRequest, delRequest,
}, },
form: { form: {
labelCol: { labelCol: {
//固定label宽度 //固定label宽度
span: null, span: null,
style: { style: {
width: "100px", width: "100px",
}, },
}, },
col: { col: {
span: 22, span: 22,
}, },
wrapper: { wrapper: {
width: 600, width: 600,
}, },
}, },
actionbar: { actionbar: {
show: true, show: true,
buttons: { buttons: {
add: { add: {
text: "上传自定义证书", text: "上传自定义证书",
type: "primary", type: "primary",
show: false, show: false,
async click() { async click() {
await openUploadCreateDialog(); await openUploadCreateDialog();
}, },
}, },
}, },
}, },
tabs: { tabs: {
name: "fromType", name: "fromType",
show: true, show: true,
}, },
rowHandle: { rowHandle: {
width: 100, width: 100,
fixed: "right", fixed: "right",
buttons: { buttons: {
view: { show: false }, view: { show: false },
viewCert: { viewCert: {
order: 3, order: 3,
title: "查看证书", title: t("certd.viewCert.title"),
type: "link", type: "link",
icon: "ph:certificate", icon: "ph:certificate",
async click({ row }) { async click({ row }) {
await viewCert(row); await viewCert(row);
}, },
}, },
copy: { show: false }, copy: { show: false },
edit: { show: false }, edit: { show: false },
remove: { remove: {
order: 10, order: 10,
show: false, show: false,
}, },
download: { download: {
order: 9, order: 9,
title: "下载证书", title: t("certd.download.title"),
type: "link", type: "link",
icon: "ant-design:download-outlined", icon: "ant-design:download-outlined",
async click({ row }) { async click({ row }) {
if (!row.certFile) { if (!row.certFile) {
notification.error({ message: "证书还未生成，请先运行流水线" }); notification.error({ message: t("certd.certificateNotGenerated") });
return; return;
} }
window.open("/api/monitor/cert/download?id=" + row.id); window.open("/api/monitor/cert/download?id=" + row.id);
}, },
}, },
},
}, },
columns: { },
id: { columns: {
title: "ID", id: {
key: "id", title: "ID",
type: "number", key: "id",
search: { type: "number",
show: false, search: {
}, show: false,
column: { },
width: 100, column: {
editable: { width: 100,
disabled: true, editable: {
}, disabled: true,
}, },
form: { },
show: false, form: {
}, show: false,
}, },
fromType: { },
title: "来源", fromType: {
search: { title: "来源",
show: true, search: {
}, show: true,
type: "dict-select", },
dict: dict({ type: "dict-select",
data: [ dict: dict({
{ label: "流水线", value: "pipeline" }, data: [
{ label: "手动上传", value: "upload" }, { label: "流水线", value: "pipeline" },
], { label: "手动上传", value: "upload" },
}), ],
form: { }),
show: false, form: {
}, show: false,
column: { },
width: 100, column: {
sorter: true, width: 100,
component: { sorter: true,
color: "auto", component: {
}, color: "auto",
conditionalRender: false, },
}, conditionalRender: false,
valueBuilder({ value, row, key }) { },
if (!value) { valueBuilder({ value, row, key }) {
row[key] = "pipeline"; if (!value) {
} row[key] = "pipeline";
}, }
}, },
domains: { },
title: "域名", domains: {
search: { title: "域名",
show: true, search: {
}, show: true,
type: "text", },
form: { type: "text",
rules: [{ required: true, message: "请输入域名" }], form: {
}, rules: [{ required: true, message: "请输入域名" }],
column: { },
width: 450, column: {
sorter: true, width: 450,
component: { sorter: true,
name: "fs-values-format", component: {
color: "auto", name: "fs-values-format",
}, color: "auto",
}, },
}, },
domainCount: { },
title: "域名数量", domainCount: {
type: "number", title: "域名数量",
form: { type: "number",
show: false, form: {
}, show: false,
column: { },
width: 120, column: {
sorter: true, width: 120,
show: false, sorter: true,
}, show: false,
}, },
expiresLeft: { },
title: "有效天数", expiresLeft: {
search: { title: "有效天数",
show: false, search: {
}, show: false,
type: "date", },
form: { type: "date",
show: false, form: {
}, show: false,
column: { },
sorter: true, column: {
conditionalRender: false, sorter: true,
cellRender({ row }) { conditionalRender: false,
const value = row.expiresTime; cellRender({ row }) {
if (!value) { const value = row.expiresTime;
return "-"; if (!value) {
} return "-";
const expireDate = dayjs(value).format("YYYY-MM-DD"); }
const leftDays = dayjs(value).diff(dayjs(), "day"); const expireDate = dayjs(value).format("YYYY-MM-DD");
const color = leftDays < 20 ? "red" : "#389e0d"; const leftDays = dayjs(value).diff(dayjs(), "day");
const percent = (leftDays / 90) * 100; const color = leftDays < 20 ? "red" : "#389e0d";
return <a-progress title={expireDate + "过期"} percent={percent} strokeColor={color} format={(percent: number) => `${leftDays}天`} />; const percent = (leftDays / 90) * 100;
}, return <a-progress title={expireDate + "过期"} percent={percent} strokeColor={color} format={(percent: number) => `${leftDays}天`} />;
}, },
}, },
expiresTime: { },
title: "过期时间", expiresTime: {
search: { title: "过期时间",
show: false, search: {
}, show: false,
type: "datetime", },
form: { type: "datetime",
show: false, form: {
}, show: false,
column: { },
sorter: true, column: {
}, sorter: true,
}, },
certProvider: { },
title: "证书颁发机构", certProvider: {
search: { title: "证书颁发机构",
show: false, search: {
}, show: false,
type: "text", },
form: { type: "text",
show: false, form: {
}, show: false,
column: { },
width: 200, column: {
}, width: 200,
}, },
applyTime: { },
title: "申请时间", applyTime: {
search: { title: "申请时间",
show: false, search: {
}, show: false,
type: "datetime", },
form: { type: "datetime",
show: false, form: {
}, show: false,
column: { },
sorter: true, column: {
}, sorter: true,
}, },
"pipeline.title": { },
title: "关联流水线", "pipeline.title": {
search: { show: false }, title: "关联流水线",
type: "link", search: { show: false },
form: { type: "link",
show: false, form: {
}, show: false,
column: { },
width: 350, column: {
sorter: true, width: 350,
component: { sorter: true,
on: { component: {
onClick({ row }) { on: {
router.push({ path: "/certd/pipeline/detail", query: { id: row.pipelineId, editMode: "false" } }); onClick({ row }) {
}, router.push({ path: "/certd/pipeline/detail", query: { id: row.pipelineId, editMode: "false" } });
}, },
}, },
}, },
}, },
}, },
}, },
}; },
};
} }

27
packages/ui/certd-client/src/views/certd/monitor/cert/index.vue
View File

@ -1,30 +1,33 @@
<template> <template>
<fs-page> <fs-page>
<template #header> <template #header>
<div class="title"> <div class="title">
证书仓库 {{ t("certd.certificateRepo.title") }}
<span class="sub">从流水线生成的证书</span> <span class="sub">{{ t("certd.certificateRepo.sub") }}</span>
</div> </div>
</template> </template>
<fs-crud ref="crudRef" v-bind="crudBinding"> </fs-crud> <fs-crud ref="crudRef" v-bind="crudBinding"> </fs-crud>
</fs-page> </fs-page>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { onActivated, onMounted } from "vue"; import { onActivated, onMounted } from "vue";
import { useFs } from "@fast-crud/fast-crud"; import { useFs } from "@fast-crud/fast-crud";
import createCrudOptions from "./crud"; import createCrudOptions from "./crud";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
defineOptions({ defineOptions({
name: "CertStore", name: "CertStore",
}); });
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: {} }); const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: {} });
// 页面打开后获取列表数据 // 页面打开后获取列表数据
onMounted(() => { onMounted(() => {
crudExpose.doRefresh(); crudExpose.doRefresh();
}); });
onActivated(() => { onActivated(() => {
crudExpose.doRefresh(); crudExpose.doRefresh();
}); });
</script> </script>