Ci2Order.vue/App/pages/remind/manage/index.vue

<template>
	<view>
		<z-navbar :title="(type==0?'新建':'编辑')+'咨询'" back>
			<view slot="right" @click="submit">保存</view>
		</z-navbar>
		<w-picker mode="date" startYear="2000" endYear="2100" v-model="info.alertDate" :current="true" fields="day" @confirm="onConfirm($event)"
		 @cancel="onCancel" :disabled-after="false" ref="date"></w-picker>
		<w-picker mode="date" startYear="2000" endYear="2100" v-model="info.wantDate" :current="true" fields="day" @confirm="onConfirmWantDate($event)"
		 @cancel="onCancel" :disabled-after="false" ref="wantdate"></w-picker>
		<z-form :model="info" :rules="rules" ref="info">
			<z-form-item label="客户姓名" prop="customName">
				<image slot="icon" class="common_icon" src="../../../static/icon_person.png"></image>
				<z-input v-model="info.customName" placeholder="点击填写"></z-input>
			</z-form-item>
			<z-divider></z-divider>
			<z-form-item label="客户电话" prop="phone" showline>
				<image slot="icon" class="common_icon" src="../../../static/icon_tel.png"></image>
				<z-input type="number" v-model="info.phone" placeholder="点击填写"></z-input>
			</z-form-item>
			<z-form-item label="微信号" prop="wechatNo" showline>
				<image slot="icon" class="common_icon" src="../../../static/icon_weixin.png"></image>
				<z-input type="number" v-model="info.wechatNo" placeholder="点击填写"></z-input>
			</z-form-item>
			<z-form-item label="意向日期" prop="wantDate" arrow showline>
				<image slot="icon" class="common_icon" src="../../../static/icon_date.png"></image>
				<z-text v-model="info.wantDate" placeholder="选择意向日期" @click="choosewantDate"></z-text>
			</z-form-item>
			<z-form-item label="时间段" prop="wantBeginTime" showline>
				<image slot="icon" class="common_icon" src="../../../static/icon_time.png"></image>
				<view class="flex-n fac fje">
					<z-text v-model="info.wantBeginTime" placeholder="开始时间" @click.native="showTime1=true"></z-text>
					<view class="mlr-20">-</view>
					<z-text v-model="info.wantEndTime" placeholder="结束时间" @click.native="showTime2=true"></z-text>
				</view>
			</z-form-item>
			<z-time-select :visible.sync="showTime1" :step="30" v-model="info.wantBeginTime" start="07:00" :maxTime="info.wantEndTime"></z-time-select>
			<z-time-select :visible.sync="showTime2" :step="30" start="07:00" :minTime="info.wantBeginTime||'7:00'" v-model="info.wantEndTime"></z-time-select>

			<z-form-item label="意向数量" prop="userCount" showline>
				<image slot="icon" class="common_icon" src="../../../static/icon_num.png"></image>
				<z-input type="number" v-model="info.userCount" placeholder="点击填写"></z-input>
			</z-form-item>
			<z-form-item label="意向场地" prop="wantHouse" showline>
				<image slot="icon" class="common_icon" src="../../../static/icon_local.png"></image>
				<want-house multiple @checkedDetail="checkedWantHouseDetail" v-model="info.wantHouse" placeholder="选择意向场地"></want-house>
			</z-form-item>

			<z-form-item label="预算金额" prop="budgetStart" showline>
				<image slot="icon" class="common_icon" src="../../../static/icon_price.png"></image>
				<view class="flex-n fac">
					<z-input style="text-align: left;" type="number" v-model="info.budgetStart" placeholder="¥"></z-input>
					<view class="mlr-20">~</view>
					<z-input style="text-align: right;" type="number" v-model="info.budgetEnd" placeholder="¥"></z-input>
				</view>
			</z-form-item>
			<z-form-item label="意向度" prop="wantLevel" showline>
				<image slot="icon" class="common_icon" src="../../../static/icon_star.png"></image>
				<want-level v-model="info.wantLevel" placeholder="请选择意向度"></want-level>
			</z-form-item>
			<z-form-item label="顾客来源" prop="userFrom" showline>
				<image slot="icon" class="common_icon" src="../../../static/icon_phone.png"></image>
				<user-from v-model="info.userFrom" placeholder="选择客户来源" @changeDetail="changeUserFormDetail"></user-from>
			</z-form-item>
			<template v-if="info.wantDate&&new Date(info.wantDate).getTime()>=new Date($Date.getDayDate().date).getTime()">
				<z-divider></z-divider>
				<z-form-item height="100rpx" label="关闭提醒" showline>
					<switch :checked="switchAlert" @change="changeSwitchAlert" />
				</z-form-item>
				<z-form-item label="提醒时间" prop="alertDate" v-show="!switchAlert" arrow :required="!switchAlert" dynamic>
					<image slot="icon" class="common_icon" src="../../../static/icon_date.png"></image>
					<z-text v-model="info.alertDate" placeholder="选择提醒时间" @click="chooseDate"></z-text>
				</z-form-item>
			</template>
			<z-divider></z-divider>
			<z-form-item label="备注信息" prop="remark" labelPos="top">
				<textarea class="textarea" :value="info.remark" placeholder="请输入备注信息" maxlength="512" auto-height></textarea>
			</z-form-item>
		</z-form>
		
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	const app = getApp({
		allowDefault: true
	});
	import wantHouse from '../../component/wantHouse/wantHouse.vue';
	import wantLevel from '../../component/wantLevel/wantLevel.vue';
	import userFrom from '../../component/userFrom/userFrom.vue'
	export default {
		components: {
			wantLevel,
			wantHouse,
			userFrom
		},
		data() {
			var validatePhone = (rule, value, callback) => {
				if (this.info.phone && this.info.phone.length < 11 && this.info.phone.length > 0)
					return {
						state: false,
						message: '请输入11位有效的电话号'
					};
				else
					return true;
			};
			var validateAlertDate = (rule, value, callback) => {
				// time.getTime() > new Date(wantDate).getTime()
				if(!this.switchAlert){
					if (new Date(this.info.alertDate).getTime() > new Date(this.info.wantDate).getTime())
						return {
							state: false,
							message: '提醒日期不能大于意向日期'
						};
					else if (new Date(this.info.alertDate).getTime() < new Date(this.$Date.getDayDate().date).getTime()) {
						return {
							state: false,
							message: '设置的提醒日期不能小于当前日期'
						}
					}else{
						console.log('ok')
						return true;
					}
				}
				 else{
					console.log('ok')
					return true;
					}
					
			};
			var validateBudget = (rule, value, callback) => {
				if (this.info.budgetStart == '' && this.info.budgetEnd != '') {
					return {
						state: false,
						message: '请输入预算金额最小值'
					};
				} else if (this.info.budgetStart != '' && this.info.budgetEnd == '') {
					return {
						state: false,
						message: '请输入预算金额最大值'
					};
				} else {
					if (Number(this.info.budgetStart) > Number(this.info.budgetEnd)) {
						return {
							state: false,
							message: '预算金额最大值应大于最小值'
						};
					}
					return true;
				}
			};
			var validateWantTime = (rule, value, callback) => {
				if ((this.info.wantBeginTime == '' || !this.info.wantBeginTime) && this.info.wantEndTime) {
					return {
						state: false,
						message: '请选择开始时间'
					};
				} else if ((this.info.wantEndTime == '' || !this.info.wantEndTime) && this.info.wantBeginTime) {
					return {
						state: false,
						message: '请选择结束时间'
					};
				}
				return true;
			};
			return {
				id: '',
				type: 0,
				wantHouseDetail: [],
				userFromDetail: {},
				switchAlert: true,
				showTime1: false,
				showTime2: false,
				info: {
					customName: '',
					phone: '',
					wechatNo: '',
					wantDate: '',
					userCount: '',
					wantHouse: '',
					budgetStart: '',
					budgetEnd: '',
					wantLevel: '',
					userFrom: '',
					alertDate: '',
					wantBeginTime: '',
					wantEndTime: '',
					remark: ''
				},
				rules: {
					customName: [{
						required: true,
						message: ''
					}],
					phone: [{
						validator: validatePhone
					}],
					wantDate: [{
						required: true,
						message: ''
					}],
					userCount: [{
						required: true,
						message: ''
					}],
					wantHouse: [{
						required: true,
						message: ''
					}],
					budgetStart: [{
						validator: validateBudget
					}],
					wantBeginTime: [{
						validator: validateWantTime
					}],
					wantLevel: [{
						required: true,
						message: ''
					}],
					userFrom: [{
						required: true,
						message: ''
					}],
					alertDate: [{
						validator: validateAlertDate
					}]
				},
				askAlertDaysAfter: 0,
				alertDate: ''
			};
		},
		watch: {
			// 'info.wantDate'(newval, oldval) {
			// 	console.log(newval)
			// 	var wantDate = newval;

			// 	//默认提醒日期
			// 	var time = new Date(new Date(this.$Date.getDayDate().date).getTime() + this.askAlertDaysAfter * 24 * 60 * 60 * 1000)
			// 	console.log(time)
			// 	var month = time.getMonth() + 1,
			// 		day = time.getDate();
			// 	if (!this.switchAlert)
			// 		//默认提醒日期大于wantDate
			// 		if (time.getTime() > new Date(wantDate).getTime()) {
			// 			this.$set(this.info, 'alertDate', null);
			// 		} else {
			// 			this.$set(this.info, 'alertDate', time.getFullYear() + '-' + (month < 10 ? ('0' + month) : month) + '-' + (
			// 				day < 10 ? ('0' + day) : day))

			// 		}
			// 	this.alertDate = this.info.alertDate;
			// }
		},
	
		onLoad(option) {
			this.type = option.type;
			this.id = option.id;
			if (this.type == 1)
				this.getData(option.id);
		},
		mounted() {
			this.getaskalertTime();
		},
		methods: {
			
			selectError() {
				uni.showToast({
					title: '需大于开始时间' + this.info.wantBeginTime,
					icon: 'none'
				});
			},
			bindBeginTimeChange(e) {
				this.$set(this.info, 'wantBeginTime', e.target.value)
			},
			bindEndTimeChange(e) {
				this.$set(this.info, 'wantEndTime', e.target.value)
			},
			getaskalertTime() {
				console.log('storeId', uni.getStorageSync('storeId'))
				this.$axios.get('config/baseByStoreId/' + uni.getStorageSync('storeId')).then(res => {
					console.log('咨询后', res.data.askAlertDaysAfter, '天')
					console.log(res.data, res.data.orderAlertDaysBefore)
					this.askAlertDaysAfter = Number(res.data.askAlertDaysAfter) || 0;
				}).catch(err => {
					this.$refs.uToast.error(err.msg);
				})
			},
			getData(askId) {
				this.$axios.get('app/preUserAsk/findById/' + askId).then(res => {
					console.log(res)

					var info = res.data
					var wantHouse = [],
						wantHouse2 = [];

					for (var i = 0, len = info.wantHouse.length; i < len; i++) {
						if (info.wantHouse[i]) {
							wantHouse.push(info.wantHouse[i].houseId)
							wantHouse2.push({
								houseId: info.wantHouse[i].houseId,
								houseName: info.wantHouse[i].houseName
							})
						}
					}
					info.userFrom = info.customFromId;
					info.wantHouse = wantHouse;
					this.wantHouseDetail = wantHouse2;
					this.info = info;
					this.alertDate = info.alertDate;
				}).catch(err => {
					console.log(err)
					this.$refs.uToast.error(err.msg);
				})
			},
			changeSwitchAlert(e) {
				this.switchAlert = e.detail.value;
				if (this.switchAlert) {
					this.$set(this.info, 'alertDate', null)
				} else {
					this.$set(this.info, 'alertDate', this.alertDate)
				}
			},
			checkedWantHouseDetail(data) {
				var wantHouse = [];
				for (var i = 0, len = data.length; i < len; i++) {
					wantHouse.push({
						houseId: data[i].id,
						houseName: data[i].houseName
					})
				}
				console.log(wantHouse)
				this.wantHouseDetail = wantHouse;
			},
			changeUserFormDetail(data) {
				console.log(data)
				this.userFromDetail = data;
			},
			choosewantDate() {
				this.$refs.wantdate.show();
			},

			chooseDate() {
				this.$refs.date.show();
			},
			onConfirm(e) {
				this.$set(this.info, 'alertDate', e.value);
				this.alertDate = e.value;
			},
			onConfirmWantDate(e) {
				var wantDate = e.value;
				this.$set(this.info, 'wantDate', e.value)
				//默认提醒日期
				var time = new Date(new Date(this.$Date.getDayDate().date).getTime() + this.askAlertDaysAfter * 24 * 60 * 60 * 1000)
				console.log(time)
				var month = time.getMonth() + 1,
					day = time.getDate();
				if (!this.switchAlert) {

					//默认提醒日期大于wantDate
					if (time.getTime() > new Date(wantDate).getTime()) {
						this.$set(this.info, 'alertDate', null);
					} else {
						this.$set(this.info, 'alertDate', time.getFullYear() + '-' + (month < 10 ? ('0' + month) : month) + '-' + (
							day < 10 ? ('0' + day) : day))

					}
				}
				if (new Date(wantDate).getTime() < new Date(this.$Date.getDayDate().date).getTime()) {
					this.switchAlert = true;
					this.$set(this.info, 'alertDate', null);
				}
				this.alertDate = this.info.alertDate;

			},
			onCancel() {
				console.log(this.$refs.date.value, this.$refs.date.pickVal)
			},
			submit() {
				this.$refs.info.validate(val => {
					console.log(val)
					if (val) {
						if (this.type == 0) {
							this.addSubmit();
						} else {
							this.editSubmit();
						}
					} else {
						this.$refs.uToast.error('表单填写有误');
					}
				})
			},
			addSubmit() {
				var info = this.info;
				this.$axios.post('app/preUserAsk/saveAsk', {
					storeId: uni.getStorageSync('storeId'), //this.$root.getStorage('storeId')
					customName: info.customName, //客户名称
					phone: info.phone, //手机号
					wechatNo: info.wechatNo, //微信号
					userCount: info.userCount, //意向人数
					wantDate: info.wantDate, //意向日期
					wantBeginTime: info.wantBeginTime,
					wantEndTime: info.wantEndTime,
					alertDate: info.alertDate, //提醒日期
					customFromId: this.userFromDetail.id, //用户来源
					customFromName: this.userFromDetail.customFrom,
					budgetStart: info.budgetStart, //预期起
					budgetEnd: info.budgetEnd, //预期止
					wantLevel: info.wantLevel, //意向程度
					wantHouse: this.wantHouseDetail, //意向场地
					remark: info.remark, //备注
				}).then(res => {
					this.$refs.uToast.success('新增咨询成功！');
					uni.navigateBack({
						delta: 1
					});
				}).catch(err => {
					this.$refs.uToast.error(err.msg);
				})
			},
			editSubmit() {
				var info = this.info;
				this.$axios.post('app/preUserAsk/updateAsk', {
					storeId: '2', //this.$root.getStorage('storeId')
					id: this.id,
					customName: info.customName, //客户名称
					phone: info.phone, //手机号
					wechatNo: info.wechatNo, //微信号
					userCount: info.userCount, //意向人数
					wantDate: info.wantDate, //意向日期
					wantBeginTime: info.wantBeginTime,
					wantEndTime: info.wantEndTime,
					alertDate: info.alertDate, //提醒日期
					customFromId: this.userFromDetail.dicCode, //用户来源
					customFromName: this.userFromDetail.dicName,
					budgetStart: info.budgetStart, //预期起
					budgetEnd: info.budgetEnd, //预期止
					wantLevel: info.wantLevel, //意向程度
					wantHouse: this.wantHouseDetail, //意向场地
					remark: info.remark, //备注
				}).then(res => {
					this.$refs.uToast.success('新增咨询成功！');
					uni.navigateBack({
						delta: 1
					});
				}).catch(err => {
					this.$refs.uToast.error(err.msg);
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.order_package_manage {
		background: #0075FF;
		color: #0075FF;
		width: 34rpx;
		height: 34rpx;
	}

	.textarea {
		font-size: 28rpx;
		min-height: 80rpx;
		padding-bottom: 20rpx;
		width: 100%;
	}

	.common_icon {
		width: 58rpx;
		height: 58rpx;
		min-width: 58rpx;
		margin-right: 30rpx;
	}
</style>