|
|
@@ -0,0 +1,300 @@
|
|
|
+<template>
|
|
|
+ <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>
|
|
|
+ </view>
|
|
|
+ </my-bar>
|
|
|
+ <view class="clock">
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="content">
|
|
|
+ <text class="title">{{detail.title}}</text>
|
|
|
+ <view class="data" style="margin-top: 30rpx;">
|
|
|
+ <u-icon name="clock" color="#EF9944"></u-icon>
|
|
|
+ <text class="margin-left-10">{{detail.beginTime | date('mm/dd hh:MM:ss')}} 至 {{detail.endTime | date('mm/dd hh:MM:ss')}}</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}}%</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="data">
|
|
|
+ <u-icon name="home-fill" color="#EF9944"></u-icon>
|
|
|
+ <text class="margin-left-10">联营积分全场通用</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="intro">
|
|
|
+ <view class="flex">
|
|
|
+ <u-icon name="coupon" 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 disabled v-model="appendSupplyPrice" placeholder="请输入折扣" style="width: 90%;" />
|
|
|
+ <text class="padding-left-20">%</text>
|
|
|
+ </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}}
|
|
|
+ </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>
|
|
|
+
|
|
|
+ <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 :src="item.joinPic" mode=""></image>
|
|
|
+ <view>
|
|
|
+ <text>{{name | ellipsis}}</text>
|
|
|
+ <text>{{item.finalSupplyPrice}}折</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>
|
|
|
+
|
|
|
+ <block v-if="detail.auditStatus==0">
|
|
|
+ <view class="" style="height: 90rpx;"></view>
|
|
|
+ <view :style="{paddingBottom:safeAreaBottom}" class="footer-fixed padding-20 bg-white flex justify-end margin-right-30" style="box-sizing: border-box;z-index: 999;border-top: 1rpx solid #f1f1f1;">
|
|
|
+ <view @click="pass" class="cu-btn df btn-bg-color round margin-right-20" style="padding-left: 46rpx;padding-right: 46rpx;">
|
|
|
+ 通过
|
|
|
+ </view>
|
|
|
+ <view @click="opinionShow=true" class="cu-btn df btn-line-color round " style="padding-left: 46rpx;padding-right: 46rpx;">
|
|
|
+ 拒绝
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+
|
|
|
+ <block v-else>
|
|
|
+ <view class="" style="height: 90rpx;"></view>
|
|
|
+ <view :style="{paddingBottom:safeAreaBottom}" class="footer-fixed center">
|
|
|
+ <view class="cu-btn df btn-bg-color round " style="width: 90%;height: 80rpx;">
|
|
|
+ <text v-if="detail.auditStatus==1">审核已通过</text>
|
|
|
+ <text v-if="detail.auditStatus==2">审核未通过</text>
|
|
|
+ <text v-if="detail.auditStatus==2">活动已停用</text>
|
|
|
+ <text v-if="detail.auditStatus==4">已提交,待平台审核</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+
|
|
|
+ <u-modal :show-cancel-button="true" confirm-color="#FF9447" @confirm="opinionConfirm" title="审核意见" :mask-close-able="true"
|
|
|
+ v-model="opinionShow">
|
|
|
+ <view class="slot-content" style="margin: 20rpx;">
|
|
|
+ <u-form label-width="150" ref="uForm">
|
|
|
+ <u-form-item :border-bottom="false">
|
|
|
+ <u-input height="150" placeholder="请输入审核意见(选填)" v-model="auditAdvice" />
|
|
|
+ </u-form-item>
|
|
|
+ </u-form>
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import myBar from "@/components/my-bar.vue"
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ myBar
|
|
|
+ },
|
|
|
+ onPageScroll(obj) {
|
|
|
+ this.transparent = obj.scrollTop * 0.006;
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ // 名称超出显示省略号
|
|
|
+ ellipsis(value) {
|
|
|
+ if (!value) return '';
|
|
|
+ if (value.length > 4) {
|
|
|
+ return value.slice(0, 3) + '...'
|
|
|
+ }
|
|
|
+ return value
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ id: '',
|
|
|
+ transparent: '',
|
|
|
+ name: '星巴克',
|
|
|
+ detail: {},
|
|
|
+ appendSupplyPrice: 100,
|
|
|
+
|
|
|
+ opinionShow:false,
|
|
|
+ auditAdvice:''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ this.id = options.id
|
|
|
+ if (!this.id) {
|
|
|
+ this.$u.toast('系统错误')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.fetchDetail()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ fetchDetail() {
|
|
|
+ this.$api.activity.detail({
|
|
|
+ id: this.id
|
|
|
+ }).then(res => {
|
|
|
+ this.detail = res.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ opinionConfirm(){
|
|
|
+ let item = this.$u.deepClone(this.detail)
|
|
|
+ item.auditStatus = this.$global.activityStatus.refuse
|
|
|
+ this.$api.activity.submit(item).then(res => {
|
|
|
+ if (res.success == true) {
|
|
|
+ this.$u.toast(res.msg)
|
|
|
+ this.fetchDetail()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ pass(){
|
|
|
+ this.$dialog.showModal('确定通过并提交到平台进行审核?').then(()=>{
|
|
|
+ let item=this.$u.deepClone(this.detail)
|
|
|
+ item.auditStatus=this.$global.activityStatus.wait_admin_audit
|
|
|
+ this.$api.activity.submit(item).then(res=>{
|
|
|
+ if (res.success == true) {
|
|
|
+ this.$u.toast(res.msg)
|
|
|
+ this.$util.waitReload()
|
|
|
+ this.fetchDetail()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .publish {
|
|
|
+ overflow: hidden;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ height: 380rpx;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 20rpx;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ width: 92%;
|
|
|
+ margin: 0 auto -120rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ box-shadow: 0rpx 16rpx 8rpx -8rpx #a8a8a8;
|
|
|
+
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ text {
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #797979;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .clock {
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ height: 120rpx;
|
|
|
+ padding-bottom: 20rpx;
|
|
|
+
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: flex-end;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .tips {
|
|
|
+ margin-top: 10rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #FF9447;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .content {
|
|
|
+ padding: 15rpx 30rpx;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ line-height: 50rpx;
|
|
|
+ font-weight: 800;
|
|
|
+ font-size: 32rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .data {
|
|
|
+ margin: 20rpx 0;
|
|
|
+ color: #787878;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .intro {
|
|
|
+ margin-top: 15rpx;
|
|
|
+ padding: 15rpx 30rpx;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+
|
|
|
+ .desc {
|
|
|
+ color: #9a9a9a;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ line-height: 46rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .attend {
|
|
|
+ margin-top: 15rpx;
|
|
|
+ padding: 15rpx 0 15rpx 30rpx;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+
|
|
|
+ .data {
|
|
|
+ margin: 10rpx 20rpx 10rpx 0;
|
|
|
+ $width: 80rpx;
|
|
|
+
|
|
|
+ .item {
|
|
|
+ width: 190rpx;
|
|
|
+ height: $width;
|
|
|
+ background-color: #eeeeee;
|
|
|
+ border-radius: 50rpx;
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: $width;
|
|
|
+ height: $width;
|
|
|
+ }
|
|
|
+
|
|
|
+ view {
|
|
|
+ padding-left: 10rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ font-size: 22rpx;
|
|
|
+
|
|
|
+ text:first-child {
|
|
|
+ font-weight: 800;
|
|
|
+ margin-bottom: 4rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|