增加交流群二维码

README.md

@@ -39,7 +39,9 @@
 ## 🐳 联系作者&交流群
 开发者：**[红烧猎人](https://blog.enianteam.com/u/sun/content/11)**
 
-新建的QQ交流群: **276594668**
+新建的QQ交流群，进不去可以点上方连接联系作者
+
+<img src="./doc/images/qq_group_qr.jpg"  height="350" />
 
 ## 🍵 打赏
 

src/views/home/components/Setting/tabs/About.vue

@@ -6,13 +6,16 @@ import srcSvglogo from '@/assets/logo.svg'
 import srcGitee from '@/assets/about_image/gitee.png'
 import srcGithub from '@/assets/about_image/github.png'
 import srcDocker from '@/assets/about_image/docker.png'
+import srcQQGroupQR from '@/assets/about_image/qq_group_qr.jpg'
+import { RoundCardModal } from '@/components/common'
 
 interface Version {
   versionName: string
   versionCode: number
 }
 
 const versionName = ref('')
+const qqGroupQRShow = ref(false)
 
 onMounted(() => {
   get<Version>().then((res) => {
@@ -45,6 +48,10 @@ onMounted(() => {
 
       <div>
         QQ交流群：<a href="http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=_I9WIoJn1roIdoaAqelSj9qClLKlXIa1&authKey=GfsQP2GagHnus0jMc7U8Sm6VhWjtsipXUzCHbFwQsGyHMgmYWx6ZbAP%2Bhut%2B4D6N&noverify=0&group_code=276594668" target="_blank" class="link">276594668</a>
+        |
+        <span class="link cursor-pointer" @click="qqGroupQRShow = !qqGroupQRShow">
+          二维码(推荐)
+        </span>
       </div>
 
       <div>
@@ -65,6 +72,15 @@ onMounted(() => {
           <a href="https://hub.docker.com/r/hslr/sun-panel" target="_blank" class="link">Docker</a>
         </div>
       </div>
+
+      <RoundCardModal v-model:show="qqGroupQRShow" title="交流群二维码" style="width: 300px;">
+        <div class="text-center">
+          - 如果失效请返回联系作者 -
+        </div>
+        <div class="flex justify-center">
+          <img :src="srcQQGroupQR" class="h-[260px]">
+        </div>
+      </RoundCardModal>
     </div>
   </div>
 </template>