专题页面nav调整
This commit is contained in:
parent
f1cad19531
commit
63288736d4
@ -1,41 +1,45 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-row class="wrapper">
|
<div class="wrapper">
|
||||||
<el-col style="margin-bottom: 1rem;">
|
|
||||||
<el-menu type="border-card" :default-active="currentTopic" style="margin-top: -2px;border: 0;" mode="horizontal"
|
<div style="background: white">
|
||||||
|
<el-menu type="border-card" :default-active="currentTopic"
|
||||||
|
style="width: 96%;margin: 0 auto" mode="horizontal"
|
||||||
@select="handleSelectTopic">
|
@select="handleSelectTopic">
|
||||||
<el-menu-item index="news">最新</el-menu-item>
|
<el-menu-item index="news">最新</el-menu-item>
|
||||||
<el-menu-item v-for="topic in topicNavs" :key="topic.idTopic" :index="topic.topicUri">{{topic.topicTitle}}
|
<el-menu-item v-for="topic in topicNavs" :key="topic.idTopic" :index="topic.topicUri">{{ topic.topicTitle }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
</el-menu>
|
</el-menu>
|
||||||
</el-col>
|
</div>
|
||||||
</el-row>
|
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import {mapState} from 'vuex'
|
import {mapState} from 'vuex'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "topicNav",
|
name: "topicNav",
|
||||||
props: {
|
props: {
|
||||||
currentTopic: {
|
currentTopic: {
|
||||||
type: String,
|
type: String,
|
||||||
default: 'news'
|
default: 'news'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState({
|
...mapState({
|
||||||
topicNavs: state => state.topic.data,
|
topicNavs: state => state.topic.data,
|
||||||
isFetching: state => state.topic.fetching
|
isFetching: state => state.topic.fetching
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
methods: {
|
watch: {},
|
||||||
handleSelectTopic(item) {
|
methods: {
|
||||||
this.$router.push({
|
handleSelectTopic(item) {
|
||||||
path: `/topic/${item}?page=1`
|
this.$router.push({
|
||||||
});
|
path: `/topic/${item}?page=1`
|
||||||
}
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
@ -117,7 +117,7 @@ export default {
|
|||||||
proxy: [ //proxy配置
|
proxy: [ //proxy配置
|
||||||
['/api', {
|
['/api', {
|
||||||
target: apiConfig.BASE, //api请求路径
|
target: apiConfig.BASE, //api请求路径
|
||||||
pathRewrite: {'^/api': isDevMode ? '/api/v1' : '/api'} //重定向请求路径,防止路由、api路径的冲突
|
pathRewrite: {'^/api': isDevMode ? '/api' : '/api'} //重定向请求路径,防止路由、api路径的冲突
|
||||||
}],
|
}],
|
||||||
['/ws', {
|
['/ws', {
|
||||||
target: apiConfig.BASE //api请求路径
|
target: apiConfig.BASE //api请求路径
|
||||||
|
31738
package-lock.json
generated
Normal file
31738
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,31 +1,27 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
|
<el-row style="margin-top: 20px;">
|
||||||
|
<el-col style="margin-bottom: 1rem;">
|
||||||
<el-row style="margin-top: 20px;">
|
<el-breadcrumb separator-class="el-icon-arrow-right">
|
||||||
<el-col style="margin-bottom: 1rem;">
|
<el-breadcrumb-item :to="{ path: '/admin' }">首页</el-breadcrumb-item>
|
||||||
<el-breadcrumb separator-class="el-icon-arrow-right">
|
<el-breadcrumb-item>专题管理</el-breadcrumb-item>
|
||||||
<el-breadcrumb-item :to="{ path: '/admin' }">首页</el-breadcrumb-item>
|
</el-breadcrumb>
|
||||||
<el-breadcrumb-item>专题管理</el-breadcrumb-item>
|
</el-col>
|
||||||
</el-breadcrumb>
|
<el-col style="margin: .5rem;">
|
||||||
</el-col>
|
<el-button size="small" @click="createTopic" plain>创建专题</el-button>
|
||||||
<el-col style="margin: .5rem;">
|
</el-col>
|
||||||
<el-button size="small" @click="createTopic" plain>创建专题</el-button>
|
</el-row>
|
||||||
</el-col>
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="8" style="margin-bottom: .5rem;" v-for="topic in topics.list" :key="topic.idTopic">
|
||||||
|
<el-card shadow="never">
|
||||||
|
<div class="card-body d-flex flex-column">
|
||||||
</el-row> <el-row :gutter="20">
|
<el-row :gutter="20">
|
||||||
<el-col :span="8" style="margin-bottom: .5rem;" v-for="topic in topics.list" :key="topic.idTopic">
|
<el-col :span="4" style="text-align: right;">
|
||||||
<el-card shadow="never">
|
<img style="margin-right: 10px;" :src="topic.topicIconPath" :alt="topic.topicTitle"
|
||||||
<div class="card-body d-flex flex-column">
|
class="topic-brand-img">
|
||||||
<el-row :gutter="20">
|
</el-col>
|
||||||
<el-col :span="4" style="text-align: right;">
|
<el-col :span="20">
|
||||||
<img style="margin-right: 10px;" :src="topic.topicIconPath" :alt="topic.topicTitle"
|
<el-link rel="nofollow" @click="onRouter('admin-topic-detail',topic.topicUri)" :underline="false">
|
||||||
class="topic-brand-img">
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="20" >
|
|
||||||
<el-link rel="nofollow" @click="onRouter('admin-topic-detail',topic.topicUri)" :underline="false">
|
|
||||||
<span style="font-size: 20px;font-weight: bold"> {{ topic.topicTitle }}</span>
|
<span style="font-size: 20px;font-weight: bold"> {{ topic.topicTitle }}</span>
|
||||||
</el-link>
|
</el-link>
|
||||||
<div class="text-muted article-summary-md text-content">{{ topic.topicDescription }}</div>
|
<div class="text-muted article-summary-md text-content">{{ topic.topicDescription }}</div>
|
||||||
|
Loading…
Reference in New Issue
Block a user