perf: 商业版支持自定义插件的参数配置

v2-dev-plugin-config
xiaojunnuo 2025-08-27 18:23:24 +08:00
parent 8e3d699856
commit 17f23f3751
13 changed files with 265 additions and 106 deletions

View File

@ -564,7 +564,7 @@ export default {
ipv6Priority: "IPv6 Priority",
dualStackNetworkHelper: "If IPv6 priority is selected, enable IPv6 in docker-compose.yaml",
enableCommonCnameService: "Enable Public CNAME Service",
commonCnameHelper: "Allow use of public CNAME service. If disabled and no <router-link to='/sys/cname/provider'>custom CNAME service</router-link> is set, CNAME proxy certificate application will not work.",
commonCnameHelper: "Allow use of public CNAME service. If disabled and no <a href='#/sys/cname/provider'>custom CNAME service</a> is set, CNAME proxy certificate application will not work.",
enableCommonSelfServicePasswordRetrieval: "Enable self-service password recovery",
saveButton: "Save",
stopSuccess: "Stopped successfully",

View File

@ -570,7 +570,7 @@ export default {
ipv6Priority: "IPV6优先",
dualStackNetworkHelper: "如果选择IPv6优先需要在docker-compose.yaml中启用ipv6",
enableCommonCnameService: "启用公共CNAME服务",
commonCnameHelper: "是否可以使用公共CNAME服务如果禁用且没有设置<router-link to='/sys/cname/provider'>自定义CNAME服务</router-link>则无法使用CNAME代理方式申请证书",
commonCnameHelper: "是否可以使用公共CNAME服务如果禁用且没有设置<a href='#/sys/cname/provider'>自定义CNAME服务</a>则无法使用CNAME代理方式申请证书",
enableCommonSelfServicePasswordRetrieval: "启用自助找回密码",
saveButton: "保存",
stopSuccess: "停止成功",

View File

@ -1,7 +1,8 @@
import { defineStore } from "pinia";
import * as api from "./api.plugin";
import { DynamicType, FormItemProps } from "@fast-crud/fast-crud";
import { DynamicType, FormItemProps, useMerge } from "@fast-crud/fast-crud";
import { i18n } from "/src/locales/i18n";
import { cloneDeep } from "lodash-es";
interface PluginState {
group?: PluginGroups;
}
@ -32,14 +33,17 @@ export class PluginGroups {
groups!: { [key: string]: PluginGroup };
map!: { [key: string]: PluginDefine };
t: any;
constructor(groups: { [key: string]: PluginGroup }) {
mergeSetting?: boolean;
constructor(groups: { [key: string]: PluginGroup }, opts?: { mergeSetting?: boolean }) {
this.groups = groups;
this.t = i18n.global.t;
this.mergeSetting = opts?.mergeSetting ?? false;
this.initGroup(groups);
this.initMap();
}
private initGroup(groups: { [p: string]: PluginGroup }) {
const { merge } = useMerge();
const all: PluginGroup = {
key: "all",
title: this.t("certd.all"),
@ -48,6 +52,14 @@ export class PluginGroups {
icon: "material-symbols:border-all-rounded",
};
for (const key in groups) {
if (this.mergeSetting) {
for (const plugin of groups[key].plugins) {
if (plugin.sysSetting) {
merge(plugin.input, plugin.sysSetting.metadata);
}
}
}
all.plugins.push(...groups[key].plugins);
}
this.groups = {
@ -132,11 +144,15 @@ export const usePluginStore = defineStore({
id: "app.plugin",
state: (): PluginState => ({
group: null,
originGroup: null,
}),
actions: {
async reload() {
const groups = await api.GetGroups({});
this.group = new PluginGroups(groups);
this.group = new PluginGroups(groups, { mergeSetting: true });
this.originGroup = new PluginGroups(cloneDeep(groups));
console.log("group", this.group);
console.log("originGroup", this.originGroup);
},
async init() {
if (!this.group) {
@ -159,6 +175,10 @@ export const usePluginStore = defineStore({
await this.init();
return this.group.get(name);
},
async getPluginDefineFromOrigin(name: string): Promise<PluginDefine> {
await this.init();
return this.originGroup.get(name);
},
async getPluginConfig(query: any) {
return await api.GetPluginConfig(query);
},

View File

@ -304,3 +304,11 @@ h6 {
padding: 10px;
color: #6e6e6e;
}
.ant-modal-body{
.fs-form-body{
max-height: 66vh;
overflow-y: auto;
}
}

View File

@ -138,6 +138,7 @@ export function useCertPipelineCreator() {
form: {
doSubmit,
wrapper: {
wrapClassName: "cert_pipeline_create_form",
width: 1350,
saveRemind: false,
title: t("certd.pipelineForm.createTitle"),

View File

@ -115,4 +115,13 @@ function batchRerun() {
padding-left: 10px;
}
}
.cert_pipeline_create_form {
.ant-collapse {
margin: 10px;
}
.ant-collapse-header {
text-align: right;
}
}
</style>

View File

@ -43,7 +43,7 @@
</a-tab-pane>
</a-tabs>
<a-form-item>
<a-button type="primary" size="large" html-type="submit" :loading="loading" class="login-button">
<a-button type="primary" size="large" html-type="button" :loading="loading" class="login-button" @click="handleFinish">
{{ t("authentication.loginButton") }}
</a-button>
@ -217,7 +217,6 @@ export default defineComponent({
</script>
<style lang="less">
.login-page.main {
//margin: 20px !important;
margin-bottom: 100px;

View File

@ -7,38 +7,49 @@
</div>
<div class="p-10">
<div ref="formRef" class="config-form w-full" :label-col="labelCol" :wrapper-col="wrapperCol">
<template v-for="(item, key) in originInputs" :key="key">
<div>
<div :label="item.title">
<label class="flex mt-5">
<span class="w-20 flex-shrink-0">默认值</span>
<rollbackable :value="configForm[key].value" @set="configForm[key].value = item.value ?? null" @clear="unset(configForm, `${key}.value`)"></rollbackable>
</label>
<label class="flex mt-5">
<span class="w-20 flex-shrink-0">是否显示</span>
<rollbackable :value="configForm[key].show" @set="set(configForm, `${key}.show`, item.show ?? null)" @clear="unset(configForm, `${key}.show`)"></rollbackable>
</label>
<label class="flex mt-5">
<span class="w-20 flex-shrink-0">帮助说明</span>
{{ configForm[key].helper }}
<rollbackable :value="configForm[key].helper" @setter="configForm[key].helper = item.helper" @clear1="delete configForm[key].helper"></rollbackable>
</label>
</div>
</div>
</template>
<table class="table-fixed w-full">
<thead>
<tr>
<th class="text-left p-5" width="200px">插件参数</th>
<th class="text-left p-5" width="100px">参数配置</th>
<th class="text-left flex-1 p-5">自定义</th>
</tr>
</thead>
<tbody>
<template v-for="(item, key) in originInputs" :key="key">
<template v-for="prop in editableKeys" :key="prop.key">
<tr>
<td v-if="prop.key === 'value'" class="border-t-2 p-5" rowspan="3" :class="{ 'border-t-2': prop.key === 'value' }">{{ item.title }}</td>
<td class="border-t p-5" :class="{ 'border-t-2': prop.key === 'value' }">{{ prop.label }}</td>
<td class="border-t p-5" :class="{ 'border-t-2': prop.key === 'value' }">
<rollbackable :value="configForm[key][prop.key]" @set="configForm[key][prop.key] = item[prop.key] ?? null" @clear="delete configForm[key][prop.key]">
<template #default>
<fs-render :render-func="prop.defaultRender(key, item)"></fs-render>
</template>
<template #edit>
<fs-render :render-func="prop.editRender(key, item)"></fs-render>
</template>
</rollbackable>
</td>
</tr>
</template>
</template>
</tbody>
</table>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
<script setup lang="tsx">
import { computed, nextTick, onMounted, reactive, ref, Ref, unref } from "vue";
import { useRoute, useRouter } from "vue-router";
import * as api from "./api";
import { usePluginStore } from "/@/store/plugin";
import { cloneDeep, get, merge, set, unset } from "lodash-es";
import Rollbackable from "./rollbackable.vue";
import { FsRender } from "@fast-crud/fast-crud";
const route = useRoute();
const router = useRouter();
const pluginStore = usePluginStore();
@ -48,7 +59,6 @@ const props = defineProps<{
const pluginMetadata = ref<any>("");
const currentPlugin = ref();
console.log("111111111111111111111");
const labelCol = ref({
span: null,
style: {
@ -71,9 +81,49 @@ function getForm() {
}
const editableKeys = ref([
{ key: "value", label: "默认值" },
{ key: "show", label: "是否显示", component: { name: "a-switch", vModel: "checked" } },
{ key: "helper", label: "帮助说明", component: { name: "a-textarea", vModel: "value", rows: 4 } },
{
key: "value",
label: "默认值",
defaultRender(key: string, item: any) {
return () => {
return item["value"] ?? "";
};
},
editRender(key: string, item: any) {
return () => {
return <fs-component-render {...item.component} vModel:modelValue={configForm[key]["value"]} scope={getScope()} />;
};
},
},
{
key: "show",
label: "是否显示",
defaultRender(key: string, item: any) {
return () => {
const value = item["show"];
return value === false ? "不显示" : "显示";
};
},
editRender(key: string, item: any) {
return () => {
return <a-switch vModel:checked={configForm[key]["show"]} />;
};
},
},
{
key: "helper",
label: "帮助说明",
defaultRender(key: string, item: any) {
return () => {
return <pre class={"helper"}>{item["helper"]}</pre>;
};
},
editRender(key: string, item: any) {
return () => {
return <a-textarea rows={5} vModel:value={configForm[key]["helper"]} />;
};
},
},
]);
const originInputs = computed(() => {
@ -98,7 +148,7 @@ function clearFormValue(key: string) {
}
async function loadPluginSetting() {
currentPlugin.value = await pluginStore.getPluginDefine(props.plugin.name);
currentPlugin.value = await pluginStore.getPluginDefineFromOrigin(props.plugin.name);
for (const key in currentPlugin.value.input) {
configForm[key] = {};
}
@ -113,7 +163,9 @@ onMounted(async () => {
await loadPluginSetting();
});
function doSave() {}
defineExpose({
getForm,
});
</script>
<style lang="less">

View File

@ -1,32 +1,45 @@
<script setup lang="ts">
import { cloneDeep, get, merge, set, unset } from "lodash-es";
import { defineProps } from "vue";
const props = defineProps<{ value: any }>();
const emits = defineEmits(["setter", "clear1"]);
const emits = defineEmits(["set", "clear"]);
function setValue() {
console.log("33333");
emits("setter");
emits("set");
}
function clearValue() {
console.log("4444");
emits("clear1");
emits("clear");
}
</script>
<template>
<div class="rollbackable">
<div class="flex">
<div>
<div style="width: 100px">
<a-tag v-if="value === undefined" color="green" size="small" class="pointer flex-inline items-center" @click.stop="setValue">
<fs-icon icon="material-symbols:edit" class="mr-5"></fs-icon>
自定义
</a-tag>
<a-tag v-else color="red" size="small" class="pointer flex-inline items-center" @click.stop="clearValue">
<fs-icon icon="material-symbols:undo" class="mr-5"></fs-icon>
还原
</a-tag>
</div>
<div class="flex-1 overflow-hidden value-render">
<slot v-if="value === undefined" name="default"></slot>
<slot v-else name="edit"></slot>
</div>
<div>
<div v-if="value === undefined" type="primary" size="small" @click.stop="setValue"></div>
<div v-else style="margin-left: 100px" type="primary" size="small" @click.stop="clearValue">还原</div>
</div>
</div>
</div>
</template>
<style scoped lang="less"></style>
<style lang="less">
.rollbackable {
.value-render {
.ant-select,
.ant-input {
width: 100%;
}
}
}
</style>

View File

@ -4,54 +4,67 @@ import { useI18n } from "/@/locales";
import { Modal, notification } from "ant-design-vue";
import ConfigEditor from "./config-editor.vue";
import { useModal } from "/@/use/use-modal";
import { ref } from "vue";
export function usePluginConfig() {
const { openCrudFormDialog } = useFormWrapper();
const { t } = useI18n();
const modal = useModal();
async function openConfigDialog({ row, crudExpose }) {
// function createCrudOptions() {
// return {
// crudOptions: {
// columns: {},
// form: {
// wrapper: {
// width: "80%",
// title: "插件元数据配置",
// saveRemind: false,
// slots: {
// "form-body-top": () => {
// return (
// <div>
// <ConfigEditor plugin={row}></ConfigEditor>
// </div>
// );
// },
// },
// },
// afterSubmit() {
// notification.success({ message: t("certd.operationSuccess") });
// crudExpose.doRefresh();
// },
// async doSubmit({ form }: any) {
// return await api.ImportPlugin({
// ...form,
// });
// },
// },
// },
// };
// }
// const { crudOptions } = createCrudOptions();
// await openCrudFormDialog({ crudOptions });
const configEditorRef = ref();
function createCrudOptions() {
return {
crudOptions: {
columns: {},
form: {
wrapper: {
width: "80%",
title: "插件元数据配置",
saveRemind: false,
slots: {
"form-body-top": () => {
return (
<div>
<ConfigEditor ref={configEditorRef} plugin={row}></ConfigEditor>
</div>
);
},
},
},
afterSubmit() {
notification.success({ message: t("certd.operationSuccess") });
crudExpose.doRefresh();
},
async doSubmit({}: any) {
const form = configEditorRef.value.getForm();
const newForm: any = {};
for (const key in form) {
const value = form[key];
if (value && Object.keys(value).length > 0) {
newForm[key] = value;
}
}
return await api.savePluginSetting({
name: row.name,
sysSetting: {
metadata: newForm,
},
});
},
},
},
};
}
const { crudOptions } = createCrudOptions();
await openCrudFormDialog({ crudOptions });
modal.confirm({
title: "插件元数据配置",
width: "80%",
content: () => {
return <ConfigEditor plugin={row}></ConfigEditor>;
},
});
// modal.confirm({
// title: "插件元数据配置",
// width: "80%",
// content: () => {
// return <ConfigEditor plugin={row}></ConfigEditor>;
// },
// });
}
return {

View File

@ -2,7 +2,11 @@ import { ALL, Body, Controller, Inject, Post, Provide, Query } from '@midwayjs/c
import { merge } from 'lodash-es';
import { CrudController } from '@certd/lib-server';
import { PluginImportReq, PluginService } from "../../../modules/plugin/service/plugin-service.js";
import { CommPluginConfig, PluginConfigService } from '../../../modules/plugin/service/plugin-config-service.js';
import {
CommPluginConfig,
PluginConfig,
PluginConfigService
} from '../../../modules/plugin/service/plugin-config-service.js';
/**
*
*/
@ -79,7 +83,11 @@ export class PluginController extends CrudController<PluginService> {
const res = await this.pluginConfigService.saveCommPluginConfig(body);
return this.ok(res);
}
@Post('/saveSetting', { summary: 'sys:settings:edit' })
async saveSetting(@Body(ALL) body: PluginConfig) {
const res = await this.pluginConfigService.savePluginConfig(body);
return this.ok(res);
}
@Post('/import', { summary: 'sys:settings:edit' })
async import(@Body(ALL) body: PluginImportReq) {

View File

@ -3,7 +3,7 @@ import { PluginService } from './plugin-service.js';
export type PluginConfig = {
name: string;
disabled: boolean;
disabled?: boolean;
sysSetting: {
input?: Record<string, any>;
metadata?: Record<string, any>;
@ -38,10 +38,12 @@ export class PluginConfigService {
}
async saveCommPluginConfig(config: CommPluginConfig) {
await this.savePluginConfig('CertApply', config.CertApply);
config.CertApply.name = 'CertApply';
await this.savePluginConfig(config.CertApply);
}
async savePluginConfig(name: string, config: PluginConfig) {
async savePluginConfig( config: PluginConfig) {
const name = config.name;
const sysSetting = config?.sysSetting;
if (!sysSetting) {
throw new Error(`${name}.sysSetting is required`);

View File

@ -1,16 +1,16 @@
import { Inject, Provide, Scope, ScopeEnum } from "@midwayjs/core";
import { BaseService, PageReq } from "@certd/lib-server";
import { PluginEntity } from "../entity/plugin.js";
import { InjectEntityModel } from "@midwayjs/typeorm";
import { Repository } from "typeorm";
import { isComm } from "@certd/plus-core";
import { BuiltInPluginService } from "../../pipeline/service/builtin-plugin-service.js";
import { merge } from "lodash-es";
import { accessRegistry, notificationRegistry, pluginRegistry } from "@certd/pipeline";
import { dnsProviderRegistry } from "@certd/plugin-cert";
import { logger } from "@certd/basic";
import {Inject, Provide, Scope, ScopeEnum} from "@midwayjs/core";
import {BaseService, PageReq} from "@certd/lib-server";
import {PluginEntity} from "../entity/plugin.js";
import {InjectEntityModel} from "@midwayjs/typeorm";
import {IsNull, Not, Repository} from "typeorm";
import {isComm} from "@certd/plus-core";
import {BuiltInPluginService} from "../../pipeline/service/builtin-plugin-service.js";
import {merge} from "lodash-es";
import {accessRegistry, notificationRegistry, pluginRegistry} from "@certd/pipeline";
import {dnsProviderRegistry} from "@certd/plugin-cert";
import {logger} from "@certd/basic";
import yaml from "js-yaml";
import { getDefaultAccessPlugin, getDefaultDeployPlugin, getDefaultDnsPlugin } from "./default-plugin.js";
import {getDefaultAccessPlugin, getDefaultDeployPlugin, getDefaultDnsPlugin} from "./default-plugin.js";
import fs from "fs";
import path from "path";
@ -57,9 +57,9 @@ export class PluginService extends BaseService<PluginEntity> {
};
}
async getEnabledBuildInGroup(isSimple = false) {
async getEnabledBuildInGroup(opts?:{isSimple?:boolean,withSetting?:boolean}) {
const groups = this.builtInPluginService.getGroups();
if (isSimple) {
if (opts?.isSimple) {
for (const key in groups) {
const group = groups[key];
group.plugins.forEach(item => {
@ -72,9 +72,43 @@ export class PluginService extends BaseService<PluginEntity> {
if (!isComm()) {
return groups;
}
// 初始化设置
const settingPlugins = await this.repository.find({
select:{
id:true,
name:true,
sysSetting:true
},
where: {
sysSetting : Not(IsNull())
}
})
//合并插件配置
const pluginSettingMap:any = {}
for (const item of settingPlugins) {
if (!item.sysSetting) {
continue;
}
pluginSettingMap[item.name] = JSON.parse(item.sysSetting);
}
for (const key in groups) {
const group = groups[key];
if (!group.plugins) {
continue;
}
for (const item of group.plugins) {
const pluginSetting = pluginSettingMap[item.name];
if (pluginSetting){
item.sysSetting = pluginSetting
}
}
}
//排除禁用的
const list = await this.list({
query: {
type: "builtIn",
disabled: true
}
});