Commit 72f19a57 authored by 黄奎's avatar 黄奎

页面修改

parent d003c318
......@@ -224,13 +224,15 @@
:label="$q.platform.is.mobile ? '' : $t('query')"
@click="setSearchHandler"
/>
<q-btn
class="q-ml-sm"
color="primary"
unelevated
:label="$t('v102.CharteredBus.td')"
@click="goUrl"
/>
<template v-if="b2bUserInfo && b2bUserInfo.groupId == 2">
<q-btn
class="q-ml-sm"
color="primary"
unelevated
:label="$t('v102.CharteredBus.td')"
@click="goUrl"
/>
</template>
</div>
</template>
......@@ -245,6 +247,7 @@ import { CascaderOption, NCascader } from "naive-ui";
import { ApiResult } from "src/@types/enumHelper";
import message from "src/utils/message";
import { useHotel } from "../../../utils/hotelRate";
import { getStoreGetter } from "../../../store/utils";
import { useRouter } from "vue-router";
export default {
components: { svgIcon, NCascader },
......@@ -252,6 +255,7 @@ export default {
const $q = useQuasar();
const $router = useRouter();
const qDateProxy = ref(null) as any;
const b2bUserInfo = getStoreGetter<UserGetter>("user", "getUser");
const data = reactive({
CharteredBusType: useHotel.getCharteredBusType(),
provinces: [] as any,
......@@ -416,6 +420,7 @@ export default {
return {
qDateProxy,
searchCnt,
b2bUserInfo,
...toRefs(data),
...methods,
};
......
<template>
<q-card flat class="bg-white q-pa-none q-py-sm" style="width: 275px; shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15)">
<q-card
flat
class="bg-white q-pa-none q-py-sm"
style="width: 275px; shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15)"
>
<div class="q-px-sm">
<div class="q-pa-sm row">
<q-avatar size="50px" rounded class="bg-blue-2 cursor-pointer q-mr-md">
<q-img :src="user.photo" v-if="user?.photo" mode="cover" />
<span class="text-primary text-h6" v-else>{{ user?.name.substring(0, 1) }}</span>
<span class="text-primary text-h6" v-else>{{
user?.name.substring(0, 1)
}}</span>
</q-avatar>
<div class="col column">
<div class="col row items-center">
<span class="text-weight-bold text-subtitle1 q-mr-md">{{ user?.name }}</span>
<span class="bg-green-11 text-green-14 rounded-borders q-px-sm">{{$t('verified')}}</span>
<span class="bg-green-11 text-green-14 rounded-borders q-px-sm">{{
$t("verified")
}}</span>
</div>
<div class="f12 text-grey-6 f12">{{ user?.account }}</div>
</div>
......@@ -18,110 +26,126 @@
<q-separator color="grey-3" class="q-my-sm" />
<q-list class="q-px-md text-subtitle2">
<q-item clickable v-ripple class="rounded-borders lang-demo">
<q-item-section @click="goUrl('/personal')">{{ $t('userMenu.mypro') }}</q-item-section>
</q-item>
<q-item clickable v-ripple class="rounded-borders lang-demo">
<q-item-section>
<div class="row items-center">
<div class="q-mr-md">{{ $t('userMenu.myfinace') }}</div>
<q-badge rounded class="din bg-red-2 text-red-14 text-weight-bold" label="3" />
</div>
</q-item-section>
</q-item>
<q-item clickable v-ripple class="rounded-borders lang-demo">
<q-item-section>{{ $t('userMenu.fapiao') }}</q-item-section>
</q-item>
<q-item clickable v-ripple class="rounded-borders lang-demo">
<q-item-section @click="goUrl('/passbook')">{{ $t('v104.passbook.pageTitle') }}</q-item-section>
<q-item-section @click="goUrl('/personal')">{{
$t("userMenu.mypro")
}}</q-item-section>
</q-item>
<template v-if="user && user.groupId == 2">
<q-item clickable v-ripple class="rounded-borders lang-demo">
<q-item-section>
<div class="row items-center">
<div class="q-mr-md">{{ $t("userMenu.myfinace") }}</div>
<q-badge
rounded
class="din bg-red-2 text-red-14 text-weight-bold"
label="3"
/>
</div>
</q-item-section>
</q-item>
<q-item clickable v-ripple class="rounded-borders lang-demo">
<q-item-section>{{ $t("userMenu.fapiao") }} {{ user }}</q-item-section>
</q-item>
<q-item clickable v-ripple class="rounded-borders lang-demo">
<q-item-section @click="goUrl('/passbook')">{{
$t("v104.passbook.pageTitle")
}}</q-item-section>
</q-item>
</template>
</q-list>
<q-separator color="grey-3" class="q-my-sm" />
<q-list class="q-px-md text-subtitle2">
<q-item clickable v-ripple class="rounded-borders lang-demo">
<q-item-section>
<div class="row">
<div class="col">{{ $t('userMenu.lang') }}</div>
<div class="lang-box bg-grey-2 q-px-sm rounded-borders">
<span>{{currentLang.langName}}</span>
<q-popup-proxy class="no-shadow">
<q-card class="q-pa-sm" flat dark>
<q-list>
<q-item class="rounded-borders" clickable v-ripple v-for="(x,i) in langs" @click="getLanguage(x)">
<q-item-section>
<div class="row">
<div class="f12 dark col">{{x.langName}}</div>
</div>
</q-item-section>
</q-item>
</q-list>
</q-card>
</q-popup-proxy>
</div>
<div class="row">
<div class="col">{{ $t("userMenu.lang") }}</div>
<div class="lang-box bg-grey-2 q-px-sm rounded-borders">
<span>{{ currentLang.langName }}</span>
<q-popup-proxy class="no-shadow">
<q-card class="q-pa-sm" flat dark>
<q-list>
<q-item
class="rounded-borders"
clickable
v-ripple
v-for="(x, i) in langs"
@click="getLanguage(x)"
>
<q-item-section>
<div class="row">
<div class="f12 dark col">{{ x.langName }}</div>
</div>
</q-item-section>
</q-item>
</q-list>
</q-card>
</q-popup-proxy>
</div>
</div>
</q-item-section>
</q-item>
<q-item clickable v-ripple class="rounded-borders lang-demo" @click="signOut">
<q-item-section>{{ $t('userMenu.signOut') }}</q-item-section>
<q-item-section>{{ $t("userMenu.signOut") }}</q-item-section>
</q-item>
</q-list>
</q-card>
</template>
<script lang="ts">
import { useRouter } from 'vue-router';
import { defineComponent, ref, reactive, toRefs, provide } from 'vue'
import { useRouter } from "vue-router";
import { defineComponent, ref, reactive, toRefs, provide } from "vue";
import { getLangs } from "../../utils/tools";
import { SitLang } from '../../@types';
import { useI18n } from 'vue-i18n'
import { dispatchAction } from '../../store/utils';
import { UserActionsType } from '../../store/modules/user/actions';
import { SitLang } from "../../@types";
import { useI18n } from "vue-i18n";
import { dispatchAction } from "../../store/utils";
import { UserActionsType } from "../../store/modules/user/actions";
export default defineComponent({
name: 'user-info',
name: "user-info",
props: {
user: {
type: Object,
require: true
}
require: true,
},
},
setup(props) {
const $router = useRouter();
const {locale,t } = useI18n();
const data=reactive({
currentLang: {} as SitLang,
langs:[] as SitLang[],
})
data.langs=getLangs()
if(data.langs && data.langs.length>0){
data.currentLang = data.langs.find(x=> x.langLocale==locale.value) ?? {};
const { locale, t } = useI18n();
const data = reactive({
currentLang: {} as SitLang,
langs: [] as SitLang[],
});
data.langs = getLangs();
if (data.langs && data.langs.length > 0) {
data.currentLang = data.langs.find((x) => x.langLocale == locale.value) ?? {};
}
// 切换语言
const methods = {
goUrl(url:string){
$router.push({ path:url})
},
getLanguage (val:SitLang) {
locale.value = val.langLocale??''
data.currentLang=val
localStorage.setItem('lanuage', val.langLocale??'')
window.location.reload()
},
signOut(){
dispatchAction<UserActionsType>('user', 'setUserSignout', null)
window.location.reload()
}
}
return {...toRefs(data),...methods}
}
})
goUrl(url: string) {
$router.push({ path: url });
},
getLanguage(val: SitLang) {
locale.value = val.langLocale ?? "";
data.currentLang = val;
localStorage.setItem("lanuage", val.langLocale ?? "");
window.location.reload();
},
signOut() {
dispatchAction<UserActionsType>("user", "setUserSignout", null);
window.location.reload();
},
};
return { ...toRefs(data), ...methods };
},
});
</script>
<style>
.lang-demo:hover .lang-box{
background: unset !important;
}
.lang-demo:hover .q-item__section{
color:var(--q-primary) !important;
}
.lang-demo:hover .lang-box {
background: unset !important;
}
.lang-demo:hover .q-item__section {
color: var(--q-primary) !important;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment