You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

640 lines
18 KiB

<template>
<RefreshView ref="mescrollRef" :hasBack="true" text="发布活动" :useDownScroll="false" :useUpScroll="false"
:isInterceptBack="true" @backClick="backClick" :useTitleLeftBtn="isCreate==0?1:0" titleLeftBtnSource="存草稿"
@leftBtn='leftBtnClick' :useTitleRightBtn="isCreate==0?0:1" titleRightBtnSource="发布" @rightBtn='rightBtnClick'>
<view class="topLayout">
<view class="topLayout_item">
<text class="topLayout_item_left1">1</text>
<text style="font-size: 28rpx;color: #262626;margin-left: 10rpx;">基本信息</text>
</view>
<view class="topLayout_item" @click="topClik(2)">
<text class="topLayout_item_left2">2</text>
<text
style="font-size: 28rpx; font-family: Adobe Heiti Std;font-weight: normal;color: #262626;margin-left: 10rpx;">设置活动项目</text>
</view>
<view class="topLayout_item" @click="topClik(3)">
<text class="topLayout_item_left2">3</text>
<text style="font-size: 28rpx;color: #979797;margin-left: 10rpx;">奖项及其他</text>
</view>
</view>
<PublishItem leftText="标题" :isShowRight="false"></PublishItem>
<EditText hint="请输入活动名称" @onTextChange="text" :text="info.activityBaseInfo.name"></EditText>
<view class=" line">
</view>
<PublishItem leftText="赛事简介" rightText="编辑" :isShowRight="true" @rightClick="clickItem('赛事介绍')">
</PublishItem>
<view style="display: flex;margin-left: 30rpx; margin-right: 30rpx;">
<editor id="editor1" style="height: 50rpx; white-space: pre-wrap;" placeholder="点击进行编辑..." showImgSize
showImgToolbar showImgResize :read-only="true" @click="clickItem('赛事介绍')" @ready="onEditorReady1">
</editor>
</view>
<view class="line"></view>
<view style="display: flex; flex-direction: row;margin-top: 20rpx;margin-bottom: 20rpx;">
<view
style="display: flex; justify-content: center;align-items: center;padding-left: 30rpx;padding-right: 30rpx;"
@click="clickItem('宣传海报')">
<image style="width: 130rpx;height: 130rpx;" src="../../static/upload_image.png" mode="aspectFill">
</image>
</view>
<scroll-view style="width: 100%;white-space: nowrap;" scroll-x="true">
<view v-for="(item,index) in info.activityBaseInfo.listCoverImageUrl" :key="index"
style="display: inline-block;">
<view style="margin-left: 20rpx;margin-right: 20rpx;display: flex;">
<image :src="item" style="width: 220rpx;height: 150rpx;z-index: 1;" mode="aspectFill"
@click="showImage(item)">
</image>
<image src="../../static/event-icon/delete1.png"
style="margin-left: -60rpx;margin-top: 10rpx;width: 50rpx;height: 50rpx;z-index: 2;"
@click="deleteItem(item)">
</image>
</view>
</view>
</scroll-view>
</view>
<view class="line"></view>
<biaofun-datetime-picker :start="info.activityBaseInfo.enrollStartTime" @change="dateChange1">
<PublishItem leftText="报名开始时间" :middleText="info.activityBaseInfo.enrollStartTime" rightText="修改"
:isShowRight="true"></PublishItem>
</biaofun-datetime-picker>
<view class="line"></view>
<biaofun-datetime-picker :start="info.activityBaseInfo.enrollEndTime" @change="dateChange2">
<PublishItem leftText="报名截止时间" :middleText="info.activityBaseInfo.enrollEndTime" rightText="修改"
:isShowRight="true">
</PublishItem>
</biaofun-datetime-picker>
<view class="line"></view>
<PublishItem leftText="联系方式" :middleText="name_mobile" rightText="修改" :isShowRight="true"
@rightClick="clickItem('联系方式')"></PublishItem>
<view class="line"></view>
<!--
<view class="layout1" style="flex-direction:column">
<view class="layout">
<image style="width: 45rpx;height: 45rpx;" src="../../static/custom-icon/line.png" mode="aspectFill">
</image>
<text class="layout_lift">报名条件</text>
<view class="layout_right" style="flex: 1;margin-left: 50rpx;">
<radio-group @change="radioChange">
<radio :checked="info.activityBaseInfo.radioType1">认证用户</radio>
<radio :checked="info.activityBaseInfo.radioType2" style="margin-left: 50rpx;">不限制</radio>
</radio-group>
</view>
</view>
<text style="font-size: 24rpx; color:#ff0000 ; margin-left: 50rpx;">规模活动请选择认证用户便于管理及实施</text>
</view>
<view class="line"></view> -->
<PublishItem leftText="免责声明" rightText="编辑" :isShowRight="true" @rightClick="clickItem('免责声明')">
</PublishItem>
<view style="display: flex;margin-left: 30rpx; margin-right: 30rpx;">
<editor id="editor2" style="white-space: pre-wrap;" placeholder="点击进行编辑..." showImgSize showImgToolbar
showImgResize :read-only="true" @click="clickItem('免责声明')" @ready="onEditorReady2">
</editor>
</view>
<view class="line"></view>
<view class="layout">
<image style="width: 45rpx;height: 45rpx;" src="../../static/custom-icon/line.png" mode="aspectFill">
</image>
<text class="layout_lift" style="flex: 1;">参赛者取消报名</text>
<view style="display: flex; flex: 1;justify-content: flex-end;margin-right: 15rpx;">
<fui-dropdown-menu :size="30" selectedColor="#465CFF" :options="options" @click="typeItemClick"
@close="typeClose" ref="ddmtype">
<view class="fui-filter__item" @tap="filterTap()">
<image style="width: 22rpx;height: 22rpx; margin-left: 15rpx;"
src="../../static/event-icon/xia.png" mode="aspectFit" class="fui-filter__icon"
:class="{'fui-icon__ani':typeShow}">
</image>
<text>{{type}}</text>
</view>
</fui-dropdown-menu>
</view>
</view>
<view class="line"></view>
<view class="layout1" style="flex-direction:column">
<view class="layout">
<image style="width: 45rpx;height: 45rpx;" src="../../static/custom-icon/line.png" mode="aspectFill">
</image>
<text class="layout_lift" style="flex: 1;">是否公开</text>
<view class="layout_right">
<switch class="tui-fr" :checked="switch1Checked" @change="switch1Change">
</switch>
</view>
</view>
<text style="font-size: 24rpx; color:#ff0000 ; margin-left: 50rpx;">非公开赛事在我的赛事可见分享后好友可报名</text>
</view>
<view class="line"></view>
<view style="height: 300rpx;"></view>
<text class="btn" @click="jump()">设置活动项目</text>
<cropper saveMode="ScaleTo500" ref="cropper" :aspectRatio="1.25" @complete="complete" @cancel="cancel">
</cropper>
</RefreshView>
</template>
<script>
import asyncSwitch from "@/components/helang-asyncSwitch/helang-asyncSwitch.vue";
import fuiButton from "@/components/firstui/fui-dropdown-menu/fui-dropdown-menu.vue"
export default {
components: {
"async-switch": asyncSwitch,
"fuiButton": fuiButton
},
data() {
return {
isCreate: 0,
options: [{
text: '退还报名费',
value: 1,
}, {
text: '不退报名费',
value: 0
}],
name_mobile: "",
typeShow: false,
type: "退报名费",
switch1Checked: false,
switch2Checked: false,
info: {
sid: "",
activityBaseInfo: {
enrollStartTime: this.TimeFormat(this.CurrentMillions(), "yyyy-MM-dd HH:mm"),
enrollEndTime: this.TimeFormat(this.CurrentMillions(), "yyyy-MM-dd HH:mm"),
listCoverImageUrl: [],
cancelEnrollRefund: 0,
inviteType: 0
},
listActivityItems: [],
activityNotesOther: {}
},
};
},
onLoad: function(option) {
console.log('option.isCreate', option.isCreate)
this.isCreate = option.isCreate
let that = this
if (this.HasCache()) {
uni.showModal({
title: '提示',
content: '是否使用草稿内容',
success: function(res) {
if (res.confirm) { //这里是点击了确定以后
console.log('用户点击确定')
console.log('---->1', that.ReadGameCahce())
that.info = that.ReadGameCahce()
console.log('---->2', that.info)
if (that.info.activityBaseInfo.linkerName != null && that.info
.activityBaseInfo.linkerPhone != null) {
that.name_mobile = that.info.activityBaseInfo.linkerName + "\u3000" +
that.info.activityBaseInfo.linkerPhone
}
that.switch1Checked = that.info.activityBaseInfo.cancelEnrollRefund == 1 ?
true :
false
that.switch2Checked = that.info.activityBaseInfo.inviteType == 1 ? true :
false
that.onEditorReady1()
that.onEditorReady2()
} else { //这里是点击了取消以后
console.log('用户点击取消')
}
}
})
}
},
onShow() {
let backResult = this.OnActivityResult();
if (backResult != undefined) {
this.info.activityBaseInfo = backResult;
if (!this.IsEmpty(this.info.activityBaseInfo.linkerName) && !this.IsEmpty(this.info.activityBaseInfo
.linkerPhone)) {
this.name_mobile = this.info.activityBaseInfo.linkerName + "\u3000" + this.info.activityBaseInfo
.linkerPhone
}
console.log(backResult)
this.onEditorReady1()
this.onEditorReady2()
}
},
methods: {
text(e) {
this.info.activityBaseInfo.name = e
},
backClick() {
let that = this
uni.showModal({
title: '提示',
content: '赛事未发布,是否保存草稿?',
success: function(res) {
if (res.confirm) { //这里是点击了确定以后
console.log('用户点击确定')
that.WriteGameCahce(that.info)
uni.navigateBack({
delta: 1
})
} else { //这里是点击了取消以后
console.log('用户点击取消')
uni.navigateBack({
delta: 1
})
}
}
})
},
leftBtnClick() {
this.WriteGameCahce(this.info)
uni.navigateBack({
delta: 1
})
},
rightBtnClick() {
if (this.IsEmpty(getApp().globalData.memberSid)) {
console.log('createSid', "无sid")
} else {
this.info.createSid = getApp().globalData.memberSid
console.log('createSid', JSON.stringify(this.info))
// this.HTTP({
// url: 'v1/activityManagement/saveActivity',
// method: 'POST',
// data: this.info,
// paramsType: "FORM",
// loading: true
// }).then((res) => {
// this.ClearGameCache(this.info)
// wx.navigateBack({
// delta: 3
// })
// });
}
},
topClik(index) {
switch (index) {
case 2:
uni.navigateTo({
url: "setEventActivity?isCreate=" + this.isCreate +
// "&activityBaseInfo=" + encodeURIComponent(JSON.stringify(this.activityBaseInfo))
"&info=" + JSON.stringify(this.info) // 页面 A
})
break
case 3:
uni.navigateTo({
url: "prizeActivity?isCreate=" + this.isCreate +
"&info=" + JSON.stringify(this.info) // 页面 A
})
break
}
},
deleteItem(item) {
uni.showModal({
title: '温馨提示',
content: '确定要删除吗?',
success(res) {
if (res.confirm) {
this.info.activityBaseInfo.listCoverImageUrl.splice(this.info.activityBaseInfo
.listCoverImageUrl.indexOf(item), 1)
}
}
});
},
showImage(item) {
// 从相册选择6张图
uni.chooseImage({
count: 6,
sizeType: ['original', 'compressed'],
sourceType: ['album'],
success: function(res) {
// 预览图片
uni.previewImage({
urls: res.tempFilePaths,
longPressActions: {
itemList: ['发送给朋友', '保存图片', '收藏'],
success: function(data) {
console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data
.index + 1) + '张图片');
},
fail: function(err) {
console.log(err.errMsg);
}
}
});
}
});
},
clickItem(e) {
let _this = this
switch (e) {
case "宣传海报":
uni.chooseImage({
count: 9,
sizeType: ['compressed'],
success: function(res) {
console.log(JSON.stringify(res.tempFilePaths));
for (var i = 0; i < res.tempFilePaths.length; i++) {
_this.info.activityBaseInfo.listCoverImageUrl.push(res.tempFilePaths[i])
}
}
})
break;
case "联系方式":
uni.navigateTo({
url: "mobileInfoActivity?activityBaseInfo=" + JSON.stringify(_this.info
.activityBaseInfo)
})
break;
case "赛事介绍":
uni.navigateTo({
url: "explainActivity?activityBaseInfo=" + JSON.stringify(_this.info
.activityBaseInfo)
})
break;
case "免责声明":
uni.navigateTo({
url: "eventActivity?activityBaseInfo=" + JSON.stringify(_this.info
.activityBaseInfo)
})
break;
}
},
radioChange(e) {
this.info.activityBaseInfo.radioType1 = !this.info.activityBaseInfo.radioType1
this.info.activityBaseInfo.radioType2 = !this.info.activityBaseInfo.radioType2
console.log('radio1发生change事件,携带value值为:', this.info.activityBaseInfo.radioType1)
console.log('radio2发生change事件,携带value值为:', this.info.activityBaseInfo.radioType2)
},
cancel() {
this.$refs.cropper.close(true);
},
complete(e) {
this.activityBaseInfo.logo = e.path
this.$refs.cropper.close(true);
},
dateChange1(e) {
this.info.activityBaseInfo.enrollStartTime = e.f1 + " " + e.hh + ":" + e.mm
console.log(e)
},
dateChange2(e) {
this.info.activityBaseInfo.enrollEndTime = e.f1 + " " + e.hh + ":" + e.mm
},
onEditorReady1() {
// #ifdef APP-PLUS
uni.createSelectorQuery().select('#editor1').context((res) => {
this.editorCtx1 = res.context
this.editorCtx1.setContents({
html: this.info.activityBaseInfo.introduction
})
}).exec()
// #endif
// #ifdef H5 || MP-WEIXIN
this.createSelectorQuery().select('#editor1').context((res) => {
this.editorCtx1 = res.context
this.editorCtx1.setContents({
html: this.info.activityBaseInfo.introduction
})
}).exec()
// #endif
},
onEditorReady2() {
// #ifdef APP-PLUS
uni.createSelectorQuery().select('#editor2').context((res) => {
this.editorCtx2 = res.context
this.editorCtx2.setContents({
html: this.info.activityBaseInfo.disclaimer
})
}).exec()
// #endif
// #ifdef H5 || MP-WEIXIN
this.createSelectorQuery().select('#editor2').context((res) => {
this.editorCtx2 = res.context
this.editorCtx2.setContents({
html: this.info.activityBaseInfo.disclaimer
})
}).exec()
// #endif
},
filterTap() {
// this.$refs.ddmtype.show()
this.typeShow = true;
},
typeItemClick(e) {
this.type = e.text
this.info.activityBaseInfo.cancelEnrollRefund = e.value
console.log(this.type)
console.log(this.info.activityBaseInfo.cancelEnrollRefund)
this.typeClose()
},
typeClose() {
this.typeShow = false;
},
switch1Change: function(e) {
this.switch1Checked = !this.switch1Checked;
this.info.activityBaseInfo.cancelEnrollRefund = this.switch1Checked == true ? 0 : 1;
console.log(`switch1Change样式点击后是否选中:`, this.switch1Checked)
console.log(`cancelEnrollRefund是否选中:`, this.info.activityBaseInfo.cancelEnrollRefund)
},
switch2Change: function(e) {
this.switch2Checked = !this.switch2Checked;
this.info.activityBaseInfo.inviteType = this.switch2Checked == true ? 0 : 1;
console.log(`switch2Change样式点击后是否选中:`, this.switch1Checked)
console.log(`inviteType是否选中:`, this.info.activityBaseInfo.inviteType)
},
jump() {
if (this.IsEmpty(this.info.activityBaseInfo.name)) {
this.Toast("请输入活动名称");
return;
}
if (this.IsEmpty(this.info.activityBaseInfo.linkerName) || this.IsEmpty(this.info.activityBaseInfo
.linkerPhone)) {
this.Toast("联系方式不能为空");
return;
}
if (this.IsEmpty(this.info.activityBaseInfo.introduction)) {
this.Toast("活动介绍不能为空");
return;
}
if (this.IsEmpty(this.info.activityBaseInfo.disclaimer)) {
this.Toast("免责声明不能为空");
return;
}
uni.navigateTo({
url: "setEventActivity?isCreate=" + this.isCreate +
// "&activityBaseInfo=" + encodeURIComponent(JSON.stringify(this.activityBaseInfo))
"&info=" + JSON.stringify(this.info)
})
}
}
};
</script>
<style lang="scss">
.line {
width: 100%;
height: 5rpx;
background-color: #f5f4f9;
}
.logo {
width: calc(100vw - 40rpx);
height: calc((100vw - 40rpx)*0.8);
margin-left: 20rpx;
}
.topLayout {
background: #F7F7F7;
display: flex;
padding: 30rpx 60rpx;
flex-direction: row;
align-items: center;
justify-content: space-between;
.topLayout_item {
display: flex;
flex-direction: row;
align-items: center;
.topLayout_item_left1 {
width: 48rpx;
height: 48rpx;
background-color: #007AFF;
border-radius: 50%;
color: #FFFFFF;
font-size: 36rpx;
text-align: center;
}
.topLayout_item_left2 {
width: 48rpx;
height: 48rpx;
border: 1rpx solid #D9D9D9;
border-radius: 50%;
color: #D9D9D9;
font-size: 36rpx;
text-align: center;
}
}
}
.layout {
background: #FFFFFF 100%;
display: flex;
flex-direction: row;
padding: 30rpx 15rpx;
align-items: center;
.layout_lift {
font-size: 30rpx;
color: #101010;
}
.layout_right {
display: flex;
right: 32rpx;
align-items: center;
}
}
.labelLayout {
display: flex;
flex: 1;
margin-left: 10rpx;
margin-right: 10rpx;
background-color: #F2BF5C;
color: #FFFFFF;
padding-top: 5rpx;
padding-bottom: 5rpx;
justify-content: center;
text-align: center;
font-size: 30rpx;
}
.labelLayout2 {
background-color: #007AFF;
}
.tui-fr {
zoom: .7
}
.layout1 {
background: #FFFFFF 100%;
display: flex;
flex-direction: row;
padding-bottom: 20rpx;
}
.btn {
justify-content: center;
width: 100%;
margin-top: 100rpx;
padding: 30rpx;
font-size: 30rpx;
color: #FFFFFF;
background: #007AFF;
text-align: center;
flex: 1;
position: absolute;
bottom: 0;
}
.fui-filter__item {
height: auto;
width: 300rpx;
display: flex;
flex-direction: row-reverse;
align-items: center;
font-size: 30rpx;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
}
.fui-filter__icon {
transition: all .15s linear;
}
.fui-icon__ani {
transform: rotate(180deg);
}
</style>