改进

package.json

@@ -6,7 +6,8 @@
     "dev": "vite",
     "build": "vue-tsc --noEmit && vite build",
     "preview": "vite preview",
-    "lint": "eslint . --fix --ignore-path .gitignore"
+    "lint": "eslint . --fix --ignore-path .gitignore",
+    "gen": "wget https://document.awa.im/swagger/doc.json && openapi-generator-cli generate -i doc.json -g vue3 -o openapitools"
   },
   "dependencies": {
     "axios": "^1.6.2",

src/router/index.ts

@@ -40,6 +40,11 @@ const routes = [
     name: "library.documents.create",
     component: () => import("@/views/documents/Create.vue"),
   },
+  {
+    path: "/library/:LibraryId/documents/:DocumentId/edit",
+    name: "library.documents.edit",
+    component: () => import("@/views/documents/Edit.vue"),
+  },
   {
     path: "/library/:LibraryId/documents/:DocumentId",
     name: "library.documents.view",

src/views/documents/Edit.vue

@@ -0,0 +1,105 @@
+<template>
+  <v-btn class="mb-3" @click="router.back()">返回</v-btn>
+
+  <div v-if="loading">
+    <LoadingComponent> </LoadingComponent>
+  </div>
+  <div v-else>
+    <h2>编辑: {{ docu.Title }}</h2>
+
+    <div class="form-floating mb-3">
+      <v-text-field
+        v-model="docu.Title"
+        label="文档标题"
+        required
+        hide-details
+      ></v-text-field>
+    </div>
+
+    <MdEditor :theme="getTheme" v-model="docu.Content" />
+
+    <v-btn class="mt-3" color="primary" @click="updateDocument">更新文档</v-btn>
+  </div>
+
+  <v-snackbar v-model="show_created_failed" vertical>
+    <div class="text-subtitle-1 pb-2">更新失败</div>
+
+    <p>可能出现了一些问题，比如您没有完整填写，或者某一个内容超出了长度。</p>
+
+    <template v-slot:actions>
+      <v-btn color="pink" variant="text" @click="show_created_failed = false">
+        关闭
+      </v-btn>
+    </template>
+  </v-snackbar>
+
+  <v-snackbar v-model="show_title_is_not_filled">
+    <p>您还没有填写标题。</p>
+
+    <template v-slot:actions>
+      <v-btn
+        color="pink"
+        variant="text"
+        @click="show_title_is_not_filled = false"
+      >
+        关闭
+      </v-btn>
+    </template>
+  </v-snackbar>
+</template>
+
+<script setup>
+import { ref } from "vue";
+import { MdEditor } from "md-editor-v3";
+import "md-editor-v3/lib/style.css";
+import router from "@/router/index";
+import { document } from "@/plugins/api";
+import getTheme from "@/plugins/getTheme";
+import LoadingComponent from "@/components/Loading.vue";
+
+const loading = ref(true)
+const libraryIdInt = parseInt(router.currentRoute.value.params.LibraryId);
+const documentIdInt = parseInt(router.currentRoute.value.params.DocumentId);
+
+const docu = ref({
+  Title: "",
+  Content: "",
+});
+
+document
+  .libraryLibraryIdDocumentDocumentIdGet(libraryIdInt, documentIdInt)
+  .then((r) => {
+    docu.value = r.data;
+
+    console.log(r.data);
+  })
+  .finally(() => {
+    loading.value = false;
+  });
+
+const show_created_failed = ref(false);
+const show_title_is_not_filled = ref(false);
+
+function updateDocument() {
+  if (docu.value.Title == "") {
+    show_title_is_not_filled.value = true;
+    return;
+  }
+
+  document
+    .libraryLibraryIdDocumentDocumentIdPut(
+      libraryIdInt,
+      documentIdInt,
+      {
+        Title: "a",
+        Content: "a",
+      }
+    )
+    .then((r) => {
+      console.log(r);
+    })
+    .catch(() => {
+      show_created_failed.value = true;
+    });
+}
+</script>

src/views/documents/View.vue

@@ -43,14 +43,25 @@ function goto_query_library() {
     },
   });
 }
+
+function goto_edit_document() {
+  router.push({
+    name: "library.documents.edit",
+    params: {
+      LibraryId: libraryId,
+      DocumentId: documentId,
+    },
+  });
+}
 </script>
 
 <template>
   <div>
     <v-btn @click="router.back(0)">返回</v-btn>
     <v-btn class="ml-2" @click="goto_create_document">新建文档</v-btn>
+    <v-btn class="ml-2" @click="goto_edit_document">修改文档</v-btn>
     <v-btn class="ml-2" @click="goto_query_library">查询</v-btn>
-
+    
     <div v-if="loading">
       <LoadingComponent> </LoadingComponent>
     </div>