youngee_c_web_v2/pages/tasksquare/bindinfo.vue

<template>
	<view style="position: relative;">
		<!-- 胶囊 -->
		<mvBar :mysNavConfig="mysNavConfig"></mvBar>
		<view class="home" style="padding-top: 180rpx;">
			<view style="margin: 0 20rpx;">
				<uni-forms :rules="rules" :value="formData" ref="form" validate-trigger="bind"
					err-show-type="undertext">
					<view class="title">
						<p>个人资料</p>
					</view>
					<uni-forms-item name="age" label="年龄区间">
						<picker @change="bindPickerChange" :value="index" :range="array"
							range-key="age_bracket_discribe">
							<view>{{ Xage }}</view>
						</picker>
					</uni-forms-item>
					<uni-forms-item name="skintype" label="国籍">
						<picker @change="bindPickerChange1" :value="index1" :range="array1" range-key="name">
							<view>{{ array1[index1].name }}</view>
						</picker>
					</uni-forms-item>
					<uni-forms-item name="vregion" label="探店地区">
						<picker class="picker" mode="multiSelector" :range="region" range-key="name"
							:value="regionIndex" @change="pickerChange" @columnchange="pickerColumnchange">
							<view class="pbox" :class="{'pbox_hover':regionStr != '请选择省市区'}">
								<view>{{regionStr}}</view>
								<text class="iconfont icon-you"></text>
							</view>
						</picker>
					</uni-forms-item>
					<uni-forms-item name="phone" required label="联系电话">
						<uni-easyinput type="number" maxlength="11" :inputBorder="true" v-model="formData.phone"
							placeholder="请输入联系电话">
						</uni-easyinput>
					</uni-forms-item>

					<view class="line"></view>

					<view class="title">
						<p>收货地址</p>
					</view>

					<uni-forms-item name="name" required label="收件人">
						<uni-easyinput type="text" :inputBorder="true" v-model="formData.name" placeholder="请输入收件人">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item name="tel" required label="联系电话">
						<uni-easyinput type="number" maxlength="11" :inputBorder="true" v-model="formData.tel"
							placeholder="请输入联系电话">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item name="fregion" required label="所在地区">
						<picker class="picker" mode="multiSelector" :range="region" range-key="name"
							:value="regionIndex1" @change="pickerChange1" @columnchange="pickerColumnchange1">
							<view class="pbox" :class="{'pbox_hover':regionStr1 != '请选择省市区'}">
								<view>{{regionStr1}}</view>
								<text class="iconfont icon-you"></text>
							</view>
						</picker>
					</uni-forms-item>
					<uni-forms-item name="detailregion" required label="详细地址">
						<uni-easyinput type="text" :inputBorder="true" v-model="formData.detailregion"
							placeholder="请输入详细地址(省/市/县/镇/)">
						</uni-easyinput>
					</uni-forms-item>
					<view class="setdeault">
						<view class="setdeault-text">设为默认收货地址</view>
						<switch style='zoom:.8;' @change="setDefault" />
					</view>

					<view class="line"></view>

					<view class="title">
						<p>{{platform.platform_name}}账号</p>
					</view>

					<uni-forms-item name="nickname" required label="昵称">
						<uni-easyinput type="text" v-model="formData.platform_nickname" placeholder="请填写账号昵称">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item name="numberfans" required label="粉丝数">
						<uni-easyinput type="number" v-model="formData.fans_count" placeholder="请填写粉丝数量">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item name="home_link" required label=" " label-width='10'>
						<uni-easyinput class="home-link" type="text" v-model="formData.home_page_url"
							placeholder="请填写个人主页链接">
						</uni-easyinput>
					</uni-forms-item>
					<view style="margin-top: 40rpx;">
						<uni-forms-item name="home_img" required label="主页截图">
							<htz-image-upload :max="1" mediaType="image" name="file" :chooseNum="1" v-model="imageData"
								@chooseSuccess="ceshiChooseSuccess">
							</htz-image-upload>
						</uni-forms-item>
					</view>
				</uni-forms>
			</view>
		</view>
		<button class="btn1" @click="submitForm('form')">保存</button>

	</view>
</template>

<script>
	import region from '@/components/pca-code.json';
	import mvBar from "@/components/mys_navBar/mysNavBar";
	import htzImageUpload from '@/components/htz-image-upload/htz-image-upload.vue';
	import getPolicyEncode from '@/components/obs/getPolicy.js';
	import getSignature from '@/components/obs/GetSignature.js';
	export default {
		components: {
			mvBar,
			htzImageUpload,
		},
		data() {
			return {
				address: [],
				accountId: '',
				platform: {
					platform_id: '',
					platform_name: '',
					platform_icon: '',
				},
				isBind: true,
				imageData: [],
				ismodify: '',
				// 原数组
				oldRegion: region,
				// 处理后的数组
				region: [
					[],
					[],
					[]
				],
				// 选择省市区的下标Index  传则默认选中传递的
				regionIndex: [0, 0, 0],
				regionIndex1: [0, 0, 0],
				// 省市区字符串
				regionStr: '请选择省市区',
				regionStr1: '请选择省市区',
				formData: {
					age: '',
					nationality: '',
					phone: '',
					visitStoreRegion: '',
					name: '',
					tel: '',
					detailregion: '',
					fregion: '',
					setdefault: false,
					platform_nickname: '',
					fans_count: '',
					home_page_url: '',
				},
				index: 0,
				index1: 0,
				Xage: '请选择',
				Xskintype: '请选择',
				array: [{
					age_bracket_discribe: '请选择',
					age_aid: 0
				}, {
					age_bracket_discribe: '0~18',
					age_aid: 1
				}, {
					age_bracket_discribe: '18~25',
					age_aid: 2
				}, {
					age_bracket_discribe: '26~30',
					age_aid: 3
				}, {
					age_bracket_discribe: '30~40',
					age_aid: 4
				}, {
					age_bracket_discribe: '40+',
					age_aid: 5
				}],
				array1: [{
					name: '请选择',
					id: 0
				}, {
					name: '中国',
					id: 1
				}, {
					name: '外国',
					id: 2
				}],
				data: {},
				show: false,
				rules: {
					phone: {
						rules: [{
							required: true,
							errorMessage: '请输入联系电话'
						}, ]
					},
					detailregion: {
						rules: [{
							required: true,
							errorMessage: '请输入详细地址'
						}, ]
					},
					name: {
						rules: [{
							required: true,
							errorMessage: '请输入收件人'
						}, ]
					},
					tel: {
						rules: [{
							required: true,
							errorMessage: '请输入联系电话',
						}, ]
					},
					fregion: {
						rules: [{
							required: true,
							errorMessage: '请选择所在地区'
						}, ]
					},
					nickname: {
						rules: [{
							required: true,
							errorMessage: '请输入昵称'
						}, ]
					},
					numberfans: {
						rules: [{
							required: true,
							errorMessage: '请输入粉丝数'
						}, ]
					},
					home_link: {
						rules: [{
							required: true,
							errorMessage: '请输入主页链接'
						}, ]
					},
					home_img: {
						rules: [{
							required: true,
							errorMessage: '请选择主页截图'
						}, ]
					},
				},

				mysNavConfig: {
					/* 开启单页显示首页图标 */
					isHome: true,
					/* 固定导航  */
					navFixed: true,
					/* 标题 （屏幕中心居中 两边图标中心居中使用slot center1） */
					navTitle: {
						text: "我的信息",
						color: "",
						fontSize: "32rpx", // px upx rpx
						fontWeight: "normal", // 100 - 700
					},
					btnType: "type2",
					onLeftClick: '',
					/* type2 按钮 */
					type2Config: {
						// 左图标
						leftPath: "/static/img/png2.png",
						// 右图标
						rightPath: "/static/img/png4.png",
						// 圆角
						radius: "40rpx",
					},
				},

			}
		},
		onReady() {
			this.$refs.form.setRules(this.rules)
		},
		onShow() {
			this.getDefaultAddress()
			this.getlist()
		},
		onLoad(options) {
			this.platform.platform_id = parseInt(options.platform_id)
			if (options.account_id) {
				this.accountId = parseInt(options.account_id)
				this.isBind = false
			}
		},
		methods: {
			// 信息表
			getlist() {
				this.$https.get('/youngee/c/g/get-info-tables')
					.then(res => {
						console.log(res)
						this.array = res.data.data.AgeBracket

						let list = res.data.data.ThirdPlatform
						for (var i = 0; i < list.length; ++i) {
							if (list[i].id == this.platform.platform_id) {
								this.platform.platform_icon = list[i].platform_icon
								this.platform.platform_name = list[i].platform_name
							}
						}
						this.getlist1()
						this.getaccount()
					})
			},
			// 达人详细信息表
			getlist1() {
				this.$https.get('/youngee/c/t/g/get-talent-info')
					.then(res => {
						console.log(res)
						if (res.data.data.talent_wx_number !== null) {
							if (res.data.data.talent_age_bracket !== 0) {
								for (var i = 0; i < this.array.length; i++) {
									if (this.array[i].age_aid == res.data.data.talent_age_bracket) {
										this.Xage = this.array[i].age_bracket_discribe
									}
									this.formData.age = res.data.data.talent_age_bracket
								}
							}
							if (res.data.data.talent_nationality !== 0) {
								this.index1 = res.data.data.talent_nationality
								this.formData.nationality = res.data.data.talent_nationality
							}
							if (res.data.data.visit_store_region !== 0) {

								let a = res.data.data.visit_store_region.toString().slice(0, 2)
								let b = res.data.data.visit_store_region.toString().slice(0, 4)
								let c = 0
								for (var i = 0; i < region.length; i++) {
									if (region[i].code == a) {
										a = region[i].name
										for (var j = 0; j < region[i].children.length; j++) {
											if (region[i].children[j].code == b) {
												b = region[i].children[j].name
												for (var o = 0; o < region[i].children[j].children
													.length; o++) {
													if (region[i].children[j].children[o].code == res.data.data
														.visit_store_region) {
														c = region[i].children[j].children[o].name
													}
												}
											}

										}
									}
								}
								this.regionStr = a + ' ' + b + ' ' + c
								this.formData.visitStoreRegion = res.data.data.visit_store_region
							}
							this.formData.phone = res.data.data.talent_phone_number
						}
					})
			},
			getaccount() {
				console.log(this.isBind)
				if (!this.isBind) {
					this.$https.get('/youngee/c/t/g/get-talent-account')
						.then(res => {
							console.log(res)
							if (res.data.code !== -3) {
								this.account = res.data.data
								for (var i = 0; i < this.account.length; i++) {
									if (this.platform.platform_id == this.account[i].platform_id) {
										this.formData.platform_nickname = this.account[i].platform_nickname
										this.formData.fans_count = this.account[i].fans_count
										this.formData.home_page_url = this.account[i].home_page_url
										this.imageData.push(this.account[i].home_page_capture_url);
									}
								}
							}
						})
				}
			},
			setDefault(e) {
				console.log(e.detail.value)
				if (e.detail.value)
					this.formData.setdefault = 1
				else
					this.formData.setdefault = 0
			},
			getDefaultAddress() {
				this.$https.get('/youngee/c/t/g/get-talent-default-address').then(res => {

					this.formData.name = res.data.data.receiver_name
					this.formData.tel = res.data.data.phone_number
					this.formData.detailregion = res.data.data.detail_addr
					this.formData.fregion = res.data.data.region_code
					console.log("111")
					console.log(this.formData)
					let a = res.data.data.region_code.toString().slice(0, 2)
					let b = res.data.data.region_code.toString().slice(0, 4)
					let c = 0
					for (var i = 0; i < region.length; i++) {
						if (region[i].code == a) {
							a = region[i].name
							for (var j = 0; j < region[i].children.length; j++) {
								if (region[i].children[j].code == b) {
									b = region[i].children[j].name
									for (var o = 0; o < region[i].children[j].children.length; o++) {
										if (region[i].children[j].children[o].code == res.data.data.region_code) {
											c = region[i].children[j].children[o].name
										}
									}
								}

							}
						}
					}
					this.regionStr1 = a + ' ' + b + ' ' + c
				})
			},

			/**
			 * 手动提交
			 * @param {Object} form
			 */
			submitForm(form) {
				// console.log(this.formData);
				this.$refs.form.validate().then(res => {

					const iphoneReg1 = /^1[0-9]{10}$/
					const urlReg =
						/(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&amp;%$#_]*)?/

					if (!iphoneReg1.test(this.formData.phone)) {
						uni.showToast({
							title: '电话号码格式不正确',
							icon: 'none'
						})
						return
					}
					if (!urlReg.test(this.formData.home_page_url)) {
						uni.showToast({
							title: '主页链接格式不正确',
							icon: 'none'
						})
						return
					}
					uni.showToast({
						title: '提交成功'
					})

					this.$https.post('/youngee/c/t/p/talent-info', {
							talent_age_bracket: this.formData.age,
							talent_nationality: this.formData.nationality,
							visit_store_region: this.formData.visitStoreRegion,
							talent_phone_number: this.formData.phone,
						})
						.then(res => {
							console.log(res)
						})

					this.$https.post('/youngee/c/t/p/add-talent-address', {
							region_code: this.formData.fregion,
							detail_addr: this.formData.detailregion,
							phone_number: this.formData.phone,
							receiver_name: this.formData.name,
							default_tag: this.formData.setdefault
						})
						.then(res => {
							console.log(res)
						})

					this.formData.home_page_capture_url = this.imageData[0]
					if (this.isBind) {
						this.$https.post('/youngee/c/t/p/add-talent-account', {
								platform_id: this.platform.platform_id,
								platform_nickname: this.formData.platform_nickname,
								home_page_url: this.formData.home_page_url,
								fans_count: this.formData.fans_count,
								home_page_capture_url: this.formData
									.home_page_capture_url,
							})
							.then(res => {
								console.log(res)
							})
					} else {
						this.$https.post('/youngee/c/t/p/update-talent-account', {
								account_id: this.accountId,
								platform_id: this.platform.platform_id,
								platform_nickname: this.formData.platform_nickname,
								home_page_url: this.formData.home_page_url,
								fans_count: this.formData.fans_count,
								home_page_capture_url: this.formData
									.home_page_capture_url,
							})
							.then(res => {
								console.log(res)
							})
					}

					uni.showToast({
						title: '修改成功'
					})
					uni.navigateBack()
				}).catch(err => {
					console.error('验证失败：', errors)
					uni.showToast({
						title: '请填写所有信息',
						icon: 'none'
					})
				})
			},
			ceshiChooseSuccess(tempFilePaths, e) { //选择图片返回
				console.log('ceshiChooseSuccess', tempFilePaths, e);
				if (e == 0) {
					this.store = 'talent_upload/' + this.guid() + '.png'
				} else if (e == 1) {
					this.store = 'talent_upload/' + this.guid() + '.mp4'
				}
				/****************
				以下代码是自定义上传逻辑，仅供参考
				***************/
				this.imgUpload(tempFilePaths);
				/*******************************/
				console.log("imgdata" + this.imageData)
			},
			imgUpload(tempFilePaths) {
				let that = this
				console.log('imgUpload', tempFilePaths)
				let config = {
					AccessKeyId: 'IVW21DTGIIUBBAGXKK0Y', //AK
					SecretKey: 'Y01nEQNcLOATMw7uJwrk3yOdQZ2fqLhSnXcOKVDE', //SK
					EndPoint: 'https://horastar.obs.cn-east-3.myhuaweicloud.com', //上传文件的路径
				};
				let fileName = this.store; //指定上传到OBS桶中的对象名
				// let fileName = "talent_upload/icon-arrow-right.png"
				let OBSPolicy = { //设定policy内容
					"expiration": "2089-12-31T12:00:00.000Z",
					"conditions": [{
							"bucket": "horastar"
						}, //Bucket name
						// {"bucket": "goin"}, 
						{
							'key': fileName
						}
					]
				}

				let policyEncoded = getPolicyEncode(OBSPolicy); //计算policy编码值
				let signature = getSignature(policyEncoded, config.SecretKey); //计算signature 
				uni.uploadFile({
					//url: config.EndPoint,
					url: config.EndPoint,
					filePath: tempFilePaths[0],
					name: 'file',

					formData: {
						'AccessKeyID': config.AccessKeyId,
						'policy': policyEncoded,
						'signature': signature,
						'key': fileName,
					},

					success: function(res) {
						console.log(res.statusCode); //打印响应状态码
						if (res.statusCode == '204') {
							that.imageData.push(config.EndPoint + '/' + fileName);
							console.log('上传图片成功', res)
							let obs_url = config.EndPoint + '/' + fileName; //用你自己的 bucket 名替换星号
							console.log(obs_url)
							that.formData.home_img = obs_url
							uni.showToast({
								title: '上传成功',
								icon: '成功'
							});
						} else {
							console.log('上传图片失败', res)
							uni.showToast({
								title: '上传失败',
								icon: '失败'
							});
						}
					},
					fail: function(e) {
						console.log(e);
					}
				})
			},
			guid() {
				return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
					var r = Math.random() * 16 | 0,
						v = c == 'x' ? r : (r & 0x3 | 0x8);

					return v.toString(16);
				});
			},
			// 年龄选择的
			bindPickerChange: function(e) {
				this.index = e.detail.value;
				this.formData.age = this.array[this.index].age_aid
				this.Xage = this.array[this.index].age_bracket_discribe
				console.log(this.formData.age)
			},
			//国籍选择
			bindPickerChange1: function(e) {
				console.log(e)
				this.index1 = e.detail.value;
				this.formData.nationality = this.array1[this.index1].id
				console.log(this.formData.nationality)
			},
			//城市选择
			pickerChange(e) {
				// console.log(e, '1');
				this.regionIndex = e.detail.value;
				this.regionStr = this.region[0][this.regionIndex[0]].name + ' ' + this.region[1][this.regionIndex[
						1]]
					.name + ' ' +
					this.region[2][this.regionIndex[2]].name;

				// 组件传值
				this.$emit('region', [this.region[0][this.regionIndex[0]].code, this.region[1][this.regionIndex[1]]
					.code,
					this.region[
						2][this.regionIndex[2]].code
				]);
				this.formData.visitStoreRegion = this.region[2][this.regionIndex[2]].code;

			},
			pickerColumnchange(e) {
				// console.log(e);
				// 第几列滑动
				// console.log(e.detail.column);
				// 第几列滑动的下标
				// console.log(e.detail.value)

				if (e.detail.column === 0) {
					// 声明城市数组
					let cityArr = [];
					let countyArr = [];
					// 设置下标
					this.regionIndex = [e.detail.value, 0, 0];
					// 改变城市列表
					this.region[1] = this.oldRegion[e.detail.value].children.map(item => {
						cityArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 1, cityArr);
					// 改变县区列表
					this.oldRegion[e.detail.value].children[0].children.map(item => {
						countyArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 2, countyArr);
				}
				if (e.detail.column === 1) {
					this.regionIndex[1] = e.detail.value;
					this.regionIndex[2] = 0;
					let countyArr = [];
					this.oldRegion[this.regionIndex[0]].children[this.regionIndex[1]].children.map(item => {
						countyArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 2, countyArr);
				}
				if (e.detail.column === 2) {
					this.regionIndex[2] = e.detail.value;
				}
			},
			//城市选择
			pickerChange(e) {
				// console.log(e, '1');
				this.regionIndex = e.detail.value;
				this.regionStr = this.region[0][this.regionIndex[0]].name + ' ' + this.region[1][this.regionIndex[
						1]]
					.name + ' ' +
					this.region[2][this.regionIndex[2]].name;

				// 组件传值
				this.$emit('region', [this.region[0][this.regionIndex[0]].code, this.region[1][this.regionIndex[1]]
					.code,
					this.region[
						2][this.regionIndex[2]].code
				]);
				this.formData.visitStoreRegion = this.region[2][this.regionIndex[2]].code;

			},
			pickerColumnchange(e) {
				// console.log(e);
				// 第几列滑动
				// console.log(e.detail.column);
				// 第几列滑动的下标
				// console.log(e.detail.value)

				if (e.detail.column === 0) {
					// 声明城市数组
					let cityArr = [];
					let countyArr = [];
					// 设置下标
					this.regionIndex = [e.detail.value, 0, 0];
					// 改变城市列表
					this.region[1] = this.oldRegion[e.detail.value].children.map(item => {
						cityArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 1, cityArr);
					// 改变县区列表
					this.oldRegion[e.detail.value].children[0].children.map(item => {
						countyArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 2, countyArr);
				}
				if (e.detail.column === 1) {
					this.regionIndex[1] = e.detail.value;
					this.regionIndex[2] = 0;
					let countyArr = [];
					this.oldRegion[this.regionIndex[0]].children[this.regionIndex[1]].children.map(item => {
						countyArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 2, countyArr);
				}
				if (e.detail.column === 2) {
					this.regionIndex[2] = e.detail.value;
				}
			},
			//城市选择
			pickerChange1(e) {
				// console.log(e, '1');
				this.regionIndex1 = e.detail.value;
				this.regionStr1 = this.region[0][this.regionIndex1[0]].name + ' ' + this.region[1][this.regionIndex1[
						1]]
					.name + ' ' +
					this.region[2][this.regionIndex1[2]].name;

				// 组件传值
				this.$emit('region', [this.region[0][this.regionIndex1[0]].code, this.region[1][this.regionIndex1[1]]
					.code,
					this.region[
						2][this.regionIndex1[2]].code
				]);
				this.formData.fregion = this.region[2][this.regionIndex1[2]].code;
				console.log(this.formData.fregion)

			},
			pickerColumnchange1(e) {
				if (e.detail.column === 0) {
					// 声明城市数组
					let cityArr = [];
					let countyArr = [];
					// 设置下标
					this.regionIndex1 = [e.detail.value, 0, 0];
					// 改变城市列表
					this.region[1] = this.oldRegion[e.detail.value].children.map(item => {
						cityArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 1, cityArr);
					// 改变县区列表
					this.oldRegion[e.detail.value].children[0].children.map(item => {
						countyArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 2, countyArr);
				}
				if (e.detail.column === 1) {
					this.regionIndex1[1] = e.detail.value;
					this.regionIndex1[2] = 0;
					let countyArr = [];
					this.oldRegion[this.regionIndex1[0]].children[this.regionIndex1[1]].children.map(item => {
						countyArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 2, countyArr);
				}
				if (e.detail.column === 2) {
					this.regionIndex1[2] = e.detail.value;
				}
			},
		},
		created() {
			let provinceArr = [];
			let cityArr = [];
			this.oldRegion.map((item, index) => {
				this.region[0].push({
					name: item.name,
					code: item.code
				});
			})
			// console.log(provinceArr);
			provinceArr.map((item, index) => {
				this.region[1].push({
					name: item.name,
					code: item.code
				});
			})
			cityArr.map((item, index) => {
				this.region[2].push({
					name: item.name,
					code: item.code
				});
			})
			this.regionStr = '请选择省市区';
		}
	};
</script>
<style>
	picker {
		position: relative;
		display: block;
		cursor: pointer;
		padding-left: 20rpx !important;
		padding-top: 20rpx !important;
		color: grey !important;
	}

	/deep/.uni-forms-item__inner {
		border-bottom: none !important;
		margin-bottom: 0 !important;
	}
</style>
<style lang="scss" scoped>
	@charset "UTF-8";

	/* 头条小程序组件内不能引入字体 */
	/* #ifdef MP-TOUTIAO */
	@font-face {
		font-family: uniicons;
		font-weight: normal;
		font-style: normal;
		src: url("~@/static/uni.ttf") format("truetype");
	}

	/* #endif */
	/* #ifndef APP-NVUE */

	page {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		background-color: #FFFFFF;
		min-height: 100%;
		height: auto;
	}

	view {
		font-size: 14px;
		// line-height: inherit;
	}

	.line {
		width: 96%;
		margin: 10rpx 2%;
		border-bottom: 1rpx solid #bbbbbb;
	}

	.title {
		height: 80rpx;
		display: flex;
		align-items: center;
	}

	.menu {
		position: fixed;
		top: 180rpx;
		background-color: #FFFFFF;
		justify-content: space-around;
		height: 80rpx;
		// height: 5%;
		width: 100%;
		display: flex;
		z-index: 10;
		margin-bottom: 10rpx;
	}

	.menu-item p {
		font-weight: 600;

		&.lor {
			border-bottom: 5rpx solid #F0D232;
			color: #F0D232;
			padding-bottom: 15rpx;
		}
	}

	.setdeault {
		display: flex;
		justify-content: space-between;
	}

	.btn1 {
		width: 100%;
		margin-top: 30rpx;
		font-size: 35rpx;
		color: #FFFFFF;
		background-color: #F0D232;
		border: none;
		border-radius: 0;
	}

	.uni-input-border,
	.uni-textarea-border {
		flex: 1;
		font-size: 14px;
		color: #666;
		border: 1px #FFFFFF solid;
		border-radius: 5px;
		/* #ifndef APP-NVUE */
		box-sizing: border-box;
		/* #endif */
	}

	.uni-input-border {
		padding: 0 10px;
		height: 35px;
	}

	.uni-textarea-border {
		padding: 10px;
		height: 80px;
	}

	.label-box {
		margin-right: 10px;
	}

	.transform-scale {
		transform: scale(0.7);
	}

	.butto {
		text-align: center;
	}

	.option {
		padding: 20rpx;
	}

	.uni-margin-wrap {
		width: 690rpx;
		width: 100%;
		;
	}

	.swiper {
		height: 300rpx;
	}

	.swiper-item {
		display: block;
		height: 300rpx;
		line-height: 300rpx;
		text-align: center;
	}

	.swiper-list {
		margin-top: 40rpx;
		margin-bottom: 0;
	}

	.uni-common-mt {
		margin-top: 60rpx;
		position: relative;
	}

	.info {
		position: absolute;
		right: 20rpx;
	}

	.uni-padding-wrap {
		width: 550rpx;
		padding: 0 100rpx;
	}

	.signup {
		box-shadow: 0rpx 5rpx 40rpx #ccc;
		width: 100%;
		position: fixed;
		bottom: 0rpx;
		display: flex;
		height: 90rpx;
		padding-top: 2%;
		background-color: #FFFFFF;
		justify-content: space-around;
	}

	.signuptext {
		text-align: center;
		margin-top: 2%;

	}

	.signuptext p {
		font-size: 60%;
		color: #333333;
	}

	.signupbut {
		text-align: center;
		margin-top: 2%;
	}

	.but1 {
		width: 120%;
		text-align: center;
		background-color: #FCCF41;
		border-radius: 10rpx;
		color: #464100;
		font-size: 28rpx;
		line-height: 156%;

		font-weight: 500;
		height: 65%;
	}

	/deep/.uni-searchbar__box {
		border-color: #267CFF !important;
		border-width: 2rpx !important;
	}

	/deep/.uni-searchbar__box {
		background-color: #FFFFFF !important;
	}

	/deep/.uni-searchbar__text-placeholder {
		font-size: 30rpx !important;
	}

	/deep/.segmented-control__text {
		font-size: 34rpx !important;
	}

	/deep/.uni-data-checklist {
		padding-left: 20upx;
	}

	uni-picker {
		position: relative;
		display: block;
		cursor: pointer;
		padding-left: 20rpx !important;
		padding-top: 14rpx !important;
		color: grey !important;
	}

	/deep/.uni-date-x--border {
		border: 0px solid #dcdfe6 !important;
	}

	/deep/.is-input-border {
		border: 0px solid #c8c7cc !important;
	}

	/deep/.uni-progress-info {
		font-size: 25rpx !important;
	}

	/deep/.uni-error-message {
		position: absolute;
		bottom: -20rpx !important;
		left: 20rpx !important;
		text-align: left;
	}

	/deep/.uni-forms-item__inner {
		padding-bottom: 0rpx !important;
		margin-bottom: 30rpx !important;
		border-bottom: 0.5rpx solid #CCCCCC;
	}

	/deep/.uni-group__title {
		background-color: #FFFFFF !important;
	}

	/deep/.uni-list-item__content-title {
		font-size: 30rpx !important;
		color: #111111 !important;
	}

	/deep/.uni-progress-bar {
		border-radius: 10rpx !important;
	}

	/deep/.uni-progress-inner-bar {
		border-radius: 10rpx !important;
	}


	/deep/.is-input-border {
		border-radius: 20px !important;
		background-color: #fff;
	}

	.uni-easyinput__content-input {
		font-size: 30upx !important;
	}

	.content-clear-icon {
		font-size: 40upx !important;
	}

	/deep/.input-box {
		padding: 50upx;
		font-size: 30upx;

		.input-item {
			display: flex;

			border: 1upx solid #F8F8F8;
			line-height: 90upx;
			height: 90upx;
			margin-top: 20upx;
			background: #F8F8F8;
			border-radius: 48upx;

			.input-label {
				width: 150upx;
				text-align: center;
			}

			.input-body {
				position: relative;
				height: 100upx;
				width: calc(100% - 150upx);

				.input {
					line-height: 90upx;
					height: 90upx;
					position: relative;
					font-size: 28upx;
				}

				.eye {
					position: absolute;
					height: 50upx;
					width: 50upx;
					right: 20upx;
					top: 50%;
					transform: translateY(-50%);
				}

				.btn-code {
					position: absolute;
					right: 0upx;
					top: 50%;
					transform: translateY(-50%);
					background: none;
					color: #205592;
					width: 160upx;
					font-size: 24upx;
					box-sizing: border-box;
					text-align: center;
					padding: 0;
					height: 100upx;
					line-height: 100upx;
				}
			}
		}

		.select {
			// padding-top: 40upx;
			display: flex;
			justify-content: space-between;
			color: #003B67;
		}
	}

	/deep/.title-left {
		width: 3px;
		height: 16px;
		background: #267CFF;
		display: inline-block;
		border-radius: 3px;
		margin-top: 3px;
		vertical-align: top;
		margin-right: 10px;
	}


	.card {
		padding: 24rpx;
		margin-top: 30rpx;
		border: 1rpx solid #F0D232;
		background-color: #ffffff;
		margin: 0 10rpx;
	}

	.head {
		padding-top: 5%;
		padding: 0 0 0 1%;
		height: 80rpx;
		margin-top: 2%;
	}

	.head span {
		color: #333333;
		font-size: 80%;
		font-weight: 550;
		text-indent: 2em;

	}

	.head image {
		vertical-align: middle;
		width: 50rpx;
		height: 50rpx;
		display: inline-block;
		padding-right: 14rpx;
	}

	.home-link {
		/deep/.uni-easyinput__content-input {
			background-color: #EBEBEB;
			border-radius: 15rpx;
		}
	}


	.heng-line {
		margin-top: 60rpx;
		margin-bottom: 50rpx;
		border: 1rpx solid #DCDCDC;

	}

	.signupbtn p {
		font-size: 30rpx;
	}

	.exit-btn {
		width: 120%;
		text-align: center;
		background-color: #C0C0C0;
		border-radius: 10rpx;
		color: #FFFFFF;
		font-size: 30rpx;
		line-height: 180%;
	}

	.main-btn {
		width: 300rpx;
		text-align: center;
		background-color: #FCCF41;
		border-radius: 10rpx;
		color: #000000;
		font-size: 30rpx;
		line-height: 180%;
	}

	.uni-input-placeholder {
		font-size: 24rpx !important;
	}

	/deep/.uni-date-x--border {
		border: 0px solid #dcdfe6 !important;
	}

	/deep/.is-input-border {
		border: 0px solid #c8c7cc !important;
	}



	.example {
		padding: 0 15px 15px;
	}

	.example-info {
		padding: 15px;
		color: #3b4144;
		background: #ffffff;
	}

	.example-body {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		padding: 0;
		font-size: 14px;
		background-color: #ffffff;
	}

	/* #endif */
	.example {
		padding: 0 15px;
	}

	.example-info {
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		padding: 15px;
		color: #3b4144;
		background-color: #ffffff;
		font-size: 14px;
		line-height: 20px;
	}

	.example-info-text {
		font-size: 14px;
		line-height: 20px;
		color: #3b4144;
	}

	.example-body {
		flex-direction: column;
		padding: 15px;
		background-color: #ffffff;
	}
</style>