新增：软件接口图录入

2026-02-04 11:23:25 +08:00
parent 9c1c39d9a9
commit a5a3ee9bb5
7 changed files with 121 additions and 13 deletions
--- a/cdTMP/src/layout/components/projectInfoOther/InterfaceImage.vue
+++ b/cdTMP/src/layout/components/projectInfoOther/InterfaceImage.vue
@@ -0,0 +1,80 @@
+<template>
+    <div class="interface-image-container">
+        <a-modal
+            v-model:visible="visible"
+            width="50%"
+            draggable
+            :on-before-ok="handleSyncOk"
+            unmount-on-close
+            ok-text="确认保存"
+            cancel-text="关闭不保存"
+            :maskClosable="false"
+            @close="handleOnClose"
+        >
+            <template #title>软件接口图</template>
+            <div class="flex justify-center items-center">
+                <ImageInput v-model="imageUrl" v-model:fontnote="fontnote" />
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref, getCurrentInstance } from "vue"
+import ImageInput from "./projectModal/ImageInput/index.vue"
+import { Message } from "@arco-design/web-vue"
+import projectApi from "@/api/project/project"
+import { useRoute } from "vue-router"
+
+const { proxy } = getCurrentInstance() as any
+const route = useRoute()
+const visible = ref(false)
+
+// props
+const { reset } = defineProps<{
+    reset: () => void
+}>()
+
+// 题注和图片数据
+const fontnote = ref("")
+const imageUrl = ref("")
+
+const handleSyncOk = async () => {
+    // 验证题注是否为空
+    if (fontnote.value.trim().length <= 0 || !imageUrl.value.trim()) {
+        Message.error("请输入题注和粘贴图片")
+        return false
+    }
+    // 提交数据
+    try {
+        await projectApi.postInterfaceImage(route.query.id, { fontnote: fontnote.value, content: imageUrl.value, type: "image" })
+        Message.success("保存成功")
+    } catch (e) {
+        return false
+    }
+}
+
+const handleOnClose = () => {
+    // 用来清空数据
+    fontnote.value = ""
+    imageUrl.value = ""
+    reset()
+}
+
+const open = async () => {
+    proxy?.$loading?.show("数据加载中...")
+    try {
+        const { data } = await projectApi.getInterfaceImage(route.query.id)
+        fontnote.value = data.fontnote
+        imageUrl.value = data.content
+        visible.value = true
+    } catch (e) {
+    } finally {
+        proxy?.$loading?.hide()
+    }
+}
+
+defineExpose({ open })
+</script>
+
+<style scoped></style>