<template>
	<view class="container">
		<view class="form-panel">
			<uni-card>
				<uni-forms ref="ebikeInfoForm" :modelValue="ebikeInfo">
					<view v-if="modelShow" class="flex">
						<text class="cuIcon-order lg text-gray" @click="showClick"></text>
						<uni-forms-item label="中控编号" label-s name="bikeCode">
							<ecuCodeScan @scan-change="ecuCodeScanChange" :codeValue="ebikeInfo.ecuCode" />
						</uni-forms-item>
					</view>
					<view v-else class="flex">
						<text class="cuIcon-order lg text-gray" @click="showClick"></text>
						<uni-forms-item label="车辆编号" name="bikeCode">
							<bikeCodeScan @scan-change="bikeCodeScanChange" :codeValue="ebikeInfo.bikeCode" />
						</uni-forms-item>
					</view>
				</uni-forms>
			</uni-card>
			<uni-card>
				<view>
					<uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									在线状态
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.online.load=='loading'"
											:status="detectionInfo.online.load" iconType="circle" :icon-size="15"
											:content-text="contentText" />
									</view>
									<view class="cu-info">
										<text v-if="detectionInfo.online.detectionState=='error'"
											class="cuIcon-roundclosefill text-red"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.online.detectionState=='error'">
											{{ detectionInfo.online.msg }}
										</text>
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.online.detectionState=='success'"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.online.detectionState=='success'">
											{{ detectionInfo.online.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.online.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'online'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									GPS坐标
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.gps.load=='loading'"
											:status="detectionInfo.gps.load" iconType="circle" :icon-size="15"
											:content-text="contentText" />
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.gps.detectionState"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm" v-if="detectionInfo.gps.detectionState">
											{{ detectionInfo.gps.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.gps.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'gps',type:'gps'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									SOC
									<text class="cuIcon-info lg text-gray" @click="socClick"
										style="display: inline-block; transform: rotate(180deg);"></text>
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.soc.load=='loading'"
											:status="detectionInfo.soc.load" iconType="circle" :icon-size="15"
											:content-text="contentText" />
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.soc.detectionState"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm" v-if="detectionInfo.soc.detectionState">
											{{ detectionInfo.soc.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.soc.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'gps',type:'soc'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									电压(mv)
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.voltage.load=='loading'"
											:status="detectionInfo.voltage.load" iconType="circle" :icon-size="15"
											:content-text="contentText" />
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.voltage.detectionState"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm" v-if="detectionInfo.voltage.detectionState">
											{{ detectionInfo.voltage.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.voltage.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'gps',type:'voltage'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									打开电池仓
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.openBatteryLock.load=='loading'"
											:icon-size="15" :status="detectionInfo.openBatteryLock.load"
											iconType="circle" :content-text="contentText" />
									</view>
									<view class="cu-info">
										<text v-if="detectionInfo.openBatteryLock.detectionState=='error'"
											class="cuIcon-roundclosefill text-red"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.openBatteryLock.detectionState=='error'">
											{{ detectionInfo.openBatteryLock.msg }}
										</text>
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.openBatteryLock.detectionState=='success'"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.openBatteryLock.detectionState=='success'">
											{{ detectionInfo.openBatteryLock.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.openBatteryLock.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'openBatteryLock'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									开锁
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.unlock.load=='loading'"
											:status="detectionInfo.unlock.load" iconType="circle" :icon-size="15"
											:content-text="contentText" />
									</view>
									<view class="cu-info">
										<text v-if="detectionInfo.unlock.detectionState=='error'"
											class="cuIcon-roundclosefill text-red"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.unlock.detectionState=='error'">
											{{ detectionInfo.unlock.msg }}
										</text>
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.unlock.detectionState=='success'"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.unlock.detectionState=='success'">
											{{ detectionInfo.unlock.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.unlock.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'unlock'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									开头盔
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.openHelmet.load=='loading'"
											:status="detectionInfo.openHelmet.load" iconType="circle" :icon-size="15"
											:content-text="contentText" />
									</view>
									<view class="cu-info">
										<text v-if="detectionInfo.openHelmet.detectionState=='error'"
											class="cuIcon-roundclosefill text-red"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.openHelmet.detectionState=='error'">
											{{ detectionInfo.openHelmet.msg }}
										</text>
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.openHelmet.detectionState=='success'"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.openHelmet.detectionState=='success'">
											{{ detectionInfo.openHelmet.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.openHelmet.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'openHelmet'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									关锁
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.lock.load=='loading'"
											:status="detectionInfo.lock.load" iconType="circle" :icon-size="15"
											:content-text="contentText" />
									</view>
									<view class="cu-info">
										<text v-if="detectionInfo.lock.detectionState=='error'"
											class="cuIcon-roundclosefill text-red"></text>
										<text class="margin-left-sm" v-if="detectionInfo.lock.detectionState=='error'">
											{{ detectionInfo.lock.msg }}
										</text>
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.lock.detectionState=='success'"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.lock.detectionState=='success'">
											{{ detectionInfo.lock.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.lock.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'lock'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									寻车铃
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.findEbike.load=='loading'"
											:status="detectionInfo.findEbike.load" iconType="circle" :icon-size="15"
											:content-text="contentText" />
									</view>
									<view class="cu-info">
										<text v-if="detectionInfo.findEbike.detectionState=='error'"
											class="cuIcon-roundclosefill text-red"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.findEbike.detectionState=='error'">
											{{ detectionInfo.findEbike.msg }}
										</text>
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.findEbike.detectionState=='success'"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.findEbike.detectionState=='success'">
											{{ detectionInfo.findEbike.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.findEbike.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'findEbike'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									关闭电源
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.powerOff.load=='loading'"
											:status="detectionInfo.powerOff.load" iconType="circle" :icon-size="15"
											:content-text="contentText" />
									</view>
									<view class="cu-info">
										<text v-if="detectionInfo.powerOff.detectionState=='error'"
											class="cuIcon-roundclosefill text-red"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.powerOff.detectionState=='error'">
											{{ detectionInfo.powerOff.msg }}
										</text>
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.powerOff.detectionState=='success'"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.powerOff.detectionState=='success'">
											{{ detectionInfo.powerOff.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.powerOff.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'powerOff'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
						<uni-list :border="true">
							<view class="flex" style="padding: 10px 0 10px 0;">
								<view class="zk-title">
									取消设防
								</view>
								<view class="zk-state">
									<view class="cu-info">
										<uni-load-more v-if="detectionInfo.cancelAntiTheft.load=='loading'"
											:status="detectionInfo.cancelAntiTheft.load" iconType="circle"
											:icon-size="15" :content-text="contentText" />
									</view>
									<view class="cu-info">
										<text v-if="detectionInfo.cancelAntiTheft.detectionState=='error'"
											class="cuIcon-roundclosefill text-red"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.cancelAntiTheft.detectionState=='error'">
											{{ detectionInfo.cancelAntiTheft.msg }}
										</text>
									</view>
									<view class=" cu-info">
										<text v-if="detectionInfo.cancelAntiTheft.detectionState=='success'"
											class="cuIcon-roundcheckfill text-green"></text>
										<text class="margin-left-sm"
											v-if="detectionInfo.cancelAntiTheft.detectionState=='success'">
											{{ detectionInfo.cancelAntiTheft.msg }}
										</text>
									</view>
								</view>
								<view class="zk-but">
									<view style="bottom: 10rpx;width:100%">
										<button :disabled="detectionInfo.cancelAntiTheft.btuDisabled"
											style="width: 60px;height: 35px;font-size: 15px;" type="primary"
											@click="execDetection({url:'cancelAntiTheft'})">执行</button>
									</view>
								</view>
							</view>
						</uni-list>
					</uni-list>
				</view>
			</uni-card>
		</view>
		<view class="nav-panel">
			<c-uni-goods-nav :fill="true" :options="[]" :buttonGroup="navButtonGroup" @buttonClick="autoDetection" />
		</view>
	</view>
</template>

<script setup>
	import {
		reactive,
		ref
	} from 'vue';
	import * as api from '@/utils/api.js';
	import {
		showModelMessage
	} from '@/utils/tools.js';
	import config from '../../../utils/config';
	const ebikeInfo = ref({
		ecuCode: '',
		bikeCode: '',
		ecuId: '',
		ecuSn: ''
	});

	const reqState = ref(false);

	const detectionInfo = ref({
		online: {
			load: '',
			btuDisabled: true,
			detectionState: '',
			msg: ""
		},
		findEbike: {
			load: '',
			btuDisabled: true,
			detectionState: '',
			msg: ""
		},
		gps: {
			load: '',
			btuDisabled: true,
			detectionState: false,
			msg: ""
		},
		soc: {
			load: '',
			btuDisabled: true,
			detectionState: false,
			msg: ""
		},
		openBatteryLock: {
			load: '',
			btuDisabled: true,
			detectionState: '',
			msg: ""
		},
		lock: {
			load: '',
			btuDisabled: true,
			detectionState: '',
			msg: ""
		},
		unlock: {
			load: '',
			btuDisabled: true,
			detectionState: '',
			msg: ""
		},
		openHelmet: {
			load: '',
			btuDisabled: true,
			detectionState: '',
			msg: ""
		},
		voltage: {
			load: '',
			btuDisabled: true,
			detectionState: false,
			msg: ""
		},
		cancelAntiTheft: {
			load: '',
			btuDisabled: true,
			detectionState: '',
			msg: ""
		},
		powerOff: {
			load: '',
			btuDisabled: true,
			detectionState: '',
			msg: ""
		}
	});

	const modelShow = ref(true)

	const urlList = ref([]);

	const contentText = ref({
		contentdown: '',
		contentrefresh: '测试中',
		contentnomore: '',
	})

	const showClick = () => {
		modelShow.value = !modelShow.value
	}

	const navButtonGroup = reactive([{
		text: '自动测试',
		backgroundColor: '#0078D4',
		color: '#fff',
		disable: true
	}]);

	const bikeCodeScanChange = (data) => {
		api.callEbikeInfo("getBikeINfoData?bikeCode=" + data).then((res) => {
			ebikeInfo.value.ecuCode = res.data.ecuCode;
			ebikeInfo.value.bikeId = res.data.bikeId;
			ebikeInfo.value.ecuId = res.data.ecuId;
			ebikeInfo.value.ecuSn = res.data.ecuSn;

			detectionInfo.value.online.btuDisabled = false;
			detectionInfo.value.findEbike.btuDisabled = false;
			detectionInfo.value.gps.btuDisabled = false;
			detectionInfo.value.soc.btuDisabled = false;
			detectionInfo.value.openBatteryLock.btuDisabled = false;
			detectionInfo.value.lock.btuDisabled = false;
			detectionInfo.value.unlock.btuDisabled = false;
			detectionInfo.value.openHelmet.btuDisabled = false;
			detectionInfo.value.voltage.btuDisabled = false;
			detectionInfo.value.cancelAntiTheft.btuDisabled = false;
			detectionInfo.value.powerOff.btuDisabled = false;
			navButtonGroup[0].disable = false
		});
	};

	const ecuCodeScanChange = (data) => {
		ebikeInfo.value.ecuCode = data["imei"];
		ebikeInfo.value.ecuSn = data["sn"];
	};

	const socClick = () => {
		showModelMessage("中控读取电池BMS返回的电量", "SOC说明", false, "我知道了")
	}

	const execDetection = (url) => {

		if (reqState.value) {
			uni.showToast({
				title: '指令执行中，请稍后',
				icon: 'none',
			});
			detectionInfo.value[url['url']].btuDisable = false
			return;
		}

		if (url['type']) {
			detectionInfo.value[url['type']].load = 'loading';
			detectionInfo.value[url['type']].btuDisable = true
			detectionInfo.value[url['type']].detectionState = '';
		} else {
			detectionInfo.value[url['url']].load = 'loading';
			detectionInfo.value[url['url']].btuDisable = true
			detectionInfo.value[url['url']].detectionState = '';
		}

		reqState.value = true;

		var paramName = "ecuId";
		var data = ebikeInfo.value.ecuId
		var bikeId = ebikeInfo.value.bikeId
		api.callCoreApi(url['url'] + "?" + paramName + "=" + data + "&bikeId=" + bikeId, {}, 'get').then((res) => {
			if (url['type']) {
				api.callCoreApi("gpsMsg" + "?ecuSn=" + ebikeInfo.value.ecuSn, {}, 'get').then((res) => {
					detectionInfo.value[url['type']].load = '';
					reqState.value = false;
					detectionInfo.value[url['type']].btuDisable = false;
					if (url['type'] == 'gps') {
						detectionInfo.value[url['type']].msg = "东经:" + res.data.longitude + "°,北纬:" +
							res.data.latitude + "°";
					} else {
						detectionInfo.value[url['type']].msg = res.data[url['type']];
					}
					detectionInfo.value[url['type']].detectionState = true;
				})
			} else {
				detectionInfo.value[url['url']].load = '';
				reqState.value = false;
				detectionInfo.value[url['url']].btuDisable = false;
				detectionInfo.value[url['url']].msg = res.data.message;
				if (res.data.code == 200) {
					detectionInfo.value[url['url']].detectionState = 'success';
				} else {
					detectionInfo.value[url['url']].detectionState = 'error';
				}
			}
		});
	}


	const recursionExecDetection = () => {

		if (urlList.value[0]['type']) {
			detectionInfo.value[urlList.value[0]['type']].load = 'loading';
			detectionInfo.value[urlList.value[0]['type']].btuDisable = true
			detectionInfo.value[urlList.value[0]['type']].detectionState = '';
		} else {
			detectionInfo.value[urlList.value[0]['url']].load = 'loading';
			detectionInfo.value[urlList.value[0]['url']].btuDisable = true
			detectionInfo.value[urlList.value[0]['url']].detectionState = '';
		}

		reqState.value = true;

		var paramName = "ecuId";
		var data = ebikeInfo.value.ecuId
		var bikeId = ebikeInfo.value.bikeId
		api.callCoreApi(urlList.value[0]['url'] + "?" + paramName + "=" + data+ "&bikeId=" + bikeId, {}, 'get').then((res) => {
			if (urlList.value[0]['type']) {
				api.callCoreApi("gpsMsg" + "?ecuSn=" + ebikeInfo.value.ecuSn, {}, 'get').then((res) => {
					detectionInfo.value[urlList.value[0]['type']].load = '';
					reqState.value = false;
					detectionInfo.value[urlList.value[0]['type']].btuDisable = false;
					if (urlList.value[0]['type'] == 'gps') {
						detectionInfo.value[urlList.value[0]['type']].msg = "东经:" + res.data
							.longitude + "°,北纬:" +
							res.data.latitude + "°";
					} else {
						detectionInfo.value[urlList.value[0]['type']].msg = res.data[urlList.value[0][
							'type'
						]];
					}
					detectionInfo.value[urlList.value[0]['type']].detectionState = true;
					urlList.value.shift();
					if (urlList.value.length > 0) {
						recursionExecDetection();
					}
				})
			} else {
				detectionInfo.value[urlList.value[0]['url']].load = '';
				reqState.value = false;
				detectionInfo.value[urlList.value[0]['url']].btuDisable = false;
				detectionInfo.value[urlList.value[0]['url']].msg = res.data.message;
				if (res.data.code == 200) {
					detectionInfo.value[urlList.value[0]['url']].detectionState = 'success';
				} else {
					detectionInfo.value[urlList.value[0]['url']].detectionState = 'error';
				}
				urlList.value.shift();
				if (urlList.value.length > 0) {
					recursionExecDetection();
				}
			}
		});
	}

	const autoDetection = () => {

		urlList.value = [{
				url: 'online'
			},
			{
				url: 'gps',
				type: 'gps'
			},
			{
				url: 'gps',
				type: 'soc'
			},
			{
				url: 'gps',
				type: 'voltage'
			},
			{
				url: 'openBatteryLock'
			},
			{
				url: 'unlock'
			},
			{
				url: 'openHelmet'
			},
			{
				url: 'lock'
			},
			{
				url: 'findEbike'
			},
			{
				url: 'powerOff'
			},
			{
				url: 'cancelAntiTheft'
			}
		]
		recursionExecDetection();
	}
</script>

<style>
	.container {
		padding: 5px;
		background-color: #F8F8F8;
	}

	.cuIcon-order {
		font-family: "cuIcon";
		font-size: 22px;
		font-style: normal;
		padding: 8px 0 0 0;
	}

	.zk-title {
		width: 30%;
		padding: 8px 0 0 0;
		font-size: 14px;
	}

	.zk-state {
		width: 50%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 35px;
	}

	.uni-forms-item {
		position: relative;
		display: flex;
		flex-direction: row;
		margin-bottom: 0px !important
	}

	.uni-load-more {
		display: flex;
		flex-direction: row;
		height: 40px;
		align-items: center;
		justify-content: left !important;
	}

	.uni-load-more__text {
		font-size: 12px !important;
		margin-left: 8px;
	}

	.zk-but {
		width: 20%;
	}

	.form-panel {
		padding-bottom: 55px;
	}

	.nav-panel {
		position: fixed;
		bottom: 0rpx;
		width: 100%;
		padding-bottom: 20px;
		background-color: #fff;
		z-index: 10;
	}
</style>