添加了部分路由
This commit is contained in:
@@ -11,7 +11,7 @@
|
||||
<div v-for="(i,j) in list" :key="j" style="overflow: hidden;" @click="routeto(j)">
|
||||
<div class="item" :class="{'selitem': j == selnum, 'seltop': j == selnum - 1, 'selbottom': j == selnum + 1}">
|
||||
<div class="route">
|
||||
<img src="" alt="" class="icon">
|
||||
<img :src="i.icon" alt="" class="icon">
|
||||
<div class="title">{{i.name}}</div>
|
||||
</div>
|
||||
<img src="" alt="" class="right">
|
||||
@@ -79,7 +79,6 @@
|
||||
.icon{
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
background-color: #0f0;
|
||||
}
|
||||
.title{
|
||||
font-size: 13px;
|
||||
@@ -118,47 +117,54 @@
|
||||
}
|
||||
</style>
|
||||
<script lang="ts">
|
||||
import router from '@/router';
|
||||
import { defineComponent, ref } from 'vue';
|
||||
|
||||
|
||||
export default defineComponent({
|
||||
setup(){
|
||||
interface MenuItem {
|
||||
icon: string;
|
||||
sleicon: string;
|
||||
name: string;
|
||||
route: string;
|
||||
}
|
||||
// 左侧的列表数组
|
||||
const list: Array<MenuItem> = [
|
||||
{
|
||||
icon: "",
|
||||
icon: "../static/images/wode1.ping",
|
||||
sleicon:"",
|
||||
name: "我的档案",
|
||||
route: ""
|
||||
route: "/mine/archives"
|
||||
},
|
||||
{
|
||||
icon: "",
|
||||
icon: "../static/images/xiayig.ping",
|
||||
sleicon:"",
|
||||
name: "发布直播",
|
||||
route: ""
|
||||
route: "/mine/webcast"
|
||||
},
|
||||
{
|
||||
icon: "",
|
||||
icon: "../static/images/shipin.png",
|
||||
sleicon:"shipin.png",
|
||||
name: "上传视频",
|
||||
route: ""
|
||||
route: "/mine/video"
|
||||
},
|
||||
{
|
||||
icon: "",
|
||||
icon: "/static/images/yinhangka.png",
|
||||
sleicon:"",
|
||||
name: "我的钱包",
|
||||
route: ""
|
||||
route: "/mine/wallet"
|
||||
},
|
||||
{
|
||||
icon: "",
|
||||
icon: "../static/images/tongji.png",
|
||||
sleicon:"",
|
||||
name: "列表统计",
|
||||
route: ""
|
||||
route: "/mine/liststatistic"
|
||||
},
|
||||
{
|
||||
icon: "",
|
||||
icon: "../static/images/bangzhu@2x.png",
|
||||
sleicon:"",
|
||||
name: "关于Beelink",
|
||||
route: ""
|
||||
route: "/mine/aboutus"
|
||||
}
|
||||
]
|
||||
// 当前选中的index
|
||||
@@ -170,6 +176,9 @@ export default defineComponent({
|
||||
function routeto(index: number): void {
|
||||
console.log(index)
|
||||
selnum.value = index;
|
||||
router.push({
|
||||
path: list[index].route
|
||||
})
|
||||
|
||||
}
|
||||
return{
|
||||
|
||||
@@ -2,33 +2,33 @@
|
||||
<div class="nav">
|
||||
<div class="logo" :style="{'background-color': types == 0 ? 'unset' : ''}">
|
||||
|
||||
<img src="" alt="" class="img">
|
||||
<img src="@/static/images/logo.png" alt="" class="img">
|
||||
<div class="title" :style="{'color': types == 0 ? '#07AD97' : ''}">Beelink</div>
|
||||
</div>
|
||||
<div class="navigation">
|
||||
<div class="item" v-for="(i,j) in nav" :key="j">
|
||||
<div class="item" v-for="(i,j) in nav" :key="j" @click="navto(j)">
|
||||
{{i.name}}
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 100%"></div>
|
||||
<div class="setting">
|
||||
<div class="item">
|
||||
<img src="" alt="" class="icon">
|
||||
<img src="@/static/images/shijian.png" alt="" class="icon">
|
||||
<div class="name">北京 GMT +08:00</div>
|
||||
<img src="" alt="" class="down">
|
||||
<img src="@/static/images/jiantou2.png" alt="" class="down">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="" alt="" class="icon">
|
||||
<img src="@/static/images/qianbi.png" alt="" class="icon">
|
||||
<div class="name">人民币</div>
|
||||
<img src="" alt="" class="down">
|
||||
<img src="@/static/images/jiantou2.png" alt="" class="down">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="" alt="" class="icon">
|
||||
<img src="@/static/images/yuyan.png" alt="" class="icon">
|
||||
<div class="name">中文</div>
|
||||
<img src="" alt="" class="down">
|
||||
<img src="@/static/images/jiantou2.png" alt="" class="down">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="" alt="" class="icon">
|
||||
<img src="@/static/images/rili.png" alt="" class="icon">
|
||||
<div class="name">日历</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -49,7 +49,6 @@
|
||||
.img{
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
background-color: #0f0;
|
||||
margin-left: 14px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
@@ -93,7 +92,6 @@
|
||||
.icon{
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-color: #0f0;
|
||||
}
|
||||
.name{
|
||||
margin-left: 6px;
|
||||
@@ -105,13 +103,13 @@
|
||||
width: 9px;
|
||||
height: 5px;
|
||||
margin-left: 20px;
|
||||
background-color: #0f0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script lang="ts">
|
||||
import router from '@/router';
|
||||
import { defineComponent, ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
|
||||
@@ -139,7 +137,7 @@ export default defineComponent({
|
||||
},
|
||||
{
|
||||
name: "视频管理",
|
||||
route: ""
|
||||
route: "/regime/video"
|
||||
},
|
||||
{
|
||||
name: "订阅者管理",
|
||||
@@ -147,12 +145,18 @@ export default defineComponent({
|
||||
},
|
||||
{
|
||||
name: "个人中心",
|
||||
route: ""
|
||||
route: "/mine/archives"
|
||||
}
|
||||
]
|
||||
function navto(index: number){
|
||||
router.push({
|
||||
path: nav[index].route
|
||||
})
|
||||
}
|
||||
return {
|
||||
nav,
|
||||
types
|
||||
types,
|
||||
navto
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@@ -60,7 +60,7 @@
|
||||
.reply{
|
||||
padding-top: 28px;
|
||||
border-top: 1px solid #ededed;
|
||||
&::v-deep .ant-input{
|
||||
::v-deep .ant-input{
|
||||
font-size: 11px;
|
||||
}
|
||||
.send{
|
||||
|
||||
Reference in New Issue
Block a user