Skip to content

T
techbook
Commit 41b8a638 authored by zhangyanni's avatar zhangyanni
Browse files
Options

页面

parent 27f86026
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 602 additions and 115 deletions
public/css/phone.scss
View file @ 41b8a638
......@@ -2715,4 +2715,27 @@ i, em {
top: 122%;
}
}
.redEnvelopeApplyForm.el-form--label-top .el-form-item__label{
color: #fff !important;
}
.manySwiper{
.swiper-slide{
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: .02rem solid rgba(255,255,255,0.1);
&:nth-child(4n+4){
border-bottom:.02rem solid transparent;
}
span{
text-align: center;
display: inline-block;
width: 50%;
&:last-of-type{
color: #FDDA02;
font-weight: bold;
}
}
}
}
}
\ No newline at end of file
src/assets/font/iconfont.css
View file @ 41b8a638
This diff is collapsed.
src/assets/font/iconfont.js
View file @ 41b8a638
This diff is collapsed.
src/assets/font/iconfont.svg
View file @ 41b8a638
......@@ -20,6 +20,9 @@ Created by iconfont
/>
<missing-glyph />
<glyph glyph-name="henyihan" unicode="&#59001;" d="M416.722489 483.1232c0-27.306667-20.48-47.786667-47.786667-47.786667s-47.786667 20.48-47.786666 47.786667 20.48 47.786667 47.786666 47.786667 47.786667-22.755556 47.786667-47.786667M723.922489 483.1232c0-27.306667-20.48-47.786667-47.786667-47.786667s-47.786667 20.48-47.786666 47.786667 20.48 47.786667 47.786666 47.786667 47.786667-22.755556 47.786667-47.786667M937.824711 387.549867c0-229.831111-186.595556-416.426667-416.426667-416.426667s-414.151111 186.595556-414.151111 416.426667 186.595556 414.151111 414.151111 414.151111c40.96 0 81.92-6.826667 118.328889-18.204445 18.204444-4.551111 36.408889 4.551111 40.96 22.755556 4.551111 18.204444-4.551111 36.408889-22.755555 40.96-45.511111 13.653333-91.022222 20.48-138.808889 20.48-261.688889 0-477.866667-216.177778-477.866667-480.142222s216.177778-480.142222 480.142222-480.142223 480.142222 216.177778 480.142223 480.142223c0 18.204444-13.653333 31.857778-31.857778 31.857777-18.204444 0-31.857778-13.653333-31.857778-31.857777zM744.402489 835.834311v-150.186667c0-18.204444 13.653333-31.857778 31.857778-31.857777 18.204444 0 31.857778 13.653333 31.857777 31.857777v150.186667c0 18.204444-13.653333 31.857778-31.857777 31.857778-15.928889 0-31.857778-13.653333-31.857778-31.857778zM865.006933 788.047644v-284.444444c0-18.204444 13.653333-31.857778 31.857778-31.857778 18.204444 0 31.857778 13.653333 31.857778 31.857778v284.444444c0 18.204444-13.653333 31.857778-31.857778 31.857778-18.204444 0-31.857778-13.653333-31.857778-31.857778zM516.846933 166.820978c0 38.684444 29.582222 68.266667 68.266667 68.266666 18.204444 0 31.857778 13.653333 31.857778 31.857778s-13.653333 31.857778-31.857778 31.857778c-72.817778 0-134.257778-59.164444-134.257778-134.257778 0-18.204444 13.653333-31.857778 31.857778-31.857778s34.133333 15.928889 34.133333 34.133334z" horiz-adv-x="1024" />
<glyph glyph-name="zhibo" unicode="&#58999;" d="M953.268148 543.061333v-279.36237L877.112889 319.525926l-48.165926 35.422815v96.711111l48.165926 35.422815 76.117333 56.016592M424.77037 456.059259l72.969482-53.589333-72.969482-53.665185V456.059259M763.638519 706.37037H70.352593A68.987259 68.987259 0 0 1 0 639.051852v-472.177778A68.987259 68.987259 0 0 1 70.352593 99.555556h693.285926a68.987259 68.987259 0 0 1 70.428444 67.470222v98.910815l106.799407-78.544593a61.25037 61.25037 0 0 1 83.171556 0V619.368296a58.140444 58.140444 0 0 1-40.277333 16.611556 67.849481 67.849481 0 0 1-42.894223-16.611556l-106.799407-78.544592v98.228148A68.987259 68.987259 0 0 1 763.638519 706.37037zM75.851852 170.81837V635.06963h682.363259v-464.25126H75.851852z m305.114074 393.557334a39.063704 39.063704 0 0 1-26.81363-10.467556v-303.028148a39.556741 39.556741 0 0 1 53.62726 0l171.956148 126.255407a34.133333 34.133333 0 0 1 0 50.479408l-171.956148 126.293333a38.987852 38.987852 0 0 1-26.81363 10.467556z" horiz-adv-x="1024" />
......
src/components/apply/applyPro.vue
View file @ 41b8a638
This diff is collapsed.
src/main.js
View file @ 41b8a638
......@@ -201,7 +201,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=="topicDetails"||to.name=="discussdetail"||to.name=="topiccommentMore"||to.name=="mineMedal"||to.name=="live"||to.name=="medalDetail"||to.name=="reward"||to.name=="redMoneySwiper"||to.name=="redEnvelopeActDetail"||to.name=="redEnvelopeActJoin"){
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=="topicDetails"||to.name=="discussdetail"||to.name=="topiccommentMore"||to.name=="mineMedal"||to.name=="live"||to.name=="medalDetail"||to.name=="reward"||to.name=="redMoneySwiper"||to.name=="redEnvelopeActDetail"||to.name=="redEnvelopeActJoin"||to.name=="redEnvelopeActHtml"){
} else{
if(to.path == '/topicList'||to.path == '/topicDetails'||to.path == '/discussdetail'||to.path == '/eventdetail'||to.path == '/eventpage'||to.path == '/industryReport'||to.path == '/articleList'||to.path == '/articleDetail'||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 @ 41b8a638
......@@ -74,6 +74,7 @@ const vip = () => import('views/vip/phone/list').catch(routerUtils.catchImport);
const activitylist = () => import('views/mobile/activityApply/list').catch(routerUtils.catchImport);//活动列表
const activitydetail = () => import('views/mobile/activityApply/detail').catch(routerUtils.catchImport);//活动详情
const redEnvelopeWechat = () => import('views/mobile/activityApply/redEnvelopeWechat').catch(routerUtils.catchImport);//红包活动详情
const redEnvelopeActHtml = ()=> import('views/mobile/activityApply/redEnvelopeHtml').catch(routerUtils.catchImport);//红包活动html详情
const redEnvelopeActJoin = () => import('views/mobile/activityApply/redEnvelopeDetail').catch(routerUtils.catchImport);//红包活动答题
const activityMyJoin = () => import('views/mobile/activityApply/myjoin').catch(routerUtils.catchImport);//我参与的活动
const activityapplySuccess = () => import('views/mobile/activityApply/applysuccess').catch(routerUtils.catchImport);//报名成功
......@@ -1073,11 +1074,11 @@ const router = new Router({
name: "activityapplySuccess",
component: activityapplySuccess
},
{
path: '/redMoneySwiper',
name: "redMoneySwiper",
component: redMoneySwiper
},
// {
// path: '/redMoneySwiper',
// name: "redMoneySwiper",
// component: redMoneySwiper
// },
{
path: "/apply",
name: "activityapplyForProject",
......@@ -1414,19 +1415,23 @@ const router = new Router({
name: "topiccommentMore",
component: topiccommentMore
},
]
},
{
path:"/redEnvelopeActDetail",
name:"redEnvelopeActDetail",
component:redEnvelopeWechat
},
{
path:"/redEnvelopeActDetail",
name:"redEnvelopeActDetail",
component:redEnvelopeWechat
},
{
path:"/redEnvelopeActJoin",
name:"redEnvelopeActJoin",
component:redEnvelopeActJoin
{
path:"/redEnvelopeActJoin",
name:"redEnvelopeActJoin",
component:redEnvelopeActJoin
},
{
path:"/redEnvelopeActHtml",
name:"redEnvelopeActHtml",
component:redEnvelopeActHtml
},
]
},
{
......
src/views/mobile/activityApply/answerCmpt.vue
View file @ 41b8a638
......@@ -12,14 +12,19 @@
<span>换一批</span>
</div>
</div>
<div class="answerLi">
<div v-for="(item,index) in tableData">
<p class="topicTitle">{{index+1}}、<span>wowowoowowowo哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</span></p>
<div v-for="topicItem in tableData.topicList">
</div>
<div class="answerLi" v-for="(item,index) in tableData">
<p class="topicTitle">{{index+1}}、<span>{{item.title}}</span></p>
<div v-for="(topicItem,topicIndex) in item.topicList" class="topicItem"
:class="item.currentIndex==topicIndex&&item.type==0||topicItem.highlight?'activeTopic':''"
@click="handleClick(index,topicIndex,item,topicItem)">
<span>{{publicFun.getTextfInRichtext(topicIndex)}}、</span>
<span>{{topicItem.title}}</span>
</div>
</div>
<div class="submitWrapper">
<p class="nextButton grayNextButton" v-if="!canSubmit">下一步</p>
<p class="nextButton" v-if="canSubmit" @click="handleSubmit">下一步</p>
</div>
</div>
</template>
......@@ -32,26 +37,30 @@
},
data() {
return {
currentIndex: 1,
tableData: [{
id: 1,
topicList: [
{
id: 1,
title: "wowowowo哈哈哈哈才能才能出门吗"
},
{
id: 2,
title: "wiiwwow哦我我的卡"
},
{
id: 3,
title: "啦啦啦大家都看到的，的，参差错落出来的开店大吉"
},
]
},
tableData: [
{
id: 1,
title: "我是题目一",
type:1,
topicList: [
{
id: 1,
title: "wowowowo哈哈哈哈才能才能出门吗"
},
{
id: 2,
title: "wiiwwow哦我我的卡"
},
{
id: 3,
title: "啦啦啦大家都看到的，的，参差错落出来的开店大吉"
},
]
},
{
id: 2,
type:0,
title: "我是题目二",
topicList: [
{
id: 1,
......@@ -66,21 +75,126 @@
title: "哦饿饿哦饿哦饿开发飞机分毫不差那阿卡卡"
},
]
}]
}
],
canSubmit:false,
submitData:{
id:this.$route.query.id,
list:[]
},
itemArr:[]
}
},
methods: {
//换一批
handleChange() {
this.currentIndex++;
this.tableData.forEach((item, index) => {
item.currentIndex = -1;
})
this.$forceUpdate();
},
//选择题目
handleClick(dataIndex,index, data, itemData) {
//高亮
if(data.type==1){
data.currentIndex = 0;
itemData.highlight = !itemData.highlight;
}else{
if(data.currentIndex!=index) data.currentIndex = index;
else data.currentIndex = -1;
}
this.$forceUpdate();
//高亮
//添加数据
if(this.submitData.list.length>0){
for(var i=0;i<this.submitData.list.length;i++){
console.log(data.id)
console.log(this.submitData.list[i].id)
if(data.id==this.submitData.list[i].id){
if(data.type==1){
let childTopicList = this.submitData.list[i].childlist;
for(var j=0;j<childTopicList.length;j++){
if(itemData.highlight){
if(itemData.id!=childTopicList[j]){
childTopicList.push(itemData.id)
}
}else{
if(itemData.id==childTopicList[j]){
childTopicList.splice(j,1);
j--;
}
}
}
}else{
if(data.currentIndex==-1){
this.submitData.list[i].childlist = [];
}else this.submitData.list[i].childlist[0] = itemData.id;
}
}else{
this.submitData.list.push({
id:data.id,
childlist:[itemData.id]
})
}
}
}else{
this.submitData.list.push({
id:data.id,
childlist:[itemData.id]
})
}
console.log(this.submitData.list)
//添加数据
//是否可提交
let arr = [];
this.tableData.forEach((item, index) => {
if (item.currentIndex == -1) {
arr.push(item);
}
})
if (arr.length == 0) {
this.canSubmit = true;
} else {
this.canSubmit = false;
}
//是否可提交
},
//获取初始化题目
getInitTopicListData() {
this.tableData.forEach((item, index) => {
item.currentIndex = -1;
if(item.type==1){
item.topicList.forEach((topicItem,topicIndex)=>{
topicItem.highlight = false;
})
}
})
},
//提交下一步
handleSubmit() {
this.$emit("postFlagVal",this.submitData);
console.log(this.submitData)
}
},
mounted() {
if(this.$route.query.flag==1) this.getInitTopicListData();
}
}
</script>
<style scoped lang="scss">
.answerDiv {
background: #3B0992;
background: rgba(0, 0, 0, .2);
position: relative;
display: flex;
justify-content: center;
......@@ -115,7 +229,7 @@
color: #fff;
align-items: center;
margin-bottom: .3rem;
> span {
span {
padding-left: .1rem;
}
}
......@@ -124,16 +238,46 @@
background: #fff;
padding: .4rem .3rem;
border-radius: .06rem;
> div {
p.topicTitle {
font-weight: bold;
color: #1A1A1E;
font-size: .28rem;
padding-bottom: .3rem;
> span {
padding-left: .1rem;
}
margin-bottom: .3rem;
p.topicTitle {
font-weight: bold;
color: #1A1A1E;
font-size: .28rem;
padding-bottom: .2rem;
> span {
padding-left: .1rem;
}
}
.topicItem {
border: .02rem solid #EEEEEE;
border-radius: .06rem;
margin: .15rem 0;
padding: .15rem .1rem .15rem .3rem;
line-height: .48rem;
}
.activeTopic {
border: .02rem solid #5D78FF;
color: #5D78FF;
}
}
.submitWrapper {
padding-top: .2rem;
.nextButton {
background-color: #5D78FF;
height: .9rem;
border-radius: .06rem;
font-size: .32rem;
font-weight: bold;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
margin-bottom: 1.2rem;
}
.grayNextButton{
background-color: #e8e8e8;
color: #AAA;
}
}
</style>
\ No newline at end of file
src/views/mobile/activityApply/applyRegisterCmpt.vue
View file @ 41b8a638
This source diff could not be displayed because it is too large. You can view the blob instead.
src/views/mobile/activityApply/errorAnswerCmpt.vue
View file @ 41b8a638
<template>
<div>
<div class="errorAnswerWrapper">
<div>
<i class="iconfont icon-henyihan"></i>
</div>
<div class="titleWrapper">
<p>很遗憾，您未答对问题</p>
<p>点击下面的按钮，继续答题</p>
</div>
<div class="submitWrapper">
<p class="nextButton" @click="handleSubmit">您还有2次机会，赶快参与</p>
</div>
</div>
</template>
<script>
export default {
name: "errorAnswer",
props:{
id:String,
props: {
id: String,
},
data(){
return{
}
},
methods:{
handleSubmit(){
}
}
}
</script>
<style scoped>
<style scoped lang="scss">
.errorAnswerWrapper {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding-top: 1.3rem;
color:#fff;
.icon-henyihan{
font-size: 1.38rem;
}
.titleWrapper{
padding-top: .5rem;
width: 100%;
text-align: center;
font-size: .34rem;
>p:first-of-type{
padding-bottom: .3rem;
font-weight: bold;
}
}
.submitWrapper {
width: 100%;
padding-top: 1.2rem;
.nextButton {
background-color: #5D78FF;
height: .9rem;
border-radius: .06rem;
font-size: .32rem;
font-weight: bold;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
margin-bottom: 1.2rem;
}
}
}
</style>
\ No newline at end of file
src/views/mobile/activityApply/hasAfterCmpt.vue
View file @ 41b8a638
<template>
<div>
<div class="overfolowWrapper">
<div class="shareAfterWrapper" v-if="$route.query.flag==4">
<p>恭喜您获得 <span class="moneytitle">4.5 </span>元红包</p>
<p>邀请好友注册成功领取更多红包,审核通过后，我们将把红包发送给你的微信服务通知里，请注意查收！</p>
<p>分享给好友，你将有 <span class="moneytitle">10次 </span>获得红包机会哦！</p>
</div>
<div class="submitAfterWrapper" v-if="$route.query.flag==5">
<p>提交成功，我们审核通过后，</p>
<p>24小时内将红包发放到你微信-服务通知里！</p>
<p>还可分享给好友，可得随机红包，</p>
<p> <span class="moneytitle">随机红包</span> 最高金额 <span class="moneytitle">55</span>元</p>
</div>
<div class="oldRegisterWrapper" v-if="$route.query.flag==6">
<p>此次活动仅限于新用户参与，您可分享好友，
你将有 <span class="moneytitle">10次 </span>获得红包机会哦！</p>
</div>
<div class="moneySwiper">
<moneySwiper></moneySwiper>
</div>
</div>
</template>
<script>
import moneySwiper from './moneySwiper1'
export default {
name: "hasAfterCmpt",
props:{
id:String,
},
components:{
moneySwiper
}
}
</script>
<style scoped lang="scss">
.overfolowWrapper{
color: #fff;
padding: 0 .2rem;
}
.moneytitle{
color: #FDDA02;
font-weight: bold;
}
.shareAfterWrapper{
font-size: .38rem;
p:first-of-type{
font-weight: bold;
.moneytitle{
font-size: .6rem;
}
}
p:nth-of-type(2){
font-size: .28rem;
padding-top: .4rem;
padding-bottom: .5rem;
line-height:.6rem;
}
p:last-of-type{
font-size: .32rem;
font-weight: bold;
}
}
.moneySwiper{
padding-top: .7rem;
}
.submitAfterWrapper{
padding-top: .3rem;
p:first-of-type{
font-size: .38rem;
font-weight: bold;
padding-bottom: .4rem;
}
p:nth-of-type(2){
font-size: .28rem;
font-weight: bold;
padding-bottom: .5rem;
}
p:nth-of-type(3){
font-size: .32rem;
font-weight: bold;
padding-bottom: .1rem;
}
p:last-of-type{
font-size: .32rem;
font-weight: bold;
>span:last-of-type{
font-size: .6rem;
}
}
}
.oldRegisterWrapper{
padding-top: .3rem;
font-size: .32rem;
font-weight: bold;
line-height: .7rem;
}
</style>
\ No newline at end of file
src/views/mobile/activityApply/moneySwiper1.vue
View file @ 41b8a638
<template>
<div>
<swiper :options="swiperOption" class="swiper-wrap manySwiper" ref="mySwiper"
style="cursor: pointer;height: 3rem;">
<swiper-slide v-for="(item,index) in projectDesList" :key="item.id">
<span class="title" v-text="item.title"></span>
</swiper-slide>
</swiper>
<p class="nextButton">分享好友领红包</p>
<div class="qrcode">
<div>
<img src="../../../assets/img/bigBusiness@2x.png" alt="">
<img src="../../../assets/img/bigBusiness@2x.png" alt="">
</div>
<div>
<p>关注公众号</p>
<p>TB客服</p>
</div>
</div>
<div class="answerDiv">
<div class="answerTitle">最新用户领取红包</div>
<div class="titleWrap">
<div class="headerWrap">
<p>用户</p>
<p>金额（{{lang==1?'元':'RMB'}}）</p>
</div>
<swiper :options="swiperOption" class="swiper-wrap manySwiper" ref="mySwiper"
style="cursor: pointer;height: 3rem;">
<swiper-slide v-for="(item,index) in projectDesList" :key="item.id">
<span class="title" v-text="item.name"></span>
<span class="title" v-text="item.money"></span>
</swiper-slide>
</swiper>
</div>
</div>
</div>
</template>
<script>
import {Toast,Lazyload,MessageBox} from 'mint-ui';
import {Toast, Lazyload, MessageBox} from 'mint-ui';
export default {
name: "moneySwiper",
data() {
return {
lang:this.$i18n.locale == "zh-CN" ? 1 : 2,
projectDesList: [
{
id:1,
title:"我是1"
id: 1,
name: "134****2743",
money:"120.89"
},
{
id:2,
title:"我是2"
id: 2,
name: "186****5687",
money:"90.01"
},
{
id:3,
title:"我是3"
id: 3,
name: "132****4679",
money:"22.81"
},
{
id:4,
title:"我是4"
id: 4,
name: "135****1189",
money:"20.05"
},
{
id:5,
title:"我是5"
id: 5,
name: "136****4678",
money:"90.82"
},
{
id:6,
title:"我是6"
id: 6,
name: "134****5649",
money:"55.39"
},
{
id:7,
title:"我是7"
id: 7,
name: "138****7617",
money:"105.06"
},
{
id:8,
title:"我是8"
id: 8,
name: "133****4792",
money:"45.67"
},
{
id:9,
title:"我是9"
id: 9,
name: "199****2673",
money:"50.78"
},
{
id:10,
title:"我是10"
id: 10,
name: "137****1900",
money:"99.01"
},
{
id:11,
title:"我是11"
id: 11,
name: "189****1253",
money:"89.12"
},
{
id:12,
title:"我是12"
id: 12,
name: "199****7489",
money:"30.89"
},
{
id:13,
title:"我是13"
id: 13,
name: "134****5634",
money:"15.94"
},
{
id:14,
title:"我是14"
id: 14,
name: "132****4673",
money:"50.37"
},
{
id:15,
title:"我是15"
id: 15,
name: "136****9836",
money:"60.82"
},
{
id:16,
title:"我是16"
id: 16,
name: "137****2789",
money:"105.89"
},
{
id:17,
title:"我是17"
id: 17,
name: "189****1897",
money:"80.06"
},
{
id:18,
title:"我是18"
id: 18,
name: "132****2699",
money:"110.07"
},
{
id:19,
title:"我是19"
id: 19,
name: "138****9843",
money:"20.46"
},
{
id:20,
title:"我是20"
id: 20,
name: "139****3699",
money:"68.06"
},
],// 滚动项目信息为数组
swiperOption: {
slidesPerView:4,
slidesPerGroup : 4,
slidesPerView: 4,
slidesPerGroup: 4,
//是一个组件自有属性，如果notNextTick设置为true，组件则不会通过NextTick来实例化swiper，也就意味着你可以在第一时间获取到swiper对象，假如你需要刚加载遍使用获取swiper对象来做什么事，那么这个属性一定要是true
notNextTick: true,
//循环
......@@ -131,8 +175,8 @@
}
},
methods:{
getProjectIntr(){
methods: {
getProjectIntr() {
}
},
......@@ -152,7 +196,7 @@
computed: {
optionSetting () {
optionSetting() {
return {
......@@ -211,4 +255,80 @@
}
}
.nextButton {
background-color: #FF5D5D;
height: .9rem;
border-radius: 1rem;
font-size: .32rem;
font-weight: bold;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
margin-bottom: .6rem;
}
.qrcode{
padding: 0 .95rem;
color: #fff;
margin-bottom: .6rem;
div{
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
>p{
text-align: center;
width: 2rem;
padding-top: .2rem;
}
>img{
width: 2rem;
height: 2rem;
object-fit: contain;
}
}
}
.answerDiv {
background: rgba(0, 0, 0, .2);
position: relative;
display: flex;
justify-content: center;
min-height: 2rem;
border-radius: .06rem;
margin-bottom: .3rem;
.answerTitle {
background: #FF9E29;
position: absolute;
height: .5rem;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
font-size: .28rem;
padding: 0 .5rem;
border-bottom-left-radius: .14rem;
border-bottom-right-radius: .14rem;
margin-bottom: .3rem;
}
.titleWrap {
padding: .7rem .15rem 0 .3rem;
color: #fff;
line-height: .48rem;
font-size: .28rem;
width: 100%;
>div.headerWrap{
padding-top: .2rem;
display: flex;
justify-content: space-between;
border-bottom: .02rem solid rgba(255,255,255,0.1);
padding-bottom: .2rem;
p{
width: 50%;
text-align: center;
}
}
}
}
</style>
\ No newline at end of file
src/views/mobile/activityApply/redEnvelopeHtml.vue 0 → 100644
View file @ 41b8a638
<template>
<div class="overfolowWrapper">
<p>保存下面的二维码图片用微信扫一扫参与活动</p>
<div>
<div class="qrcodeWrap">
<VueQRCodeComponent :text="url" :size="220" :margin="0"></VueQRCodeComponent>
</div>
</div>
</div>
</template>
<script>
import VueQRCodeComponent from 'vue-qrcode-component';
export default {
name: "redEnvelopeHtml",
components:{
VueQRCodeComponent
},
data(){
return {
url:"https://www.techbook.vip/index.html#/activitydetail?page=1&id=548&isApply=1&type=3",
}
}
}
</script>
<style scoped lang="scss">
.overfolowWrapper{
background: #3F3F53;
>div{
display: flex;
flex-wrap: wrap;
justify-content: center;
}
p{
font-size: .28rem;
padding-top: 2.3rem;
color: #fff;
text-align: center;
}
}
.qrcodeWrap{
width: 4.3rem;
height: 4.3rem;
background-color: #fff;
padding: .2rem;
margin-top: .5rem;
}
</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