任务详情
This commit is contained in:
@@ -34,11 +34,12 @@
|
||||
<div class="left">百年征和波澜壮阔,百年初心历争议弥坚。7月1日上午,庆祝中国共产党成立100周年…</div>
|
||||
<div class="right">
|
||||
<img src="https://cdn.cunwuyun.cn/wxmp/fengdu/zan-active.png" alt="">
|
||||
<!-- https://cdn.cunwuyun.cn/wxmp/fengdu/zan.png -->
|
||||
<span>99+</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<img src="https://cdn.cunwuyun.cn/wxmp/fengdu/zan.png" alt="">
|
||||
<img src="https://cdn.cunwuyun.cn/fengdu/img-jifenlist.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
</div>
|
||||
<div class="title">任务大厅</div>
|
||||
<div class="card-list">
|
||||
<div class="card">
|
||||
<div class="card" @click="$linkTo('./taskDetail')">
|
||||
<h4>10月31日线下公益宣传</h4>
|
||||
<p>
|
||||
百年征和波澜壮阔,百年初心历争议弥坚。7月1日上午,庆祝中国共产党成立100周年在国务院举办…
|
||||
@@ -95,7 +95,7 @@ export default {
|
||||
font-weight: 400;
|
||||
}
|
||||
.imgs {
|
||||
|
||||
|
||||
}
|
||||
|
||||
.time {
|
||||
|
||||
165
src/project/fengdu/AppNewFarmerBank/taskDetail.vue
Normal file
165
src/project/fengdu/AppNewFarmerBank/taskDetail.vue
Normal file
@@ -0,0 +1,165 @@
|
||||
<template>
|
||||
<div class="taskDetail">
|
||||
<div class="task">
|
||||
<h4>10月31日线下公益宣传</h4>
|
||||
<p>百年征和波澜壮阔,百年初心历争议弥坚。7月1日上午,庆祝中国共产党成立100周年在国务院举办午,庆
|
||||
祝中国共产党成立100周年在国务院举办午,庆祝中…</p>
|
||||
<div class="imgs" v-for="(item, index) in info.annexs" :key="index">
|
||||
<!-- <img :src="item.annexFile.url" mode="aspectFill" @click="preview(info.annexs, item.annexFile.url)" /> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="info">
|
||||
<div class="title">基础信息</div>
|
||||
<div class="items">
|
||||
<img src="https://cdn.cunwuyun.cn/fengdu/ic-dizhi.png" alt="">
|
||||
<div class="items-info">
|
||||
<label>活动地点:</label>
|
||||
<div class="value">丰都县金牛区XXXX大厦XXX楼2101</div>
|
||||
</div>
|
||||
<div class="address">
|
||||
<img src="https://cdn.cunwuyun.cn/fengdu/ic-daohang.png" alt="">
|
||||
<i>导航</i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="https://cdn.cunwuyun.cn/fengdu/ic-renwuleixing.png" alt="">
|
||||
<div class="item-info">
|
||||
<label>任务类型:</label>
|
||||
<div class="value">报名得积分</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="https://cdn.cunwuyun.cn/fengdu/ic-jinchangshijian.png" alt="">
|
||||
<div class="item-info">
|
||||
<label>进场时间:</label>
|
||||
<div class="value">2020-12-11 10:10 至 2020-12-11 10:10</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="https://cdn.cunwuyun.cn/fengdu/ic-lichangshijian.png" alt="">
|
||||
<div class="item-info">
|
||||
<label>离场时间:</label>
|
||||
<div class="value">2020-12-11 10:10 至 2020-12-11 10:10</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="right" @click="toAddress">
|
||||
<image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/dh.png" />
|
||||
<i>导航</i>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "taskDetail",
|
||||
appName: "任务详情",
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
toAddress() {
|
||||
wx.openLocation({
|
||||
latitude: this.info.lat,
|
||||
longitude: this.info.lng,
|
||||
scale: 18
|
||||
})
|
||||
},
|
||||
// preview(url) {
|
||||
// uni.previewImage({
|
||||
// urls: this.info.checkPhoto.map(v => v.url),
|
||||
// current: url
|
||||
// })
|
||||
// },
|
||||
|
||||
},
|
||||
onShow() {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '任务详情'
|
||||
});
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.taskDetail {
|
||||
.task,
|
||||
.info {
|
||||
margin-top: 24px;
|
||||
padding: 32px;
|
||||
box-sizing: border-box;
|
||||
background: #FFF;
|
||||
h4 {
|
||||
font-size: 34px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-top: 32px;
|
||||
font-size: 28px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.imgs {
|
||||
display: flex;
|
||||
max-width: 450px;
|
||||
|
||||
img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.info {
|
||||
.title {
|
||||
font-size: 34px;
|
||||
font-weight: 500;
|
||||
}
|
||||
.items,
|
||||
.item {
|
||||
display: flex;
|
||||
margin-top: 24px;
|
||||
img {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
align-self: center;
|
||||
margin-right: 32px;
|
||||
}
|
||||
|
||||
.items-info {
|
||||
width: calc(100% - 100px);
|
||||
}
|
||||
|
||||
.address {
|
||||
width: 60px;
|
||||
img {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
i {
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #687DA6;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.item-info,
|
||||
.items-info {
|
||||
font-size: 28px;
|
||||
font-weight: 400;
|
||||
label {
|
||||
color: #666666;
|
||||
}
|
||||
.value {
|
||||
color: #333333;
|
||||
margin-top: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user