<template>
	<view class="container">
		<form @submit="onSubmit">
			<view class="page-block">
				<view class="page-title-block">
					<view class="title">门店信息</view>
				</view>

				<view class="content">
					<view class="cell flex flex-y-center">
						<view class="title-block required">
							<text>所属门店</text>
						</view>
						<view class="desc">
							<picker mode="selector" :range="tableTypeList" range-key="title"
								@change="onTableTypeChange">
								<view>
									{{tableTypeActive}}
								</view>
							</picker>
						</view>
					</view>

					<view class="cell flex flex-y-center">
						<view class="title-block required">
							<text>真实姓名</text>
						</view>
						<view class="desc">
							<input type="text" :value="info.nickname" name="nickname" class="input-box" placeholder="请输入"
								placeholder-class="desc-placeholder">
						</view>
					</view>

					<view class="cell flex flex-y-center">
						<view class="title-block required">
							<text>登录账号</text>
						</view>
						<view class="desc">
							<input type="text" :value="info.name" name="name" class="input-box" placeholder="请输入"
								placeholder-class="desc-placeholder">
						</view>
					</view>

					<view class="cell flex flex-y-center">
						<view class="title-block required">
							<text>登录密码</text>
						</view>
						<view class="desc">
							<input type="text" name="password" class="input-box" placeholder="请输入"
								placeholder-class="desc-placeholder">
						</view>
					</view>

					<view class="cell flex flex-y-center">
						<view class="title-block required">
							<text>确认密码</text>
						</view>
						<view class="desc">
							<input type="text"  name="password2" class="input-box" placeholder="请输入"
								placeholder-class="desc-placeholder">
						</view>
					</view>
				</view>

				<!-- <view class="info-car">
					<view class="title-block">
						<view class="title">
							请上传LOGO
						</view>
					</view>
					<view class="content" @click="ChooseImage">
						<image :src="thumb?URL+thumb:'../static/images/icon_6.png'" class="logo-img"
							mode="">
						</image>
					</view>
				</view>
 -->
			</view>

			<view class="footer-bar">
				<view class="content flex flex-center" style="background: none;position: relative;">
					<button class="btn" hover-class="none" form-type="submit">
						立即提交
					</button>
				</view>
			</view>
		</form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				URL:getApp().globalData.URL,
				tableTypeList: [],
				tableTypeActive: "请选择",
				store_id: "",
				imgid: "",
				admin_id: "",
				id: "",
				info: {},thumb:"",
			}
		},
		onLoad(options) {
	
			this.admin_id = uni.getStorageSync("admin_id");
			this.shop_store_index();
			if (options.id) {
				this.id = options.id;
			}
		},
		methods: {
			
			onTableTypeChange(e) {
				console.log(e)
				this.tableTypeActive = this.tableTypeList[e.detail.value].title;
				this.store_id = this.tableTypeList[e.detail.value].id
			},

			ChooseImage(e) {
				let type = e.currentTarget.dataset.type;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: (res) => {
						console.log(res)
						res.tempFilePaths.forEach((v, i) => {
							this.Upload({
								url: "Smdcshop/upload",
								data: {
									url: v,
									type: "",
									token: "",
									admin_id: this.admin_id
								}
							}).then(res => {
								console.log(res, "res")
								this.imgid = res.id;
								this.thumb = res.src;
							}).catch(err => {
								uni.showToast({
									title: err.message,
									icon: 'none'
								})
							});
						})
					},
				});
			},

			shop_store_index() {
				this.request({
					url: 'Smdcshop/shop_store_index',
					data: {
						admin_id: this.admin_id,
					}
				}).then(res => {
					if (res.code == 200) {
						this.tableTypeList = res.data
						if(this.id){
							this.store_user_info(this.id);
						}
					}
				})
			},

			//获取详情
			store_user_info(id) {
				this.request({
					url: 'Smdcshop/store_user_info',
					data: {
						id: id
					}
				}).then(res => {
				
					if (res.code=="200") {
							console.log(res.data,this.tableTypeList,"res.data")
						this.info = res.data;
						this.thumb=res.data.thumb;
						for(let i of this.tableTypeList){
							console.log(i.id,res.data.store_id)
							if(i.id==res.data.store_id){
								console.log(i.title)
								this.tableTypeActive=i.title;
							}
						}
						this.store_id=res.data.store_id;
					}
				})
			},

			onSubmit(e) {
				let params = {
						store_id: this.store_id,
						admin_id: this.admin_id,
						thumb: this.imgid,
					},url,
					data = Object.assign(params, e.detail.value);
				console.log(data, "password")
				if (data.name == "") {
					uni.showToast({
						title: "请输入账号",
						icon: 'none'
					})
					return false
				} else if (!data.store_id) {
					uni.showToast({
						title: "请选择门店",
						icon: 'none'
					})
					return false
				} else if (!data.password) {
					uni.showToast({
						title: "请输入密码",
						icon: 'none'
					})
					return false
				}
				if (this.id) {
					//修改
					data.id = this.id;
					url = 'Smdcshop/store_user_update';
				} else {
					//新增
					url = 'Smdcshop/store_user_add';
				}
				this.request({
					url: url,
					data: data,
				}).then(res => {
					if (res.code == 200) {
						uni.showToast({
							title: res.message,
							icon: 'none'
						})
						setTimeout(() => {
							uni.navigateBack()
						}, 2000)
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: 'none'
					})
				});
			},
		}
	}
</script>

<style>
	@import url("../static/css/common.css");

	page {
		background-color: #F4F5F7;
	}

	.info-car {
		margin-top: 25rpx;
		background-color: #fff;
		padding: 0 25rpx;
	}

	.info-car .title-block {
		border-bottom: 1rpx solid #f5f5f5;
	}

	.info-car .title {
		height: 100rpx;
		line-height: 100rpx;
		font-size: 30rpx;
		color: #333;
		font-weight: 600;
	}

	.info-car .content {
		padding: 30rpx 0;
	}

	.info-car .input-box {
		font-size: 28rpx;
		color: #000;
	}

	.info-car .logo-img {
		display: block;
		width: 120rpx;
		height: 120rpx;
	}
</style>
