Update app.vue

Author: huangshuwei

examples/src/comp/app.vue

@@ -30,132 +30,132 @@
                             </a>
                         </span>
 
-                        <!-- switch version -->
+                        <!-- switch lang -->
                         <span class="main-banner-menu-item">
                             <div
                                 v-click-outside="
-                                    () => (showVersionDropdown = false)
+                                    () => (showLangDropdown = false)
                                 "
-                                class="switch-version-container"
+                                class="switch-lang-container"
                             >
                                 <span
-                                    class="switch-version"
+                                    class="switch-lang"
                                     @click="
-                                        showVersionDropdown =
-                                            !showVersionDropdown
+                                        showLangDropdown = !showLangDropdown
                                     "
                                 >
-                                    {{ currentDocVersion }}
+                                    <i class="icon iconfont icon-translate" />
                                     <i class="icon iconfont icon-dropdown" />
                                 </span>
                                 <div
-                                    class="switch-version-dropdown-pannel"
+                                    class="switch-lang-dropdown-pannel"
                                     :class="
-                                        showVersionDropdown
+                                        showLangDropdown
                                             ? 'dropdown-pannel-show'
                                             : ''
                                     "
                                 >
                                     <span
-                                        v-for="item in switchVersionOptions"
+                                        v-for="item in switchLangOptions"
                                         :key="item.value"
                                         :class="[
                                             'dropdown-item',
                                             {
                                                 active:
-                                                    item.label ===
-                                                    currentDocVersion,
+                                                    item.value ===
+                                                    currentDocLang,
                                             },
                                         ]"
-                                        @click.stop="versionChange(item)"
+                                        @click.stop="langChange(item)"
                                     >
                                         {{ item.label }}
                                     </span>
                                 </div>
                             </div>
                         </span>
 
-                        <!-- switch lang -->
+                        <!-- switch theme -->
                         <span class="main-banner-menu-item">
                             <div
                                 v-click-outside="
-                                    () => (showLangDropdown = false)
+                                    () => (showThemeDropdown = false)
                                 "
-                                class="switch-lang-container"
+                                class="switch-theme-container"
                             >
                                 <span
-                                    class="switch-lang"
+                                    class="switch-theme"
                                     @click="
-                                        showLangDropdown = !showLangDropdown
+                                        showThemeDropdown = !showThemeDropdown
                                     "
                                 >
-                                    <i class="icon iconfont icon-translate" />
+                                    {{ currentLocal.docTheme }}
                                     <i class="icon iconfont icon-dropdown" />
                                 </span>
                                 <div
-                                    class="switch-lang-dropdown-pannel"
+                                    class="switch-theme-dropdown-pannel"
                                     :class="
-                                        showLangDropdown
+                                        showThemeDropdown
                                             ? 'dropdown-pannel-show'
                                             : ''
                                     "
                                 >
                                     <span
-                                        v-for="item in switchLangOptions"
+                                        v-for="item in currentLocal.switchDocThemeOptions"
                                         :key="item.value"
                                         :class="[
                                             'dropdown-item',
                                             {
                                                 active:
                                                     item.value ===
-                                                    currentDocLang,
+                                                    currentDocTheme,
                                             },
                                         ]"
-                                        @click.stop="langChange(item)"
+                                        @click.stop="themeChange(item)"
                                     >
                                         {{ item.label }}
                                     </span>
                                 </div>
                             </div>
                         </span>
 
-                        <!-- switch theme -->
+                        <!-- switch version -->
                         <span class="main-banner-menu-item">
                             <div
                                 v-click-outside="
-                                    () => (showThemeDropdown = false)
+                                    () => (showVersionDropdown = false)
                                 "
-                                class="switch-theme-container"
+                                class="switch-version-container"
                             >
                                 <span
-                                    class="switch-theme"
+                                    class="switch-version"
                                     @click="
-                                        showThemeDropdown = !showThemeDropdown
+                                        showVersionDropdown =
+                                            !showVersionDropdown
                                     "
                                 >
-                                    {{ currentLocal.docTheme }}
+                                    {{ currentDocVersion }}
                                     <i class="icon iconfont icon-dropdown" />
                                 </span>
                                 <div
-                                    class="switch-theme-dropdown-pannel"
+                                    class="switch-version-dropdown-pannel"
                                     :class="
-                                        showThemeDropdown
+                                        showVersionDropdown
                                             ? 'dropdown-pannel-show'
                                             : ''
                                     "
                                 >
                                     <span
-                                        v-for="item in currentLocal.switchDocThemeOptions"
+                                        v-for="item in switchVersionOptions"
                                         :key="item.value"
                                         :class="[
                                             'dropdown-item',
                                             {
                                                 active:
-                                                    item.value ===
-                                                    currentDocTheme,
+                                                    item.label ===
+                                                    currentDocVersion,
                                             },
                                         ]"
-                                        @click.stop="themeChange(item)"
+                                        @click.stop="versionChange(item)"
                                     >
                                         {{ item.label }}
                                     </span>