108 lines
2.7 KiB
Vue
108 lines
2.7 KiB
Vue
|
<template>
|
||
|
|
<div class="account_message">
|
||
|
|
<div class="account_message_title modal_title_text">
|
||
|
|
<div class="">
|
||
|
|
消息中心
|
||
|
|
</div>
|
||
|
|
<div class="account_message_title_setting">设置</div>
|
||
|
|
</div>
|
||
|
|
<a-tabs class="account_message_body" v-model:activeKey="activeKey">
|
||
|
|
<a-tab-pane key="1" tab="系统消息">
|
||
|
|
<system ref="system"></system>
|
||
|
|
</a-tab-pane>
|
||
|
|
<a-tab-pane key="2" tab="私信" force-render>
|
||
|
|
<privateChat ref="privateChat"></privateChat>
|
||
|
|
</a-tab-pane>
|
||
|
|
<a-tab-pane key="3" tab="评论">Content of Tab Pane 3</a-tab-pane>
|
||
|
|
<a-tab-pane key="4" tab="点赞">Content of Tab Pane 3</a-tab-pane>
|
||
|
|
<a-tab-pane key="6" tab="新增粉丝">
|
||
|
|
<newFollow ref="newFollow"></newFollow>
|
||
|
|
</a-tab-pane>
|
||
|
|
<a-tab-pane key="5" tab="客服">Content of Tab Pane 3</a-tab-pane>
|
||
|
|
</a-tabs>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script lang="ts">
|
||
|
|
import { defineComponent,computed,ref,reactive,nextTick,toRefs,createVNode} from 'vue'
|
||
|
|
import { Https } from "@/tool/https";
|
||
|
|
import { useRouter,useRoute } from 'vue-router'
|
||
|
|
import { Modal,message } from 'ant-design-vue';
|
||
|
|
import { useStore } from "vuex";
|
||
|
|
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
|
||
|
|
import system from '@/component/Account/message/system.vue'
|
||
|
|
import privateChat from '@/component/Account/message/privateChat.vue'
|
||
|
|
import newFollow from '@/component/Account/message/newFollow.vue'
|
||
|
|
import { useI18n } from 'vue-i18n'
|
||
|
|
export default defineComponent({
|
||
|
|
components:{
|
||
|
|
system,
|
||
|
|
privateChat,
|
||
|
|
newFollow,
|
||
|
|
},
|
||
|
|
setup() {
|
||
|
|
const router = useRouter()
|
||
|
|
const store = useStore();
|
||
|
|
let accountMessage = reactive({
|
||
|
|
activeKey: ref('1'),
|
||
|
|
})
|
||
|
|
// provide('exhibitionList',exhibitionList)
|
||
|
|
let setUserData = ()=>{
|
||
|
|
router.push({path:'/home/account/accountEdit'})
|
||
|
|
}
|
||
|
|
return{
|
||
|
|
...toRefs(accountMessage),
|
||
|
|
setUserData,
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data(){
|
||
|
|
return{
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
<style lang="less" scoped>
|
||
|
|
.account_message{
|
||
|
|
width: 100%;
|
||
|
|
.account_message_title{
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 2rem 5rem;
|
||
|
|
border-bottom: 1px solid #e9eaec;
|
||
|
|
.account_message_title_setting{
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.account_message_body{
|
||
|
|
padding: 0rem 5rem;
|
||
|
|
:deep(.ant-tabs-nav){
|
||
|
|
.ant-tabs-nav-wrap{
|
||
|
|
.ant-tabs-tab-btn{
|
||
|
|
font-size: 2.4rem;
|
||
|
|
}
|
||
|
|
.ant-tabs-tab-btn:active{
|
||
|
|
color: #39215b;
|
||
|
|
}
|
||
|
|
.ant-tabs-tab-active{
|
||
|
|
.ant-tabs-tab-btn{
|
||
|
|
color: #39215b;
|
||
|
|
font-weight: 900;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.ant-tabs-tab:hover{
|
||
|
|
color: #39215b;
|
||
|
|
}
|
||
|
|
.ant-tabs-ink-bar{
|
||
|
|
background: #39215b;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
:deep(.ant-tabs-content){
|
||
|
|
min-height: 80rem;
|
||
|
|
padding-bottom: 3rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|