Skip to content

P
pica-new-compaign
提交 0f26e7fc 编写于 作者: huangwensu's avatar huangwensu
浏览文件
操作

活动首页编辑

上级 c7b69edf
隐藏空白字符变更
内嵌 并排
正在显示 包含 105 行增加 和 66 行删除
components/step.vue
浏览文件 @ 0f26e7fc
...@@ -5,12 +5,16 @@ ...@@ -5,12 +5,16 @@
<div class="step-text">{{stepText}}</div> <div class="step-text">{{stepText}}</div>
<div class="step-time">{{stepTime}}</div> <div class="step-time">{{stepTime}}</div>
</div> </div>
<img :src="imgSrc"/> <img :class="{'img-style':stepFlag}" :src="imgSrc"/>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
props: { props: {
stepFlag: {
type: Boolean,
default: false
},
imgSrc: { imgSrc: {
type: String, type: String,
default: '' default: ''
...@@ -32,6 +36,7 @@ export default { ...@@ -32,6 +36,7 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.step-container { .step-container {
position: relative;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
padding: 20px 10px 20px 0px; padding: 20px 10px 20px 0px;
...@@ -64,5 +69,12 @@ export default { ...@@ -64,5 +69,12 @@ export default {
height: 40px; height: 40px;
margin-left: 70px; margin-left: 70px;
} }
img.img-style {
position: absolute;
right: 10px;
top: 0px;
width: 65px;
height: 65px;
}
} }
</style> </style>
\ No newline at end of file
components/task-activity.vue
浏览文件 @ 0f26e7fc
...@@ -8,69 +8,30 @@ ...@@ -8,69 +8,30 @@
<img src="../static/images/task-one.png" /> <img src="../static/images/task-one.png" />
<div class="task-l"> <div class="task-l">
<div class="task-t">{{item.ruleName}}</div> <div class="task-t">{{item.ruleName}}</div>
<div class="task-b">
<span v-if="handleData(item.rewardJsonInfo)[0].rewardType == 1">
{{handleData(item.rewardJsonInfo)[0].rewardQuantity}}云鹊豆<span v-if="item.taskFrequency != 2 && (item.resourceType != 8 || (item.resourceType == 8 && item.resourceId == 2)) ">/次</span>
</span>
<span v-if="handleData(item.rewardJsonInfo)[0].rewardType == 2">
{{handleData(item.rewardJsonInfo)[0].rewardQuantity}}元现金红包<span v-if="item.taskFrequency != 2">/次</span>
</span>
<span v-if="handleData(item.rewardJsonInfo)[0].rewardType == 3">
{{handleData(item.rewardJsonInfo)[0].rewardQuantity}}分勤奋分<span v-if="item.taskFrequency != 2">/次</span>
</span>
<span v-if="handleData(item.rewardJsonInfo)[0].rewardType == 4">
{{handleData(item.rewardJsonInfo)[0].rewardQuantity}}条短信额度<span v-if="item.taskFrequency != 2">/次</span>
</span>
</div>
</div> </div>
<!-- taskFrequency 单次or累计 finishFrequency 用户完成的频率 doctorFinishFrequency 当前完成次数 --> <!-- taskFrequency 单次or累计 finishFrequency 用户完成的频率 doctorFinishFrequency 当前完成次数 -->
<div class="task-r"> <div class="task-r">
<span v-if="item.timeStatus == 2">已结束</span> <!-- <div class="task-b" v-if="item.taskFrequency == 1 && item.resourceType != 8">限量 {{item.doctorFinishFrequency || 0}}/{{item.finishFrequency}}次</div>
<span v-if="item.taskFrequency == 1 <div class="task-b" v-if="item.taskFrequency == 1 && item.resourceType == 8 && item.resourceId == 2">获奖次数 {{item.doctorFinishFrequency || 0}}/{{item.finishFrequency}}次</div> -->
&& item.timeStatus == 1 <div class="task-b" v-if="handleData(item.rewardJsonInfo)[0].rewardType == 1">
&& (item.finishFrequency == item.doctorFinishFrequency) {{handleData(item.rewardJsonInfo)[0].rewardQuantity}}云鹊豆/人
&& (item.resourceType != 8 || (item.resourceType == 8 && item.resourceId == 1)) </div>
"> <div class="task-b" v-if="handleData(item.rewardJsonInfo)[0].rewardType == 2">
已完成 {{handleData(item.rewardJsonInfo)[0].rewardQuantity}}元现金红包/人
</span> </div>
<span class='has-bg' <div class="task-b" v-if="handleData(item.rewardJsonInfo)[0].rewardType == 3">
v-if="item.taskFrequency == 1 {{handleData(item.rewardJsonInfo)[0].rewardQuantity}}分勤奋分/人
&& item.timeStatus == 1 </div>
&& (item.finishFrequency == item.doctorFinishFrequency) <div class="task-b" v-if="handleData(item.rewardJsonInfo)[0].rewardType == 4">
&& item.resourceType == 8 {{handleData(item.rewardJsonInfo)[0].rewardQuantity}}条短信额度/人
&& item.resourceId == 2"> </div>
继续完成 <span class='has-bg' v-if="item.resourceType == 7">去邀请</span>
</span>
<span class='has-bg'
v-if="item.taskFrequency == 1
&& item.timeStatus == 1
&& (item.finishFrequency > item.doctorFinishFrequency)
&& item.doctorFinishFrequency
&& item.resourceType != 8">
继续完成
</span>
<span class='has-bg'
v-if="item.taskFrequency == 1
&& item.timeStatus == 1
&& (item.finishFrequency > item.doctorFinishFrequency)
&& item.doctorFinishFrequency
&& item.resourceType == 8
&& item.resourceId == 2">
去完成
</span>
<span class='has-bg'
v-if="item.taskFrequency == 1
&& item.timeStatus == 1
&& !item.doctorFinishFrequency">
去完成
</span>
<div class="task-b" v-if="item.taskFrequency == 1 && item.resourceType != 8">限量 {{item.doctorFinishFrequency || 0}}/{{item.finishFrequency}}次</div>
<div class="task-b" v-if="item.taskFrequency == 1 && item.resourceType == 8 && item.resourceId == 2">获奖次数 {{item.doctorFinishFrequency || 0}}/{{item.finishFrequency}}次</div>
<div class="task-b" v-if="item.taskFrequency == 2 && (item.cumulativeFrequency > item.nowCumulativeFrequency)">进度 {{item.nowCumulativeFrequency}}/{{item.cumulativeFrequency}}</div>
<span v-if="item.taskFrequency == 2 && item.timeStatus == 1 && (item.cumulativeFrequency == item.nowCumulativeFrequency)">已完成</span> <span v-if="item.taskFrequency == 2 && item.timeStatus == 1 && (item.cumulativeFrequency == item.nowCumulativeFrequency)">已完成</span>
<span class='has-bg' v-if="item.taskFrequency == 2 && item.timeStatus == 1 && (item.cumulativeFrequency > item.nowCumulativeFrequency) && item.nowCumulativeFrequency">继续完成</span> <span class='has-bg' v-if="item.taskFrequency == 2 && item.timeStatus == 1 && (item.cumulativeFrequency > item.nowCumulativeFrequency) && item.nowCumulativeFrequency">继续完成</span>
<span class='has-bg' v-if="item.taskFrequency == 2 && item.timeStatus == 1 && !item.nowCumulativeFrequency">去完成</span> <span class='has-bg' v-if="item.taskFrequency == 2 && item.timeStatus == 1 && !item.nowCumulativeFrequency">去完成</span>
<div class="task-b" v-if="item.taskFrequency == 2 && (item.cumulativeFrequency > item.nowCumulativeFrequency)">进度 {{item.nowCumulativeFrequency}}/{{item.cumulativeFrequency}}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -271,6 +232,7 @@ export default { ...@@ -271,6 +232,7 @@ export default {
} }
.task-l { .task-l {
.task-t { .task-t {
padding-bottom: 20px;
font-size: 16px; font-size: 16px;
color: #373839; color: #373839;
font-weight: 700; font-weight: 700;
...@@ -278,7 +240,6 @@ export default { ...@@ -278,7 +240,6 @@ export default {
.task-b { .task-b {
font-size: 12px; font-size: 12px;
color: #979899; color: #979899;
padding-top: 5px;
span { span {
color: #979899; color: #979899;
} }
...@@ -298,15 +259,18 @@ export default { ...@@ -298,15 +259,18 @@ export default {
background: #C7C8C9; background: #C7C8C9;
border-radius: 25px; border-radius: 25px;
text-align: center; text-align: center;
margin-top: 5px;
} }
span.has-bg { span.has-bg {
background: #FB6D5E; // background: #FB6D5E;
background:linear-gradient(270deg,rgba(255,88,36,1) 0%,rgba(254,163,86,1) 100%);
border-radius:35px;
} }
.task-b { .task-b {
text-align: center; text-align: center;
font-size: 12px; font-size: 12px;
color: #979899; color: #979899;
padding-top: 5px; // padding-top: 5px;
} }
} }
} }
......
pages/index.vue
浏览文件 @ 0f26e7fc
<template> <template>
<div class="container"> <div class="container">
<header <Header
:token="token" :token="token"
:is-scroll="isScroll" :is-scroll="isScroll"
:share-title1="shareTitle1" :share-title1="shareTitle1"
...@@ -8,14 +8,28 @@ ...@@ -8,14 +8,28 @@
:share-icon-url="shareIconUrl" :share-icon-url="shareIconUrl"
/> />
<!-- 勤奋分进度 --> <!-- 勤奋分进度 -->
<div> <div class="progress-container">
<status-bar /> <div class="score-info">
<div v-if="!userMobile" class="text">
<img src="../static/images/task-four.png" />
<span class="tc">我的勤奋分<span>{{12345}}</span></span>
<span class="bt" @click="selfInfo">个人明细 ></span>
</div>
<div v-if="userMobile" class="text">
<span class="tc">登录可参加活动</span>
<span class="bt" @click="goToLogin">去登录 ></span>
</div>
</div>
<status-bar
class="progress-bar"
:isLogin="isLogin"/>
</div> </div>
<!-- 活动阶段 --> <!-- 活动阶段 -->
<img class="title-text" src="../static/images/step-title.png"/> <img class="title-text" src="../static/images/step-title.png"/>
<div class="activity-step"> <div class="activity-step">
<div class="step bt"> <div class="step bt">
<step <step
:stepFlag="stepFlag"
:imgSrc="imgSrc1" :imgSrc="imgSrc1"
:numText="numText1" :numText="numText1"
:stepText="stepText1" :stepText="stepText1"
...@@ -47,7 +61,7 @@ ...@@ -47,7 +61,7 @@
<script> <script>
import TaskActivity from '../components/task-activity'; import TaskActivity from '../components/task-activity';
import Header from '../components/header'; import Header from '../components/header/index';
import Step from '../components/step'; import Step from '../components/step';
import StatusBar from '../components/bussiness/status-bar'; import StatusBar from '../components/bussiness/status-bar';
import { getNcovRealReports } from "@/service"; import { getNcovRealReports } from "@/service";
...@@ -61,9 +75,11 @@ export default { ...@@ -61,9 +75,11 @@ export default {
}, },
data() { data() {
return { return {
isLogin: false,
userMobile: '',
stepFlag: true,
isWeb: true, isWeb: true,
activityId: 9, activityId: 9,
userMobile: '',
token: '', token: '',
shareTitle1: '', shareTitle1: '',
shareTitle2: '', shareTitle2: '',
...@@ -97,11 +113,20 @@ export default { ...@@ -97,11 +113,20 @@ export default {
this.infoData = res.data || this.infoData; this.infoData = res.data || this.infoData;
} }
}); });
},
// 去登录
goToLogin() {
},
// 查看个人明细
selfInfo() {
}, },
// 活动任务 // 活动任务
activityTaskJump(data) { activityTaskJump(data) {
//this.jumpPage(data.href, data.id); //this.jumpPage(data.href, data.id);
}, },
} }
} }
...@@ -115,6 +140,44 @@ export default { ...@@ -115,6 +140,44 @@ export default {
.title-text { .title-text {
width: 100%; width: 100%;
} }
.progress-container {
margin: 0 10px 15px;
.score-info {
padding: 0 17px;
height: 48px;
background:linear-gradient(180deg,rgba(214,86,53,1) 0%,rgba(189,38,65,1) 100%);
border-radius:10px 10px 0px 0px;
.text {
line-height: 48px;
img {
float: left;
width: 30px;
height: 30px;
padding: 10px 10px 0px 0px;
}
span.tc {
font-size: 14px;
font-weight: 700;
color: #fff;
span {
padding-left: 10px;
font-size: 18px;
color: #FFE8A5;
}
}
span.bt {
font-size: 12px;
float: right;
color:#FFE8A5;
}
}
}
.progress-bar {
padding: 5px 17px;
height: 87px;
border-radius: 0px 0px 10px 10px;
}
}
.activity-step { .activity-step {
margin: 0 10px 15px; margin: 0 10px 15px;
border-radius: 5px; border-radius: 5px;
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或