Commit 01b3d7be authored by jiaoyahui's avatar jiaoyahui

新增我的浏览 关注 这些页面,以及样式

parent 4002db8e
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1″>
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<script src="./static/js/mqttws31.js" type="text/javascript"></script> <script src="./static/js/mqttws31.js" type="text/javascript"></script>
<title>斗牛财经</title> <title>斗牛财经</title>
......
...@@ -8,6 +8,11 @@ import live from '../views/live' ...@@ -8,6 +8,11 @@ import live from '../views/live'
import pdf from '../views/pdf' import pdf from '../views/pdf'
import fullScreen from '../views/fullScreen' import fullScreen from '../views/fullScreen'
import list from '../views/liveList' import list from '../views/liveList'
import mine from '../views/mine/index'//我的页面
import about from '../views/mine/about'//关于我们
import follow from '../views/mine/follow'//关于我们
import browse from '../views/mine/browse'//我的浏览
import proposal from '../views/mine/proposal'//我的建议
// import bullet from '../views/bullet' // import bullet from '../views/bullet'
...@@ -86,6 +91,36 @@ const router = new Router({ ...@@ -86,6 +91,36 @@ const router = new Router({
component: list, component: list,
}, },
{
path: '/mine',
name: 'mine',
component: mine,
},
{
path: '/about',
name: 'about',
component: about,
},
{
path: '/follow',
name: 'follow',
component: follow,
},
{
path: '/browse',
name: 'browse',
component: browse,
},
{
path: '/proposal',
name: 'proposal',
component: proposal,
},
] ]
}) })
......
...@@ -1001,13 +1001,13 @@ display: block; ...@@ -1001,13 +1001,13 @@ display: block;
} }
.conten{ .conten{
position:fixed; position: fixed;
top:0%; bottom: 0%;
left:0%; left: 0%;
width:100%; width: 100%;
/* background:red */ /* background: red; */
background: white; background: white;
height:100% height: 100%;
} }
.p_conte{ .p_conte{
position: relative; position: relative;
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="head"> <div class="head">
<span>斗牛财经</span> <span>斗牛财经</span>
<img v-if="ifLog==0" class="portait-not" src="../common/img/not-logged.png" alt=""> <img v-if="ifLog==0" class="portait-not" src="../common/img/not-logged.png" alt="">
<img v-if="ifLog==1" class="portait-not" src="../common/img/title_logo.png" alt=""> <img v-if="ifLog==1" class="portait-not" src="../common/img/title_logo.png" alt="" @click="mine">
<img v-if="ifLog==2" class="portait-not" :src="userImg" alt=""> <img v-if="ifLog==2" class="portait-not" :src="userImg" alt="">
</div> </div>
<div class="tab"> <div class="tab">
...@@ -163,6 +163,9 @@ export default { ...@@ -163,6 +163,9 @@ export default {
}) })
},
mine(){
this.$router.push('/mine')
} }
}, },
}; };
......
<template>
<div class="abont">
<div>关于我们</div>
<img src="../../assets/about.png" alt="">
</div>
</template>
<script type="text/ecmascript-6">
export default {
data () {
return {}
},
created () { },
mounted () {
this.beforeCreate()
},
methods: {
beforeCreate () {
document.querySelector('body').setAttribute('style', 'background-color:rgba(247, 247, 247, 1);')
},
beforeDestroy () {
document.querySelector('body').removeAttribute('style')
}
},
components: {}
}
</script>
<style scoped>
.abont{
text-align: center;
margin-top: 20px;
font-size: 16px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #222222;
line-height: 22px;
}
</style>
<template>
<div class="cont">
<div class="brow">我的浏览</div>
<div class="time">一天之内</div>
<div class="Flor">
<div><img src="../../assets/let.png" alt="" class="Pong"></div>
<div class="name">
<div>行业时间</div>
<div class="Ti">林秋平</div>
<div class="Ti">今天:9:30</div>
</div>
</div>
<div class="timetwo">更早</div>
<div class="Flor">
<div><img src="../../assets/let.png" alt="" class="Pong"></div>
<div class="name">
<div>行业时间</div>
<div class="Ti">林秋平</div>
<div class="Ti">今天:9:30</div>
</div>
</div>
<div class="Flor">
<div><img src="../../assets/let.png" alt="" class="Pong"></div>
<div class="name">
<div>行业时间</div>
<div class="Ti">林秋平</div>
<div class="Ti">今天:9:30</div>
</div>
</div>
</div>
</template>
<script type="text/ecmascript-6">
export default {
data () {
return {}
},
created () { },
mounted () {
this.beforeCreate()
},
methods: {
beforeCreate () {
document.querySelector('body').setAttribute('style', 'background-color:rgba(247, 247, 247, 1);')
},
beforeDestroy () {
document.querySelector('body').removeAttribute('style')
}
}
}
</script>
<style scoped>
body{
width: 100%;
height: 100%;
background-color: #9c8888;
position: fixed;
}
.brow{
text-align:center;
margin-top: 10px;
font-size: 16px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #222222;
line-height: 22px;
}
.time{
font-size: 4.26667vw;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 600;
color: #2C2C2C;
line-height: 5.86667vw;
margin-left: 20px;
}
.timetwo{
font-size: 4.26667vw;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 600;
color: #2C2C2C;
line-height: 5.86667vw;
margin-left: 5.33333vw;
margin-top: 20px;
}
.Pong{
width: 149px;
height: 74px;
padding-right: 10px
}
.Flor{
display: flex;
margin-left: 8.26667vw;
margin-top: 8.26667vw;
background: #FFFFFF;
width: 90.4vw;
height: 26.66667vw;
padding-top: 5.33333vw;
margin: 0 auto;
padding-left: 5.33333vw;
margin-top:10px
}
.name div{
height: 22px;
font-size: 16px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #2C2C2C;
}
.name .Ti{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 20px;
}
</style>
<template>
<div class="flow">
<div class="sent">我的关注</div>
<div class="cont">
<div class="Img_p">
<img src="../../assets/toux.png" alt="">
<img src="../../assets/y.png" alt="" class="Y_p">
<div class="Pelo">
<div>林秋平</div>
<div class="wen">这是一段文字</div>
</div>
</div>
<div>
<img src="../../assets/vit.png" alt="" class="Y_two">
</div>
</div>
<div class="cont">
<div class="Img_p">
<img src="../../assets/toux.png" alt="">
<img src="../../assets/y.png" alt="" class="Y_p">
<div class="Pelo">
<div>林秋平</div>
<div class="wen">这是一段文字</div>
</div>
</div>
<div>
<img src="../../assets/vit.png" alt="" class="Y_two">
</div>
</div>
</div>
</template>
<script type="text/ecmascript-6">
export default {
data () {
return {}
},
created () { },
mounted () {
// this.beforeCreate()
},
methods: {
beforeCreate () {
document.querySelector('body').setAttribute('style', 'background-color:rgba(247, 247, 247, 1);')
},
beforeDestroy () {
document.querySelector('body').removeAttribute('style')
}
},
components: {}
}
</script>
<style scoped>
.flow .sent{
text-align: center;
margin-top: 5.33333vw;
font-size: 4.26667vw;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
position: relative;
color: #222222;
justify-content: space-around;
}
.cont .Img_p img{
width: 64px;
height: 64px;
padding-top: 12px;
}
.cont{
display: flex;
justify-content: space-around;
margin-top: 9.33333vw;
width: 90.4vw;
height: 26.66667vw;
margin: 0 auto;
margin-top: 5.33333vw;
background: #F7F7F7;
}
.cont .Img_p .Y_p{
width: 11.73333vw;
height: 5.6vw;
position: absolute;
left: 2.2vw;
top: 14.4vw;
}
.Img_p{
display: flex;
position: relative;
}
.cont .Y_two{
width: 64px;
height: 23px;
margin-top: 9vw;
}
.Pelo{
margin-top: 5.66667vw;
margin-left: 10px;
}
.Pelo .wen{
margin-top: 10px;
}
</style>
<template>
<div class="Contain">
<div>
<div class="Plog">
<div>
<img class="portait-not" src="../../assets/title_logo.png" alt="">
</div>
<div class="Login">
<span>登录</span><span>/注册</span>
<div>我们在等您登录注册哦</div>
</div>
</div>
</div>
<div class="grounp_p">
<div class="grounp">
<span>*****</span>
<div>今日积分</div>
</div>
<div class="grounp">
<span>*****</span>
<div>累计积分</div>
</div>
<div class="grounp">
<span>*****</span>
<div>我的金牛</div>
</div>
</div>
<div class="one_p">
<div class="test_sen" @click="browse">
<img src="../../assets/eye.png" alt="">
<div>我的浏览</div>
</div>
<div class="test_sen" @click="fllow">
<img src="../../assets/stars.png" alt="">
<div>我的关注</div>
</div>
<div class="test_sen">
<img src="../../assets/mine_m.png" alt="">
<div>客服电话</div>
</div>
<div class="test_sen" @click="proposal">
<img src="../../assets/read.png" alt="">
<div>投诉建议</div>
</div>
</div>
<div class="Pent">
<div class="Rig">
<div>用户协议</div>
<img src="../../assets/right.png" alt="">
</div>
<div class="Rig">
<div>隐私政策</div>
<img src="../../assets/right.png" alt="">
</div>
<div class="Rig" @click="about">
<div>关于我们</div>
<img src="../../assets/right.png" alt="">
</div>
</div>
<div class="sent">
<div class="Ing_m">
<img src="../../assets/app.png" alt="">
<div>下载App ></div>
</div>
</div>
<div class="sent">
<div class="Ing_m">
<img src="../../assets/xcx.png" alt="">
<div>下载小程序 ></div>
</div>
</div>
</div>
</template>
<script type="text/ecmascript-6">
export default {
data () {
return {}
},
created () { },
mounted () {
this.beforeCreate()
},
methods: {
beforeCreate () {
document.querySelector('body').setAttribute('style', 'background-color:rgba(247, 247, 247, 1);')
},
beforeDestroy () {
document.querySelector('body').removeAttribute('style')
},
about:function(){
this.$router.replace({
path: "/about"//要跳转的页面的路由
});
},
fllow:function(){
this.$router.replace({
path: "/follow"//要跳转的页面的路由
});
},
browse:function(){
this.$router.replace({
path: "/browse"//要跳转的页面的路由
});
},
proposal:function(){
this.$router.replace({
path: "/proposal"//要跳转的页面的路由
});
}
}
}
</script>
<style scoped>
.Plog_p{
}
.Plog{
/* position: absolute;
top: 29px;
left: 60px; */
display: flex;
margin:20px 20px 20px 20px
}
.portait-not{
height: 7vw;
width: 7vw;
border-radius: 50%;
/* position: absolute;
top: 1.5vw;
left: 4vw; */
}
.Contain .Plog img{
margin-right:20px;
}
.Contain div img{
width: 58px;
height: 58px;
}
.Login span{
overflow-wrap: break-word;
color: rgba(34, 34, 34, 1);
font-size: 16px;
font-family: PingFangSC-Semibold;
font-weight: 600;
text-align: left;
white-space: nowrap;
line-height: 22px;
}
.Login div{
overflow-wrap: break-word;
color: rgba(101, 101, 101, 1);
font-size: 11px;
font-family: PingFangSC-Regular;
font-weight: NaN;
text-align: left;
white-space: nowrap;
line-height: 16px;
margin-top: 8px;
}
.grounp_p{
display: flex;
justify-content: space-around;
flex-direction: row;
}
.grounp span{
text-align: center;
/* border: 1px solid red; */
/* width: 87px; */
display: block;
}
.grounp div{
color: rgba(102, 102, 102, 1);
font-size: 12px;
font-family: PingFangSC-Regular;
font-weight: NaN;
text-align: left;
white-space: nowrap;
line-height: 17px;
margin-top: 2px;
}
.Contain .test_sen img{
width: 36px;
height: 36px;
padding-left: 7px;
border-radius: 8px;
}
.test_sen div{
font-size: 12px;
font-family: PingFangSC-Regular;
font-weight: NaN;
}
.one_p{
display: flex;
justify-content: space-around;
flex-direction: row;
margin-top: 2.66667vw;
/* border: 1px solid red; */
background: white;
margin: 10px 20px 0px 20px;
padding-top: 18px;
height: 79px;
}
.Contain .Rig img{
width: 16px;
height: 16px;
/* margin: 2px 0 2px 0; */
}
.Pent .Rig{
display: flex;
justify-content: space-between;
flex-direction: row;
display: flex;
justify-content: space-between;
flex-direction: row;
/* padding-left: 5.33333vw; */
border-bottom: 1px solid #DCDCDC;
padding-top: 2.66667vw;
/* padding-right: 5.33333vw; */
padding-bottom: 5.33333vw;
margin-right: 10px;
}
.Pent{
background: white;
margin-top: 8vw;
margin-left: 5.33333vw;
margin-right: 5.33333vw;
padding-left: 22px;
padding-bottom: 10px;
}
.Contain .Pent div{
color: rgba(34, 34, 34, 1);
font-size: 14px;
font-family: PingFangSC-Regular;
font-weight: NaN;
}
.Contain .Ing_m img{
width: 372px;
height: 161px;
margin-top:10px;
}
.Contain .Ing_m div{
position: absolute;
top: 112px;
right: 38px;
color:red;
font-size: 12px;
margin-top:10px;
}
.sent{
position: relative;
}
</style>
<template>
<div class="cont">
<div class="aft">投诉与建议</div>
<div class="grup">
<img src="../../assets/fu.png" alt="" class="Lent">
<span>遇到问题了?点击拨打<span style="color:red">客服热线</span>为您解决</span>
</div>
<div class="grup_p">您的问题或者建议</div>
<div class="plead">
<div>请填写你的遇到的问题或者功能建议,感谢支持(必填)</div>
</div>
<div class="In_img">图片(选填,提供问题截图)</div>
<div class="Pon">
<div></div>
</div>
<div class="line">联系方式</div>
<div class="ba_c">
<div>留下联系方式,更方便解决问题</div>
</div>
<div class="log_t">
<img src="../../assets/login_t.png" alt="">
</div>
</div>
</template>
<script type="text/ecmascript-6">
export default {
data () {
return {}
},
created () { },
mounted () {
this.beforeCreate()
},
methods: {
beforeCreate () {
document.querySelector('body').setAttribute('style', 'background-color:#F7F7F7;')
},
beforeDestroy () {
document.querySelector('body').removeAttribute('style')
}
},
components: {}
}
</script>
<style scoped>
.aft{
font-size: 4.8vw;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #1F1F1F;
line-height: 6.66667vw;
text-align: center;
/* margin-top: 11.2vw; */
background: white;
height: 85px;
line-height: 85px;
}
.Lent{
width: 13px;
height: 13px;
}
.grup{
margin-left:34px;
margin-top:10px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #656565;
line-height: 20px;
}
.log_t{
text-align: center;
margin-top: 215px;
}
.log_t img{
width: 272px;
height: 46px;
background: #E11E1E;
border-radius: 23px;
}
.grup_p{
margin-top: 14px;
margin-left:34px;
margin-top:10px;
font-size: 14px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #656565;
line-height: 20px;
}
.line{
font-size: 14px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #656565;
line-height: 20px;
margin-left:32px;
margin-top:18px;
margin-bottom: 12px;
}
.plead{
/* margin-top: 5.33333vw; */
/* width: 89.6vw; */
height: 33.86667vw;
background: #FFFFFF;
border-radius: 2.13333vw;
font-size: 3.73333vw;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
padding: 5.33333vw;
/* margin-left: 27px; */
/* margin-right: 28px; */
margin: 10px;
}
.In_img{
font-size: 3.73333vw;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #656565;
line-height: 5.33333vw;
/* margin: 3.2vw 0 0 1.6vw; */
margin-left: 21px;
}
.Pon{
width: 89.6vw;
height: 21.33333vw;
background: #FFFFFF;
border-radius: 2.13333vw;
margin: 0 quto;
margin: 0 auto;
margin-top: 12px;
}
.ba_c{
/* width: 89.6vw; */
height: 12.26667vw;
background: #FFFFFF;
border-radius: 2.13333vw;
font-size: 3.73333vw;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 12.33333vw;
margin-left: 4.93333vw;
/* text-align: center; */
/* padding-left: 4vw; */
margin-right: 12px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment