03402fac by zhangmeng

票务

1 parent 8340c88d
......@@ -2,13 +2,14 @@
<div class="app-container">
<div class="box">
<el-row :gutter="20">
<el-col :lg="5" :md="5" :xl="6" :sm="8" :xs="8">
<el-col :lg="5" :md="5" :sm="8" :xl="6" :xs="8">
<el-card class="mb20">
<div :class="language==0?'center-menu':'center-menu en-menu'">
<ul v-if="user.utype=='2'&&language==0">
<li v-for="(m, i) in menus"
:key="i"
:class="{ active: m.isActive }"
<li
v-for="(m, i) in menus"
:key="i"
:class="{ active: m.isActive }"
>
<a href="javascript:void(0)" @click="toInfo(m,menus)">
<img :src="m.isActive ? m.picUrl2 : m.picUrl1">
......@@ -17,9 +18,10 @@
</li>
</ul>
<ul v-if="user.utype=='2'&&language==1">
<li v-for="(m, i) in menusEn"
:key="i"
:class="{ active: m.isActive }"
<li
v-for="(m, i) in menusEn"
:key="i"
:class="{ active: m.isActive }"
>
<a href="javascript:void(0)" @click="toInfo(m,menusEn)">
<img :src="m.isActive ? m.picUrl2 : m.picUrl1">
......@@ -29,9 +31,9 @@
</ul>
<ul v-if="user.utype=='1'&&language==0">
<li
v-for="(m, i) in menusPersonal"
:key="i"
:class="{ active: m.isActive }"
v-for="(m, i) in menusPersonal"
:key="i"
:class="{ active: m.isActive }"
>
<a href="javascript:void(0)" @click="toInfo(m,menusPersonal)">
<img :src="m.isActive ? m.picUrl2 : m.picUrl1">
......@@ -41,9 +43,9 @@
</ul>
<ul v-if="user.utype=='1'&&language==1">
<li
v-for="(m, i) in menusPersonalEn"
:key="i"
:class="{ active: m.isActive }"
v-for="(m, i) in menusPersonalEn"
:key="i"
:class="{ active: m.isActive }"
>
<a href="javascript:void(0)" @click="toInfo(m,menusPersonalEn)">
<img :src="m.isActive ? m.picUrl2 : m.picUrl1">
......@@ -53,9 +55,9 @@
</ul>
<ul v-if="user.utype=='3'&&language==0">
<li
v-for="(m, i) in menus3"
:key="i"
:class="{ active: m.isActive }"
v-for="(m, i) in menus3"
:key="i"
:class="{ active: m.isActive }"
>
<a href="javascript:void(0)" @click="toInfo(m,menus3)">
<img :src="m.isActive ? m.picUrl2 : m.picUrl1">
......@@ -65,9 +67,9 @@
</ul>
<ul v-if="user.utype=='3'&&language==1">
<li
v-for="(m, i) in menus3En"
:key="i"
:class="{ active: m.isActive }"
v-for="(m, i) in menus3En"
:key="i"
:class="{ active: m.isActive }"
>
<a href="javascript:void(0)" @click="toInfo(m,menus3En)">
<img :src="m.isActive ? m.picUrl2 : m.picUrl1">
......@@ -78,8 +80,8 @@
</div>
</el-card>
</el-col>
<el-col :lg="19" :md="19" :xl="18" :sm="16" :xs="16">
<router-view :user="user" class="rightPart"/>
<el-col :lg="19" :md="19" :sm="16" :xl="18" :xs="16">
<router-view :user="user" class="rightPart" />
</el-col>
</el-row>
</div>
......@@ -87,12 +89,12 @@
</template>
<script setup>
import {ref} from 'vue'
import {useRoute, useRouter} from 'vue-router'
import {onMounted} from '@vue/runtime-core'
import { ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { onMounted } from '@vue/runtime-core'
import useUserStore from '@/store/modules/user'
import _ from 'lodash'
import {useStorage} from "@vueuse/core/index";
import { useStorage } from '@vueuse/core/index'
const language = useStorage('language', 0)
......@@ -245,13 +247,13 @@ const menus3 = ref([
picUrl2: '/img/nav_29_dwn.png',
isActive: false
},
{
name: language.value == 0 ? '票务预订' : 'Ticket Reservation',
routeName: 'seat_order',
picUrl1: '/img/c7.png',
picUrl2: '/img/c7.png',
isActive: false
},
// {
// name: language.value == 0 ? '票务预订' : 'Ticket Reservation',
// routeName: 'seat_order',
// picUrl1: '/img/c7.png',
// picUrl2: '/img/c7.png',
// isActive: false
// },
{
name: language.value == 0 ? '发票申请' : 'Electronic invoice',
routeName: 'myKP',
......@@ -281,14 +283,14 @@ const menus3En = ref([
picUrl1: '/img/nav_29.png',
picUrl2: '/img/nav_29_dwn.png',
isActive: false
},
{
name: language.value == 0 ? '票务预订' : 'Ticket Reservation',
routeName: 'seat_order',
picUrl1: '/img/c7.png',
picUrl2: '/img/c7.png',
isActive: false
}
// {
// name: language.value == 0 ? '票务预订' : 'Ticket Reservation',
// routeName: 'seat_order',
// picUrl1: '/img/c7.png',
// picUrl2: '/img/c7.png',
// isActive: false
// }
])
const menusPersonal = ref([
{
......@@ -319,13 +321,13 @@ const menusPersonal = ref([
picUrl2: '/img/nav_29_dwn.png',
isActive: false
},
{
name: language.value == 0 ? '票务预订' : 'Ticket Reservation',
routeName: 'seat_order',
picUrl1: '/img/c7.png',
picUrl2: '/img/c7.png',
isActive: false
},
// {
// name: language.value == 0 ? '票务预订' : 'Ticket Reservation',
// routeName: 'seat_order',
// picUrl1: '/img/c7.png',
// picUrl2: '/img/c7.png',
// isActive: false
// },
{
name: language.value == 0 ? '系统消息' : 'System messages',
routeName: 'mySms',
......@@ -370,13 +372,13 @@ const menusPersonalEn = ref([
picUrl2: '/img/nav_29_dwn.png',
isActive: false
},
{
name: language.value == 0 ? '票务预订' : 'Ticket Reservation',
routeName: 'seat_order',
picUrl1: '/img/c7.png',
picUrl2: '/img/c7.png',
isActive: false
},
// {
// name: language.value == 0 ? '票务预订' : 'Ticket Reservation',
// routeName: 'seat_order',
// picUrl1: '/img/c7.png',
// picUrl2: '/img/c7.png',
// isActive: false
// },
{
name: language.value == 0 ? '系统消息' : 'System messages',
routeName: 'mySms',
......@@ -389,7 +391,7 @@ let currMenu
onMounted(() => {
console.log(route.query)
if (!user.utype) {
router.push({name: 'home'})
router.push({ name: 'home' })
return
}
if (user.utype == '1') {
......@@ -399,7 +401,7 @@ onMounted(() => {
currMenu.isActive = true
}
console.log(route.name)
if (user.utype == '2') {
currMenu = _.find(menus.value, (m) => {
return m.routeName === route.name
......@@ -412,7 +414,6 @@ onMounted(() => {
})
currMenu.isActive = true
}
})
const toInfo = (item, list) => {
......@@ -420,37 +421,37 @@ const toInfo = (item, list) => {
m.isActive = false
})
item.isActive = true
router.push({
name: item.routeName
})
}
</script>
<style scoped lang="scss">
<style lang="scss" scoped>
:deep(.el-tabs__nav-wrap) {
padding: 0 15px;
}
.center-menu {
text-align: center;
li {
margin-bottom: 15px;
}
&.en-menu {
text-align: left;
li {
padding: 6px 0 6px 14px;
a {
display: flex;
align-items: center;
}
}
img {
padding: 0;
width: 26px;
......@@ -477,7 +478,7 @@ li img {
}
.el-card {
box-shadow: none !important;
:deep(.el-card__body) {
padding: 0 !important;
}
......@@ -495,16 +496,16 @@ li img {
top: 80px;
width: 100px;
border-right: 1px solid #eee;
li {
font-size: 13px;
padding: 8px 10px;
border-radius: 0;
img {
display: none
}
&.active {
background: #fff;
border-left: 2px solid var(--el-color-primary);
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!