renshou/office/vote/vote.vue

<template>
	<view>
		<view class="con">
			<view class="title"><input v-model="voteTitle" maxlength="20" placeholder="请输入投票标题 (最多20个字）" placeholder-class="placeholder" /></view>
			<view class="time ddflex">
				<view class="label">截止时间</view>
				<picker mode="date" :value="endTime" @change="bindDateChange" class="fflex">
					<view class="picker" v-if="endTime">
						{{endTime}}
					</view>
					<view class="picker placeholder" v-else>
						请选择投票截止时间
					</view>
				</picker>
			</view>
			<view class="tits">*投票必须超过2个选项哦~</view>
			<view class="list">
				<view class="li ddflex" v-for="(item, index) in optionList" :key="index">
					<view class="fflex"><input v-model="item.name" maxlength="15" placeholder="请输入选项描述 (15字内)" placeholder-class="placeholder" class="ipt" /></view>
					<view class="del" @click="removeObj(index)"><image src="../static/images/tp_del.png"></image></view>
				</view>
			</view>
			<view class="add-btn" @click="addObj()">添加选项</view>
		</view>
		<view class="bot">
			<view class="no" @click="noVote()" v-if="pollId">不设置投票</view>
			<view class="complete" @click="completeVote()">完成</view>
		</view>
	</view>
</template>

<script>
const req = require('../../utils/request.js');
const QQMapWX = require("../../utils/qqmap.js");
export default {
	data() {
		return {
			voteTitle: '',
			endTime: '',
			pollId: '',
			optionList: [], //投票项
			optionListResut: [], //最终确认有值的投票项
			
			location: {},
			poiIndex: -1,
			poiList: [],
		};
	},
	onLoad(opt) {
		this.pollId = opt.pollId;
		if (!this.pollId) {
			for (var i = 0; i < 2; i++) {
				var obj = {
					name: ''
				};
				this.optionList.push(obj);
			}
		} else {
			let pages = getCurrentPages(); //获取所有页面栈实例列表
			let prevPage = pages[pages.length - 2]; //上一页页面实例
			var pollObj = prevPage.$vm.pollObj;
			if (pollObj) {
				this.voteTitle = pollObj.title;
				this.optionList = JSON.parse(pollObj.optionJson);
			}
		}
		
		QQMapWX.initMap();
		let location = {
			latitude: req.getStorage('loctionAddressMap').location.lat,
			longitude: req.getStorage('loctionAddressMap').location.lng
		}
		QQMapWX.reverseGeocoder(location, data => {
			this.poiList = data.pois;
			this.checkLocation(this.poiList[0],0)
		});
	},
	methods: {
		chooseLocation(){
			let that = this;
			uni.chooseLocation({//choosePoi不返回经纬度
				success: function (res) {
					console.log('位置名称：' , res);
					that.location = {
						poiName: res.name,
						poiAddress: res.address,
						poiLongitude: res.longitude,
						poiLatitude: res.latitude
					}
					that.reverseGeocoder(res);
				}
			});
		},
		reverseGeocoder(location) {
			QQMapWX.initMap();
			QQMapWX.reverseGeocoder(location, data => {
				this.location.poiRegionalism = data.ad_info.adcode.substring(0, 2) + "0000," + data.ad_info.adcode.substring(0, 4) +"00," + data.ad_info.adcode
				console.log('解析后的地址地址数据：', data,this.location.poiRegionalism);
			});
		},
		checkLocation(item,index){
			if(this.poiIndex == index) return false;
			this.poiIndex = index;
			this.location = {
				poiName: item.title,
				poiAddress: item.address,
				poiLongitude: item.location.lng,
				poiLatitude: item.location.lat,
				poiRegionalism: item.ad_info.adcode.substring(0, 2) + "0000," + item.ad_info.adcode.substring(0, 4) +"00," + item.ad_info.adcode
			}
		},
		
		//不设置投票
		noVote() {
			this.selectedBack('');
		},

		//完成投票
		completeVote() {
			this.getSaveVote();
		},

		addObj() {
			var obj = {
				name: ''
			};
			this.optionList.push(obj);
		},

		removeObj(indx) {
			if (this.optionList.length <= 2) {
				req.msg('须保留两个选项');
				return;
			}
			this.optionList.splice(indx, 1);
		},

		checkOptionListResut() {
			this.optionListResut = [];
			var list = this.optionList.filter(it => it.name);
			if (list && list.length > 0) {
				for (var i = 0; i < list.length; i++) {
					var obj = {
						code: i,
						name: list[i].name
					};
					this.optionListResut.push(obj);
				}
			}
			console.log('数据>>>>>>', this.optionListResut);
			return this.optionListResut.length;
		},
		bindDateChange: function(e) {
			this.endTime= e.detail.value
		},

		getSaveVote() {
			var tha = this;
			var dataP = {};
			if (this.pollId) {
				dataP.id = this.pollId;
			}
			if (!this.voteTitle) {
				req.msg('请输入投票标题');
				return;
			} else {
				dataP.title = this.voteTitle;
			}
			if(!this.endTime) return req.msg('请选择投票截止时间');
			dataP.endTime = this.endTime;
			if (this.checkOptionListResut() >= 2) {
				dataP.optionJson = JSON.stringify(this.optionListResut);
			} else {
				req.msg('投票必须超过2个选项');
				return;
			}
			
			// 位置
			if(this.location&&this.location.poiName){
				dataP.poiName = this.location.poiName;
				dataP.poiAddress = this.location.poiAddress;
				dataP.poiLongitude = this.location.poiLongitude;
				dataP.poiLatitude = this.location.poiLatitude;
				dataP.poiRegionalism = this.location.poiRegionalism
			}
			
			req.postRequest('/api/v3/poll/save', dataP, data => {
				req.msg('投票保存成功');
				setTimeout(() => {
					tha.selectedBack(data);
				}, 1500);
			});
		},

		selectedBack(obj) {
			let pages = getCurrentPages(); //获取所有页面栈实例列表
			let prevPage = pages[pages.length - 2]; //上一页页面实例
			prevPage.$vm.pollObj = obj; //修改上一页data里面的searchVal参数值为1211
			uni.navigateBack({
				//uni.navigateTo跳转的返回，默认1为返回上一级
				delta: 1
			});
		}
	}
};
</script>

<style>
@import './vote.css';
</style>