From 08e0f4f66d2e39a19b91e8e2fe1bcad75569d4b8 Mon Sep 17 00:00:00 2001 From: 明梦爽 <2972214568@qq.com> Date: 星期三, 26 一月 2022 23:24:08 +0800 Subject: [PATCH] 登录权限设置好 --- src/components/page/xueShuJiaoLiu.vue | 172 +++++++++++++++++++++++++++++++++++++++++--------------- 1 files changed, 125 insertions(+), 47 deletions(-) diff --git a/src/components/page/xueShuJiaoLiu.vue b/src/components/page/xueShuJiaoLiu.vue index b13e877..8f56845 100644 --- a/src/components/page/xueShuJiaoLiu.vue +++ b/src/components/page/xueShuJiaoLiu.vue @@ -1,68 +1,146 @@ <template> <div> - <globalTitle /> - - <el-tabs :tab-position="tabPosition" style="height: 400px; width=500px"> - <el-tab-pane label="瀛︽湳淇℃伅"> - <template> - <el-table :data="xueshuData" style="width: 100%"> - <el-table-column prop="date" label="瀛︽湳淇℃伅" width=""> - </el-table-column> - </el-table> - </template> - </el-tab-pane> - <el-tab-pane label="绉戞妧绔炶禌"> - <template> - <el-table :data="kejiData" style="width: 100%"> - <el-table-column prop="date" label="绉戞妧绔炶禌" width=""> - </el-table-column> - </el-table> - </template> - </el-tab-pane> - </el-tabs> + <el-row> + <globalTitle /> + </el-row> + <el-row class="mart10"> + <!-- 灏忔爣棰� --> + <el-col :span="4" class="marr10"> + <ul> + <li v-for="(item, index) in menuList" :key="index" class="liStylenone liPointer marb10" @click="changeMenu(item)"> + <b :class="cont == item.name ? 'ft-blue' : 'ft-black'">{{item.name}}</b> + </li> + </ul> + </el-col> + <!-- 鏂伴椈鍐呭 --> + <el-card class="box-card"> + <p class="name">{{this.cont}}</p> + <hr class="namehr"> + <el-col :span="24"> + <div> + <el-row class="marb10" :key="index" v-for="(item, index) in newsList"> + <div class="flex-v flex-between marb5 cursor" @click="show(item)"> + <div>{{ item.title }}</div> + <div>{{ item.releaseTime }}</div> + </div> + <el-divider class="hr"></el-divider> + </el-row> + </div> + <!-- 鍒嗛〉 --> + <div class="fenye"> + <el-pagination + background + @current-change="handleCurrentChange" + :current-page.sync="currentPage" + :page-size="pageSize" + layout="prev, pager, next,total" + :total="total"> + </el-pagination> + </div> + </el-col> + </el-card> + </el-row> </div> </template> <script> import globalTitle from '../globalTitle.vue' +import { getMinTitle, getNewsList } from '../../api/api' export default { components: { globalTitle }, name: 'xueShuJiaoLiu', data() { return { - tabPosition: 'left', - xueshuData: [ - { - date: '甯傛斂鍗忓壇涓诲腑鐜嬭憲涓�琛屾潵鎴戞牎鑰冨療璋冪爺', - }, - { - date: '閮戝窞澶у鍗氬+鐢熷甯堝垬蹇椾紵鏁欐巿鏉ユ垜鏍¤瀛�', - }, - { - date: '鍗椾含澶у鍗氬+鐢熷甯堢繜鍥芥柟鏁欐巿鏉ユ垜鏍¤瀛�', - }, - { - date: '鍗庝腑绉戞妧澶у鍗氬+鐢熷甯堝緪鏅撴灄鍙楄仒鎴戞牎鐗硅仒鏁欐巿', + cont: '', + menuList: [], + newsList:[], + pageSize:5, + currentPage:1, + total:0, + item:{}, + } + }, + created() { + }, + mounted() { + this.getTitle(); + }, + watch: { + menuList(n,o){ + this.cont = this.menuList[0].name + this.item = this.menuList[0]; + this.getnews(this.menuList[0]); + } + }, + methods: { + handleCurrentChange(val) { + console.log(`褰撳墠椤�: ${val}`); + this.getnews(this.item); + }, + getTitle(){ + const data = Number(this.$route.query.id); + getMinTitle(data).then(res => { + console.log(res); + if(res.code == 200){ + this.menuList = res.data } - ], - kejiData: [ - { - date: '鎴戞牎椴查箯浜т笟瀛﹂櫌鍦ㄦ渤鍗楃渷椴查箯浜т笟瀛﹂櫌寤鸿鑰冩牳涓幏寰椾紭绉�', - }, - { - date: '2021绾т复搴婂尰瀛︽湰绉戠敓瀛︿笟瀵煎笀鍙婄彮涓讳换鑱樹换浠紡涓捐', - }, - { - date: '鎴戞牎绗崄涓�娆″鐢熶唬琛ㄥぇ浼氫妇琛�', - }, - { - date: '娌冲崡鐪侀珮绛夋暀鑲插浜嬪伐浣滀笟鍔″煿璁細鍦ㄦ垜鏍″彫寮�', + }).catch(err => { + console.log(err); + }) + }, + changeMenu(val) { + this.cont = val.name + this.item = val + this.currentPage = 1 + this.getnews(val); + }, + getnews(item){ + const data = { + current:this.currentPage, + newsCategoryId:item.id, + size:this.pageSize + }; + getNewsList(data).then(res => { + console.log(res); + if(res.code == 200){ + this.newsList = res.data.records + this.total = Number(res.data.total) } - ] + }).catch(error => { + console.log(error); + }) + }, + // 璺宠浆鍒版柊闂诲睍绀洪〉闈� + show(item){ + // console.log(item.id); + this.$router.push({path:'/home/news',query:{id:item.id}}) } } } </script> <style lang="less" scoped> +ul { + width: 200px; + li { + background-color: rgb(242, 243, 245); + height: 50px; + line-height: 50px; + text-align: center; + } +} +.ft-blue { + color: rgb(9, 143, 252); +} +.ft-black { + color: #000; +} +.box-card{ + height: 500px; + position: relative; + .fenye{ + position: absolute; + bottom: 10px; + } +} </style> \ No newline at end of file -- Gitblit v1.8.0