任务详情

This commit is contained in:
shijingjing
2023-03-28 18:13:57 +08:00
parent 351fadae18
commit f2d13e2345
3 changed files with 169 additions and 3 deletions

View File

@@ -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>

View File

@@ -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 {

View 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>