|
|
@@ -1,56 +1,96 @@
|
|
|
<template>
|
|
|
- <el-row id="movie-list">
|
|
|
- <el-col v-for="(user, index) in userList" :key="index" :md="1" :sm="3" :xs="3">
|
|
|
- <router-link target="_blank" :to="`/user/` + user.userId">
|
|
|
- <el-avatar>
|
|
|
- <el-image :src="user.avatarUrl" />
|
|
|
- </el-avatar>
|
|
|
- </router-link>
|
|
|
+ <div>
|
|
|
+ <el-col
|
|
|
+ v-for="(more, index) in moreList"
|
|
|
+ :key="index"
|
|
|
+ :md="6"
|
|
|
+ :sm="6"
|
|
|
+ :xs="6"
|
|
|
+ style="padding: 5px;"
|
|
|
+ >
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <el-row>
|
|
|
+ <el-col :md="4">
|
|
|
+ <router-link target="_blank" :to="more.link">
|
|
|
+ <el-avatar>
|
|
|
+ <el-image :src="more.coverUrl" />
|
|
|
+ </el-avatar>
|
|
|
+ </router-link>
|
|
|
+ </el-col>
|
|
|
+ <el-col :md="16">
|
|
|
+ <el-row style="padding: 5px;">
|
|
|
+ <span v-html="more.title" />
|
|
|
+ </el-row>
|
|
|
+ <el-row style="padding: 5px;">
|
|
|
+ <span v-html="more.desc" />
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
</el-col>
|
|
|
- </el-row>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { getUsers } from '@/api/user'
|
|
|
-
|
|
|
export default {
|
|
|
name: 'Discover',
|
|
|
data() {
|
|
|
return {
|
|
|
- // 屏幕宽度, 为了控制分页条的大小
|
|
|
- screenWidth: document.body.clientWidth,
|
|
|
- currentPage: 1,
|
|
|
- userList: [],
|
|
|
- showEmpty: true
|
|
|
+ moreList: []
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
document.title = '发现'
|
|
|
- this.currentPage = 1
|
|
|
-
|
|
|
- getUsers().then(res => {
|
|
|
- if (res.code === 0) {
|
|
|
- const resData = res.data
|
|
|
- this.userList = resData
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- // 当窗口宽度改变时获取屏幕宽度
|
|
|
- window.onresize = () => {
|
|
|
- return () => {
|
|
|
- window.screenWidth = document.body.clientWidth
|
|
|
- this.screenWidth = window.screenWidth
|
|
|
- }
|
|
|
- }
|
|
|
+ this.getData()
|
|
|
},
|
|
|
methods: {
|
|
|
- handleCurrentChange(currentPage) {
|
|
|
- this.currentPage = currentPage
|
|
|
- this.$store.commit('updatePage', currentPage)
|
|
|
- this.$store.dispatch('getPageBean')
|
|
|
- // 回到顶部
|
|
|
- scrollTo(0, 0)
|
|
|
+ getData() {
|
|
|
+ this.moreList.push(
|
|
|
+ {
|
|
|
+ title: 'map',
|
|
|
+ desc: '地图',
|
|
|
+ link: '/map',
|
|
|
+ coverUrl: ''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'exam',
|
|
|
+ desc: '考试',
|
|
|
+ link: '/exam',
|
|
|
+ coverUrl: ''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'mall',
|
|
|
+ desc: '商城',
|
|
|
+ link: '/mall',
|
|
|
+ coverUrl: ''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'vote',
|
|
|
+ desc: '投票',
|
|
|
+ link: '/vote',
|
|
|
+ coverUrl: ''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'wenshu',
|
|
|
+ desc: '裁判文书',
|
|
|
+ link: '/wenshu',
|
|
|
+ coverUrl: ''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'chart',
|
|
|
+ desc: '图表',
|
|
|
+ link: '/chart',
|
|
|
+ coverUrl: ''
|
|
|
+ }/*,
|
|
|
+ {
|
|
|
+ title: 'chat',
|
|
|
+ desc: 'IM',
|
|
|
+ link: '/chat',
|
|
|
+ coverUrl: ''
|
|
|
+ }*/
|
|
|
+ )
|
|
|
}
|
|
|
}
|
|
|
}
|
