feat: 新增证书申请参数模版管理,开放接口支持使用证书参数模版和指定证书申请参数

This commit is contained in:
xiaojunnuo
2026-06-02 23:08:10 +08:00
parent 3e4b7f30ac
commit f8b71a0e61
21 changed files with 1130 additions and 12 deletions
@@ -12,6 +12,7 @@ export default {
settings: "Settings",
accessManager: "Access Management",
dnsPersistRecord: "DNS Persist Records",
certApplyTemplate: "Certificate Apply Templates",
subDomain: "Subdomain Delegation Settings",
pipelineGroup: "Pipeline Group Management",
openKey: "Open API Key",
@@ -12,6 +12,7 @@ export default {
settings: "设置",
accessManager: "授权管理",
dnsPersistRecord: "DNS持久验证记录",
certApplyTemplate: "证书申请参数模版",
subDomain: "子域名托管设置",
pipelineGroup: "流水线分组管理",
openKey: "开放接口密钥",
@@ -197,6 +197,17 @@ export const certdResources = [
keepAlive: true,
},
},
{
title: "certd.certApplyTemplate",
name: "CertApplyTemplate",
path: "/certd/cert/apply-template",
component: "/certd/cert/apply-template/index.vue",
meta: {
icon: "ion:list-circle-outline",
auth: true,
keepAlive: true,
},
},
{
title: "certd.subDomain",
name: "SubDomain",
@@ -0,0 +1,66 @@
import { request } from "/src/api/service";
const apiPrefix = "/cert/apply-template";
export async function GetList(query: any) {
return await request({
url: apiPrefix + "/page",
method: "post",
data: query,
});
}
export async function ListAll() {
return await request({
url: apiPrefix + "/list",
method: "post",
data: {},
});
}
export async function AddObj(obj: any) {
return await request({
url: apiPrefix + "/add",
method: "post",
data: obj,
});
}
export async function UpdateObj(obj: any) {
return await request({
url: apiPrefix + "/update",
method: "post",
data: obj,
});
}
export async function DelObj(id: number) {
return await request({
url: apiPrefix + "/delete",
method: "post",
params: { id },
});
}
export async function GetObj(id: number) {
return await request({
url: apiPrefix + "/info",
method: "post",
params: { id },
});
}
export async function SetDefault(id: number) {
return await request({
url: apiPrefix + "/setDefault",
method: "post",
data: { id },
});
}
export async function GetDefault() {
return await request({
url: apiPrefix + "/default",
method: "post",
});
}
@@ -0,0 +1,164 @@
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, useFormWrapper, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
import { message } from "ant-design-vue";
import * as api from "./api";
import { useProjectStore } from "/@/store/project";
import { usePluginStore } from "/@/store/plugin";
import { buildCertApplyTemplateColumns, buildTemplateSubmitData, pickCertApplyTemplateParams } from "./fields";
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
const pluginStore = usePluginStore();
const projectStore = useProjectStore();
const { openCrudFormDialog } = useFormWrapper();
const isDefaultDict = dict({
data: [
{ value: true, label: "默认", color: "green" },
{ value: false, label: "否", color: "gray" },
],
});
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
return await api.GetList(query);
};
const addRequest = async ({ form }: AddReq) => {
return await api.AddObj(buildTemplateSubmitData(form));
};
const editRequest = async ({ form, row }: EditReq) => {
form.id = row.id;
return await api.UpdateObj(buildTemplateSubmitData(form));
};
const delRequest = async ({ row }: DelReq) => {
return await api.DelObj(row.id);
};
async function setDefault(row: any) {
await api.SetDefault(row.id);
message.success("设置成功");
await crudExpose.doRefresh();
}
async function openForm(row?: any) {
const certPlugin: any = await pluginStore.getPluginDefine("CertApply");
const columns = buildCertApplyTemplateColumns(certPlugin);
const content = row?.content ? (typeof row.content === "string" ? JSON.parse(row.content || "{}") : row.content) : {};
const initialForm = row
? {
id: row.id,
name: row.name,
isDefault: row.isDefault,
disabled: row.disabled,
...pickCertApplyTemplateParams(content),
}
: {};
await openCrudFormDialog({
crudOptions: {
columns,
form: {
mode: row ? "edit" : "add",
initialForm,
wrapper: {
width: 1100,
title: row ? "编辑证书申请参数模版" : "新增证书申请参数模版",
saveRemind: false,
},
col: {
span: 12,
},
async doSubmit({ form }: any) {
if (row) {
await editRequest({ form, row } as any);
} else {
await addRequest({ form } as any);
}
},
async afterSubmit() {
await crudExpose.doRefresh();
},
},
},
});
}
return {
crudOptions: {
request: {
pageRequest,
addRequest,
editRequest,
delRequest,
},
search: {
initialForm: {
...projectStore.getSearchForm(),
},
},
actionbar: {
buttons: {
add: {
icon: "ion:add-circle-outline",
click: () => openForm(),
},
},
},
rowHandle: {
fixed: "right",
width: 120,
buttons: {
edit: {
click: ({ row }) => openForm(row),
},
remove: {},
},
},
columns: {
id: {
title: "ID",
type: "number",
column: { width: 80 },
form: { show: false },
},
name: {
title: "模版名称",
type: "text",
search: { show: true },
column: { minWidth: 220 },
},
isDefault: {
title: "默认",
type: "dict-switch",
dict: isDefaultDict,
column: {
width: 150,
cellRender({ value, row }) {
return (
<div class="flex items-center gap-2">
<fs-values-format modelValue={value} dict={isDefaultDict}></fs-values-format>
{!row.isDefault && (
<a-tooltip title="设为默认">
<fs-icon class="pointer color-primary" icon="ion:star-outline" onClick={() => setDefault(row)}></fs-icon>
</a-tooltip>
)}
</div>
);
},
},
},
disabled: {
title: "禁用",
type: "dict-switch",
column: { width: 100 },
},
createTime: {
title: "创建时间",
type: "datetime",
column: { width: 180 },
},
content: {
title: "配置",
type: "text",
column: { show: false },
form: { show: false },
},
},
},
};
}
@@ -0,0 +1,94 @@
import { cloneDeep, merge, omit } from "lodash-es";
import { useReference } from "/@/use/use-refrence";
export const certApplyTemplateExcludeParamFields = ["domains", "domainsVerifyPlan"];
const excludeFieldSet = new Set(certApplyTemplateExcludeParamFields);
export function pickCertApplyTemplateParams(input: any = {}) {
const params: any = {};
for (const key of Object.keys(input || {})) {
if (!excludeFieldSet.has(key) && input[key] !== undefined) {
params[key] = input[key];
}
}
return params;
}
export function buildCertApplyTemplateColumns(certPlugin: any) {
const columns: any = {
name: {
title: "模版名称",
type: "text",
form: {
required: true,
order: -1000,
},
},
};
for (const key of Object.keys(certPlugin?.input || {})) {
if (excludeFieldSet.has(key)) {
continue;
}
const inputDefine = cloneDeep(certPlugin?.input?.[key]);
if (!inputDefine) {
continue;
}
useReference(inputDefine);
columns[key] = {
title: inputDefine.title,
form: {
...inputDefine,
},
};
}
// if (columns.acmeAccountAccessId?.form) {
// columns.acmeAccountAccessId.form.show = true;
// columns.acmeAccountAccessId.form.required = false;
// columns.acmeAccountAccessId.form.component = {
// ...columns.acmeAccountAccessId.form.component,
// type: "acmeAccount",
// subtype: undefined,
// };
// }
merge(columns, {
isDefault: {
title: "默认模版",
type: "switch",
form: {
value: false,
component: {
name: "a-switch",
vModel: "checked",
},
order: 900,
},
},
disabled: {
title: "禁用",
type: "switch",
form: {
value: false,
component: {
name: "a-switch",
vModel: "checked",
},
order: 901,
},
},
});
return columns;
}
export function buildTemplateSubmitData(form: any) {
return {
id: form.id,
name: form.name,
content: pickCertApplyTemplateParams(omit(form, ["id", "name", "content", "isDefault", "disabled"])),
isDefault: form.isDefault,
disabled: form.disabled,
};
}
@@ -0,0 +1,36 @@
<template>
<fs-page class="page-cert-apply-template">
<template #header>
<div class="title">
证书申请参数模版
<span class="sub">预设证书申请参数不包含域名和校验方式</span>
</div>
</template>
<fs-crud ref="crudRef" v-bind="crudBinding"> </fs-crud>
</fs-page>
</template>
<script lang="ts" setup>
import { onActivated, onMounted } from "vue";
import { useFs } from "@fast-crud/fast-crud";
import createCrudOptions from "./crud";
defineOptions({
name: "CertApplyTemplate",
});
const { crudBinding, crudRef, crudExpose } = useFs({
createCrudOptions,
context: {
permission: { isProjectPermission: true },
},
});
onMounted(() => {
crudExpose.doRefresh();
});
onActivated(() => {
crudExpose.doRefresh();
});
</script>
@@ -1,12 +1,12 @@
import { checkPipelineLimit } from "/@/views/certd/pipeline/utils";
import { cloneDeep, merge, omit } from "lodash-es";
import { message } from "ant-design-vue";
import { message, Modal } from "ant-design-vue";
import { nanoid } from "nanoid";
import { useRouter } from "vue-router";
import { compute, CreateCrudOptionsRet, dict, useFormWrapper } from "@fast-crud/fast-crud";
import NotificationSelector from "/@/views/certd/notification/notification-selector/index.vue";
import { useReference } from "/@/use/use-refrence";
import { computed, provide, Ref, ref } from "vue";
import { computed, provide, reactive, Ref, ref } from "vue";
import * as api from "../api";
import { PluginGroup, usePluginStore } from "/@/store/plugin";
import { createNotificationApi } from "/@/views/certd/notification/api";
@@ -14,6 +14,8 @@ import GroupSelector from "../group/group-selector.vue";
import { useI18n } from "/src/locales";
import { useSettingStore } from "/@/store/settings";
import dayjs from "dayjs";
import * as certApplyTemplateApi from "/@/views/certd/cert/apply-template/api";
import { buildCertApplyTemplateColumns, buildTemplateSubmitData, pickCertApplyTemplateParams } from "/@/views/certd/cert/apply-template/fields";
export function fillPipelineByDefaultForm(pipeline: any, form: any) {
const triggers = [];
@@ -107,6 +109,7 @@ export function useCertPipelineCreator({ formWrapperRef }: { formWrapperRef: Ref
const pluginStore = usePluginStore();
const settingStore = useSettingStore();
const router = useRouter();
const { openCrudFormDialog: openInnerCrudFormDialog } = useFormWrapper();
function createCrudOptions(req: { certPlugin: any; doSubmit: any; title?: string; initialForm?: any }): CreateCrudOptionsRet {
const inputs: any = {};
@@ -150,6 +153,236 @@ export function useCertPipelineCreator({ formWrapperRef }: { formWrapperRef: Ref
const initialForm = req.initialForm || {};
initialForm.type = certPlugin.name;
const templateDict = dict({
value: "id",
label: "name",
async getData() {
return await certApplyTemplateApi.ListAll();
},
async getNodesByValues(ids: any[]) {
const list = await certApplyTemplateApi.ListAll();
return list.filter((item: any) => ids.includes(item.id));
},
immediate: false,
});
const applyTemplates = reactive<any[]>([]);
async function reloadApplyTemplates() {
const list = await certApplyTemplateApi.ListAll();
applyTemplates.splice(0, applyTemplates.length, ...list);
return list;
}
async function applyTemplateToForm(templateId: number, form: any) {
if (!templateId) {
return;
}
const template = await certApplyTemplateApi.GetObj(templateId);
const params = pickCertApplyTemplateParams(typeof template.content === "string" ? JSON.parse(template.content || "{}") : template.content);
form.input = {
...form.input,
...params,
};
}
function getSelectedApplyTemplateName(form: any) {
if (!form?.applyTemplateId) {
return "选择模版";
}
const template = applyTemplates.find(item => item.id === form.applyTemplateId);
return template?.name || "选择模版";
}
async function saveCurrentTemplate(form: any) {
await openInnerCrudFormDialog({
crudOptions: {
columns: {
name: {
title: "模版名称",
type: "text",
form: {
required: true,
},
},
isDefault: {
title: "设为默认",
type: "switch",
form: {
value: false,
component: {
name: "a-switch",
vModel: "checked",
},
},
},
},
form: {
mode: "add",
wrapper: {
width: 520,
title: "保存证书申请参数模版",
saveRemind: false,
},
col: {
span: 24,
},
async doSubmit({ form: templateForm }: any) {
await certApplyTemplateApi.AddObj({
name: templateForm.name,
isDefault: templateForm.isDefault,
content: pickCertApplyTemplateParams(form.input),
});
await reloadApplyTemplates();
await templateDict.reloadDict();
message.success("保存成功");
},
},
},
});
}
async function openApplyTemplateEditor(templateId: number) {
const row = await certApplyTemplateApi.GetObj(templateId);
const columns = buildCertApplyTemplateColumns(certPlugin);
const content = row?.content ? (typeof row.content === "string" ? JSON.parse(row.content || "{}") : row.content) : {};
await openInnerCrudFormDialog({
crudOptions: {
columns,
form: {
mode: "edit",
initialForm: {
id: row.id,
name: row.name,
isDefault: row.isDefault,
disabled: row.disabled,
...pickCertApplyTemplateParams(content),
},
wrapper: {
width: 1100,
title: "编辑证书申请参数模版",
saveRemind: false,
},
col: {
span: 12,
},
async doSubmit({ form: templateForm }: any) {
await certApplyTemplateApi.UpdateObj(buildTemplateSubmitData(templateForm));
await reloadApplyTemplates();
await templateDict.reloadDict();
message.success("保存成功");
},
},
},
});
}
function deleteApplyTemplate(templateId: number) {
Modal.confirm({
title: "确认删除该模版?",
content: "删除后无法恢复。",
async onOk() {
await certApplyTemplateApi.DelObj(templateId);
await reloadApplyTemplates();
await templateDict.reloadDict();
message.success("删除成功");
},
});
}
function stopMenuAction(event: MouseEvent, action: () => void) {
event.preventDefault();
event.stopPropagation();
action();
}
function goApplyTemplateManage() {
formWrapperRef.value?.close?.();
router.push({ name: "CertApplyTemplate" });
}
function renderTemplateFooter(scope: any) {
if (certPlugin.name !== "CertApply") {
return null;
}
const form = scope?.getFormData?.();
if (!form) {
return null;
}
return (
<div class="flex items-center">
<a-dropdown
trigger={["click"]}
onOpenChange={(open: boolean) => {
if (open) {
reloadApplyTemplates();
}
}}
v-slots={{
overlay: () => (
<a-menu
onClick={({ key }: any) => {
if (key === "save") {
saveCurrentTemplate(form);
return;
}
if (key === "empty") {
return;
}
const templateId = Number(key);
form.applyTemplateId = templateId;
applyTemplateToForm(templateId, form);
}}
>
{applyTemplates.length === 0 ? (
<a-menu-item key="empty" disabled>
</a-menu-item>
) : (
applyTemplates.map(item => (
<a-menu-item key={item.id}>
<div class="flex items-center justify-between gap-4 min-w-80">
<span class="truncate">{item.name}</span>
<span class="flex items-center gap-2 shrink-0">
<a-button size="small" type="link" onClick={(event: MouseEvent) => stopMenuAction(event, () => openApplyTemplateEditor(item.id))}>
</a-button>
<a-button size="small" type="link" danger onClick={(event: MouseEvent) => stopMenuAction(event, () => deleteApplyTemplate(item.id))}>
</a-button>
</span>
</div>
</a-menu-item>
))
)}
<a-menu-divider />
<a-menu-item key="save">
<div class="flex items-center justify-between gap-4 min-w-80">
<div class="flex items-center">
<fs-icon icon="ion:save-outline" />
<span class="ml-1"></span>
</div>
<a-tooltip title="证书参数模版管理">
<a-button size="small" type="link" onClick={(event: MouseEvent) => stopMenuAction(event, goApplyTemplateManage)}>
<fs-icon icon="ion:list-circle-outline" />
</a-button>
</a-tooltip>
</div>
</a-menu-item>
</a-menu>
),
}}
>
<a-tooltip title="选择参数模版,自动填充证书申请参数">
<a-button>
<span class="inline-block max-w-48 truncate align-bottom">{getSelectedApplyTemplateName(form)}</span>
<fs-icon icon="ion:chevron-down" class="ml-1" />
</a-button>
</a-tooltip>
</a-dropdown>
</div>
);
}
return {
crudOptions: {
form: {
@@ -160,6 +393,9 @@ export function useCertPipelineCreator({ formWrapperRef }: { formWrapperRef: Ref
width: 1350,
saveRemind: false,
title: req.title || t("certd.pipelineForm.createTitle"),
slots: {
"form-footer-left": renderTemplateFooter,
},
},
group: {
groups: {
@@ -323,6 +559,15 @@ export function useCertPipelineCreator({ formWrapperRef }: { formWrapperRef: Ref
initialForm.input[key] = pluginSysConfig.sysSetting?.input[key];
}
}
const defaultTemplate = req.pluginName === "CertApply" ? await certApplyTemplateApi.GetDefault() : null;
if (defaultTemplate) {
initialForm.applyTemplateId = defaultTemplate.id;
const templateParams = pickCertApplyTemplateParams(typeof defaultTemplate.content === "string" ? JSON.parse(defaultTemplate.content || "{}") : defaultTemplate.content);
initialForm.input = {
...initialForm.input,
...templateParams,
};
}
async function doSubmit({ form }: any) {
// const certDetail = readCertDetail(form.cert.crt);
@@ -75,7 +75,6 @@ import { groupDictRef } from "./group/dicts";
import { useCertPipelineCreator } from "./certd-form/use";
import { useRouter } from "vue-router";
import { useCrudPermission } from "/@/plugin/permission";
import CertdForm from "./certd-form/certd-form.vue";
defineOptions({
name: "PipelineManager",