根据域名渲染菜单

src/App.vue

@@ -3,11 +3,12 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, onBeforeUnmount } from 'vue';
+import { defineComponent, onBeforeUnmount,provide } from 'vue';
 import { useQuasar, QSpinnerFacebook } from 'quasar'
 import { useI18n } from 'vue-i18n'
 import axios from 'axios';
 import { DirtionmaryHelper } from './config/dictionary';
+import { getDomainName } from './utils/validate'
 export default defineComponent({
   name: 'App',
   setup(props, context) {
@@ -17,6 +18,10 @@ export default defineComponent({
     if (localStorage.vuex) {
       localStorage.clear()
     }
+
+    // 存储当前域名
+    provide(DirtionmaryHelper.DOMAIN_NAME, getDomainName())
+
     onBeforeUnmount(() => {
       if (timer !== void 0) {
         clearTimeout(timer)

src/boot/i18n.ts

 
 import { boot } from 'quasar/wrappers'
 import { createI18n } from 'vue-i18n'
-
+import { getDomainName } from '../utils/validate'
 import messages from 'src/i18n'
 
 export type MessageLanguages = keyof typeof messages;
@@ -20,9 +20,14 @@ declare module 'vue-i18n' {
   // define the number format schema
   export interface DefineNumberFormat {}
 }
-
+let Language
+if(getDomainName()){
+  Language = localStorage.getItem('lanuage') ?? 'zhTW'
+}else{
+  Language = localStorage.getItem('lanuage') ?? 'zhSW'
+}
 const i18n = createI18n({
-  locale: localStorage.getItem('lanuage') ?? 'zhTW',
+  locale: Language,
   legacy: false,
   warnHtmlInMessage:false,
   warnHtmlMessage:false,

src/components/CompositionComponent.vue

 <template>
 	<div class="text-center">
 		<!-- <img src="../assets/images/lg-logo.png" style="height:200px;"/> -->
-		<img src="../assets/images/home.png" style="width: 50%;"/>
+		<img v-if="isDomainName_PIC" src="../assets/images/home.png" style="width: 50%;"/>
+    <img v-else src="../assets/images/home-hp.png" style="width: 50%;"/>
 		<!-- <div class="q-mt-lg text-h3 text-grey-4 text-center">歡迎使用PIC同業預定系統</div> -->
 	</div>
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, computed, ref, toRef, Ref } from 'vue'
+import { defineComponent, PropType, computed, reactive, toRefs, ref, toRef, Ref, inject } from 'vue'
 import { Todo, Meta } from './models'
+import { DirtionmaryHelper } from '../config/dictionary'
 
 function useClickCount() {
 	const clickCount = ref(0)
@@ -45,7 +47,14 @@ export default defineComponent({
 		}
 	},
 	setup(props) {
-		return { ...useClickCount(), ...useDisplayTodo(toRef(props, 'todos')) }
+    const data = reactive({
+      isDomainName_PIC:true
+    })
+
+    // 根据域名渲染logo
+    data.isDomainName_PIC = inject(DirtionmaryHelper.DOMAIN_NAME)
+
+		return { ...useClickCount(), ...useDisplayTodo(toRef(props, 'todos')),...toRefs(data), }
 	}
 })
 </script>

src/components/layout/Notifications.vue

@@ -37,7 +37,7 @@
   </template>
 
   <script lang="ts">
-  import { defineComponent, ref, reactive, toRefs, provide, onMounted } from 'vue'
+  import { defineComponent, ref, reactive, toRefs, provide, onMounted, inject } from 'vue'
   import { useMenus, Menu } from '../../utils/menus'
   import { getLangs } from "../../utils/tools";
   import { SitLang } from '../../@types';
@@ -46,6 +46,7 @@
   import { UserActionsType } from '../../store/modules/user/actions';
   import useScrollModule from '../../module/scrollbar/scrollModule'
   import svgIcon from '../global/svg-icon.vue'
+  import { DirtionmaryHelper } from '../../config/dictionary';
   export default defineComponent({
     components: { svgIcon },
     name: 'user-info',
@@ -64,7 +65,13 @@
           scrollStyle: {} as any,
       })
       data.scrollStyle = useScrollModule().scrollStyle
-      data.menus = useMenus.getMenus()
+
+      // 根据域名渲染菜单
+      const menList = useMenus.getMenus().filter(x=>{
+        return x.id == 16
+      })
+      data.menus = !inject(DirtionmaryHelper.DOMAIN_NAME)?menList:useMenus.getMenus()
+
       data.langs=getLangs()
       if(data.langs && data.langs.length>0){
         data.currentLang = data.langs.find(x=> x.langLocale==locale.value) ?? {};

src/components/layout/navs.vue

@@ -5,9 +5,10 @@
 </template>
 
 <script lang="ts">
-import { defineComponent,ref,reactive, toRefs } from 'vue'
+import { defineComponent,ref,reactive, toRefs, inject } from 'vue'
 import navItem from './nav-item.vue'
 import { useMenus, Menu } from '../../utils/menus'
+import { DirtionmaryHelper } from '../../config/dictionary';
 export default defineComponent({
   components: { navItem },
   name: 'navs',
@@ -15,7 +16,12 @@ export default defineComponent({
     const data = reactive({
       menus: [] as Menu[]
     })
-    data.menus = useMenus.getMenus()
+
+    // 根据域名渲染菜单
+    const menList = useMenus.getMenus().filter(x=>{
+      return x.id == 16
+    })
+    data.menus = !inject(DirtionmaryHelper.DOMAIN_NAME)?menList:useMenus.getMenus()
 
     return {...toRefs(data)}
   }

src/config/dictionary.ts

@@ -101,5 +101,9 @@ class DirtionmaryHelper {
     * 幸福存折详情
     */
   static readonly PASSBOOK_DETAILS = "passbookDetails"
+  /**
+    * 域名
+    */
+  static readonly DOMAIN_NAME = "domainName"
 }
 export { userDictionmary,DirtionmaryHelper }

src/layouts/MainLayout.vue

@@ -37,7 +37,8 @@
 
     <q-drawer show-if-above v-model="leftDrawerOpen" style="background: #1e1e2d; width: 265px" side="left" class="column">
       <div style="box-sizing: border-box; height: 66px; border-bottom: 1px dashed #444" class="row items-center q-px-md desktop-only">
-        <img src="../assets/images/pic-log.png" alt="" style="height: 30px" />
+        <img v-if="isDomainName_PIC" src="../assets/images/pic-log.png" alt="" style="height: 30px" />
+        <img v-else src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1679454107000_656.png" alt="" style="height: 30px" />
         <!-- <div class="text-white text-weight-bold text-subtitle1 q-ml-md">{{ $t('siteName') }}</div> -->
       </div>
       <q-scroll-area :thumb-style="scrollStyle.thumbStyle" :bar-style="scrollStyle.barStyle" class="col nav-list q-pl-lg">
@@ -90,8 +91,12 @@ export default {
       timer: 0,
       isDadge: true,
       version:'',
+      isDomainName_PIC:true
     })
 
+    // 根据域名渲染logo
+    data.isDomainName_PIC = inject(DirtionmaryHelper.DOMAIN_NAME)
+
     const childPageTitle = ref('')
     provide(DirtionmaryHelper.PAGE_TITLE_KEY ,childPageTitle)
     const activeMenu=ref(0)

src/pages/auth/login.vue

@@ -4,7 +4,8 @@
       <div style="width:450px;" class="column  justify-between  content-between">
         <div  :class="{'row':$q.platform.is.desktop,'column':$q.platform.is.mobile}">
           <div class="col" :class="{'text-center q-mb-md':$q.platform.is.mobile}">
-            <img src="../../assets/images/jvs-log.png" style="width:80%;" />
+            <img v-if="isDomainName_PIC" src="../../assets/images/jvs-log.png" style="width:80%;" />
+            <img v-else src="http://imgfile.oytour.com/Upload/WebSite/202303170746500900000000054.png" style="width:80%;" />
           </div>
         </div>
         <div class="q-py-xxl full-width">
@@ -65,16 +66,18 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, reactive, ref } from 'vue'
+import { defineComponent, reactive, ref, inject } from 'vue'
 import useLgoinModule from '../../module/user/loginModule'
 import useMetaModule from '../../module/meta/metaModule'
 import { useI18n } from 'vue-i18n'
 import { getLangs } from "../../utils/tools";
 import { SitLang } from '../../@types';
 import { useQuasar } from 'quasar';
+import { DirtionmaryHelper } from '../../config/dictionary'
 export default defineComponent({
   setup() {
     //TODO: 缺陷，验证与提交应该使用Form表单来完成，不应该进行单个验证
+
     let { userModel, usernameRef, passwordRef, userValidateRule, loginSubmit, stateManager } = useLgoinModule()
     let { setTitle } = useMetaModule()
 
@@ -83,8 +86,13 @@ export default defineComponent({
     setTitle(t("login.pageTitle"))
     const data=reactive({
       currentLang: {} as SitLang,
-      langs:[] as SitLang[]
+      langs:[] as SitLang[],
+      isDomainName_PIC:true
     })
+
+    // 根据域名渲染logo
+    data.isDomainName_PIC = inject(DirtionmaryHelper.DOMAIN_NAME)
+
     data.langs=getLangs()
     if(data.langs && data.langs.length>0){
       data.currentLang = data.langs.find(x=> x.langLocale==locale.value) ?? {};

src/utils/tools.ts

 import { SitLang, StandardStatus, RoomType, OrderType, DinnerType, HotelType, SendType } from './../@types/index';
 import { i18n } from '../boot/i18n'
+import { getDomainName } from '../utils/validate'
 const {t} =i18n.global
 /**
  * @description 按照需要写入 必要可以注入全局
@@ -469,7 +470,13 @@ export function getLangs() {
     quasarLang:'zh-TW'
   }
   let langs:SitLang[]=[]
-  // zhSw,enUs
+
+  // 根据域名渲染简体
+  if(!getDomainName()){
+    langs.push(zhSw)
+  }else{
     langs.push(zhTw,koHG,jaRB)
+  }
+
   return langs
 }

src/utils/validate.ts

@@ -62,3 +62,15 @@ export function compareArray(arrA: any[], arrB: any[]) {
 	}
 	return isSame
 }
+
+/** 获取当前域名 localhost、pic.oytour.com、sell.oytour.com*/
+export function getDomainName() {
+	let domainNameUrl = window.location.hostname;
+  if(domainNameUrl=='localhost'){
+    return true
+  }else if(domainNameUrl=='pic.oytour.com'){
+    return true
+  }else if(domainNameUrl=='sell.oytour.com'){
+    return false
+  }
+}