From 58a4e079f0c2984db2eb893565c49d7f756403b8 Mon Sep 17 00:00:00 2001
From: KUN1007 <yuyuyukunkunkun@gmail.com>
Date: Sun, 22 Oct 2023 21:27:19 +0800
Subject: [PATCH] feat: donate page i18n

---
 src/language/en.ts          |  8 ++++++++
 src/views/donate/Donate.vue | 37 +++++++++++++++++++++++++++++++------
 2 files changed, 39 insertions(+), 6 deletions(-)

diff --git a/src/language/en.ts b/src/language/en.ts
index 5258a317..d6a6a82a 100644
--- a/src/language/en.ts
+++ b/src/language/en.ts
@@ -339,6 +339,14 @@ export default {
     donate: 'Donate Us',
     home: 'Back Home',
   },
+  donate: {
+    donate: 'Donate Us',
+    no: 'comes with no Moemoepoint rewards',
+    server:
+      ', but it can help us cover some server expenses. Are you sure you want to sponsor us?',
+    confirm: 'Confirm Donate',
+    back: 'Back Home',
+  },
   // 非页面组件这里统一用大驼峰
   ComponentAlert: {
     confirm: 'OK',
diff --git a/src/views/donate/Donate.vue b/src/views/donate/Donate.vue
index 6e7cfbb3..b3f1f380 100644
--- a/src/views/donate/Donate.vue
+++ b/src/views/donate/Donate.vue
@@ -1,20 +1,35 @@
 <script setup lang="ts">
 import KUNGalgameFooter from '@/components/KUNGalgameFooter.vue'
+import Message from '@/components/alert/Message'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+
+const handleClickDonate = () => {
+  Message(
+    `Let's talk about it when we're in a loss, and first of all, thank you for your support.`,
+    '等我们亏钱再说啦，先感谢您的支持',
+    'info',
+    7777
+  )
+}
 </script>
 
 <template>
   <div class="root">
     <div class="container">
-      <div class="title">赞助我们</div>
+      <div class="title">{{ $tm('donate.donate') }}</div>
       <p class="warning">
-        赞助我们<span>没有任何的萌萌点奖励</span>，不过可以帮我们缓解一部分服务器的费用，您确定要赞助吗
+        {{ $tm('donate.donate') }}
+        <span>{{ $tm('donate.no') }}</span>
+        {{ $tm('donate.server') }}
       </p>
       <div class="btn">
-        <RouterLink to="/">确定赞助</RouterLink>
-        <RouterLink to="/">返回主页</RouterLink>
+        <span @click="handleClickDonate">{{ $tm('donate.confirm') }}</span>
+        <span @click="router.push('/kun')">{{ $tm('donate.back') }}</span>
       </div>
     </div>
-    <!-- 版权 -->
+
     <KUNGalgameFooter style="margin-bottom: 20px; white-space: nowrap" />
   </div>
 </template>
@@ -71,7 +86,7 @@ import KUNGalgameFooter from '@/components/KUNGalgameFooter.vue'
   margin-top: 40px;
   display: flex;
   justify-content: space-between;
-  a {
+  span {
     padding: 7px 10px;
     &:nth-child(1) {
       background-color: var(--kungalgame-trans-red-0);
@@ -93,4 +108,14 @@ import KUNGalgameFooter from '@/components/KUNGalgameFooter.vue'
     }
   }
 }
+
+@media (max-width: 700px) {
+  .root {
+    min-width: 100%;
+  }
+
+  .container {
+    width: 90%;
+  }
+}
 </style>