From ea2f44df75ee590b2c23d20d9c42b775e5262c0a Mon Sep 17 00:00:00 2001
From: zhengyi <admin@mczhengyi.top>
Date: Fri, 29 Dec 2023 22:09:12 +0800
Subject: [PATCH] :sparkles: Add insert drive block

Fix https://git.mczhengyi.top/zhengyi/halo-plugin-vditor/issues/29
---
 console/src/i18n/en-US.ts         |  6 +++
 console/src/i18n/zh-CN.ts         |  6 +++
 console/src/i18n/zh-TW.ts         |  6 +++
 console/src/model/DriveModal.vue  | 75 +++++++++++++++++++++++++++++++
 console/src/utils/vditor-utils.ts |  5 +++
 console/src/views/Vditor.vue      |  6 +++
 6 files changed, 104 insertions(+)
 create mode 100644 console/src/model/DriveModal.vue

diff --git a/console/src/i18n/en-US.ts b/console/src/i18n/en-US.ts
index b788465..cea0bb8 100644
--- a/console/src/i18n/en-US.ts
+++ b/console/src/i18n/en-US.ts
@@ -17,6 +17,12 @@ const lang: I18nLang = {
   repo: "Repo",
   insert_git: "Insert Git Repo",
   insert_custom: "Insert Custom",
+  insert_drive: "Insert Resources Link",
+  baidu_net_disk: "Baidu Net Disk",
+  ali_drive: "Ali Drive",
+  title: "Title",
+  link: "Link",
+  password: "Password",
 };
 
 export default lang;
diff --git a/console/src/i18n/zh-CN.ts b/console/src/i18n/zh-CN.ts
index 72c7f5d..47cb14d 100644
--- a/console/src/i18n/zh-CN.ts
+++ b/console/src/i18n/zh-CN.ts
@@ -17,6 +17,12 @@ const lang: I18nLang = {
   repo: "仓库",
   insert_git: "插入Git仓库",
   insert_custom: "插入自定义块",
+  insert_drive: "插入资源链接",
+  baidu_net_disk: "百度网盘",
+  ali_drive: "阿里云盘",
+  title: "标题",
+  link: "链接",
+  password: "密码",
 };
 
 export default lang;
diff --git a/console/src/i18n/zh-TW.ts b/console/src/i18n/zh-TW.ts
index b24fc85..bdd47bc 100644
--- a/console/src/i18n/zh-TW.ts
+++ b/console/src/i18n/zh-TW.ts
@@ -17,6 +17,12 @@ const lang: I18nLang = {
   repo: "儲存庫",
   insert_git: "插入Git存儲庫",
   insert_custom: "插入自定義塊",
+  insert_drive: "插入資源鏈接",
+  baidu_net_disk: "百度網盤",
+  ali_drive: "阿里雲盤",
+  title: "標題",
+  link: "鏈接",
+  password: "密碼",
 };
 
 export default lang;
diff --git a/console/src/model/DriveModal.vue b/console/src/model/DriveModal.vue
new file mode 100644
index 0000000..0f0ecfb
--- /dev/null
+++ b/console/src/model/DriveModal.vue
@@ -0,0 +1,75 @@
+<script setup lang="ts">
+import { VModal, VButton, VSpace } from "@halo-dev/components";
+import { t } from "@/utils/i18n-utils";
+import { ref } from "vue";
+
+const props = defineProps<{
+  open: boolean;
+}>();
+const emit = defineEmits<{
+  (event: "done", value: string): void;
+  (event: "close"): void;
+}>();
+
+const platform = ref("baidu");
+const name = ref("");
+const link = ref("");
+const password = ref("");
+
+const generateCode = () => {
+  let code = "\n\n```halo\n";
+  code += `drive:${platform.value}\n`;
+  code += `name: ${name.value}\n`;
+  code += `link: ${link.value}\n`;
+  if (password.value) {
+    code += `password: ${password.value}\n`;
+  }
+  emit("done", code + "```\n\n");
+};
+</script>
+
+<template>
+  <VModal
+    :visible="props.open"
+    :layer-closable="false"
+    :title="t('insert_drive')"
+    @close="emit('close')"
+  >
+    <v-space align="start" direction="column" spacing="xs" style="width: 100%">
+      <label for="type" class="vditor-mde-label">
+        <span>{{ t("platform") }}</span>
+        <select id="platform" v-model="platform" class="vditor-mde-select">
+          <option value="baidu">{{ t("baidu_net_disk") }}</option>
+          <option value="ali">{{ t("ali_drive") }}</option>
+        </select>
+      </label>
+      <label for="name" class="vditor-mde-label">
+        <span>{{ t("title") }}</span>
+        <input id="name" v-model="name" type="text" class="vditor-mde-input" />
+      </label>
+      <label for="link" class="vditor-mde-label">
+        <span>{{ t("link") }}</span>
+        <input id="link" v-model="link" type="text" class="vditor-mde-input" />
+      </label>
+      <label for="password" class="vditor-mde-label">
+        <span>{{ t("password") }}</span>
+        <input
+          id="password"
+          v-model="password"
+          type="text"
+          class="vditor-mde-input"
+        />
+      </label>
+    </v-space>
+    <template #footer>
+      <v-space align="center" direction="row" spacing="xs">
+        <v-button type="primary" @click="generateCode">
+          {{ t("confirm") }}
+        </v-button>
+        <v-button type="default" @click="emit('close')">
+          {{ t("close") }}
+        </v-button>
+      </v-space>
+    </template>
+  </VModal>
+</template>
diff --git a/console/src/utils/vditor-utils.ts b/console/src/utils/vditor-utils.ts
index f1e7f96..c7e5b0f 100644
--- a/console/src/utils/vditor-utils.ts
+++ b/console/src/utils/vditor-utils.ts
@@ -125,6 +125,11 @@ function getToolbar(
           icon: t("insert_git"),
           click: () => openModal("git"),
         },
+        {
+          name: "insert_drive",
+          icon: t("insert_drive"),
+          click: () => openModal("drive"),
+        },
       ],
     },
     {
diff --git a/console/src/views/Vditor.vue b/console/src/views/Vditor.vue
index eebd461..1375054 100644
--- a/console/src/views/Vditor.vue
+++ b/console/src/views/Vditor.vue
@@ -9,6 +9,7 @@ import type { Attachment } from "@halo-dev/api-client";
 import { VLoading } from "@halo-dev/components";
 import TipsModel from "@/model/TipsModel.vue";
 import GitModal from "@/model/GitModal.vue";
+import DriveModal from "@/model/DriveModal.vue";
 
 const props = withDefaults(
   defineProps<{
@@ -146,6 +147,11 @@ onMounted(async () => {
         @done="insertValue"
         @close="insertModel = 'none'"
       />
+      <DriveModal
+        :open="insertModel === 'drive'"
+        @done="insertValue"
+        @close="insertModel = 'none'"
+      />
     </div>
 
     <AttachmentSelectorModal