mirror of https://github.com/certd/certd
chore:
parent
2ca20be197
commit
3e079e3b80
|
@ -5,6 +5,7 @@ import { i18n } from "/src/locales/i18n";
|
||||||
import { cloneDeep } from "lodash-es";
|
import { cloneDeep } from "lodash-es";
|
||||||
interface PluginState {
|
interface PluginState {
|
||||||
group?: PluginGroups;
|
group?: PluginGroups;
|
||||||
|
originGroup?: PluginGroups;
|
||||||
}
|
}
|
||||||
|
|
||||||
export type PluginGroup = {
|
export type PluginGroup = {
|
||||||
|
@ -55,7 +56,7 @@ export class PluginGroups {
|
||||||
if (this.mergeSetting) {
|
if (this.mergeSetting) {
|
||||||
for (const plugin of groups[key].plugins) {
|
for (const plugin of groups[key].plugins) {
|
||||||
if (plugin.sysSetting) {
|
if (plugin.sysSetting) {
|
||||||
merge(plugin.input, plugin.sysSetting.metadata);
|
merge(plugin.input, plugin.sysSetting.metadata?.input || {});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -166,6 +167,7 @@ export const usePluginStore = defineStore({
|
||||||
},
|
},
|
||||||
async clear() {
|
async clear() {
|
||||||
this.group = null;
|
this.group = null;
|
||||||
|
this.originGroup = null
|
||||||
},
|
},
|
||||||
async getList(): Promise<PluginDefine[]> {
|
async getList(): Promise<PluginDefine[]> {
|
||||||
await this.init();
|
await this.init();
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<div class="origin-metadata w-100%">
|
<div class="origin-metadata w-100%">
|
||||||
<div class="block-title">
|
<div class="block-title">
|
||||||
自定义插件参数配置
|
自定义插件参数配置
|
||||||
<div class="helper">1111</div>
|
<div class="helper">可以设置插件选项的配置,设置配置默认值、修改帮助说明、设置是否显示该字段等</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-10">
|
<div class="p-10">
|
||||||
<div ref="formRef" class="config-form w-full" :label-col="labelCol" :wrapper-col="wrapperCol">
|
<div ref="formRef" class="config-form w-full" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||||
|
@ -16,18 +16,18 @@
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<template v-for="(item, key) in originInputs" :key="key">
|
<template v-for="item in originInputs" :key="item.key">
|
||||||
<template v-for="prop in editableKeys" :key="prop.key">
|
<template v-for="prop in editableKeys" :key="prop.key">
|
||||||
<tr>
|
<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 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' }">{{ prop.label }}</td>
|
||||||
<td class="border-t p-5" :class="{ 'border-t-2': prop.key === 'value' }">
|
<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]">
|
<rollbackable :value="configForm[item.key][prop.key]" @set="prop.onSet(item)" @clear="delete configForm[item.key][prop.key]">
|
||||||
<template #default>
|
<template #default>
|
||||||
<fs-render :render-func="prop.defaultRender(key, item)"></fs-render>
|
<fs-render :render-func="prop.defaultRender(item)"></fs-render>
|
||||||
</template>
|
</template>
|
||||||
<template #edit>
|
<template #edit>
|
||||||
<fs-render :render-func="prop.editRender(key, item)"></fs-render>
|
<fs-render :render-func="prop.editRender(item)"></fs-render>
|
||||||
</template>
|
</template>
|
||||||
</rollbackable>
|
</rollbackable>
|
||||||
</td>
|
</td>
|
||||||
|
@ -73,9 +73,7 @@ function getScope() {
|
||||||
form: configForm,
|
form: configForm,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
function getScopeFunc() {
|
|
||||||
return getScope;
|
|
||||||
}
|
|
||||||
function getForm() {
|
function getForm() {
|
||||||
return configForm;
|
return configForm;
|
||||||
}
|
}
|
||||||
|
@ -84,43 +82,52 @@ const editableKeys = ref([
|
||||||
{
|
{
|
||||||
key: "value",
|
key: "value",
|
||||||
label: "默认值",
|
label: "默认值",
|
||||||
defaultRender(key: string, item: any) {
|
onSet(item: any) {
|
||||||
|
configForm[item.key]["value"] = item.value ?? null;
|
||||||
|
},
|
||||||
|
defaultRender(item: any) {
|
||||||
return () => {
|
return () => {
|
||||||
return item["value"] ?? "";
|
return item["value"] ?? "";
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
editRender(key: string, item: any) {
|
editRender(item: any) {
|
||||||
return () => {
|
return () => {
|
||||||
return <fs-component-render {...item.component} vModel:modelValue={configForm[key]["value"]} scope={getScope()} />;
|
return <fs-component-render {...item.component} vModel:modelValue={configForm[item.key]["value"]} scope={getScope()} />;
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: "show",
|
key: "show",
|
||||||
label: "是否显示",
|
label: "是否显示",
|
||||||
defaultRender(key: string, item: any) {
|
onSet(item: any) {
|
||||||
|
configForm[item.key]["show"] = item.show ?? true;
|
||||||
|
},
|
||||||
|
defaultRender(item: any) {
|
||||||
return () => {
|
return () => {
|
||||||
const value = item["show"];
|
const value = item["show"];
|
||||||
return value === false ? "不显示" : "显示";
|
return value === false ? "不显示" : "显示";
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
editRender(key: string, item: any) {
|
editRender(item: any) {
|
||||||
return () => {
|
return () => {
|
||||||
return <a-switch vModel:checked={configForm[key]["show"]} />;
|
return <a-switch vModel:checked={configForm[item.key]["show"]} />;
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: "helper",
|
key: "helper",
|
||||||
label: "帮助说明",
|
label: "帮助说明",
|
||||||
defaultRender(key: string, item: any) {
|
onSet(item: any) {
|
||||||
|
configForm[item.key]["helper"] = item.helper ?? "";
|
||||||
|
},
|
||||||
|
defaultRender(item: any) {
|
||||||
return () => {
|
return () => {
|
||||||
return <pre class={"helper"}>{item["helper"]}</pre>;
|
return <pre class={"helper"}>{item["helper"]}</pre>;
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
editRender(key: string, item: any) {
|
editRender(item: any) {
|
||||||
return () => {
|
return () => {
|
||||||
return <a-textarea rows={5} vModel:value={configForm[key]["helper"]} />;
|
return <a-textarea rows={5} vModel:value={configForm[item.key]["helper"]} />;
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
@ -155,7 +162,7 @@ async function loadPluginSetting() {
|
||||||
const setting = props.plugin.sysSetting;
|
const setting = props.plugin.sysSetting;
|
||||||
if (setting) {
|
if (setting) {
|
||||||
const settingJson = JSON.parse(setting);
|
const settingJson = JSON.parse(setting);
|
||||||
merge(configForm, settingJson.metadata);
|
merge(configForm, settingJson.metadata?.input || {});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5,10 +5,12 @@ import { Modal, notification } from "ant-design-vue";
|
||||||
import ConfigEditor from "./config-editor.vue";
|
import ConfigEditor from "./config-editor.vue";
|
||||||
import { useModal } from "/@/use/use-modal";
|
import { useModal } from "/@/use/use-modal";
|
||||||
import { ref } from "vue";
|
import { ref } from "vue";
|
||||||
|
import { usePluginStore } from "/@/store/plugin";
|
||||||
export function usePluginConfig() {
|
export function usePluginConfig() {
|
||||||
const { openCrudFormDialog } = useFormWrapper();
|
const { openCrudFormDialog } = useFormWrapper();
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
|
||||||
|
const pluginStore = usePluginStore();
|
||||||
const modal = useModal();
|
const modal = useModal();
|
||||||
async function openConfigDialog({ row, crudExpose }) {
|
async function openConfigDialog({ row, crudExpose }) {
|
||||||
const configEditorRef = ref();
|
const configEditorRef = ref();
|
||||||
|
@ -19,7 +21,7 @@ export function usePluginConfig() {
|
||||||
form: {
|
form: {
|
||||||
wrapper: {
|
wrapper: {
|
||||||
width: "80%",
|
width: "80%",
|
||||||
title: "插件元数据配置",
|
title: "插件参数自定义",
|
||||||
saveRemind: false,
|
saveRemind: false,
|
||||||
slots: {
|
slots: {
|
||||||
"form-body-top": () => {
|
"form-body-top": () => {
|
||||||
|
@ -44,12 +46,16 @@ export function usePluginConfig() {
|
||||||
newForm[key] = value;
|
newForm[key] = value;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return await api.savePluginSetting({
|
const res = await api.savePluginSetting({
|
||||||
name: row.name,
|
name: row.name,
|
||||||
sysSetting: {
|
sysSetting: {
|
||||||
metadata: newForm,
|
metadata: {
|
||||||
|
input: newForm,
|
||||||
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
await pluginStore.clear();
|
||||||
|
return res;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in New Issue