Skip to content

T
techbook
Commit 1484fad2 authored by zhangyanni's avatar zhangyanni
Browse files
Options

直播

parent 18ee0cbc
Hide whitespace changes
Inline Side-by-side
Showing with 203 additions and 6 deletions
public/live.html 0 → 100644
View file @ 1484fad2
<head>
<title>`DEMO`</title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<script src='https://cnstatic01.e.vhall.com/static/js/iframeSolu.js'></script>
</head>
<body style="height:100%;margin: 0;">
<iframe border="0" src="https://live.vhall.com/room/embedclient/641675169?" style="width: 100%;height: calc(100vh - 3rem);"></iframe>
</body>
\ No newline at end of file
src/assets/img/mobile/medal.png
View replaced file @ 18ee0cbc View file @ 1484fad2
src/assets/img/mobile/medal.png

233 KB | W: | H:

src/assets/img/mobile/medal.png

232 KB | W: | H:

src/assets/img/mobile/medal.png
src/assets/img/mobile/medal.png
src/assets/img/mobile/medal.png
src/assets/img/mobile/medal.png
  • 2-up
  • Swipe
  • Onion skin
src/components/mobile/breadTop.vue
View file @ 1484fad2
<template>
<div class="breadWrap" :class="[isColor?'breadWrap transparentWrap':'',isTransparent?'transWrap':'']">
<!--<i class="iconfont icon-fanhui" @click="handleReturn" v-if="isReturn"></i>-->
<div class="breadWrap" :class="[isColor?'transparentWrap':'',isTransparent?'transWrap':'',isTop?'topZero':'',medalImg?'bgWrap':'']">
<i class="iconfont icon-fanhui" @click="handleReturn" v-if="isReturn&&isTop"></i>
<span class="leftTitle" :class="[isReturn&&isTranslate||!isReturn&&isTranslate?'positionLeftScreen':'',!isTranslate?'positionRightScreen':'']" @click="handleScreen" v-if="isSearch">{{$t("mobile.screenTitle")}} <i class="iconfont icon-xiala"></i></span>
<p>{{title}} <span>{{count}}</span></p>
<p v-if="title" @click="$router.push('/live')">{{title}} <span>{{count}}</span></p>
<span class="rightTitle translate" v-if="isTranslate" @click="handleTranslate">{{isTrans?$t("mobile.showOldActicle"):$t("mobile.translateTitle")}}</span>
</div>
</template>
......@@ -34,7 +34,9 @@
},
isTransparent:false,
hasCount:false,
count:String
count:String,
isTop:false,//没有顶部的时候
medalImg:false
},
data() {
return {
......@@ -160,4 +162,23 @@
border-bottom: 1px solid transparent;
}
}
.topZero{
top: 0;
i{
color: #fff;
}
&::after {
border-bottom: unset;
}
}
.bgWrap{
height: 3rem;
background-image: url("../../assets/img/mobile/medalBg.png");
background-repeat: no-repeat;
background-position: 50% center;
background-size: contain;
display: flex;
align-items: flex-start;
padding-top: .4rem;
}
</style>
\ No newline at end of file
src/main.js
View file @ 1484fad2
......@@ -175,7 +175,7 @@ router.beforeEach((to, from, next) => {
if (i18n.locale== "zh-CN") router.replace({path:'/loginByPhone',query:to.query});
}
if(!publicFun.getCookie("userInfo")){
if(to.name == 'dashboard'||to.name=='indexView'|| to.name == 'login' || to.name == 'mobileLoginCmpt'|| to.name == 'emailLoginCmpt'|| to.name == 'mobileRegisterCmpt'|| to.name == 'emailRegisterCmpt'||to.name=='completeInfoCmpt'|| to.name == 'successCmpt'||to.name=='findPasswordCmpt'||to.name=='modifyPasswordCmpt'||to.name=='passSuccessCmpt'||to.name=='indexView'||to.name=="mobileIndex"||to.name=="mobileLogin"||to.name=="loginByPhone"||to.name=="loginByEmail"||to.name=="mobileRegister"||to.name=="duijieshareRequire"||to.name=="duijieshareProject"||to.name=="knowledgeList"||to.name=="knowledgeDetail"||to.name=='vip'||to.name=='vipList'||to.name=='loadEmail'||to.name=='openEmail'||to.name=="viewRequire"||to.name=="duijiephoneBusinessList"||to.name=="duijiephoneBusinessDetail"||to.name=="duijiephoneRequireDetail"||to.name=="bigBusinessList"||to.name=="bigBusinessDetail"||to.name=="requireDetail"||to.name=="mixSearch"||to.name=="activitylist"||to.name=="activitydetail"||to.name=="activitySearchResult"||to.name=="activityapplyForProject"||to.name=='wechatLogin'||to.name=='newPage'||to.name=='bindAccount'||to.name=='subjectsecondStage'||to.name=='subjectsecondStageDetail'||to.name=='subjectmasterComment'||to.name=='subjectmasterList'||to.name=='subjectmasterDetail'||to.name=='subjectfirstStage'||to.name=='subjectcommentMore'||to.name=='subjectList'||to.name=="subjectresultpage"||to.name=="mineIndex"||to.name=="subjectStage"||to.name=="articleList"||to.name=="articleFlagList"||to.name=="articleDetail"||to.name=="mobileSearch"||to.name=="tryNewPage"||to.name=="industryReport"||to.name=="pdf"||to.name=="topicList"||to.name=="topicDetail"||to.name=="discussdetail"||to.name=="topiccommentMore"){
if(to.name == 'dashboard'||to.name=='indexView'|| to.name == 'login' || to.name == 'mobileLoginCmpt'|| to.name == 'emailLoginCmpt'|| to.name == 'mobileRegisterCmpt'|| to.name == 'emailRegisterCmpt'||to.name=='completeInfoCmpt'|| to.name == 'successCmpt'||to.name=='findPasswordCmpt'||to.name=='modifyPasswordCmpt'||to.name=='passSuccessCmpt'||to.name=='indexView'||to.name=="mobileIndex"||to.name=="mobileLogin"||to.name=="loginByPhone"||to.name=="loginByEmail"||to.name=="mobileRegister"||to.name=="duijieshareRequire"||to.name=="duijieshareProject"||to.name=="knowledgeList"||to.name=="knowledgeDetail"||to.name=='vip'||to.name=='vipList'||to.name=='loadEmail'||to.name=='openEmail'||to.name=="viewRequire"||to.name=="duijiephoneBusinessList"||to.name=="duijiephoneBusinessDetail"||to.name=="duijiephoneRequireDetail"||to.name=="bigBusinessList"||to.name=="bigBusinessDetail"||to.name=="requireDetail"||to.name=="mixSearch"||to.name=="activitylist"||to.name=="activitydetail"||to.name=="activitySearchResult"||to.name=="activityapplyForProject"||to.name=='wechatLogin'||to.name=='newPage'||to.name=='bindAccount'||to.name=='subjectsecondStage'||to.name=='subjectsecondStageDetail'||to.name=='subjectmasterComment'||to.name=='subjectmasterList'||to.name=='subjectmasterDetail'||to.name=='subjectfirstStage'||to.name=='subjectcommentMore'||to.name=='subjectList'||to.name=="subjectresultpage"||to.name=="mineIndex"||to.name=="subjectStage"||to.name=="articleList"||to.name=="articleFlagList"||to.name=="articleDetail"||to.name=="mobileSearch"||to.name=="tryNewPage"||to.name=="industryReport"||to.name=="pdf"||to.name=="topicList"||to.name=="topicDetail"||to.name=="discussdetail"||to.name=="topiccommentMore"||to.name=="mineMedal"||to.name=="live"){
} else{
if(to.path == '/eventdetail'||to.path == '/eventpage'||to.path == '/industrypage'||to.path == '/contentall'||to.path == '/contentdetail'||to.path == '/tabconnect'||to.path == '/thirdStage'||to.path == '/questionfill'||to.path == '/questionfillpc'||to.path == '/casedetailschild'||to.path == '/lndustryfocuschild'||to.path == '/successfulcasechild'||to.path == '/projectdetails'||to.path == '/seeprojectlist'||to.path == '/projectlist'||to.path == '/viewproject'||to.path == '/templateMobile1'||to.path == '/knowledge'||to.path == '/knowledgedetails'||to.path == '/termserviceed'||to.path == '/privacypolicyed'||to.path == '/contactused'||to.path == '/aboutused'||to.path == '/casedetailsed'||to.path == '/lndustryfocused'||to.path == '/successfulcaseed'||to.path == '/usehelped'||to.path == '/useHelp'||to.path == '/reminder'||to.path == '/contactus' ||to.path == '/privacypolicy' ||to.path == '/termservice' ||to.path == '/casedetails' ||to.path == '/successfulcase' ||to.path == '/lndustryfocus' ||to.path == '/aboutus'||to.path=='/applicationnotice' ){
......
src/router.js
View file @ 1484fad2
......@@ -98,7 +98,8 @@ const pdfPage = ()=>import("views/mobile/pdf").catch(routerUtils.catchImport);//
const discussdetail = ()=> import("views/mobile/topic/discussdetail").catch(routerUtils.catchImport);//搜索中转页面
const topiccommentMore = () => import('views/mobile/topic/commentMore').catch(routerUtils.catchImport);//评论更多
const mineComment = () => import('views/mobile/personaluser/personaldata').catch(routerUtils.catchImport);//我的评论
const mineMedal = () => import('views/mobile/medal/mine').catch(routerUtils.catchImport);//我的勋章
const live= () => import('views/mobile/live').catch(routerUtils.catchImport);//直播
Vue.use(Router)
const originalReplace = Router.prototype.replace;
Router.prototype.replace = function replace(location) {
......@@ -976,6 +977,11 @@ const router = new Router({
name: "activitydetail",
component: activitydetail
},
{
path:"/live",
name:"live",
component:live
},
{
path: '/myjoin',
name: "activityMyJoin",
......@@ -1319,6 +1325,12 @@ const router = new Router({
path:"/mobilesearch",
name:"mobileSearch",
component:mobileSearch
},
{
name:"mineMedal",
path:"/mineMedal",
component:mineMedal,
}
]
......
src/views/mobile/live.vue 0 → 100644
View file @ 1484fad2
<template>
<div>
<iframe name = "child" id = "child" src="live.html" frameborder="0" scrolling="no" style="position:related;top: 2.8px;left: 0px;width: 100%;height: 100vh;"></iframe>
</div>
</template>
<script>
window.onload = function(){
var _iftameBody = document.getElementById('child').contentWindow.document.getElementsByTagName("body")[0];
var _iframe = document.getElementById('child').contentWindow.document.getElementsByTagName("iframe")[0]; //get iframe下的id
_iframe.style.width= "100%"; //修改样式
_iframe.style.height= "calc(100vh - 3rem)"; //修改样式
_iftameBody.style.margin = 0;
};
export default {
name: "live",
}
</script>
<style scoped>
</style>
\ No newline at end of file
src/views/mobile/medal/mine.vue 0 → 100644
View file @ 1484fad2
<template>
<div class="overfolowWrapper">
<breadTop :isReturn="true" :isTop="true" :medalImg="true"></breadTop>
<div class="mineInfo">
<div>
<div class="headerImg">
<div :style="{backgroundImage:'url('+require('../../../assets/img/defaultlogo.png')+')'}"></div>
</div>
<span>小雨崔哥</span>
</div>
<div>
<p>4</p>
<p>已获得</p>
</div>
</div>
<div class="medalInfo">
<div>
<div class="medal medal1"></div>
<div class="info"></div>
</div>
</div>
</div>
</template>
<script>
import api from './api'
import {Toast} from 'mint-ui';
import breadTop from '../../../components/mobile/breadTop'
export default {
name: "mineMedal",
components:{
breadTop
},
data(){
return{
}
},
methods:{
},
mounted(){
}
}
</script>
<style scoped lang="scss">
.medalBg{
width: 100%;
height: 3rem;
background-image: url("../../../assets/img/mobile/medalBg.png");
background-repeat: no-repeat;
background-position: 50% center;
position: absolute;
left: 0;
top: 0;
}
.mineInfo{
width: 100%;
position: absolute;
top: 0;
left: 0;
padding-top: 1.1rem;
padding-left: .6rem;
padding-right: .8rem;
display: flex;
justify-content: space-between;
z-index: 100;
color: #fff;
align-items: center;
>div:first-of-type{
display: flex;
align-items: center;
>span{
display: inline-block;
width: 2.6rem;
overflow: hidden;
text-overflow: ellipsis;
white-space:nowrap;
padding-left: .3rem;
font-weight: bold;
font-size: .32rem;
}
}
>div:last-of-type{
text-align: center;
>p:first-of-type{
font-size: .56rem;
font-weight: bold;
padding-bottom: .1rem;
}
}
.headerImg{
width: 1.25rem;
height: 1.25rem;
border-radius: 50%;
background-color: rgba(255,255,255,0.6);
display: flex;
justify-content: center;
align-items: center;
>div{
width: 1.15rem;
height: 1.15rem;
background-size: cover;
background-repeat: no-repeat;
border-radius: 50%;
}
}
}
.medalInfo{
width: 100%;
height: calc(100% - 3rem);
background: #fff;
position: absolute;
top: 3rem;
padding: .5rem .6rem;
.medal{
width: 1.5rem;
height: 1.68rem;
background-repeat: no-repeat;
background-size: cover;
background-image: url("../../../assets/img/mobile/medal.png");
background-position-x: 0;
}
.medal1{
background-position-y:-12.25rem;
}
}
</style>
\ No newline at end of file
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