|
|
@@ -0,0 +1,449 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <view v-if="stepOne">
|
|
|
+ <view class="form">
|
|
|
+ <view class="form-title">基本信息</view>
|
|
|
+ <view class="form-item-title">封面图</view>
|
|
|
+ <view class="upload-pic ddflex" v-if="!pic" @click="uploadImage(1)">
|
|
|
+ <image src="../static/images/pic.png"></image>
|
|
|
+ <view style="margin-top: 30rpx;">上传封面图</view>
|
|
|
+ </view>
|
|
|
+ <image v-else class="upload-image" :src="pic" @click="uploadImage(1)"></image>
|
|
|
+ <view class="form-limit">* 图片尺寸限制：680*350</view>
|
|
|
+ <view class="form-item-title">活动详情轮播图</view>
|
|
|
+ <view class="ddflex" style="margin-top: 30rpx;">
|
|
|
+ <view class="upload-photo-image" v-for="item ,index in fileList" @click="uploadImage(2,index+1)">
|
|
|
+ <image :src="item" mode="aspectFill"></image>
|
|
|
+ <image class="upload-photo-close" src="/static/pages/images/close3.png" @click.stop="deleteImage(2,index+1)"></image>
|
|
|
+ </view>
|
|
|
+ <view class="upload-photo ddflex" @click="uploadImage(2)" v-if="fileList.length<9">
|
|
|
+ <image src="../static/images/photo.png"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="form-limit">* 图片尺寸限制：670*350</view>
|
|
|
+ </view>
|
|
|
+ <view class="form-border"></view>
|
|
|
+ <view class="form">
|
|
|
+ <view class="form-item-title">活动标题</view>
|
|
|
+ <view class="form-input-box">
|
|
|
+ <input v-model="title" placeholder-class="form-input-placeholder" placeholder="请输入活动标题"/>
|
|
|
+ </view>
|
|
|
+ <view class="form-item-title">活动说明</view>
|
|
|
+ <view class="form-input-box">
|
|
|
+ <input v-model="brief" placeholder-class="form-input-placeholder" placeholder="请填写活动简介说明"/>
|
|
|
+ </view>
|
|
|
+ <view class="form-item-title">
|
|
|
+ 活动详情
|
|
|
+ <view class="more ddflex" @click="jumpUrl('/match/editorContent/editorContent')">
|
|
|
+ <text v-if="!text">编辑</text>
|
|
|
+ <text v-else style="color: var(--main);">已完善</text>
|
|
|
+ <image src="../../static/pages/images/more.png"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="next-btn" @click="next">下一步</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 第二步 -->
|
|
|
+ <view v-if="stepTwo">
|
|
|
+ <view class="form">
|
|
|
+ <view class="form-title">报名设置</view>
|
|
|
+ <view class="form-item-title">最大报名人数</view>
|
|
|
+ <view class="form-number-select ddflex">
|
|
|
+ <view>-</view>
|
|
|
+ <input v-model="personLimit" type="number" placeholder="最大报名人数" placeholder-class="form-input-placeholder"/>
|
|
|
+ <view>+</view>
|
|
|
+ </view>
|
|
|
+ <view class="form-item-title">报名时间</view>
|
|
|
+ <view class="ddflex" style="margin-top: 20rpx;">
|
|
|
+ <picker v-model="enlistStartTime" mode="date" class="flex" @change="enlistStartTimeChange">
|
|
|
+ <view class="form-date-select" :style="enlistStartTime?'color:#333':''">
|
|
|
+ {{enlistStartTime?enlistStartTime:'开始日期'}}
|
|
|
+ </view>
|
|
|
+ </picker>
|
|
|
+ <text style="margin: 0 20rpx;">至</text>
|
|
|
+ <picker v-model="enlistEndTime" mode="date" class="flex" @change="enlistEndTimeChange">
|
|
|
+ <view class="form-date-select" :style="enlistEndTime?'color:#333':''">
|
|
|
+ {{enlistEndTime?enlistEndTime:'结束日期'}}
|
|
|
+ </view>
|
|
|
+ </picker>
|
|
|
+ </view>
|
|
|
+ <view class="form-item-title">活动时间</view>
|
|
|
+ <view class="ddflex" style="margin-top: 20rpx;">
|
|
|
+ <picker v-model="startTime" mode="date" class="flex" @change="startTimeChange">
|
|
|
+ <view class="form-date-select" :style="startTime?'color:#333':''">
|
|
|
+ {{startTime?startTime:"开始日期"}}
|
|
|
+ </view>
|
|
|
+ </picker>
|
|
|
+ <text style="margin: 0 20rpx;">至</text>
|
|
|
+ <picker v-model="endTime" mode="date" class="flex" @change="endTimeChange">
|
|
|
+ <view class="form-date-select" :style="endTime?'color:#333':''">
|
|
|
+ {{endTime?endTime:"结束日期"}}
|
|
|
+ </view>
|
|
|
+ </picker>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="form-border"></view>
|
|
|
+ <view class="form">
|
|
|
+ <view class="form-title">活动地址</view>
|
|
|
+ <view class="form-item-title">地址名称</view>
|
|
|
+ <view class="form-input-box">
|
|
|
+ <input v-model="house" placeholder-class="form-input-placeholder" placeholder="请输入活动地址简称"/>
|
|
|
+ </view>
|
|
|
+ <view class="form-item-title">选择城市</view>
|
|
|
+ <view class="form-input-box">
|
|
|
+ <!-- <picker class="form-input-placeholder" mode="region" @change="bindRegionChange" :value="region" > -->
|
|
|
+ <view class="picker" :style="region.length>0?'color: #333;':'color:#cccccc'" @click="chooseLocation()">
|
|
|
+ {{region.length > 0 ? region[0]+region[1]+region[2] : '请选择所在城市'}}
|
|
|
+ </view>
|
|
|
+ <!-- </picker> -->
|
|
|
+ <!-- <image src="/card/static/images/area.png" class="loca" @click="chooseLocation()"></image> -->
|
|
|
+ </view>
|
|
|
+ <view class="form-item-title">
|
|
|
+ 详细地址
|
|
|
+ </view>
|
|
|
+ <view class="form-input-box">
|
|
|
+ <input v-model="address" placeholder-class="form-input-placeholder" placeholder="请输入详细地址"/>
|
|
|
+ </view>
|
|
|
+ <view class="next-btn" @click="submit()">提交</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import util from "../../utils/util.js";
|
|
|
+ const app = getApp();
|
|
|
+ const req = require("../../utils/request.js");
|
|
|
+
|
|
|
+ export default {
|
|
|
+ components: {},
|
|
|
+ props: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ stepOne:true,
|
|
|
+ stepTwo:false,
|
|
|
+
|
|
|
+ pic:'',//封面图
|
|
|
+ fileList:[],//banner
|
|
|
+ title:'',
|
|
|
+ brief:'',
|
|
|
+ text:'',
|
|
|
+ personLimit:-1,
|
|
|
+ enlistStartTime:'',
|
|
|
+ enlistEndTime:'',
|
|
|
+ startTime:'',
|
|
|
+ endTime:'',
|
|
|
+ house:'',
|
|
|
+ region:[],
|
|
|
+ address:'',
|
|
|
+ regionCode:[],
|
|
|
+ id:'',
|
|
|
+ longitude:null,
|
|
|
+ latitude:null
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ this.id = options.id
|
|
|
+ if(this.id){
|
|
|
+ this.getActivityInfo()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ jumpUrl(url){
|
|
|
+ uni.navigateTo({
|
|
|
+ url:url
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getActivityInfo(){
|
|
|
+ req.getRequest('/api/match/detail',{id:this.id},res=>{
|
|
|
+ this.pic = res.pic
|
|
|
+ this.fileList = res.imageList.map(item=>{return item.url})
|
|
|
+ this.title = res.title
|
|
|
+ this.brief = res.brief
|
|
|
+ this.text = res.text
|
|
|
+ this.personLimit = res.personLimit
|
|
|
+ this.enlistStartTime = this.formatTime(res.enlistStartTime)
|
|
|
+ this.enlistEndTime = this.formatTime(res.enlistEndTime)
|
|
|
+ this.startTime = this.formatTime(res.startTime)
|
|
|
+ this.endTime = this.formatTime(res.endTime)
|
|
|
+ this.house = res.house
|
|
|
+ this.regionCode = [res.province,res.city,res.country]
|
|
|
+ this.region = res.areaAdd.split(',')
|
|
|
+ this.address = res.address
|
|
|
+ this.longitude = res.lng?res.lng:null
|
|
|
+ this.latitude = res.lat?res.lat:null
|
|
|
+ })
|
|
|
+ },
|
|
|
+ next(){
|
|
|
+ if(!this.pic){
|
|
|
+ return req.msg('请上传封面图')
|
|
|
+ }
|
|
|
+ if(this.fileList.length==0){
|
|
|
+ return req.msg('请上传活动轮播图')
|
|
|
+ }
|
|
|
+ if(!this.title){
|
|
|
+ return req.msg('请填写活动名称')
|
|
|
+ }
|
|
|
+ if(!this.brief){
|
|
|
+ return req.msg('请填写活动简介')
|
|
|
+ }
|
|
|
+ if(!this.text){
|
|
|
+ return req.msg('请填写活动详情')
|
|
|
+ }
|
|
|
+ this.stepOne = false
|
|
|
+ this.stepTwo = true
|
|
|
+ },
|
|
|
+ uploadImage(type,index){
|
|
|
+ let that = this;
|
|
|
+ let count = 1
|
|
|
+ if(type==1){
|
|
|
+ count = 1
|
|
|
+ }else if(type==2){
|
|
|
+ if(index){
|
|
|
+ count = 1
|
|
|
+ }else{
|
|
|
+ count = 9-that.fileList.length
|
|
|
+ }
|
|
|
+ }
|
|
|
+ uni.chooseImage({
|
|
|
+ count: count,
|
|
|
+ sizeType: ['original', 'compressed'],
|
|
|
+ sourceType: ['album', 'camera'],
|
|
|
+ success: function({ tempFilePaths }) {
|
|
|
+ var promise = Promise.all(
|
|
|
+ tempFilePaths.map(tempFilePath => {
|
|
|
+ return new Promise(function(resolve, reject) {
|
|
|
+ req.uploadFile('/api/nocheck/upload', tempFilePath, res => {
|
|
|
+ // type 1 封面图
|
|
|
+ if(type==1){
|
|
|
+ that.pic = res.src
|
|
|
+ }else if(type==2){
|
|
|
+ if(index){
|
|
|
+ that.fileList[index] = res.src
|
|
|
+ that.fileList = JSON.parse(JSON.stringify(that.fileList))
|
|
|
+ }else{
|
|
|
+ that.fileList = that.fileList.concat(res.src)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ })
|
|
|
+ );
|
|
|
+ promise
|
|
|
+ .then(function(results) {
|
|
|
+ console.log(results);
|
|
|
+ })
|
|
|
+ .catch(function(err) {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ deleteImage(type,index){
|
|
|
+ if(type==2)
|
|
|
+ this.fileList.splice(index,1)
|
|
|
+ },
|
|
|
+ enlistStartTimeChange(e){
|
|
|
+ if(this.enlistEndTime){
|
|
|
+ if(this.enlistEndTime<e.detail.value)
|
|
|
+ return req.msg('报名开始时间不能大于结束时间')
|
|
|
+ }
|
|
|
+ this.enlistStartTime = e.detail.value
|
|
|
+ },
|
|
|
+ enlistEndTimeChange(e){
|
|
|
+ if(this.enlistStartTime){
|
|
|
+ if(this.enlistStartTime>e.detail.value)
|
|
|
+ return req.msg('报名结束时间不能小于开始时间')
|
|
|
+ }
|
|
|
+ this.enlistEndTime = e.detail.value
|
|
|
+ },
|
|
|
+ startTimeChange(e){
|
|
|
+ if(this.endTime){
|
|
|
+ if(this.endTime<e.detail.value)
|
|
|
+ return req.msg('活动开始时间不能大于结束时间')
|
|
|
+ }
|
|
|
+ this.startTime = e.detail.value
|
|
|
+ },
|
|
|
+ endTimeChange(e){
|
|
|
+ if(this.startTime){
|
|
|
+ if(this.startTime>e.detail.value)
|
|
|
+ return req.msg('活动结束时间不能小于开始时间')
|
|
|
+ }
|
|
|
+ this.endTime = e.detail.value
|
|
|
+ },
|
|
|
+ chooseLocation() {
|
|
|
+ var tha = this;
|
|
|
+ uni.chooseLocation({
|
|
|
+ success: function(res) {
|
|
|
+ if (res.name) {
|
|
|
+ tha.address = res.name;
|
|
|
+ tha.reverseGeocoder(res);
|
|
|
+ console.log('地址数据》》》：', res);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ reverseGeocoder(location) {
|
|
|
+ // #ifdef H5
|
|
|
+ location = location.latitude + ',' + location.longitude
|
|
|
+ let url = 'https://apis.map.qq.com/ws/geocoder/v1/?address=';
|
|
|
+ this.$jsonp(url, {
|
|
|
+ key: req.public.mapLBSKEY,
|
|
|
+ location: location,
|
|
|
+ output: 'jsonp'
|
|
|
+ }).then(data => {
|
|
|
+ console.log('解析后的地址地址数据：', data);
|
|
|
+ data = data.result
|
|
|
+ this.region = [data.ad_info.province,data.ad_info.city,data.ad_info.district]
|
|
|
+ this.regionCode = [data.ad_info.adcode.substring(0,2)+'0000',data.ad_info.adcode.substring(0,4)+'00',data.ad_info.adcode]
|
|
|
+ this.longitude = data.ad_info.location.lng
|
|
|
+ this.latitude = data.ad_info.location.lat
|
|
|
+ }).catch(err => {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
+ // #endif
|
|
|
+ // #ifndef H5
|
|
|
+ QQMapWX.initMap();
|
|
|
+ QQMapWX.reverseGeocoder(location, data => {
|
|
|
+ console.log('解析后的地址地址数据：', data);
|
|
|
+
|
|
|
+ this.region = [data.ad_info.province,data.ad_info.city,data.ad_info.district]
|
|
|
+ this.regionCode = [data.ad_info.adcode.substring(0,2)+'0000',data.ad_info.adcode.substring(0,4)+'00',data.ad_info.adcode]
|
|
|
+ this.longitude = data.ad_info.location.lng
|
|
|
+ this.latitude = data.ad_info.location.lat
|
|
|
+ });
|
|
|
+ //#endif
|
|
|
+ },
|
|
|
+ bindRegionChange(event) {
|
|
|
+ console.log(event)
|
|
|
+ this.region = event.detail.value
|
|
|
+ this.regionCode = event.detail.code
|
|
|
+ },
|
|
|
+ submit(){
|
|
|
+ if(!this.pic){
|
|
|
+ return req.msg('请上传封面图')
|
|
|
+ }
|
|
|
+ if(this.fileList.length==0){
|
|
|
+ return req.msg('请上传活动轮播图')
|
|
|
+ }
|
|
|
+ if(!this.title){
|
|
|
+ return req.msg('请填写活动名称')
|
|
|
+ }
|
|
|
+ if(!this.brief){
|
|
|
+ return req.msg('请填写活动简介')
|
|
|
+ }
|
|
|
+ if(!this.text){
|
|
|
+ return req.msg('请填写活动详情')
|
|
|
+ }
|
|
|
+ if(!this.enlistStartTime){
|
|
|
+ return req.msg('请选择报名开始时间')
|
|
|
+ }
|
|
|
+ if(!this.enlistEndTime){
|
|
|
+ return req.msg('请选择报名结束时间')
|
|
|
+ }
|
|
|
+ if(!this.startTime){
|
|
|
+ return req.msg('请选择活动开始时间')
|
|
|
+ }
|
|
|
+ if(!this.endTime){
|
|
|
+ return req.msg('请选择活动结束时间')
|
|
|
+ }
|
|
|
+ if(!this.house){
|
|
|
+ return req.msg('请填写活动地址')
|
|
|
+ }
|
|
|
+ if(this.regionCode.length==0){
|
|
|
+ return req.msg('请选择活动所在城市')
|
|
|
+ }
|
|
|
+ if(!this.address){
|
|
|
+ return req.msg('请填写详细地址')
|
|
|
+ }
|
|
|
+
|
|
|
+ let dataP = {
|
|
|
+ pic:this.pic,
|
|
|
+ fileList:JSON.stringify(this.fileList.map(item=>{return {url:item}})),
|
|
|
+ title:this.title,
|
|
|
+ brief:this.brief,
|
|
|
+ text:this.text,
|
|
|
+ personLimit:this.personLimit,
|
|
|
+ enlistStartTime:this.enlistStartTime,
|
|
|
+ enlistEndTime:this.enlistEndTime,
|
|
|
+ startTime:this.startTime,
|
|
|
+ endTime:this.endTime,
|
|
|
+ house:this.house,
|
|
|
+ province:this.regionCode[0],
|
|
|
+ city:this.regionCode[1],
|
|
|
+ country:this.regionCode[2],
|
|
|
+ areaAdd:this.region.join(','),
|
|
|
+ address:this.address,
|
|
|
+ lng:this.longitude,
|
|
|
+ lat:this.latitude
|
|
|
+ }
|
|
|
+ let prices = [{
|
|
|
+ title: "VIP",
|
|
|
+ marketMoney: 0,
|
|
|
+ money: 0,
|
|
|
+ vipMoney: 0,
|
|
|
+ vipModels: [],
|
|
|
+ personCount: 1,
|
|
|
+ isDefault: 0
|
|
|
+ }]
|
|
|
+ dataP.prices = prices
|
|
|
+ let url = '/api/match/save'
|
|
|
+ if(this.id) {
|
|
|
+ dataP.id = this.id
|
|
|
+ url = '/api/match/update'
|
|
|
+ uni.showModal({
|
|
|
+ title:'提示',
|
|
|
+ content:'修改活动将重新审核，确定修改？',
|
|
|
+ success: (res) => {
|
|
|
+ if(res.confirm){
|
|
|
+ req.postRequest(url,dataP,res=>{
|
|
|
+ req.msg('创建成功')
|
|
|
+ let pages = getCurrentPages();
|
|
|
+ var prevPage = pages[pages.length - 2];
|
|
|
+ if (prevPage) {
|
|
|
+ prevPage.$vm.isLoad = true
|
|
|
+ prevPage.$vm.form.page = 1
|
|
|
+ prevPage.$vm.getPageList()
|
|
|
+ }
|
|
|
+ setTimeout(()=>{
|
|
|
+ uni.navigateBack()
|
|
|
+ },1000)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ req.postRequest(url,dataP,res=>{
|
|
|
+ req.msg('创建成功')
|
|
|
+ let pages = getCurrentPages();
|
|
|
+ var prevPage = pages[pages.length - 2];
|
|
|
+ if (prevPage) {
|
|
|
+ prevPage.$vm.isLoad = true
|
|
|
+ prevPage.$vm.form.page = 1
|
|
|
+ prevPage.$vm.getPageList()
|
|
|
+ }
|
|
|
+ setTimeout(()=>{
|
|
|
+ uni.navigateBack()
|
|
|
+ },1000)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ formatTime(date){
|
|
|
+ date = new Date(date.replace(/-/g, '/'))
|
|
|
+ return util.formatTime(date).t3
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ @import "./activityEdit.css";
|
|
|
+</style>
|
xhj
