hi-ucs/front/src/views/personalCenter/index.vue

108 lines
3.1 KiB
Vue

<template>
<div>
<home-header></home-header>
<div id="container">
<aside>
<aside-menu></aside-menu>
</aside>
<article>
<div class="form-container">
<!-- <on-the-right-side-of-the-list
v-if="showFlag === 'collect'"
></on-the-right-side-of-the-list> -->
<my-apply v-if="showFlag === 'apply'"></my-apply>
<my-publish v-if="showFlag === 'push'"></my-publish>
<purchase-vehicle
v-if="showFlag === 'PurchaseVehicle'"
></purchase-vehicle>
<collection v-else-if="showFlag === 'collect'"></collection>
<my-application v-else-if="showFlag === 'demand'"></my-application>
<my-comments v-else-if="showFlag === 'remark'"></my-comments>
<my-browse v-else-if="showFlag === 'recent'"></my-browse>
</div>
</article>
</div>
</div>
</template>
<script setup>
import HomeHeader from '@/views/home/components/header'
import asideMenu from '@/views/personalCenter/components/asideMenu'
// import OnTheRightSideOfTheList from './OnTheRightSideOfTheList'
import MyApply from '@/views/personalCenter/components/MyApply'
import MyApplication from '@/views/personalCenter/components/MyApplication'
import MyComments from '@/views/personalCenter/components/MyComments'
import MyPublish from '@/views/personalCenter/components/MyPublish'
import MyBrowse from '@/views/personalCenter/components/MyBrowse'
import PurchaseVehicle from '@/views/personalCenter/components/PurchaseVehicle'
import Collection from '@/views/personalCenter/components/Collection'
import mybus from '@/myplugins/mybus'
import { onBeforeUnmount, ref } from 'vue'
const type = JSON.parse(window.sessionStorage.getItem('type'))
const showFlag = ref('PurchaseVehicle')
if (type) {
showFlag.value = type
console.log('type================>', type, showFlag)
}
const delFlag = ref(true)
mybus.on('tabsChange', (e) => {
console.log('进入详情', e)
if (e.flag) {
delFlag.value = false
} else {
console.log('tabsChange', e.key)
showFlag.value = e.key
window.sessionStorage.setItem('type', JSON.stringify(showFlag.value))
console.log('showFlag.value', showFlag.value)
}
})
onBeforeUnmount(() => {
mybus.off('tabsChange')
if (delFlag.value) {
window.sessionStorage.setItem('type', JSON.stringify(''))
}
})
</script>
<style scoped lang="less">
#container {
background-color: #f5f8fc;
height: 100%;
width: 100%;
margin: 64px auto 0;
display: flex;
justify-content: center;
position: relative;
aside {
width: 282px;
height: 96%;
overflow-y: auto;
background-color: #fff;
margin: 1% 0 3%;
}
article {
width: 1090px;
height: 99%;
overflow-y: auto;
background-color: #fff;
margin: 1% 0 1% 14px;
}
.form-container {
.title {
font-size: 20px;
color: #000;
font-weight: bold;
margin-bottom: 20px;
}
}
}
</style>
<style>
html,
body {
height: unset;
}
</style>