论坛交流页面样式完善 以及 接口调试
This commit is contained in:
parent
849043d4fc
commit
abbb22c560
|
|
@ -7,8 +7,15 @@
|
|||
.breadcrumb {
|
||||
margin: 2vw 0;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
}
|
||||
.edit-content{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin: 0 17vw 3vw;
|
||||
text-align: center;
|
||||
}
|
||||
/* 面板 */
|
||||
.content {
|
||||
display: flex;
|
||||
|
|
@ -34,6 +41,13 @@
|
|||
float: left;
|
||||
margin: 2vw;
|
||||
}
|
||||
.card-content-left {
|
||||
text-align: left;
|
||||
display: block;
|
||||
position: relative;
|
||||
float: left;
|
||||
margin: 1vw 1.5vw;
|
||||
}
|
||||
.card-img {
|
||||
position: relative;
|
||||
float: left;
|
||||
|
|
@ -41,10 +55,6 @@
|
|||
height: auto;
|
||||
}
|
||||
|
||||
.content-button{
|
||||
margin: 2vw 24vw 15px;
|
||||
text-align: right;
|
||||
}
|
||||
/* 分割线 */
|
||||
.el-divider {
|
||||
width: 95%;
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@ export default {
|
|||
return {
|
||||
banner: require("@/assets/logo/banner.jpg"),
|
||||
osredmLogo: require("@/assets/logo/osredmLogo.svg"),
|
||||
activeIndex: "home", /* 启动默认显示页 */
|
||||
activeIndex: "", /* 启动默认显示页 */
|
||||
|
||||
userName: "",
|
||||
userPass: "",
|
||||
|
|
@ -119,6 +119,13 @@ export default {
|
|||
// 返回红山开源
|
||||
backOsredm(){
|
||||
window.location.href='https://www.osredm.com'
|
||||
},
|
||||
|
||||
// 获取路由path 得到当前页
|
||||
getPath(){
|
||||
|
||||
var path = this.$route.path
|
||||
this.activeIndex = path.split("/")[2]
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -127,7 +134,7 @@ export default {
|
|||
this.userName = sessionStorage.getItem("name");
|
||||
this.userPass = sessionStorage.getItem("pass");
|
||||
this.userAvatar = require("@/assets/logo/user.jpg");
|
||||
|
||||
this.getPath()
|
||||
/* var userRank = sessionStorage.getItem("rank");
|
||||
if (userRank == 1) {
|
||||
this.rankIf = true;
|
||||
|
|
|
|||
|
|
@ -1,15 +1,18 @@
|
|||
<template>
|
||||
<div>
|
||||
<div v-loading="contentLoading" element-loading-background="rgb(255, 255, 255)">
|
||||
|
||||
<div class="content-button">
|
||||
<el-button plain class="edit-button">编辑</el-button>
|
||||
<div class="content-button" >
|
||||
<el-button plain class="edit-button" @click="goToEdit">编辑</el-button>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<div class="content" >
|
||||
<div class="white"></div>
|
||||
<div class="card">
|
||||
<el-image :src="chat" class="card-img"/>
|
||||
<div class="card-content">
|
||||
|
||||
<el-image :src="chat" class="flot-img"/>
|
||||
|
||||
<div class="card-content-left">
|
||||
<h3>交流互动</h3>
|
||||
<div>dadasdadsad</div>
|
||||
<div>dsvdsvsdvsdvds</div>
|
||||
</div>
|
||||
|
|
@ -17,15 +20,15 @@
|
|||
|
||||
<div class="card">
|
||||
<div class="chat-link">
|
||||
<div class="chat-link">
|
||||
<div class="chat-link" style="cursor: pointer">
|
||||
<el-image :src="chat_link1" class="img-link"/>
|
||||
<div class="chat-link">参赛资讯</div>
|
||||
</div>
|
||||
<div class="chat-link">
|
||||
<div class="chat-link" style="cursor: pointer">
|
||||
<el-image :src="chat_link2" class="img-link"/>
|
||||
<div class="chat-link">选手交流</div>
|
||||
</div>
|
||||
<div class="chat-link">
|
||||
<div class="chat-link" style="cursor: pointer">
|
||||
<el-image :src="chat_link3" class="img-link"/>
|
||||
<div class="chat-link">专家答疑</div>
|
||||
</div>
|
||||
|
|
@ -37,12 +40,70 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import pageUtils from "@/utils/pageUtils";
|
||||
import {Message} from "element-ui";
|
||||
|
||||
export default {
|
||||
name: "Chat"
|
||||
name: "Chat",
|
||||
data(){
|
||||
return{
|
||||
chat:'/api/files/chat-img.png',
|
||||
chat_link1:'/api/files/chat-icon.png',
|
||||
chat_link2:'/api/files/chat-icon.png',
|
||||
chat_link3:'/api/files/chat-icon.png',
|
||||
contentLoading: true,
|
||||
loadingBg:'#FFF'
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
initPage(){
|
||||
pageUtils.checkComp(this.$router,this.$route.params.compId,this.$api)
|
||||
this.$api.getPageData(this.$route.params.compId,'chat').then((res) => {
|
||||
console.log(res)
|
||||
//先判断 该页面是否展示
|
||||
if (res.data.show) {
|
||||
this.chat_link1 = res.data.logoOne
|
||||
this.chat_link2 = res.data.logoTwo
|
||||
this.chat_link3 = res.data.logoThree
|
||||
this.chat = res.data.imgUrl
|
||||
this.contentLoading = false
|
||||
}else {
|
||||
Message.warning("该页面不存在")
|
||||
this.$router.push({
|
||||
path: '/404'
|
||||
});
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
goToEdit(){
|
||||
// 跳转至编辑页面
|
||||
pageUtils.openPage(this.$router,"/" + this.$route.params.compId + "/chatEdit")
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.initPage()
|
||||
},
|
||||
created() {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.flot-img{
|
||||
/*margin-top: -50px;*/
|
||||
padding: 1vw;
|
||||
position: relative;
|
||||
float: left;
|
||||
margin-top: -70px;
|
||||
margin-left: 20px;
|
||||
margin-bottom: 20px;
|
||||
width:35vw;
|
||||
height: auto;
|
||||
box-shadow: inset 0 3px 8px rgba(219,227,255,.7)
|
||||
|
||||
}
|
||||
|
||||
.white {
|
||||
height: 66px;
|
||||
|
|
@ -51,10 +112,13 @@ export default {
|
|||
.chat-link {
|
||||
display: flex;
|
||||
margin: 1vw auto;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
.img-link {
|
||||
width: 25%;
|
||||
height: auto;
|
||||
width: auto;
|
||||
height: 3vw;
|
||||
padding: 0.5vw;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,46 @@
|
|||
<template>
|
||||
<div class="edit-content">
|
||||
<el-breadcrumb class="breadcrumb" separator="/">
|
||||
<el-breadcrumb-item :to="{ path: '/' + this.$route.params.compId +'/chat' }">交流互动</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>编辑</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<mavon-editor :ishljs="true" v-model="data" @change="change"/>
|
||||
<div class="button-group">
|
||||
<el-button type="primary" @click="submit">提交</el-button>
|
||||
<el-button>取消</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "ChatEdit",
|
||||
data(){
|
||||
return{
|
||||
data: "",
|
||||
html:""
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
change(value,render){
|
||||
this.html = render
|
||||
},
|
||||
submit(){
|
||||
console.log(this.data)
|
||||
console.log(this.html)
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style src="@/assets/css/common.css" scoped>
|
||||
|
||||
|
||||
</style>
|
||||
<style>
|
||||
.button-group{
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
<div>
|
||||
<div class="content-button">
|
||||
<el-button plain class="edit-button">编辑</el-button>
|
||||
<el-button plain>编辑</el-button>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
|
|
@ -65,4 +65,3 @@ export default {
|
|||
</style>
|
||||
|
||||
<style src="@/assets/css/common.css" scoped/>
|
||||
>>>>>>> master
|
||||
|
|
|
|||
|
|
@ -1,32 +1,32 @@
|
|||
<template>
|
||||
<div class="content">
|
||||
<el-breadcrumb class="breadcrumb" separator="/">
|
||||
<el-breadcrumb-item :to="{ path: '/home' }">赛事首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>编辑</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<mavon-editor :ishljs="true" v-model="data" @save="save"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "HomeEdit",
|
||||
data(){
|
||||
return{
|
||||
data: ""
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
save(value,render){
|
||||
// value是markdown格式
|
||||
// render是html格式
|
||||
console.log(value)
|
||||
console.log(render)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style src="@/assets/css/common.css" scoped>
|
||||
|
||||
<template>
|
||||
<div class="edit-content">
|
||||
<el-breadcrumb class="breadcrumb" separator="/">
|
||||
<el-breadcrumb-item :to="{ path: '/' + this.$route.params.compId + '/home' }">赛事首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>编辑</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<mavon-editor :ishljs="true" v-model="data" @save="save"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "HomeEdit",
|
||||
data(){
|
||||
return{
|
||||
data: ""
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
save(value,render){
|
||||
// value是markdown格式
|
||||
// render是html格式
|
||||
console.log(value)
|
||||
console.log(render)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style src="@/assets/css/common.css" scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -32,10 +32,18 @@ export const getComp = data => {
|
|||
})
|
||||
};
|
||||
|
||||
export const getPageData = (compId,page) => {
|
||||
return axios({
|
||||
url: '/comp/getPageData/'+ compId + '/' + page,
|
||||
method: 'get',
|
||||
})
|
||||
};
|
||||
|
||||
// 默认全部倒出
|
||||
// 根据需要进行
|
||||
export default {
|
||||
query,
|
||||
mock,
|
||||
getComp
|
||||
getComp,
|
||||
getPageData
|
||||
}
|
||||
Loading…
Reference in New Issue