<template>
	<view class="app">
		<view class="title">
			<view class="left">
			</view>
			<view class="right">
				设备序列号
			</view>
			<image src="../../static/pageC/ScanAdd.png" mode="" @click="scanning"></image>
		</view>
		<view class="uptext">
			<input placeholder="请输入设备序列号" v-model="data.sn"></input>
		</view>
		<view class="title">
			<view class="left">
			</view>
			<view class="right">
				设备类型
			</view>
		</view>
		<view class="types">
			<view @tap='data.deviceType=0' :class="data.deviceType==0?'type':'type2'">血压计</view>
			<view @tap='data.deviceType=1' :class="data.deviceType==1?'type':'type2'">血糖仪</view>
		</view>
		<view class="submit" @click="submit">
			保存
		</view>
	</view>
</template>

<script>
	// import { bindDevice } from '@/service/api/api.js'
	export default {
		data() {
			return {
				type: 1,
				data: {
					deviceType: 0,
					identity: uni.getStorageSync('userInfo').identity,
					signNo: uni.getStorageSync('signInfo').signNo,
					sn: ''
				}
			};
		},
		methods: {
			scanning() {
				const that = this
				uni.scanCode({
					onlyFromCamera: true,
					success(res) {
						that.data.sn = res.result
					}
				})
			},
			submit() {
				// bindDevice(this.data).then(res => {
				// 	if(res.data.code == '1') {
				// 		uni.showToast({
				// 			title: '绑定成功',
				// 			duration: 1000
				// 		})
				// 		setTimeout(function() {
				// 			uni.navigateBack({
				// 				delta: 1
				// 			})
				// 		}, 1000);
				// 	}
				// })
			}
		}
	}
</script>

<style lang="scss">
	.app {
		margin-top: 40rpx;

		.submit {
			width: 60%;
			height: 98rpx;
			margin: 60rpx auto;
			background-color: #55d0df;
			border-radius: 10rpx;
			border: solid 0rpx #0c0c0c;
			color: #ffffff;
			text-align: center;
			line-height: 98rpx;
		}

		.types {
			text-align: center;
			line-height: 60rpx;
			font-size: 28rpx;
			margin-top: 30rpx;
			display: flex;
			padding-bottom: 50rpx;
			border-bottom: 1rpx solid #f0f1f6;
			;

			.type2 {
				margin-left: 50rpx;
				color: #999999;
				width: 144rpx;
				height: 60rpx;
				background-color: #ffffff;
				border-radius: 10rpx;
				border: solid 1rpx #d0d0d0;
			}

			.type {
				margin-left: 50rpx;
				width: 144rpx;
				height: 60rpx;
				background-color: #ffffff;
				border-radius: 10rpx;
				border: solid 1rpx #55d0df;
				color: #55d0df;
			}
		}


		.uptext {
			width: 100%;

			input {
				width: 580rpx;
				height: 88rpx;
				background-color: #ffffff;
				border-radius: 10rpx;
				border: solid 1rpx #d0d0d0;
				text-align: center;
				font-size: 40rpx;
				margin: 40rpx auto;
			}
		}

		.title {
			display: flex;
			padding: 30rpx 0 30rpx 30rpx;
			font-size: 30rpx;

			image {
				width: 160rpx;
				height: 40rpx;
				margin-left: 40%;
			}

			.right {
				line-height: 34rpx;
				padding-left: 20rpx;
				color: #666666;
			}

			.left {
				width: 8rpx;
				height: 32rpx;
				background-color: #55d0df;
				border-radius: 4rpx;
			}
		}
	}
</style>