chore:

packages/ui/certd-client/package.json

@@ -63,9 +63,12 @@
     "echarts": "^5.5.1",
     "highlight.js": "^11.9.0",
     "humanize-duration": "^3.27.3",
+    "js-yaml": "^4.1.0",
     "lodash-es": "^4.17.21",
     "lucide-vue-next": "^0.477.0",
     "mitt": "^3.0.1",
+    "monaco-editor": "^0.52.2",
+    "monaco-yaml": "^5.3.1",
     "nanoid": "^4.0.0",
     "node-forge": "^1.3.1",
     "nprogress": "^0.2.0",
@@ -93,9 +96,7 @@
     "vuedraggable": "^4.1.0",
     "watermark-js-plus": "^1.5.8",
     "zod": "^3.24.2",
-    "zod-defaults": "^0.1.3",
+    "zod-defaults": "^0.1.3"
-    "monaco-editor": "^0.52.2",
-    "monaco-yaml": "^5.3.1"
   },
   "devDependencies": {
     "@certd/lib-iframe": "^1.32.0",

packages/ui/certd-client/src/views/certd/mine/change-password-button.vue

@@ -40,11 +40,11 @@ const { buildFormOptions } = useColumns();
 const passwordFormOptions: CrudOptions = {
   form: {
     col: {
-      span: 24
+      span: 24,
     },
     wrapper: {
       title: "修改密码",
-      width: "500px"
+      width: "500px",
     },
     async doSubmit({ form }) {
       await api.changePassword(form);
@@ -53,15 +53,15 @@ const passwordFormOptions: CrudOptions = {
     },
     async afterSubmit() {
       notification.success({ message: "修改成功" });
-    }
+    },
   },
   columns: {
     password: {
       title: "旧密码",
       type: "password",
       form: {
-        rules: [{ required: true, message: "请输入旧密码" }]
+        rules: [{ required: true, message: "请输入旧密码" }],
-      }
+      },
     },
     newPassword: {
       title: "新密码",
@@ -70,9 +70,9 @@ const passwordFormOptions: CrudOptions = {
         rules: [
           { required: true, message: "请输入确认密码" },
           //@ts-ignore
-          { validator: validatePass1, trigger: "blur" }
+          { validator: validatePass1, trigger: "blur" },
-        ]
+        ],
-      }
+      },
     },
     confirmNewPassword: {
       title: "确认新密码",
@@ -81,11 +81,11 @@ const passwordFormOptions: CrudOptions = {
         rules: [
           { required: true, message: "请输入确认密码" },
           //@ts-ignore
-          { validator: validatePass2, trigger: "blur" }
+          { validator: validatePass2, trigger: "blur" },
-        ]
+        ],
-      }
+      },
-    }
+    },
-  }
+  },
 };
 
 async function open(opts: { password: "" }) {
@@ -93,13 +93,13 @@ async function open(opts: { password: "" }) {
   formOptions.newInstance = true; //新实例打开
   passwordFormRef.value = await openDialog(formOptions);
   passwordFormRef.value.setFormData({
-    password: opts.password
+    password: opts.password,
   });
   console.log(passwordFormRef.value);
 }
 
 const scope = ref({
-  open: open
+  open: open,
 });
 
 defineExpose(scope.value);

packages/ui/certd-client/src/views/sys/plugin/components/plugin-input.vue

@@ -7,7 +7,7 @@
     <div class="inputs">
       <div class="inputs-inner">
         <a-collapse v-model:active-key="activeKey">
-          <a-collapse-panel v-for="(item, index) in inputs" :key="index">
+          <a-collapse-panel v-for="(item, index) of inputs" :key="index">
             <template #header> {{ item.key }} ： {{ item.title }} </template>
             <a-form :label-col="{ style: { width: '80px' } }">
               <a-form-item label="字段名称">
@@ -37,22 +37,62 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, Ref } from "vue";
+import { ref, Ref, inject, toRef } from "vue";
+import { useFormWrapper } from "@fast-crud/fast-crud";
 
 const activeKey = ref([]);
-const inputs: Ref = ref([]);
 
+const getPlugin: any = inject("get:plugin");
+const pluginRef = getPlugin();
+const inputs = toRef(pluginRef.value.metadata, "input");
+if (!inputs.value) {
+  inputs.value = {};
+}
 function addNewField() {
-  inputs.value.push({
+  const { openCrudFormDialog } = useFormWrapper();
-    key: "newInput",
+
-    title: "新字段",
+  openCrudFormDialog({
-    component: `
+    crudOptions: {
+      form: {
+        labelCol: { style: { width: "80px" } },
+        wrapperCol: { span: 18 },
+        wrapper: {
+          title: "添加输入",
+        },
+        doSubmit({ form }: any) {
+          debugger;
+          const key = form.key;
+          const title = form.title;
+          inputs.value[key] = {
+            key,
+            title,
+            component: `
   name: a-input
     
     `,
-    helper: "",
+            helper: "",
-    value: undefined,
+            value: undefined,
-    required: false,
+            required: false,
+          };
+        },
+      },
+      columns: {
+        key: {
+          title: "字段名称",
+          type: "text",
+          form: {
+            helper: "英文字段名称",
+          },
+        },
+        title: {
+          title: "字段标题",
+          type: "text",
+          form: {
+            helper: "字段标题",
+          },
+        },
+      },
+    },
   });
 }
 </script>

packages/ui/certd-client/src/views/sys/plugin/edit.vue

@@ -25,7 +25,7 @@
           </a-tabs>
 
           <div v-if="metadataActive === 'source'" class="metadata-source">
-            <fs-editor-code v-model="plugin.metadata" language="yaml"></fs-editor-code>
+            <fs-editor-code :model-value="metadataStr" language="yaml" @update:model-value="onMetadataStrUpdate"></fs-editor-code>
           </div>
         </div>
       </div>
@@ -39,10 +39,12 @@
   </fs-page>
 </template>
 <script lang="ts" setup>
-import { onMounted, ref, watch } from "vue";
+import { onMounted, ref, watch, provide } from "vue";
 import { useRoute } from "vue-router";
 import * as api from "./api";
+import yaml from "js-yaml";
 import PluginInput from "/@/views/sys/plugin/components/plugin-input.vue";
+import { merge } from "lodash-es";
 defineOptions({
   name: "SysPluginEdit",
 });
@@ -50,15 +52,30 @@ const route = useRoute();
 
 const plugin = ref<any>({});
 
+const metadataStr = ref("");
+function onMetadataStrUpdate(value: string) {
+  metadataStr.value = value;
+}
 const metadataActive = ref("editor");
 async function getPlugin() {
   const id = route.query.id;
-  plugin.value = await api.GetObj(id);
+  const pluginObj = await api.GetObj(id);
+  if (!pluginObj.metadata) {
+    pluginObj.metadata = {
+      input: {},
+      output: {},
+    };
+  }
+  plugin.value = pluginObj;
 }
 
 onMounted(async () => {
   await getPlugin();
 });
+
+provide("get:plugin", () => {
+  return plugin;
+});
 </script>
 
 <style lang="less">

pnpm-lock.yaml

@@ -1160,6 +1160,9 @@ importers:
       humanize-duration:
         specifier: ^3.27.3
         version: 3.32.1
+      js-yaml:
+        specifier: ^4.1.0
+        version: 4.1.0
       lodash-es:
         specifier: ^4.17.21
         version: 4.17.21