From 7c40157cba4c566fe3665b8ac581b5986f93df11 Mon Sep 17 00:00:00 2001
From: MaysWind <i@mayswind.net>
Date: Sun, 5 Jan 2025 17:07:46 +0800
Subject: [PATCH] migrate switch to mobile dialog to composition API and
 typescript

---
 .../desktop/SwitchToMobileDialog.vue          | 43 +++++++++----------
 1 file changed, 20 insertions(+), 23 deletions(-)

diff --git a/src/components/desktop/SwitchToMobileDialog.vue b/src/components/desktop/SwitchToMobileDialog.vue
index 68dab8f2..48cb6697 100644
--- a/src/components/desktop/SwitchToMobileDialog.vue
+++ b/src/components/desktop/SwitchToMobileDialog.vue
@@ -28,34 +28,31 @@
     </v-dialog>
 </template>
 
-<script>
+<script setup lang="ts">
+import { computed } from 'vue';
+
 import { getMobileUrlQrCodePath } from '@/lib/qrcode.ts';
 import { getMobileVersionPath } from '@/lib/version.ts';
 
-export default {
-    props: [
-        'show'
-    ],
-    emits: [
-        'update:show'
-    ],
-    data() {
-        return {
-            mobileUrlQrCodePath: getMobileUrlQrCodePath(),
-            mobileVersionPath: getMobileVersionPath(),
-        }
+const props = defineProps<{
+    show: boolean;
+}>();
+
+const emit = defineEmits<{
+    (e: 'update:show', value: boolean): void
+}>();
+
+const mobileUrlQrCodePath = getMobileUrlQrCodePath();
+const mobileVersionPath = getMobileVersionPath();
+
+const showState = computed<boolean>({
+    get: () => {
+        return props.show;
     },
-    computed: {
-        showState: {
-            get: function () {
-                return this.show;
-            },
-            set: function (value) {
-                this.$emit('update:show', value);
-            }
-        }
+    set: value => {
+        emit('update:show', value);
     }
-}
+});
 </script>
 
 <style>