perf: 优化通知格式

2026-05-17 13:57:31 +08:00 · 2025-03-26 12:05:28 +08:00
parent 27a8a57cf5
commit c3c5006daa
4 changed files with 111 additions and 19 deletions
@@ -0,0 +1,99 @@
+<template>
+  <div class="remote-input">
+    <a-input v-bind="attrs" :value="modelValue" @update:value="onInputChange"></a-input>
+    <fs-button class="ml-1" v-bind="button" :text="button?.text || title" @click="openDialog"></fs-button>
+  </div>
+</template>
+<script setup lang="ts">
+import { doRequest } from "/@/components/plugins/lib";
+import { inject, ref, useAttrs } from "vue";
+import { useFormWrapper } from "@fast-crud/fast-crud";
+import { notification } from "ant-design-vue";
+
+defineOptions({
+  name: "RemoteInput",
+});
+const { openCrudFormDialog } = useFormWrapper();
+const props = defineProps<{
+  modelValue: string;
+  title: string;
+  action: string;
+  form: any;
+  button?: any;
+}>();
+
+const emit = defineEmits<{
+  "update:modelValue": any;
+}>();
+
+const getScope: any = inject("get:scope");
+const getPluginType: any = inject("get:plugin:type");
+
+const attrs = useAttrs();
+
+const loading = ref(false);
+
+function onInputChange(value: string) {
+  emit("update:modelValue", value);
+}
+
+async function openDialog() {
+  function createCrudOptions() {
+    return {
+      crudOptions: {
+        columns: {
+          ...props.form.columns,
+        },
+        form: {
+          wrapper: {
+            title: props.title,
+            saveRemind: false,
+          },
+          afterSubmit() {
+            notification.success({ message: "操作成功" });
+          },
+          async doSubmit({ form }: any) {
+            return await doPluginFormSubmit(form);
+          },
+        },
+      },
+    };
+  }
+  const { crudOptions } = createCrudOptions();
+  await openCrudFormDialog({ crudOptions });
+}
+
+const doPluginFormSubmit = async (data: any) => {
+  if (loading.value) {
+    return;
+  }
+
+  loading.value = true;
+  try {
+    const pluginType = getPluginType();
+    const { form } = getScope();
+    const res = await doRequest({
+      type: pluginType,
+      typeName: form.type,
+      action: props.action,
+      input: pluginType === "plugin" ? form.input : form,
+      data: data,
+    });
+    //获取返回值 填入到input中
+    emit("update:modelValue", res);
+    return res;
+  } finally {
+    loading.value = false;
+  }
+};
+</script>
+<style lang="less">
+.remote-input {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  .a-input {
+    flex: 1;
+  }
+}
+</style>