|
|
@@ -2,22 +2,38 @@
|
|
|
<view class="safe-area-inset-bottom">
|
|
|
<my-bar title="活动详情" :transparent="transparent">
|
|
|
<view slot="content" class="publish">
|
|
|
- <image :src="detail.pic" style="height: 380rpx;width: 100%;"></image>
|
|
|
+ <image @click="$util.preview(detail.poster)" :src="detail.poster" style="height: 340rpx;width: 100%;">
|
|
|
+ </image>
|
|
|
</view>
|
|
|
</my-bar>
|
|
|
<view class="clock">
|
|
|
- <!-- <view class="cu-btn round sm" style="background-color: #dcdcdc;">
|
|
|
- <u-icon name="clock"></u-icon>
|
|
|
- <text class="margin-left-10">设置响应倒计时</text>
|
|
|
- </view>
|
|
|
- <view class="tips">
|
|
|
- <text>*</text>
|
|
|
- <text>如未在限定时间内响应,系统默认自动推送给旗下商户。</text>
|
|
|
- </view> -->
|
|
|
</view>
|
|
|
-
|
|
|
<view class="content">
|
|
|
<text class="title">{{detail.title}}</text>
|
|
|
+
|
|
|
+ <view class="data flex" style="margin-top: 30rpx;">
|
|
|
+ <u-icon name="eye" color="#EF9944"></u-icon>
|
|
|
+ <view v-if="detail.auditStatus=='WAITING_MALL'" class="margin-left-10">
|
|
|
+ 审核状态:
|
|
|
+ <text style="color: #EF9944;">待审核</text>
|
|
|
+ </view>
|
|
|
+ <view v-if="detail.auditStatus=='WAITING_PLATFORM'" class="margin-left-10">
|
|
|
+ 审核状态:
|
|
|
+ <text style="color: #EF9944;">待平台审核</text>
|
|
|
+ </view>
|
|
|
+ <view v-if="detail.auditStatus=='PASS'" class="margin-left-10">
|
|
|
+ 审核状态:
|
|
|
+ <text style="color: #19be6b;">审核通过</text>
|
|
|
+ </view>
|
|
|
+ <view v-if="detail.auditStatus=='FAIL'" class="margin-left-10">
|
|
|
+ 审核状态:
|
|
|
+ <text style="color: #fa3534;">审核不通过</text>
|
|
|
+ </view>
|
|
|
+ <view v-if="detail.auditStatus=='STOP'" class="margin-left-10">
|
|
|
+ 审核状态:
|
|
|
+ <text style="color: #fa3534;">活动已停用</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
<view class="data" style="margin-top: 30rpx;">
|
|
|
<u-icon name="clock" color="#EF9944"></u-icon>
|
|
|
<text class="margin-left-10">开始时间:{{detail.beginTime}}</text>
|
|
|
@@ -26,90 +42,122 @@
|
|
|
<u-icon name="clock" color="#EF9944"></u-icon>
|
|
|
<text class="margin-left-10">结束时间:{{detail.endTime}}</text>
|
|
|
</view>
|
|
|
- <!-- <view class="data">
|
|
|
- <u-icon name="map"></u-icon>
|
|
|
- <text class="margin-left-10">仅限全天河区内报名</text>
|
|
|
- </view> -->
|
|
|
- <view class="data flex">
|
|
|
- <view class="flex">
|
|
|
- <u-icon name="grid" color="#EF9944"></u-icon>
|
|
|
- <text class="margin-left-10">{{detail.labelNames}}</text>
|
|
|
- </view>
|
|
|
- <view class="flex margin-left-50">
|
|
|
- <u-icon name="bag" color="#EF9944"></u-icon>
|
|
|
- <text class="margin-left-10">活动折扣 {{detail.supplyPrice/10}} 折</text>
|
|
|
- </view>
|
|
|
+ <view class="data" style="margin-top: 30rpx;">
|
|
|
+ <u-icon name="grid" color="#EF9944"></u-icon>
|
|
|
+ <text class="margin-left-10">活动分类:{{detail.labelKey}}</text>
|
|
|
</view>
|
|
|
- <view class="data">
|
|
|
- <u-icon name="home-fill" color="#EF9944"></u-icon>
|
|
|
- <text class="margin-left-10">联营积分全场通用</text>
|
|
|
+ <view class="data" style="margin-top: 30rpx;">
|
|
|
+ <u-icon name="coupon" color="#EF9944"></u-icon>
|
|
|
+ <text class="margin-left-10">活动折扣:{{detail.discount * 10}} 折</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <view class="intro" v-if="current==1">
|
|
|
- <view class="flex">
|
|
|
- <u-icon name="coupon" color="#EF9944"></u-icon>
|
|
|
- <text class="margin-left-10">商场活动补贴</text>
|
|
|
+ <view class="attend" v-if="!$isEmpty(joinRecords)">
|
|
|
+ <view class="margin-bottom-20">
|
|
|
+ <u-icon name="calendar-fill" color="#EF9944"></u-icon>
|
|
|
+ <text class="margin-left-10">已参加</text>
|
|
|
</view>
|
|
|
- <view class="desc" style="display: flex;border-bottom: 1rpx solid #DDDDDD;align-items: center;">
|
|
|
- <u-input v-model="appendSupplyPrice" placeholder="请输入折扣" style="width: 90%;" />
|
|
|
- <text class="padding-left-20">%</text>
|
|
|
+ <view class="flex">
|
|
|
+ <view class="flex " style="width: 90%;">
|
|
|
+ <view class="data" v-for="(item,index) in joinRecords" :key="index">
|
|
|
+ <view class="item">
|
|
|
+ <image style="border-radius: 50%;" :src="item.joinLogo" mode="aspectFill"></image>
|
|
|
+ <view>
|
|
|
+ <text>{{item.joinName | ellipsis}}</text>
|
|
|
+ <text>{{item.discount * 10}}折</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-if="detail.activityJoinRecords.length>3" class="center" style="width: 10%;margin-right: 15rpx;">
|
|
|
+ <u-icon name="more-circle" size="80" color="#ababab"></u-icon>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
+
|
|
|
<view class="intro">
|
|
|
<view class="flex">
|
|
|
<u-icon name="bookmark" color="#EF9944"></u-icon>
|
|
|
<text class="margin-left-10">活动介绍</text>
|
|
|
</view>
|
|
|
<view class="desc">
|
|
|
- {{detail.detail}}
|
|
|
+ {{detail.intro}}
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <view class="attend" v-if="!$isEmpty(detail.activityJoinRecords)">
|
|
|
- <view class="margin-bottom-20">
|
|
|
- <u-icon name="calendar-fill" color="#EF9944"></u-icon>
|
|
|
- <text class="margin-left-10">已参加</text>
|
|
|
+ <view class="" v-if="current==0">
|
|
|
+ <view @click="open=!open" class="intro" style="width: 100%;">
|
|
|
+ <text class="text-bold text-lg">审核流程</text>
|
|
|
+ <text :class="open?'cuIcon-fold':'cuIcon-unfold'" class=" margin-left-10"></text>
|
|
|
</view>
|
|
|
|
|
|
- <view class="flex">
|
|
|
- <view class="flex " style="width: 90%;">
|
|
|
- <view class="data" v-for="(item,index) in detail.activityJoinRecords" :key="index">
|
|
|
- <view class="item">
|
|
|
- <image style="border-radius: 50%;" :src="item.joinPic" mode=""></image>
|
|
|
+ <view class="history" v-if="open" :style="{marginBottom:safeAreaBottom}">
|
|
|
+ <u-time-line>
|
|
|
+ <u-time-line-item nodeTop="2" v-for="(item,index) in historyList" :key="index">
|
|
|
+ <template v-slot:node>
|
|
|
+ <view class="u-node bg-white">
|
|
|
+ <u-icon name="clock-fill" color="#e0e3ea" :size="28"></u-icon>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ <template v-slot:content>
|
|
|
<view>
|
|
|
- <text>{{name | ellipsis}}</text>
|
|
|
- <text>{{item.finalSupplyPrice}}折</text>
|
|
|
+ <view class="">{{item.createTime}}</view>
|
|
|
+ <view style="width: 636rpx;">
|
|
|
+ <view class="content">
|
|
|
+ <view class="nav-title">
|
|
|
+ <view class="">
|
|
|
+ <text>【{{item.assigneeName?item.assigneeName:'联兑通平台'}}】在
|
|
|
+ [{{item.createTime}}] 开始处理 [{{item.historyActivityName}}] 环节</text>
|
|
|
+ </view>
|
|
|
+ <view class="" v-if="item.historyActivityDurationTime">
|
|
|
+ 任务历时:
|
|
|
+ [{{item.historyActivityDurationTime}}]
|
|
|
+ </view>
|
|
|
+ <view class="" v-if="item.comment">
|
|
|
+ 批复意见:
|
|
|
+ [{{item.comment}}]
|
|
|
+ </view>
|
|
|
+ <view class="" v-if="item.endTime">
|
|
|
+ 结束时间:
|
|
|
+ [{{item.endTime}}]
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-if="detail.activityJoinRecords.length>3" class="center" style="width: 10%;margin-right: 15rpx;">
|
|
|
- <u-icon name="more-circle" size="80" color="#ababab"></u-icon>
|
|
|
- </view>
|
|
|
+ </template>
|
|
|
+ </u-time-line-item>
|
|
|
+ </u-time-line>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
- <block >
|
|
|
- <view class="" style="height: 90rpx;"></view>
|
|
|
- <view @click="operate" :style="{paddingBottom:safeAreaBottom}" class="footer-fixed center">
|
|
|
- <view class="cu-btn df btn-bg-color round " style="width: 90%;height: 80rpx;">
|
|
|
- <block v-if="current==0">
|
|
|
- <text v-if="detail.auditStatus==0 || detail.auditStatus == 4">待审核</text>
|
|
|
- <text v-if="detail.auditStatus==1">审核通过</text>
|
|
|
- <text v-if="detail.auditStatus==2">审核不通过</text>
|
|
|
- <text v-if="detail.auditStatus==3">已停用</text>
|
|
|
- </block>
|
|
|
- <block v-if="current==1">
|
|
|
- <text>参加活动</text>
|
|
|
- </block>
|
|
|
- <block v-if="current==2">
|
|
|
- <text>退出活动</text>
|
|
|
- </block>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <block v-if="isShowBtn">
|
|
|
+ <view class="" style="height: 50rpx;"></view>
|
|
|
+ <view :style="{paddingBottom:safeAreaBottom}" class=" center" :class="current==0?'':'footer-fixed'">
|
|
|
+ <view @click="operate" class="cu-btn df btn-bg-color radius " style="width: 90%;height: 80rpx;">
|
|
|
+ <text v-if="current==1">参加活动</text>
|
|
|
+ <text v-if="current==2">退出活动</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</block>
|
|
|
+
|
|
|
+ <u-modal :show-cancel-button="true" confirm-color="#FF9447" @confirm="join" title="提示" :mask-close-able="true"
|
|
|
+ v-model="modalShow">
|
|
|
+ <view class="slot-content" style="margin: 20rpx;">
|
|
|
+ <u-form label-width="150" ref="uForm">
|
|
|
+ <u-form-item :border-bottom="false">
|
|
|
+ <view class="flex center">
|
|
|
+ <u-input style="width: 80%;" height="150" placeholder="请输入活动折扣(如输入9,表示9折)"
|
|
|
+ v-model="discount" />
|
|
|
+ <text class="center margin-left-10">折</text>
|
|
|
+ </view>
|
|
|
+ </u-form-item>
|
|
|
+ </u-form>
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -135,92 +183,128 @@
|
|
|
data() {
|
|
|
return {
|
|
|
id: '',
|
|
|
- current: 0, //0 发起活动详情,1可参加活动详情,2已参加活动详情
|
|
|
+ current: 0,
|
|
|
transparent: '',
|
|
|
- name: '星巴克',
|
|
|
+ //活动详情
|
|
|
detail: {},
|
|
|
- appendSupplyPrice: 100
|
|
|
+ //流程详情
|
|
|
+ flowDetail: {},
|
|
|
+ //审核历史
|
|
|
+ open: true,
|
|
|
+ historyList: [],
|
|
|
+ //参加活动
|
|
|
+ discount: '',
|
|
|
+ joinRecords: [],
|
|
|
+ isShowBtn: false,
|
|
|
+ modalShow: false,
|
|
|
+
|
|
|
+ //退出活动
|
|
|
+ joinRecordId: ''
|
|
|
}
|
|
|
},
|
|
|
onLoad(options) {
|
|
|
this.id = options.id
|
|
|
- this.current = options.current || 0
|
|
|
+ this.current = options.current
|
|
|
+ this.joinRecordId = options.joinRecordId ? options.joinRecordId : ''
|
|
|
if (!this.id) {
|
|
|
this.$u.toast('系统错误')
|
|
|
return
|
|
|
}
|
|
|
this.fetchDetail()
|
|
|
+ this.getJoinRecord()
|
|
|
},
|
|
|
methods: {
|
|
|
+ getJoinRecord() {
|
|
|
+ let params = {
|
|
|
+ activityId: this.id
|
|
|
+ }
|
|
|
+ this.$api.joinRecord.list(params).then(res => {
|
|
|
+ this.joinRecords = res.data.records
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async getHistoryFlowList(processInstanceId) {
|
|
|
+ this.$api.flow.historyFlowList({
|
|
|
+ processInstanceId
|
|
|
+ }).then(res => {
|
|
|
+ this.historyList = res.data
|
|
|
+ })
|
|
|
+ },
|
|
|
fetchDetail() {
|
|
|
this.$api.activity.detail({
|
|
|
id: this.id
|
|
|
}).then(res => {
|
|
|
this.detail = res.data
|
|
|
+ if (!this.detail.auditStatus.includes('WAITING') && this.detail.auditStatus != this.$global
|
|
|
+ .shop_auditStatus.FAIL&&this.current!=0) {
|
|
|
+ this.isShowBtn = true
|
|
|
+ }
|
|
|
+
|
|
|
+ this.getHistoryFlowList(this.detail.processInstanceId)
|
|
|
})
|
|
|
},
|
|
|
operate() {
|
|
|
if (this.current == 0) {
|
|
|
- return
|
|
|
- }
|
|
|
- if (this.current == 1) {
|
|
|
- //参加活动
|
|
|
- this.join()
|
|
|
+ //暂时不需要停用活动这个操作
|
|
|
+ } else if (this.current == 1) {
|
|
|
+ this.modalShow = true
|
|
|
} else if (this.current == 2) {
|
|
|
- //退出活动
|
|
|
this.exit()
|
|
|
}
|
|
|
-
|
|
|
},
|
|
|
- join() {
|
|
|
- this.$dialog.showModal("确定参加?").then(res => {
|
|
|
- let operateList = {
|
|
|
- activityId: this.id,
|
|
|
- joinType: 1,
|
|
|
- joinId: this.vuex_mallId,
|
|
|
- appendSupplyPrice: this.appendSupplyPrice
|
|
|
- }
|
|
|
- this.$api.activity.join(operateList).then(res => {
|
|
|
+ stop() {
|
|
|
+ let item = this.$u.deepClone(this.detail)
|
|
|
+ item.auditStatus = this.$global.shop_auditStatus.STOP
|
|
|
+ this.$dialog.showModal('确定停用?').then(() => {
|
|
|
+ this.$api.activity.stop(item).then(res => {
|
|
|
if (res.success) {
|
|
|
- this.$dialog.showModal("参加成功", false).then(() => {
|
|
|
- this.$util.isReloadAndBack()
|
|
|
- })
|
|
|
+ this.$util.isReloadAndBack()
|
|
|
}
|
|
|
})
|
|
|
})
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ join() {
|
|
|
+ let mall = this.$cache.get('selectedMall')
|
|
|
+ let params = {
|
|
|
+ activityId: this.id,
|
|
|
+ joinType: this.$global.sponsorType.mall,
|
|
|
+ joinId: this.vuex_mallId,
|
|
|
+ joinName: mall.mallName,
|
|
|
+ discount: this.discount ? (this.discount / 10) : this.detail.discount,
|
|
|
+ joinLogo: mall.logo
|
|
|
+ }
|
|
|
+ this.$api.joinRecord.submit(params).then(res => {
|
|
|
+ if (res.success) {
|
|
|
+ this.$util.isReloadAndBack()
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
exit() {
|
|
|
- this.$dialog.showModal("确定退出?").then(res => {
|
|
|
- let operateList = [{
|
|
|
- activityId: this.id,
|
|
|
- joinType: 1,
|
|
|
- joinId: this.vuex_mallId
|
|
|
- }]
|
|
|
- this.$api.activity.exit(operateList).then(res => {
|
|
|
+ this.$dialog.showModal('确定退出活动?').then(() => {
|
|
|
+ this.$api.joinRecord.remove(this.joinRecordId).then(res => {
|
|
|
if (res.success) {
|
|
|
- this.$dialog.showModal("退出成功", false).then(() => {
|
|
|
- this.$util.isReloadAndBack()
|
|
|
- })
|
|
|
+ this.$util.isReloadAndBack()
|
|
|
}
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.publish {
|
|
|
- background-color: #FFFFFF;
|
|
|
overflow: hidden;
|
|
|
border-radius: 10rpx;
|
|
|
- height: 380rpx;
|
|
|
+ height: 320rpx;
|
|
|
position: absolute;
|
|
|
bottom: 20rpx;
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
- width: 92%;
|
|
|
- margin: 0 auto -120rpx;
|
|
|
+ width: 90%;
|
|
|
+ margin: 0 auto -50rpx;
|
|
|
border-radius: 10rpx;
|
|
|
box-shadow: 0rpx 16rpx 8rpx -8rpx #a8a8a8;
|
|
|
|
|
|
@@ -237,7 +321,7 @@
|
|
|
|
|
|
.clock {
|
|
|
background-color: #FFFFFF;
|
|
|
- height: 120rpx;
|
|
|
+ height: 80rpx;
|
|
|
padding-bottom: 20rpx;
|
|
|
|
|
|
display: flex;
|
|
|
@@ -253,7 +337,7 @@
|
|
|
}
|
|
|
|
|
|
.content {
|
|
|
- padding: 15rpx 30rpx;
|
|
|
+ padding: 0rpx 30rpx 15rpx;
|
|
|
background-color: #FFFFFF;
|
|
|
|
|
|
.title {
|
|
|
@@ -291,9 +375,9 @@
|
|
|
$width: 80rpx;
|
|
|
|
|
|
.item {
|
|
|
- width: 190rpx;
|
|
|
+ width: 200rpx;
|
|
|
height: $width;
|
|
|
- background-color: #eeeeee;
|
|
|
+ background-color: #f0f0f0;
|
|
|
border-radius: 50rpx;
|
|
|
display: flex;
|
|
|
|
|
|
@@ -307,14 +391,36 @@
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
justify-content: center;
|
|
|
- font-size: 22rpx;
|
|
|
+ font-size: 20rpx;
|
|
|
|
|
|
text:first-child {
|
|
|
- font-weight: 800;
|
|
|
margin-bottom: 4rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ .history {
|
|
|
+ background-color: #ffff;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 40rpx 20rpx 20rpx 50rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .nav-title {
|
|
|
+ font-weight: 300;
|
|
|
+ font-size: 28upx;
|
|
|
+ padding-top: 20rpx;
|
|
|
+ line-height: 50rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content {
|
|
|
+ box-shadow: 0 8rpx 10rpx rgba(234, 234, 234, 0.5), 8rpx 0rpx 10rpx rgba(234, 234, 234, .5), -8rpx 0rpx 10rpx rgba(234, 234, 234, .5);
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ padding: 20rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ margin: 20rpx 0;
|
|
|
+ }
|
|
|
</style>
|