<template>
	<view class="container g_mt_16">
		<view class="form">
			<form class="form">
				<view class="cellBox">
					<view class="weui-cell g_border_e_b">
						<view class="weui-cell__hd"> 引导语 </view>
						<view class="weui-cell__bd">
							<input class="weui-input" type name="title" data-type="userName" v-model="contactInfo.title" placeholder="例如：详情咨询" placeholder-class="g_c_9" />
						</view>
					</view>
					<view class="weui-cell g_border_e_b">
						<view class="weui-cell__hd"> 称呼 </view>
						<view class="weui-cell__bd">
							<input class="weui-input" type="" name="userName" data-type="tel" v-model="contactInfo.userName" placeholder="例如：张三" placeholder-class="g_c_9" />
						</view>
					</view>
					<view class="weui-cell">
						<view class="weui-cell__hd"> 手机号 </view>
						<view class="weui-cell__bd">
							<input class="weui-input" type="number" name="tel" data-type="tel" v-model="contactInfo.tel" placeholder="请输入手机号" placeholder-class="g_c_9" />
						</view>
					</view>
				</view>
				<view class="g_mt_120" hover-class="none" hover-stop-propagation="false">
					<g-button btnText="保存" type="primary" @clickBtn="beforeFormSubmit"></g-button>
				</view>
				<view class="g_mt_16 g_fs_14" v-if="type == 'update'" @click="deleteContact" style="text-align: center; color: #576b95" hover-class="thover" hover-stop-propagation="false">删除联系人</view>
			</form>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			contactInfo: {},
			type: "",
		};
	},
	created() {},
	onLoad(options) {
		if (options.info) {
			console.log(JSON.parse(options.info));
			if (JSON.parse(options.info).title == "详情咨询" && !JSON.parse(options.info).index) {
				this.contactInfo = JSON.parse(options.info);
				this.type = "add";
			} else {
				this.contactInfo = JSON.parse(options.info);
				this.type = "update";
			}
		} else {
			this.type = "add";
		}
	},
	methods: {
		deleteContact() {
			let that = this;
			uni.showModal({
				title: "",
				content: "是否确认删除该联系人?",
				confirmColor: "#1890ff",
				success: function (res) {
					console.log(res);
					if (res.confirm) {
						that.G.Post(that.api.update_contact_cfg, { sourceJson: JSON.stringify(that.contactInfo), targetJson: "", type: "update" }, (res) => {
							uni.setStorageSync("apply-userinfo", { ...uni.getStorageSync("apply-userinfo"), noticeEndStr: res.noticeEndStr });
							console.log(res);
							uni.showToast({
								title: "删除成功",
								icon: "success",
								duration: 1500,
							});
							setTimeout(() => {
								uni.navigateBack({
									delta: 1,
								});
							}, 1500);
						});
					}
				},
			});
		},
		beforeFormSubmit(e) {
			console.log(e);
			let v = this.contactInfo;
			if (v.tel == "" || v.title == "" || v.userName == "") {
				uni.showToast({
					title: "请确保信息输入完整",
					icon: "none",
				});
			} else {
				console.log("full");
				this.addContent(v);
			}
		},
		addContent(value) {
			let that = this;
			let data, targetJson, sourceJson, type;
			if (this.type == "add") {
				targetJson = JSON.stringify(value);
				sourceJson = "";
				type = "add";
			} else {
				targetJson = JSON.stringify(value);
				sourceJson = JSON.stringify(this.contactInfo);
				type = "update";
			}
			data = {
				targetJson,
				sourceJson,
				type,
			};
			that.G.Post(that.api.update_contact_cfg, data, (res) => {
				uni.setStorageSync("apply-userinfo", { ...uni.getStorageSync("apply-userinfo"), noticeEndStr: res.noticeEndStr });
				uni.showToast({
					title: "保存成功",
					icon: "success",
					duration: 1500,
				});
				setTimeout(() => {
					uni.navigateBack({
						delta: 1,
					});
				}, 1500);
			});
		},
	},
};
</script>

<style>
page {
	background-color: #f5f5f5;
}
.container {
	padding: 10px;
	padding-top: 0;
}

.cellBox {
	border-radius: 8px;
	overflow: hidden;
	padding: 0 10px;
	background-color: #fff;
}
.weui-cell {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 56px;
	font-size: 16px;
	padding-left: 0;
	padding-right: 0;
}
.weui-cell__bd input {
	text-align: right;
}
</style>
