<template>
	<!-- style="background-image:url(../../static/beijing.png);" -->
	<view class="YmContent" :style="'min-height:'+height">
		<uni-popup ref="popup" type="center">
			<view style="background-color: white;border-radius: 10px;height: 180px;width: 300px;">
				<view class="inputview" style="display: flex;justify-content: center;">
					<input type="text" placeholder="请输入姓氏" maxlength="10"
						style="margin-top: 20px;border: 1px solid gray;margin-left: 5px;padding: 5px;border-radius: 10px;"
						v-model="popupname" />
				</view>
				<view class="radioview" style="width: 300px;margin: 0 auto;">
					<radio-group @change="radioChange" style="display: flex;justify-content: center;line-height: 80px;">
						<label class="uni-list-cell uni-list-cell-pd" style="display: flex;margin-right: 20px;">
							<view>
								<radio value="先生" :checked="true" style="transform: scale(0.7);" />
							</view>
							<view>先生</view>
						</label>
						<label class="uni-list-cell uni-list-cell-pd" style="display: flex;margin-left: 20px;">
							<view>
								<radio value="女士" :checked="false" style="transform: scale(0.7);" />
							</view>
							<view>女士</view>
						</label>
					</radio-group>
				</view>
				<view class="btnGroup" style="display: flex;justify-content: center;margin-top: 10px;">
					<view style="margin-right: 10px;">
						<button type="default" style="height: 20px;width: 100px; font-size: 12px;line-height: 20px;"
							@click="closed">取消</button>
					</view>
					<view style="margin-left: 10px;">
						<button type="primary" style="height: 20px;width: 100px; font-size: 12px;line-height: 20px;"
							@click="SubmitName">确定</button>
					</view>
				</view>
			</view>
		</uni-popup>
		<view style="header">
			<view style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;" v-if="false">
				<view style="padding-top: 17px;font-size: 12px;">类图</view>
				<view @click="chooseImg">
					<image :src="BASE_URL+model.beijintupian"
						style="width: 50px;height: 50px;border: 1px solid #EEEEEE;"></image>
				</view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;" >
				<view style="font-size: 12px;">姓名</view>
				<view style="font-size: 12px;"><input type="text" placeholder="姓名" style="text-align: right;"
						v-model="model.username" disabled/></view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;">
				<view style="font-size: 12px;">贵姓</view>
				<view style="font-size: 12px;"><input type="text" placeholder="贵姓" style="text-align: right;"
						v-model="model.full_name" @click="MessagePopup" /></view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;"
				v-if="false">
				<view style="font-size: 12px;">身份证号</view>
				<view style="font-size: 12px;"><input type="text" placeholder="身份证号" style="text-align: right;"
						v-model="model.ID_card" /></view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;" >
				<view style="font-size: 12px;">手机号</view>
				<view style="font-size: 12px;"><input type="text" placeholder="手机号" style="text-align: right;"
						v-model="model.phone" disabled/></view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;">
				<view style="font-size: 12px;">备用手机</view>
				<view style="font-size: 12px;"><input type="text" placeholder="备用手机号" style="text-align: right;"
						v-model="model.updphone" maxlength="11" /></view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;"v-if="false">
				<view style="font-size: 12px;">性别</view>
				<view style="font-size: 12px;">
					<!-- <input type="text" placeholder="性别" style="text-align: right;" v-model="model.sex" /> -->
					<picker :value="index" :range="array" @change="bindPickerChange">
						<view class="uni-input">{{array[index]}}</view>
					</picker>
				</view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;" v-if="false">
				<view style="font-size: 12px;" >地址</view>
				<view style="font-size: 12px;"><input type="text" placeholder="地址" style="text-align: right;"
						v-model="model.address" /></view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;" v-if="false">
				<view style="font-size: 12px;" >生日</view>
				<view style="font-size: 12px;">
					<!-- <input type="text" placeholder="生日" style="text-align: right;" v-model="model.birthday" /> -->
					<picker mode="date" :value="date" @change="bindDateChange">
						<view class="uni-input">{{date}}</view>
					</picker>
				</view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;" v-if="false">
				<view style="font-size: 12px;" >备注</view>
				<view style="font-size: 12px;"><input type="text" placeholder="备注" style="text-align: right;"
						v-model="model.remark" /></view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;"  v-if="false">
				<view style="font-size: 12px;">类型</view>
				<view style="font-size: 12px;"><input type="text" placeholder="类型" style="text-align: right;"
						v-model="typename" disabled />
				</view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;" v-if="false">
				<view style="font-size: 12px;" >状态</view>
				<view style="font-size: 12px;"><input type="text" placeholder="状态" style="text-align: right;"
						:value="model.status==0?'正常':'异常'" disabled /></view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;" v-if="false">
				<view style="font-size: 12px;">注册时间</view>
				<view style="font-size: 12px;"><input type="text" placeholder="注册时间" style="text-align: right;"
						v-model="model.add_time" disabled />
				</view>
			</view>
			<view
				style="display: flex;justify-content: space-between;border-bottom:1px solid #EEEEEE;   padding: 15px 0px 15px 0px;" v-if="false">
				<view style="font-size: 12px;">修改时间</view>
				<view style="font-size: 12px;"><input type="text" placeholder="修改时间" style="text-align: right;"
						v-model="model.update_time" disabled />
				</view>
			</view>
			<view style="margin-top: 10px;">
				<button type="primary" @click="Submit">提交</button>
			</view>
		</view>
	</view>
	</view>
</template>

<script>
	import BASE_URL from '../../common/config.js'
	import utils from '../../service/utils.js'
	export default {
		data() {

			return {
				BASE_URL,
				date: '',
				array: ['男', '女'],
				index: 0,
				height: '',
				popupname: '',
				model: {
					"ParentUserId": 0,
					"InviteeUserId": 0,
					"beijintupian": "",
					"birthday": "",
					"ID_card": "",
					"address": "",
					"id": 0,
					"username": "",
					"password": "",
					"author": "",
					"status": "",
					"type": 0,
					"full_name": "先生",
					"add_time": "2022-01-05T12:25:15.341Z",
					"update_time": "2022-01-05T12:25:15.341Z",
					"remark": "",
					"avatar": "",
					"phone": "",
					"updphone": "",
					"openid": "",
					"sex": "0",
					"balance": 0
				},
				typename: ''
			}
		},
		onLoad() {
			uni.getSystemInfo({
				success: (res) => {
					console.log(res)
					this.height = res.windowHeight + 'px'
				}
			})
		},
		onShow() {
			this.GetUserInfo()
		},
		methods: {
			closed() {
				this.$refs.popup.close('center')
			},
			// 提交姓名
			SubmitName() {
				if (this.popupname == '') {
					uni.showToast({
						title: '请输入姓氏',
						icon: 'none'
					})
					return
				} else {
					this.model.full_name = this.popupname + this.model.full_name
				}
				this.$refs.popup.close('center')
			},
			// 选择先生女士
			radioChange(e) {
				console.log('e', e)
			
				this.model.full_name = e.detail.value
				console.log('数据', this.model.full_name)
			},

			// 先生女士形式
			MessagePopup() {
				this.model.full_name = '先生'
				this.$refs.popup.open('center')
			},
			// 缓存读取用户信息
			GetUserInfo() {
				let jsonstorage = uni.getStorageSync('userinfo').data
				console.log(jsonstorage)
				this.model.id = jsonstorage.id
				this.model.ParentUserId = jsonstorage.ParentUserId
				this.model.InviteeUserId = jsonstorage.InviteeUserId
				this.model.author = jsonstorage.author
				this.model.avatar = jsonstorage.avatar
				this.model.balance = jsonstorage.balance
				this.model.openid = jsonstorage.openid
				this.model.beijintupian = jsonstorage.beijintupian
				this.model.username = jsonstorage.username
				this.model.full_name=jsonstorage.full_name
				this.model.ID_card = jsonstorage.ID_card
				this.model.phone = jsonstorage.phone
				this.model.updphone = jsonstorage.updphone
				if (jsonstorage.sex != null) {
					this.model.sex = jsonstorage.sex
					if (jsonstorage.sex == 0) {
						// 男
						this.index = 0
					} else {
						// 女
						this.index = 1
					}
				}
				this.model.address = jsonstorage.address
				if (jsonstorage.birthday != null) {
					this.model.birthday = jsonstorage.birthday
					this.date = jsonstorage.birthday
				} else {
					this.model.birthday = this.date = utils.formatTime(new Date(), "yyyy-MM-dd")
				}
				this.model.remark = jsonstorage.remark
				this.model.type = jsonstorage.type
				if (this.model.type == 0) {
					this.typename = '超级管理员'
				} else if (this.model.type == 1) {
					this.typename = '管理员'
				} else if (this.model.type == 2) {
					this.typename = '普通用户'
				} else if (this.model.type == 3) {
					this.typename = '销售专员'
				} else if (this.model.type == 4) {
					this.typename = '销售经理'
				}
				this.model.status = jsonstorage.status
				this.model.add_time = utils.formatTime(jsonstorage.add_time, "yyyy-MM-dd")
				this.model.update_time = utils.formatTime(jsonstorage.update_time, "yyyy-MM-dd")

			},
			// 选择头像图片
			chooseImg() {
				let _that = this
				uni.chooseImage({
					count: 1,
					sourceType: ['album'],
					success(e) {
						console.log('返回', e)
						const uploadTask = uni.uploadFile({
							// http://localhost:8031/api/Upload/upload
							url: 'https://shangten.yiqituancity.com/api/Upload/upload',
							filePath: e.tempFilePaths[0],
							name: 'file',
							formData: {
								'user': 'test'
							},
							success: function(uploadFileRes) {
								console.log('uplodt', uploadFileRes)
								let json = JSON.parse(uploadFileRes.data)
								_that.model.beijintupian = json.data.data.Uri
								console.log('背景图', _that.model.beijintupian)
							}
						});
					}
				})
			},

			bindDateChange: function(e) {
				this.date = e.target.value
				this.model.birthday = e.target.value
			},
			bindPickerChange: function(e) {
				this.index = e.target.value
				// 0男  1女
				this.model.sex = this.index
				console.log('mdoel', this.model.sex)
			},

			Submit() {
				// 提交数据修改
				this.API.Save(this.model).then(res => {
					console.log('res', res)
					console.log('modelaaaaaa', this.model)
					if (res.data.code == 200) {
						uni.showToast({
							title: '保存成功',
							icon: 'success'
						})
						let storagedata = uni.getStorageSync('userinfo')
						storagedata.data = res.data.data
						uni.setStorageSync('userinfo', storagedata)
						setTimeout(() => {
							uni.navigateBack({})
						}, 1000)

					} else {
						uni.showToast({
							title: res.data.message,
							icon: 'none'
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.YmContent {
		margin: 10px;
	}
</style>
