注册流程

hdApp/src/ext.json

@@ -4,7 +4,7 @@
   "directCommit": false,
   "ext": {
     "account": 12362,
-    "apiHost": "https://api.shop.huaml.com",
+    "apiHost": "http://api.shop.huaml.com",
     "socketApiHost": "api.shop.huaml.com",
     "imgHost": "https://img.huaml.com",
     "name":"花美玲"

hdApp/src/pagesClient/components/htz-image-upload/htz-image-upload.vue

@@ -0,0 +1,640 @@
+<template>
+	<view class="htz-image-upload-list">
+		<view class="htz-image-upload-Item" v-for="(item,index) in uploadLists" :key="index">
+			<view class="htz-image-upload-Item-video" v-if="(!/.(gif|jpg|jpeg|png|gif|jpg|png)/i.test(item))">
+				<video :disabled="false" :controls="false" :src="item">
+					<cover-view class="htz-image-upload-Item-video-fixed" @click="previewVideo(item)"></cover-view>
+
+					<cover-view class="htz-image-upload-Item-del-cover" v-if="remove && previewVideoSrc==''"
+						@click="imgDel(index)">×</cover-view>
+
+				</video>
+
+			</view>
+
+			<image v-else :src="item" @click="imgPreview(item)"></image>
+
+			<view class="htz-image-upload-Item-del" v-if="remove" @click="imgDel(index)">×</view>
+		</view>
+		<view class="htz-image-upload-Item htz-image-upload-Item-add" v-if="uploadLists.length<max && add"
+			@click="chooseFile">
+			+
+		</view>
+		<view class="preview-full" v-if="previewVideoSrc!=''">
+			<video :autoplay="true" :src="previewVideoSrc" :show-fullscreen-btn="false">
+				<cover-view class="preview-full-close" @click="previewVideoClose"> × </cover-view>
+			</video>
+		</view>
+
+	</view>
+</template>
+
+<style>
+	.ceshi {
+		width: 100%;
+		height: 100%;
+		position: relative;
+		top: 0;
+		left: 0;
+		bottom: 0;
+		right: 0;
+		background-color: #FFFFFF;
+		color: #2C405A;
+		opacity: 0.5;
+		z-index: 100;
+	}
+</style>
+
+<script>
+	export default {
+		name: 'htz-image-upload',
+		props: {
+			max: { //展示图片最大值
+				type: Number,
+				default: 1,
+			},
+			chooseNum: { //选择图片数
+				type: Number,
+				default: 9,
+			},
+			name: { //发到后台的文件参数名
+				type: String,
+				default: 'file',
+			},
+			remove: { //是否展示删除按钮
+				type: Boolean,
+				default: true,
+			},
+			add: { //是否展示添加按钮
+				type: Boolean,
+				default: true,
+			},
+			disabled: { //是否禁用
+				type: Boolean,
+				default: false,
+			},
+			sourceType: { //选择照片来源 【ps：H5就别费劲了，设置了也没用。不是我说的，官方文档就这样！！！】
+				type: Array,
+				default: () => ['album', 'camera'],
+			},
+			action: { //上传地址
+				type: String,
+				default: '',
+			},
+			headers: { //上传的请求头部
+				type: Object,
+				default: () => {},
+			},
+			formData: { //HTTP 请求中其他额外的 form data
+				type: Object,
+				default: () => {},
+			},
+			compress: { //是否需要压缩
+				type: Boolean,
+				default: true,
+			},
+			quality: { //压缩质量，范围0～100
+				type: Number,
+				default: 80,
+			},
+			value: { //受控图片列表
+				type: Array,
+				default: () => [],
+			},
+			uploadSuccess: {
+				default: (res) => {
+					return {
+						success: false,
+						url: ''
+					}
+				},
+			},
+			mediaType: { //文件类型 image/video/all
+				type: String,
+				default: 'image',
+			},
+			maxDuration: { //拍摄视频最长拍摄时间，单位秒。最长支持 60 秒。 (只针对拍摄视频有用)
+				type: Number,
+				default: 60,
+			},
+			camera: { //'front'、'back'，默认'back'(只针对拍摄视频有用)
+				type: String,
+				default: 'back',
+			},
+
+		},
+		data() {
+			return {
+				uploadLists: [],
+				mediaTypeData: ['image', 'video', 'all'],
+				previewVideoSrc: '',
+			}
+		},
+		mounted: function() {
+			let that = this
+			this.$nextTick(function() {
+				this.uploadLists = this.value;
+				if (this.mediaTypeData.indexOf(this.mediaType) == -1) {
+					that.$util.confirmModal({content:'mediaType参数不正确'},() => {
+						//console.log('用户点击确定');
+					})
+				}
+			});
+			console.log(this.action)
+		},
+		watch: {
+			value(val, oldVal) {
+				//console.log('value',val, oldVal)
+				this.uploadLists = val;
+			},
+		},
+		methods: {
+			previewVideo(src) {
+				this.previewVideoSrc = src;
+				// this.previewVideoSrc =
+				// 	'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-fbd63a76-dc76-485c-b711-f79f2986daeb/ba804d82-860b-4d1a-a706-5a4c8ce137c3.mp4'
+			},
+			previewVideoClose() {
+				this.previewVideoSrc = ''
+				console.log('previewVideoClose', this.previewVideoSrc)
+			},
+			imgDel(index) {
+				let that = this
+				that.$util.confirmModal({content:'确认删除?'},() => {
+					// that.uploadLists.splice(index, 1)
+					// that.$emit("input", that.uploadLists);
+					// that.$emit("imgDelete", that.uploadLists);
+					let delUrl = that.uploadLists[index]
+					that.uploadLists.splice(index, 1)
+					that.$emit("input", that.uploadLists);
+					that.$emit("imgDelete", {
+						del: delUrl,
+						tempFilePaths: that.uploadLists,
+						index:index
+					});					
+				})
+			},
+			imgPreview(index) {
+
+				var imgData = this.uploadLists.filter(item => /.(gif|jpg|jpeg|png|gif|jpg|png)/i.test(item)) //只预览图片的
+				uni.previewImage({
+					urls: imgData,
+					current: index,
+					loop: true,
+				});
+
+
+			},
+			chooseFile() {
+				if (this.disabled) {
+					return false;
+				}
+				switch (this.mediaTypeData.indexOf(this.mediaType)) {
+					case 1: //视频
+						this.videoAdd();
+						break;
+					case 2: //全部
+						uni.showActionSheet({
+							itemList: ['相册', '视频'],
+							success: (res) => {
+								if (res.tapIndex == 1) {
+									this.videoAdd();
+								} else if (res.tapIndex == 0) {
+									this.imgAdd();
+								}
+							},
+							fail: (res) => {
+								console.log(res.errMsg);
+							}
+						});
+						break;
+					default: //图片
+						this.imgAdd();
+						break;
+				}
+
+
+				//if(this.mediaType=='image'){
+
+
+			},
+			videoAdd() {
+				console.log('videoAdd')
+				let nowNum = Math.abs(this.uploadLists.length - this.max);
+				let thisNum = (this.chooseNum > nowNum ? nowNum : this.chooseNum) //可选数量
+				uni.chooseVideo({
+					compressed: this.compress,
+					sourceType: this.sourceType,
+					camera: this.camera,
+					maxDuration: this.maxDuration,
+					success: (res) => {
+						console.log('videoAdd', res)
+						console.log(res.tempFilePath)
+						this.chooseSuccessMethod([res.tempFilePath], 1)
+						//this.imgUpload([res.tempFilePath]);
+						//console.log('tempFiles', res)
+						// if (this.action == '') { //未配置上传路径
+						// 	this.$emit("chooseSuccess", res.tempFilePaths);
+						// } else {
+						// 	if (this.compress && (res.tempFiles[0].size / 1024 > 1025)) { //设置了需要压缩 并且 文件大于1M，进行压缩上传
+						// 		this.imgCompress(res.tempFilePaths);
+						// 	} else {
+						// 		this.imgUpload(res.tempFilePaths);
+						// 	}
+						// }
+					}
+				});
+			},
+			imgAdd() {
+				console.log('imgAdd')
+				let nowNum = Math.abs(this.uploadLists.length - this.max);
+				let thisNum = (this.chooseNum > nowNum ? nowNum : this.chooseNum) //可选数量
+				console.log('nowNum', nowNum)
+				console.log('thisNum', thisNum)
+				// #ifdef APP-PLUS
+				if (this.sourceType.length > 1) {
+					uni.showActionSheet({
+						itemList: ['拍摄', '从手机相册选择'],
+						success: (res) => {
+							if (res.tapIndex == 1) {
+								this.appGallery(thisNum);
+							} else if (res.tapIndex == 0) {
+								this.appCamera();
+							}
+						},
+						fail: (res) => {
+							console.log(res.errMsg);
+						}
+					});
+				}
+				if (this.sourceType.length == 1 && this.sourceType.indexOf('album') > -1) {
+					this.appGallery(thisNum);
+				}
+
+				if (this.sourceType.length == 1 && this.sourceType.indexOf('camera') > -1) {
+					this.appCamera();
+				}
+				// #endif
+				//#ifndef APP-PLUS
+				uni.chooseImage({
+					count: thisNum,
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: this.sourceType,
+					success: (res) => {
+						this.chooseSuccessMethod(res.tempFilePaths, 0)
+						//console.log('tempFiles', res)
+						// if (this.action == '') { //未配置上传路径
+						// 	this.$emit("chooseSuccess", res.tempFilePaths);
+						// } else {
+						// 	if (this.compress && (res.tempFiles[0].size / 1024 > 1025)) { //设置了需要压缩 并且 文件大于1M，进行压缩上传
+						// 		this.imgCompress(res.tempFilePaths);
+						// 	} else {
+						// 		this.imgUpload(res.tempFilePaths);
+						// 	}
+						// }
+					}
+				});
+				// #endif
+			},
+			appCamera() {
+				var cmr = plus.camera.getCamera();
+				var res = cmr.supportedImageResolutions[0];
+				var fmt = cmr.supportedImageFormats[0];
+				//console.log("Resolution: " + res + ", Format: " + fmt);
+				cmr.captureImage((path) => {
+						//alert("Capture image success: " + path);
+						this.chooseSuccessMethod([path], 0)
+					},
+					(error) => {
+						//alert("Capture image failed: " + error.message);
+						console.log("Capture image failed: " + error.message)
+					}, {
+						resolution: res,
+						format: fmt
+					}
+				);
+			},
+			appGallery(maxNum) {
+				plus.gallery.pick((res) => {
+					this.chooseSuccessMethod(res.files, 0)
+				}, function(e) {
+					//console.log("取消选择图片");
+				}, {
+					filter: "image",
+					multiple: true,
+					maximum: maxNum
+				});
+			},
+			chooseSuccessMethod(filePaths, type) {
+				if (this.action == '') { //未配置上传路径
+					this.$emit("chooseSuccess", filePaths, type); //filePaths 路径 type 0 为图片 1为视频
+				} else {
+					if (type == 1) {
+						this.imgUpload(filePaths);
+					} else {
+						if (this.compress) { //设置了需要压缩
+							this.imgCompress(filePaths);
+						} else {
+							this.imgUpload(filePaths);
+						}
+					}
+
+				}
+			},
+			imgCompress(tempFilePaths) {
+				uni.showLoading({
+					title: '压缩中...'
+				});
+
+				let compressImgs = [];
+				let results = [];
+				tempFilePaths.forEach((item, index) => {
+					compressImgs.push(new Promise((resolve, reject) => {
+						// #ifndef H5
+						uni.compressImage({
+							src: item,
+							quality: this.quality,
+							success: res => {
+								//console.log('compressImage', res.tempFilePath)
+								results.push(res.tempFilePath);
+								resolve(res.tempFilePath);
+							},
+							fail: (err) => {
+								//console.log(err.errMsg);
+								reject(err);
+							},
+							complete: () => {
+								//uni.hideLoading();
+							}
+						})
+						// #endif
+						// #ifdef H5
+						this.canvasDataURL(item, {
+							quality: this.quality / 100
+						}, (base64Codes) => {
+							//this.imgUpload(base64Codes);
+							results.push(base64Codes);
+							resolve(base64Codes);
+						})
+						// #endif
+					}))
+				})
+				Promise.all(compressImgs) //执行所有需请求的接口
+					.then((results) => {
+						uni.hideLoading();
+						console.log('imgUpload', results)
+						this.imgUpload(results);
+					})
+					.catch((res, object) => {
+						uni.hideLoading();
+					});
+			},
+			imgUpload(tempFilePaths) {
+				// if (this.action == '') {
+				// 	uni.showToast({
+				// 		title: '未配置上传地址',
+				// 		icon: 'none',
+				// 		duration: 2000
+				// 	});
+				// 	return false;
+				// }
+				uni.showLoading({
+					title: '上传中'
+				});
+				console.log('imgUpload', tempFilePaths)
+				let uploadImgs = [];
+				tempFilePaths.forEach((item, index) => {
+					uploadImgs.push(new Promise((resolve, reject) => {
+						console.log(index, item)
+						const uploadTask = uni.uploadFile({
+							url: this.action, //仅为示例，非真实的接口地址
+							filePath: item,
+							name: this.name,
+							fileType: 'image',
+							formData: this.formData,
+							header: this.headers,
+							success: (uploadFileRes) => {
+								if (typeof this.uploadSuccess == 'function') {
+									if (this.uploadSuccess(uploadFileRes).success) {
+										this.value.push(this.uploadSuccess(uploadFileRes)
+											.url)
+										this.$emit("input", this.uploadLists);
+									}
+								}
+								resolve(uploadFileRes);
+								this.$emit("uploadSuccess", uploadFileRes);
+							},
+							fail: (err) => {
+								console.log(err);
+								//uni.hideLoading();
+								reject(err);
+								this.$emit("uploadFail", err);
+							},
+							complete: () => {
+								//uni.hideLoading();
+							}
+						});
+					}))
+				})
+				Promise.all(uploadImgs) //执行所有需请求的接口
+					.then((results) => {
+						uni.hideLoading();
+					})
+					.catch((res, object) => {
+						uni.hideLoading();
+						this.$emit("uploadFail", res);
+					});
+				// uploadTask.onProgressUpdate((res) => {
+				// 	//console.log('',)
+				// 	uni.showLoading({
+				// 		title: '上传中' + res.progress + '%'
+				// 	});
+				// 	if (res.progress == 100) {
+				// 		uni.hideLoading();
+				// 	}
+				// });
+			},
+			canvasDataURL(path, obj, callback) {
+				var img = new Image();
+				img.src = path;
+				img.onload = function() {
+					var that = this;
+					// 默认按比例压缩
+					var w = that.width,
+						h = that.height,
+						scale = w / h;
+					w = obj.width || w;
+					h = obj.height || (w / scale);
+					var quality = 0.8; // 默认图片质量为0.8
+					//生成canvas
+					var canvas = document.createElement('canvas');
+					var ctx = canvas.getContext('2d');
+					// 创建属性节点
+					var anw = document.createAttribute("width");
+					anw.nodeValue = w;
+					var anh = document.createAttribute("height");
+					anh.nodeValue = h;
+					canvas.setAttributeNode(anw);
+					canvas.setAttributeNode(anh);
+					ctx.drawImage(that, 0, 0, w, h);
+					// 图像质量
+					if (obj.quality && obj.quality <= 1 && obj.quality > 0) {
+						quality = obj.quality;
+					}
+					// quality值越小，所绘制出的图像越模糊
+					var base64 = canvas.toDataURL('image/jpeg', quality);
+					// 回调函数返回base64的值
+					callback(base64);
+				}
+			},
+		}
+	}
+</script>
+
+<style>
+	.preview-full {
+		position: fixed;
+		top: 0;
+		left: 0;
+		bottom: 0;
+		width: 100%;
+		height: 100%;
+		z-index: 1002;
+	}
+
+	.preview-full video {
+		width: 100%;
+		height: 100%;
+		z-index: 1002;
+	}
+
+	.preview-full-close {
+		position: fixed;
+		right: 32rpx;
+		top: 25rpx;
+		width: 80rpx;
+		height: 80rpx;
+		line-height: 60rpx;
+		text-align: center;
+		z-index: 1003;
+		/* 	background-color: #808080; */
+		color: #fff;
+		font-size: 65rpx;
+		font-weight: bold;
+		text-shadow: 1px 2px 5px rgb(0 0 0);
+	}
+
+
+
+	/* .preview-full-close-before,
+	.preview-full-close-after {
+		position: absolute;
+		top: 50%;
+		left: 50%;
+		content: '';
+		height: 60rpx;
+		margin-top: -30rpx;
+		width: 6rpx;
+		margin-left: -3rpx;
+		background-color: #FFFFFF;
+		z-index: 20000;
+	}
+
+	.preview-full-close-before {
+		transform: rotate(45deg);
+
+	}
+
+	.preview-full-close-after {
+		transform: rotate(-45deg);
+
+	} */
+
+	.htz-image-upload-list {
+		display: flex;
+		flex-wrap: wrap;
+	}
+
+	.htz-image-upload-Item {
+		width: 160rpx;
+		height: 160rpx;
+		margin: 13rpx;
+		border-radius: 10rpx;
+		position: relative;
+	}
+
+	.htz-image-upload-Item image {
+		width: 100%;
+		height: 100%;
+		border-radius: 10rpx;
+	}
+
+	.htz-image-upload-Item-video {
+		width: 100%;
+		height: 100%;
+		border-radius: 10rpx;
+		position: relative;
+
+	}
+
+	.htz-image-upload-Item-video-fixed {
+		position: absolute;
+		top: 0;
+		left: 0;
+		bottom: 0;
+		width: 100%;
+		height: 100%;
+		border-radius: 10rpx;
+		z-index: 996;
+
+	}
+
+	.htz-image-upload-Item video {
+		width: 100%;
+		height: 100%;
+		border-radius: 10rpx;
+
+	}
+
+	.htz-image-upload-Item-add {
+		font-size: 105rpx;
+		/* line-height: 160rpx; */
+		text-align: center;
+		border: 1px dashed #d9d9d9;
+		color: #d9d9d9;
+	}
+
+	.htz-image-upload-Item-del {
+		background-color: #f5222d;
+		font-size: 24rpx;
+		position: absolute;
+		width: 35rpx;
+		height: 35rpx;
+		line-height: 35rpx;
+		text-align: center;
+		top: 0;
+		right: 0;
+		z-index: 997;
+		color: #fff;
+	}
+
+	.htz-image-upload-Item-del-cover {
+		background-color: #f5222d;
+		font-size: 24rpx;
+		position: absolute;
+		width: 35rpx;
+		height: 35rpx;
+		text-align: center;
+		top: 0;
+		right: 0;
+		color: #fff;
+		/* #ifdef APP-PLUS */
+		line-height: 25rpx;
+		/* #endif */
+		/* #ifndef APP-PLUS */
+		line-height: 35rpx;
+		/* #endif */
+		z-index: 997;
+
+	}
+</style>

hdApp/src/pagesClient/official/apply.vue

@@ -1,149 +1,76 @@
 <template>
   <div class="app-content">
     <form @submit="formSubmit">
-      <div class="module-com">
-        <tui-list-cell class="line-cell" :hover="false">
+      <view class="module-com">
+        <tui-list-cell class="line-cell" :hover="false" >
           <div class="tui-title">花店名称</div>
-          <input
-            v-model="form.name"
-            placeholder-class="phcolor"
-            placeholder-style="color:#CCCCCC"
-            class="tui-input"
-            name="name"
-            placeholder="请输入名称"
-          />
+          <input v-model="form.name" type="text" placeholder-class="phcolor" placeholder-style="color:#CCCCCC" class="tui-input" name="name" placeholder="请输入名称" />
         </tui-list-cell>
-        <tui-list-cell
-          class="line-cell"
-          :hover="false"
-          :arrow="true"
-          @click="openAddres"
-        >
+        <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="openAddres" >
           <div class="tui-title">所在城市</div>
-          <div class="tui-input" v-if="form.province">
-            {{ form.province + "-" + form.city }}
-          </div>
-          <div class="tui-placeholder" v-else>请选择</div>
+          <div class="tui-input" v-if="form.province" >{{ form.province + '-' + form.city }}</div>
+          <div class="tui-placeholder" v-else >请选择</div>
         </tui-list-cell>
-        <tui-list-cell
-          class="line-cell"
-          :hover="false"
-          :arrow="true"
-          @click="selRegionFn"
-        >
-          <div class="tui-title">详细地址</div>
-          <div class="tui-input" v-if="form.address">{{ form.address }}</div>
-          <div class="tui-placeholder" v-else>请填写详细地址</div>
+        <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="selRegionFn" >
+          <div class="tui-title">所在地址</div>
+          <div class="tui-input" v-if="form.address" >{{ form.address }}</div>
+          <div class="tui-placeholder" v-else >详细地址</div>
         </tui-list-cell>
-        <tui-list-cell class="line-cell" :hover="false">
+        <tui-list-cell class="line-cell" :hover="false" >
           <div class="tui-title">楼号门牌</div>
-          <input
-            v-model="form.floor"
-            placeholder-class="phcolor"
-            placeholder-style="color:#CCCCCC"
-            class="tui-input"
-            name="floor"
-            placeholder="选填"
-          />
-        </tui-list-cell>
-        <!--
-        <tui-list-cell class="line-cell" :hover="false">
-          <div class="tui-title">花店头像</div>
-          <app-uploader @resultData="_resultData" :num="1" />
-        </tui-list-cell>
-        -->
-      </div>
-      <!-- 店长昵称 -->
-      <div class="module-com">
-        <AppBindInfo @bindInfo="bindInfo" nameTetx="昵称"> </AppBindInfo>
-      </div>
-      <!-- 手机号 -->
-      <!--
-      <div class="module-com">
-        <tui-list-cell
-          v-if="option.style == 1"
-          class="line-cell code-wrap"
-          :hover="false"
-        >
-          <div class="tui-title">主营业务</div>
-          <div>
-            <button
-              @click="changeMain(1)"
-              :class="[
-                'admin-button-com',
-                'mini-btn',
-                form.main == 1 ? 'blue' : 'default',
-              ]"
-            >
-              零售
-            </button>
-            <button
-              @click="changeMain(2)"
-              style="margin-left: 10upx"
-              :class="[
-                'admin-button-com',
-                'mini-btn',
-                form.main == 2 ? 'blue' : 'default',
-              ]"
-            >
-              培训
-            </button>
-          </div>
-        </tui-list-cell>
-        <tui-list-cell class="line-cell" :hover="false">
-          <div class="tui-title">营业执照编号</div>
-          <input
-            v-model="form.licenseNo"
-            placeholder-class="phcolor"
-            placeholder-style="color:#CCCCCC"
-            class="tui-input"
-            name="name"
-            placeholder="请输入营业执照编号"
-          />
-        </tui-list-cell>
-        <tui-list-cell class="line-cell" :hover="false">
-          <div class="tui-title">营业执照</div>
-          <app-uploader @resultData="resultData" ref="appUploader" :num="1" />
+          <input v-model="form.floor" type="text" placeholder-class="phcolor" placeholder-style="color:#CCCCCC" class="tui-input" name="floor" placeholder="选填" />
         </tui-list-cell>
-      </div>
-      -->
-      <!-- 推荐人 -->
-      <div
-        class="module-com recommend-wrap"
-        v-if="!$util.isEmpty(merchantData)"
-      >
+      </view>
+
+      <view class="module-com">
+        <view class="module-tit">
+          <span>门店照片</span>
+          <span class="app-color-3">（必填）</span>
+        </view>
+        <view class="module-det">
+          <htz-image-upload :max="1" :compress="true" v-model="currentImgData" :headers="headers" :quality="95"
+           @uploadSuccess="imgUploadSuccess" @imgDelete="imgDeleteFn" :action="uploadImgUrl">
+          </htz-image-upload>
+        </view>
+      </view>
+
+      <view class="module-com">
+          <tui-list-cell class="line-cell" :hover="false">
+              <div class="tui-title required">姓名</div>
+              <input v-model="form.adminName" type="text" placeholder-class="phcolor" placeholder-style="color:#CCCCCC" class="tui-input" name="adminName" placeholder="申请人姓名" />
+          </tui-list-cell>
+          <tui-list-cell class="line-cell" :hover="false">
+              <div class="tui-title required">手机号</div>
+              <input v-model="form.mobile" type="number" placeholder-class="phcolor" placeholder-style="color:#CCCCCC" class="tui-input" name="mobile" placeholder="申请人手机号" />
+          </tui-list-cell>
+
+          <tui-list-cell class="line-cell" :hover="false">
+              <div class="tui-title required">验证码</div>
+              <input v-model="form.authCode" type="number" style="width:330upx;" placeholder-class="phcolor" placeholder-style="color:#CCCCCC" class="tui-input" name="authCode" placeholder="请填写验证码" />
+              <button v-if="hasGet == false" class="admin-button-com blue middle" @click="requestAuthCode()">获取</button>
+              <button v-else class="admin-button-com default middle" >{{count}}</button>
+          </tui-list-cell>
+      </view>
+      <view class="module-com recommend-wrap" v-if="!$util.isEmpty(merchantData)" >
         <div class="recommend-tag">推荐人</div>
         <div class="recommend-det">
-          <image
-            style="width: 90upx; height: 90upx; border-radius: 42upx"
-            mode="scaleToFill"
-            :src="merchantData.logoUrl"
-            @error="imageError"
-          />
+          <image style="width:90upx;height:90upx;border-radius:42upx;" mode="scaleToFill" :src="merchantData.logoUrl" @error="imageError" />
           <div class="recommend-info">
             <div class="app-size-32">{{ merchantData.name }}</div>
             <div class="app-color-2"></div>
           </div>
         </div>
-      </div>
+      </view>
 
       <div class="btn-wrap">
-        <button class="admin-button-com blue big" formType="submit">
-          完成
-        </button>
+        <button class="admin-button-com blue big" formType="submit" >确认</button>
       </div>
+
       <!-- 选择地区 -->
-      <app-area-sel
-        :show.sync="showRegion"
-        @change="changeAreaFn"
-        :city="form.city"
-      />
+      <app-area-sel :show.sync="showRegion" @change="changeAreaFn" :city="form.city" />
       <!-- 省市联动 -->
-      <simple-address
-        ref="simpleAddress"
-        :pickerValueDefault="cityPickerValueDefault"
-        @onConfirm="onCityConfirm"
-      ></simple-address>
+      <simple-address ref="simpleAddress" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onCityConfirm" ></simple-address>
+
     </form>
   </div>
 </template>
@@ -154,12 +81,15 @@ import AppAreaSel from "@/components/app-area-sel";
 import SimpleAddress from "@/components/plugin/simple-address";
 import AppAvatarModule from "@/components/module/app-avatar";
 import AppUploader from "@/components/app-uploader";
-import AppBindInfo from "@/components/app-bind-info";
 const form = require("@/utils/formValidation.js");
-import { getIntroduce, applyRegister } from "@/api/official";
+import {getIntroduce,applyRegister} from "@/api/official";
+import {getAuthCode} from "@/api/apply";
+import { mapGetters } from "vuex"
+//图片上传插件来源：https://ext.dcloud.net.cn/plugin?id=2922 已改造，不能再升级 shish 20211228
+import htzImageUpload from '../components/htz-image-upload/htz-image-upload.vue'
 import { mapResolve } from "@/api/map";
 import util from '@/utils/util';
-
+import { APIHOST } from '@/config'
 export default {
   name: "apply-data",
   components: {
@@ -168,9 +98,9 @@ export default {
     SimpleAddress,
     AppAvatarModule,
     AppUploader,
-    AppBindInfo,
+    htzImageUpload
   },
-  data() {
+  data () {
     return {
       merchantData: {},
       form: {
@@ -180,158 +110,160 @@ export default {
         city: "",
         dist: "",
         address: "",
-        adminName: "",
+        adminName: '',
         main: 1,
         licenseNo: "",
         license: "",
         // floor: "",
         longitude: "",
         latitude: "",
-        logo: "",
-        showAddress:""
+        showAddress:"",
+        authCode:"",
+        cover:''
       },
       showRegion: false,
       // 省市联动
       regionData: [],
       cityPickerValueDefault: [0, 0],
-      // 验证码
-      isSend: 0,
-      countDown: 119,
-      timer: null,
       adminName: "",
+      logo: '',
+      hasGet:false,
+      count:120,
+      INT:false,
+      headers:{token:''},
+      currentImgData: [],
+      uploadImgUrl:APIHOST+'/upload/save-file'
     };
   },
-  onLoad() {},
-  onShow() {
-  	let self = this
-			uni.getLocation({
-				type: 'gcj02',
-        isHighAccuracy:true,
-				success: function (res) {
-					mapResolve({lat:res.latitude,long:res.longitude}).then((obj) => {
-
-            if(!util.isEmpty(obj.data)){
-
-              console.log(obj)
-              self.form.longitude=res.longitude,
-              self.form.latitude=res.latitude,
-              self.form.province = obj.data.province
-              self.form.city = obj.data.city
-              self.form.address = obj.data.address
-              self.form.showAddress = obj.data.showAddress
-
-              uni.showToast({
-                  title: '已自动填写地址',
-                  duration: 2500
-              });
-
-            }
+	computed:{
+		...mapGetters(["getLoginInfo"])
+	},
+  onLoad () {
+    const token = uni.getStorageSync('token')
+    this.headers.token = token
+  },
+  onUnload(){
+    clearInterval(this.INT)
+  },
+	onShow() {
+    
+		// let self = this
+		// uni.getLocation({
+		// 	type: 'wgs84',
+		// 	success: function (res) {
+		// 		mapResolve({lat:res.latitude,long:res.longitude}).then((obj) => {
+    //       if(!util.isEmpty(obj.data)){
+    //         console.log(obj)
+    //         self.form.longitude=res.longitude,
+    //         self.form.latitude=res.latitude,
+    //         self.form.province = obj.data.province
+    //         self.form.city = obj.data.city
+    //         self.form.address = obj.data.address
+    //         self.form.showAddress = obj.data.showAddress
+    //         uni.showToast({ title: '已自动填写地址', duration: 2500 })
+    //       }
+		// 		})
+		// 	}
+		// })
 
-					})
-					// console.log('当前位置的经度：' + res.longitude);
-					// console.log('当前位置的纬度：' + res.latitude);
-				}
-			});
-		},
+	},
   methods: {
-    //图片地址
-    resultData(val) {
-      this.form.license = val.shortUrl;
+    requestAuthCode(){
+      let that = this
+      let mobile = this.form.mobile
+      if(this.$util.checkMobile(mobile) == false){
+        this.$msg('请输入正确手机号')
+        return
+      }
+      getAuthCode({mobile}).then(res=>{
+        if(res.code == 1){
+          that.hasGet = true
+          that.count = 120
+          that.INT = setInterval(function(){
+            if(that.count <= 0){
+              clearInterval(that.INT)
+              that.hasGet = false
+              that.count = 120
+              return
+            }
+            that.count--
+          },1000)
+        }
+      })
     },
-    _resultData(val) {
-      console.log(val);
-      this.form.logo = val.shortUrl;
+    resultData (val) {
+      this.form.license = val.shortUrl
     },
-    changeMain(val) {
-      this.form.main = val;
+    _resultData (val) {
+      this.form.logo = val.shortUrl
     },
-    bindInfo(val) {
+    changeMain (val) {
+      this.form.main = val
+    },
+    bindInfo (val) {
       this.form.adminName = val.name;
-      this.form.mobile = val.mobile;
+      this.form.mobile = val.mobile
     },
-    init() {
-      this.getIntroduceInfo();
+    init () {
+      this._getMerchantDet()
     },
-    getIntroduceInfo() {
-      getIntroduce(this.option).then((res) => {
+    _getMerchantDet () {
+      getIntroduce(this.option).then(res => {
         this.merchantData = res.data.introduce
-      })
-    },
-    confirmFn() {
-      applyRegister({
-        fromGhsId:this.option.fromGhsId,
-        hdShopAdminId: this.option.hdShopAdminId,
-        ghsShopAdminId: this.option.ghsShopAdminId,
-        ...this.form,
-        style: this.option.style || 0,
-        from: this.option.from || 0,
-      }).then((res) => {
-        this.$util.pageTo({
-          url: "/pagesClient/official/result",
-          type: 2,
-          query: {
-            pagestatus: 3,
-          },
-        });
-      }).catch(err => {});
+      });
     },
     // 选择地址
-    selRegionFn() {
+    selRegionFn () {
       if (!this.form.city) {
-        this.$msg("请先选择城市！");
+        this.$msg("请先选择城市");
         return false;
       }
       this.showRegion = true;
     },
-    changeAreaFn(e) {
+    changeAreaFn (e) {
       this.form.address = e.title;
       this.form.showAddress = e.address;
       this.form.latitude = e.location.lat;
       this.form.longitude = e.location.lng;
-      this.form.dist = e.district;
+      this.form.dist = e.district
     },
     // 省市联动
-    openAddres() {
+    openAddres () {
       this.$refs.simpleAddress.open();
     },
-    onCityConfirm(e) {
+    onCityConfirm (e) {
       this.form.province = e.provinceName;
       this.form.city = e.cityName;
     },
-    // 表单验证
-    formSubmit(e) {
-      // 表单规则
+    imgUploadSuccess(res) {
+      var _res = JSON.parse(res.data)
+      if(_res.code == 1){
+        this.currentImgData.push(_res.data.smallUrl)
+        this.form.cover = _res.data.shortUrl
+      }
+    },
+    imgDeleteFn(res){
+      const index = res.index
+      this.form.cover.splice(index,1)
+    },
+    formSubmit (e) {
       let rules = [
-        {
-          name: "name",
-          rule: ["required"],
-          msg: ["请填写花店名称"]
-        },
-        {
-          name: "city",
-          rule: ["required"],
-          msg: ["请选择城市"]
-        },
-        {
-          name: "address",
-          rule: ["required"],
-          msg: ["请填写地址"]
-        },
-        {
-          name: "adminName",
-          rule: ["required"],
-          msg: ["请填写昵称"]
-        },
-        {
-          name: "mobile",
-          rule: ["required"],
-          msg: ["请填写手机号"]
-        }
+        { name: "name", rule: ["required"], msg: ["请填写名称"] },
+        { name: "city", rule: ["required"], msg: ["请选择城市"] },
+        { name: "address", rule: ["required"], msg: ["请填写地址"] },
+        { name: "adminName", rule: ["required"], msg: ["请填写姓名"] },
+        { name: "mobile", rule: ["required"], msg: ["请填写手机号"] }
       ];
       let formData = this.form;
       let checkRes = form.validation(formData, rules);
+
+      if(this.$util.isEmpty(this.form.cover)){
+        this.$msg('请上传照片')
+        return false
+      }
+
       if (!checkRes) {
-        uni.showLoading({title: '加载中',mask:true})
+        uni.showLoading({mask:true})
         setTimeout(() => {
           this.confirmFn()
         })
@@ -340,11 +272,28 @@ export default {
         this.$msg(checkRes);
       }
     },
+    confirmFn () {
+      applyRegister({
+        hdShopAdminId: this.option.hdShopAdminId,
+        ghsShopAdminId: this.option.ghsShopAdminId,
+        ...this.form,
+        style: this.option.style || 0,
+        from: this.option.from || 0
+      }).then(res => {
+        this.$util.pageTo({
+          url: "/pagesClient/official/result",
+          type: 2,
+          query: {
+            pagestatus: 3
+          }
+        });
+      });
+    }
   },
-  watch: {},
+  watch: {
+  }
 };
 </script>
-
 <style lang="scss" scoped>
 .module-com {
   margin-bottom: 20upx;
@@ -353,7 +302,7 @@ export default {
     padding: 20upx 18upx;
     font-size: 28upx;
     font-weight: 600;
-    border-bottom: 1px solid $borderColor;
+    border-bottom: 1upx solid $borderColor;
   }
   .module-det {
     padding: 0 30upx;
@@ -393,7 +342,7 @@ export default {
   .tui-code {
     width: 200upx;
     text-align: center;
-    border-left: 1px solid $borderColor;
+    border-left: 1upx solid $borderColor;
     color: $mainColor;
   }
 }
@@ -415,4 +364,4 @@ export default {
     }
   }
 }
-</style>
+</style>