|
|
@ -12,13 +12,16 @@ |
|
|
|
|
|
|
|
<!--基本信息--> |
|
|
|
<view style="" class="basicInfo"> |
|
|
|
<view class="item"> |
|
|
|
<view class="label">春天的气息丫丫</view> |
|
|
|
<view class="value">???</view> |
|
|
|
</view> |
|
|
|
<!-- <view class="item"> |
|
|
|
<view class="label">推广名称</view> |
|
|
|
<view class="value"> |
|
|
|
<uv-input v-model="form.promotionName" placeholder="请输入推广名称" border="bottom" type='number' |
|
|
|
clearable></uv-input> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
<view class="item"> |
|
|
|
<view class="label">价格</view> |
|
|
|
<view class="value">{{item.price}}</view> |
|
|
|
<view class="value">{{item.goTiime}}</view> |
|
|
|
</view> |
|
|
|
<view class="item"> |
|
|
|
<view class="label">时长</view> |
|
|
@ -27,13 +30,13 @@ |
|
|
|
<view class="item"> |
|
|
|
<view class="label">联系方式</view> |
|
|
|
<view class="value"> |
|
|
|
<uv-input v-model="form.phone" placeholder="请输入联系方式" border="bottom" type='number' |
|
|
|
<uv-input v-model="item.phone" placeholder="请输入联系方式" border="bottom" type='number' |
|
|
|
clearable></uv-input> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="item"> |
|
|
|
<view class="label">剩余推广时长</view> |
|
|
|
<view class="value">{{item.price}}</view> |
|
|
|
<view class="value">{{item.remainingPromotionTime}}</view> |
|
|
|
</view> |
|
|
|
<view>推广作品</view> |
|
|
|
<view style="width: 30%;height: 300rpx;border-radius: 20rpx;overflow: hidden;"> |
|
|
@ -42,8 +45,15 @@ |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- ActionSheet 操作菜单 --> |
|
|
|
<uv-action-sheet ref="actionSheet" :actions="upTopList" title="选择推广时长" @select="select" @close="close" |
|
|
|
:closeOnClickAction="false"> |
|
|
|
</uv-action-sheet> |
|
|
|
|
|
|
|
<!--确认发布弹框--> |
|
|
|
<uv-popup ref="popup" mode="center" custom-style="height: 400rpx;" :closeOnClickOverlay="false"> |
|
|
|
<uv-popup ref="popup" mode="center" custom-style="height: 400rpx;"> |
|
|
|
<view class="content"> |
|
|
|
<view class="title"> |
|
|
|
推广选项 |
|
|
@ -51,22 +61,13 @@ |
|
|
|
<!--付费周期--> |
|
|
|
<view style="" class="payCycle"> |
|
|
|
<view>付费周期</view> |
|
|
|
<view style="width: 200rpx;height:50rpx"> |
|
|
|
<uv-picker ref="picker" :columns="columns" @confirm="confirm"></uv-picker> |
|
|
|
<view style="display: flex;justify-content: flex-start" @click="openPicker"> |
|
|
|
<span style="margin-right: 10rpx;">{{ form.cycle }}</span> |
|
|
|
<uv-icon name="arrow-down" color="#2979ff" size="28"></uv-icon> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view>{{item.day}}天</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!--金额--> |
|
|
|
<view style="width:100%;display: flex;justify-content: space-between;align-items: center;"> |
|
|
|
<view>金额</view> |
|
|
|
<view style="width: 200rpx;height:50rpx"> |
|
|
|
<uv-input type="number" placeholder="请输入内容" border="surround" v-model="form.moneyValue" |
|
|
|
@change="moneyValueChange"></uv-input> |
|
|
|
</view> |
|
|
|
<view>¥{{item.money}}</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!--确认推广按钮--> |
|
|
@ -77,9 +78,26 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</uv-popup> |
|
|
|
<uv-toast ref="toast"></uv-toast> |
|
|
|
|
|
|
|
<!--支付弹框--> |
|
|
|
<confirmationPopup ref="confirmationPopup" title="提示" @confirm="pay" confirmText="确认支付"> |
|
|
|
<view class="confirmationPopup"> |
|
|
|
<image src="/static/image/publish/pay.png" style="width: 150rpx;height: 150rpx;" mode=""></image> |
|
|
|
<view class="info"> |
|
|
|
确认支付{{ item.money }}元,可置顶{{ item.day }}天 |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</confirmationPopup> |
|
|
|
|
|
|
|
<!-- 平台审核弹框 --> |
|
|
|
<confirmationPopup ref="confirmationPopupUpload" title="提示" confirmText="确认" @confirm="confirm()"> |
|
|
|
<view class="confirmationPopup"> |
|
|
|
<image src="/static/image/publish/upload.png" style="width: 150rpx;height: 150rpx;" mode=""></image> |
|
|
|
<view class="info"> |
|
|
|
已由平台进行审核,时间周期为24小时 |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</confirmationPopup> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!--继续推广按钮--> |
|
|
@ -90,22 +108,26 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import dayjs from 'dayjs'; |
|
|
|
import '../../../../common.css'; // 引入公共 CSS 文件 |
|
|
|
import confirmationPopup from '@/components/toast/confirmationPopup.vue' |
|
|
|
export default { |
|
|
|
onLoad: function(options) { |
|
|
|
const id = options.id; |
|
|
|
onLoad(options) { |
|
|
|
// if (options.item) { |
|
|
|
// let item = JSON.parse(decodeURIComponent(options.item)); |
|
|
|
// } |
|
|
|
this.item.id = options.item.id |
|
|
|
}, |
|
|
|
components: { |
|
|
|
confirmationPopup |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
columns: [ |
|
|
|
['一天', '两天', '三天'] |
|
|
|
], |
|
|
|
form: { |
|
|
|
moneyValue: 0, |
|
|
|
cycle: '一天', |
|
|
|
phone: '', |
|
|
|
upTopList: [], |
|
|
|
item: { |
|
|
|
day: 0, |
|
|
|
money: 0, |
|
|
|
}, |
|
|
|
item: {}, |
|
|
|
param: { |
|
|
|
type: 'default', |
|
|
|
title: '结束后跳转标签页', |
|
|
@ -115,54 +137,112 @@ |
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.getData() |
|
|
|
// this.getData() |
|
|
|
this.indexTopPayList() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 获取推广详情数据 |
|
|
|
getData() { |
|
|
|
this.$api('infoGetPromotionDetail', {}, res => { |
|
|
|
this.$api('infoGetPromotionDetail', item.id, res => { |
|
|
|
if (res.code == 200) { |
|
|
|
this.item = res.result.records |
|
|
|
|
|
|
|
// 计算推广时间加上置顶时间 |
|
|
|
const futureTime = dayjs(this.item.createTime).add(this.item.goTiime, "day") |
|
|
|
|
|
|
|
// 获取当前时间 |
|
|
|
const now = dayjs(); |
|
|
|
|
|
|
|
// 计算两个时间之间的差异(毫秒) |
|
|
|
const diff = futureTime.diff(now); |
|
|
|
|
|
|
|
// 将毫秒转换为小时和天 |
|
|
|
const hours = Math.floor(diff / 3600000); |
|
|
|
const days = Math.floor(hours / 24); |
|
|
|
|
|
|
|
// 根据时间差显示不同的格式 |
|
|
|
if (days > 0) { |
|
|
|
// 超过24小时 |
|
|
|
const remainingHours = hours % 24; |
|
|
|
console.log(`${days}天${remainingHours}小时`); |
|
|
|
this.item.remainingPromotionTime = `${days}天${remainingHours}小时` |
|
|
|
} else { |
|
|
|
// 没有超过24小时 |
|
|
|
console.log(`${hours}小时`); |
|
|
|
this.item.remainingPromotionTime = `${hours}小时` |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
openPicker() { |
|
|
|
this.$refs.picker.open(); |
|
|
|
// 获取置顶方式 |
|
|
|
indexTopPayList() { |
|
|
|
this.$api('indexTopPayList', res => { |
|
|
|
if (res.code == 200) { |
|
|
|
for (var i = 0; i < res.result.length; i++) { |
|
|
|
this.upTopList.push({ |
|
|
|
name: '置顶' + res.result[i].day + '天' + res.result[i].money + '元' |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
select(e) { |
|
|
|
console.log('选中该项:', e); |
|
|
|
// 使用正则表达式匹配所有的数字 |
|
|
|
const matches = e.name.match(/\d+/g).map(Number); |
|
|
|
|
|
|
|
// 如果匹配到数字,则输出 |
|
|
|
if (matches) { |
|
|
|
console.log(matches, "matches"); |
|
|
|
this.item.day = matches[0] |
|
|
|
this.item.money = matches[1] |
|
|
|
} |
|
|
|
console.log(this.item.day, "this.item.day"); |
|
|
|
this.$refs.actionSheet.close() //关闭弹框 |
|
|
|
this.$refs.popup.open() //打开另外一个弹框 |
|
|
|
}, |
|
|
|
|
|
|
|
// ActionSheet 操作菜单关闭 |
|
|
|
close() { |
|
|
|
this.$refs.actionSheet.close() //关闭弹框 |
|
|
|
// this.$refs.popup.open() //打开另外一个弹框 |
|
|
|
}, |
|
|
|
|
|
|
|
// 提交平台审核的弹框的确认回调 |
|
|
|
confirm(e) { |
|
|
|
console.log('confirm', e); |
|
|
|
this.form.cycle = e.value[0] |
|
|
|
uni.navigateTo({ |
|
|
|
url: "/pages/index/index" |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 继续推广按钮 |
|
|
|
continueToPromotion() { |
|
|
|
this.$refs.popup.open(); |
|
|
|
}, |
|
|
|
// 金额发生变化 |
|
|
|
moneyValueChange(e) { |
|
|
|
console.log('moneyValue', e); |
|
|
|
this.form.moneyValue = e |
|
|
|
if(this.item.phone=='' || this.item.phone==null){ |
|
|
|
return uni.showToast({ |
|
|
|
title: '请输入联系电话', |
|
|
|
icon : 'none' |
|
|
|
}) |
|
|
|
} |
|
|
|
this.$refs.actionSheet.open(); |
|
|
|
}, |
|
|
|
// 确认推广 |
|
|
|
|
|
|
|
// 确认发布弹框 |
|
|
|
confirmPromotion() { |
|
|
|
console.log('确认推广', this.form); |
|
|
|
this.$refs.toast.show({ |
|
|
|
...this.param, |
|
|
|
complete() { |
|
|
|
this.param.url && uni.navigateTo({ |
|
|
|
url: this.param.url |
|
|
|
}) |
|
|
|
this.$refs.confirmationPopup.open() |
|
|
|
this.$refs.popup.close() |
|
|
|
}, |
|
|
|
pay() { |
|
|
|
this.$refs.confirmationPopupUpload.open() |
|
|
|
return |
|
|
|
// 支付逻辑待补充 |
|
|
|
this.$api('ConfirmPromotion', {}, res => { |
|
|
|
if (res.code == 200) { |
|
|
|
//平台审核 |
|
|
|
this.$refs.confirmationPopupUpload.open() |
|
|
|
} |
|
|
|
}) |
|
|
|
// this.$refs.toast.show() |
|
|
|
// this.$api('ConfirmPromotion', {}, res => { |
|
|
|
// if (res.code == 200) { |
|
|
|
// //跳转到支付页面。。。 |
|
|
|
|
|
|
|
// } |
|
|
|
// }) |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
@ -198,6 +278,14 @@ |
|
|
|
.item { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
.label { |
|
|
|
width: 60%; |
|
|
|
} |
|
|
|
|
|
|
|
.value { |
|
|
|
width: 40%; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
@ -238,7 +326,8 @@ |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
.confirmBtn{ |
|
|
|
|
|
|
|
.confirmBtn { |
|
|
|
width: 50%; |
|
|
|
height: 80rpx; |
|
|
|
text-align: center; |
|
|
|