Upgrade to Vue3 and Element Plus (#1374)

* Update Vue devtools * upgrade vue pinia element-plus vue-i18n, add vite * fix: i18n * global components * change v-deep * upgrade vue-lazyload * data table * update enlint and safe-dialog * package.json and vite.config.js * el-icon * el-message * vue 2 -> vue3 migration changes * $pinia * dialog * el-popover slot * lint * chore * slot * scss * remote state access * misc * jsconfig * el-button size mini -> small * :model-value * ElMessageBox * datatable * remove v-lazyload * template #dropdown * mini -> small * css * byebye hideTooltips * use sass-embedded * Update SQLite, remove unneeded libraries * Fix shift remove local avatar favorites * Electron arm64 * arm64 support * bye pug * f-word vite hah * misc * remove safe dialog component * Add self invite to launch dialog * Fix errors * Icons 1 * improve localfavorite loading performance * improve favorites world item performance * dialog visibility changes for Element Plus * clear element plus error * import performance * revert App.vue hah * hah * Revert "Add self invite to launch dialog" This reverts commit 4801cfad58. * Toggle self invite/open in-game * Self invite on launch dialog * el-button icon * el-icon * fix user dialog tab switching logic * fix PlayerList * Formatting changes * More icons * Fix friend log table * loading margin * fix markdown * fix world dialog tab switching issue * Fixes and formatting * fix: global i18n.t export * fix favorites world tab not working * Create instance, displayName * Remove group members sort by userId * Fix loading dialog tabs on swtich * Star * charts console.warn * wip: fix charts * wip: fix charts * wip: charts composables * fix favorite item tooltip warning * Fixes and formatting * Clean up image dialogs * Remove unused method * Fix platform/size border * Fix platform/size border * $vr * fix friendExportDialogVisible binding * ElMessageBox and Settings * Login formatting * Rename VR overlay query * Fix image popover and userdialog badges * Formatting * Big buttons * Fixes, update Cef * Fix gameLog table nav buttons jumping around while using nav buttons * Fix z-index * vr overlay * vite input add theme * defineAsyncComponent * ISO 639-1 * fix i18n * clean t * Formatting, fix calendar, rotate arrows * Show user status when user is offline * Fix VR overlay * fix theme and clean up * split InstanceActivity * tweak * Fix VR overlay formatting * fix scss var * AppDebug hahahaha * Years * remove reactive * improve perf * state hah… * fix user rendering poblems when user object is not yet loaded * improve perf * Update avatar/world image uploader, licenses, remove previous images dialog (old images are now deleted) * improve perf 1 * Suppress stray errors * fix traveling location display issue * Fix empty instance creator * improve friend list refresh performance * fix main charts * fix chart * Fix darkmode * Fix avatar dialog tags --------- Co-authored-by: pa <maplenagisa@gmail.com>
2026-05-03 13:36:04 +02:00 · 2025-09-12 10:45:24 +12:00
parent b233bbc299
commit 3324d0d279
249 changed files with 12948 additions and 19815 deletions
@@ -1,7 +1,7 @@
 <template>
-    <safe-dialog
+    <el-dialog
        class="x-dialog"
-        :visible="changeLogDialog.visible"
+        :model-value="changeLogDialog.visible"
        :title="t('dialog.change_log.header')"
        width="800px"
        append-to-body
@@ -13,32 +13,35 @@
                <a class="x-link" @click="openExternalLink('https://www.patreon.com/Natsumi_VRCX')">Patreon</a>,
                <a class="x-link" @click="openExternalLink('https://ko-fi.com/natsumi_sama')">Ko-fi</a>.
            </span>
-            <vue-markdown
-                :source="changeLogDialog.changeLog"
-                :linkify="false"
-                style="height: 62vh; overflow-y: auto; margin-top: 10px"></vue-markdown>
+            <VueShowdown
+                :markdown="changeLogDialog.changeLog"
+                flavor="github"
+                :options="showdownOptions"
+                @click="handleLinkClick"
+                style="height: 62vh; overflow-y: auto; margin-top: 10px" />
        </div>
        <template #footer>
-            <el-button type="small" @click="openExternalLink('https://github.com/vrcx-team/VRCX/releases')">
+            <el-button @click="openExternalLink('https://github.com/vrcx-team/VRCX/releases')">
                {{ t('dialog.change_log.github') }}
            </el-button>
-            <el-button type="small" @click="openExternalLink('https://patreon.com/Natsumi_VRCX')">
+            <el-button @click="openExternalLink('https://patreon.com/Natsumi_VRCX')">
                {{ t('dialog.change_log.donate') }}
            </el-button>
-            <el-button type="small" @click="closeDialog">
+            <el-button @click="closeDialog">
                {{ t('dialog.change_log.close') }}
            </el-button>
        </template>
-    </safe-dialog>
+    </el-dialog>
 </template>

 <script setup>
    import { storeToRefs } from 'pinia';
-    import { useI18n } from 'vue-i18n-bridge';
+    import { useI18n } from 'vue-i18n';
    import { openExternalLink } from '../../../shared/utils';
    import { useVRCXUpdaterStore } from '../../../stores';
+    import { defineAsyncComponent } from 'vue';

-    const VueMarkdown = () => import('vue-markdown');
+    const VueShowdown = defineAsyncComponent(() => import('vue-showdown').then((module) => module.VueShowdown));

    const VRCXUpdaterStore = useVRCXUpdaterStore();

@@ -46,9 +49,32 @@

    const { t } = useI18n();

+    const showdownOptions = {
+        emoji: true,
+        openLinksInNewWindow: false,
+        simplifiedAutoLink: true,
+        excludeTrailingPunctuationFromURLs: true,
+        literalMidWordUnderscores: true,
+        strikethrough: true,
+        tables: true,
+        tablesHeaderId: false,
+        ghCodeBlocks: true,
+        tasklists: true
+    };
+
    function closeDialog() {
        changeLogDialog.value.visible = false;
    }
+
+    function handleLinkClick(event) {
+        const target = event.target.closest('a');
+        if (target && target.href) {
+            event.preventDefault();
+            event.stopPropagation();
+
+            openExternalLink(target.href);
+        }
+    }
 </script>

 <style>