<template>
	<view>
		<view class="hm-p-20">
			<view class="hm-br-10 hm-bg-f">
				<view class="hm-p-20">
					<view class="led">
						{{is_open ? row_no:title}}
					</view>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('1')">1</button>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('2')">2</button>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('3')">3</button>
				</view>
				<view class="key">
					<button class="but hm-bg-primary" @click="spk()">重叫</button>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('4')">4</button>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('5')">5</button>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('6')">6</button>
				</view>
				<view class="key">
					<button class="but hm-bg-primary" @click="upper()">
						<view class="hm-dis-block-inline hm-m-t-20">
							<u-icon name="arrow-up-fill" color="#FFF" size="35"></u-icon>
						</view>
					</button>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('7')">7</button>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('8')">8</button>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('9')">9</button>
				</view>
				<view class="key">
					<button class="but hm-bg-primary" @click="reduce()">
						<view class="hm-dis-block-inline hm-m-t-20">
							<u-icon name="arrow-down-fill" color="#FFF" size="35"></u-icon>
						</view>
					</button>
				</view>
				<view class="key">
					<button class="but hm-bg-success" @click="setting()">设置</button>
				</view>
				<view class="key">
					<button class="but hm-bg-warning" @click="rows('0')">0</button>
				</view>
				<view class="key">
					<button class="but hm-bg-success" @click="clear()">清除</button>
				</view>
				<view class="key">
					<button class="but hm-bg-primary" @click="spk()">
						<view class="hm-dis-block-inline hm-m-t-20">
							<u-icon name="volume-fill" color="#FFF" size="35"></u-icon>
						</view>
					</button>
				</view>
			</view>
		</view>
		<!-- 技术支持 -->
		<view class="hm">
			{{applet.copyright}} <text class="v">V{{applet.version}}</text>
		</view>
	</view>
</template>

<script>
	let App = getApp();
	export default {
		data() {
			return {
				user:{},
				is_spk: true,
				is_open: false,
				title: '',
				detail: {},
				row_no: '',
				applet: {}
			};
		},

		components: {},
		props: {},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {
			let _this = this;
			_this.applet = App.getApplet();
			_this.user =  App.getUser();
			_this.getCalling();
			// 保持屏幕常亮
			uni.setKeepScreenOn({
				keepScreenOn: true
			});
		},
		methods: {
			/**
			 * 获取设备
			 */
			getCalling: function() {
				let _this = this;
				App._get('user.device/detail', {
					dev_type:'hmcalling'
				}, function(result) {
					if (!result.data.detail) {
						_this.title = '请绑定设备';
						return true;
					}
					if (result.data.detail.is_open.value == 1) {
						_this.is_open = true;
					} else {
						_this.title = '请开启设备';
					}
					_this.setData(result.data);
				});
			},

			/**
			 * 叫号
			 */
			spk: function(e) {
				let _this = this,
					row_no = _this.row_no;
				if (!_this.is_open) {
					App.showError(_this.title);
					return false;
				}
				if (row_no.length == 0) {
					App.showSuccess('号码不可为空');
					return false;
				}
				if (Number(row_no) == 0) {
					App.showSuccess('号码不可小于或等于0');
					return false;
				}
				App._post_form('user.device/spk', {
					row_no: row_no
				}, function(result) {
					_this.is_spk = true;
					App.showSuccess(result.msg);
				}, false, function() {});
			},

			/**
			 * 拨号
			 */
			rows(num) {
				let _this = this,
					row_no = _this.row_no;
				if (!_this.is_open) {
					App.showError(_this.title);
					return false;
				}
				if (_this.is_spk) {
					row_no = '';
				}
				if (row_no.length == 9) {
					App.showSuccess('最长9位数');
					return false;
				}
				_this.row_no = row_no + num;
				_this.is_spk = false;
			},

			/**
			 * 清除
			 */
			clear() {
				let _this = this;
				if (!_this.is_open) {
					App.showError(_this.title);
					return false;
				}
				_this.row_no = '';
				_this.is_spk = true;
			},

			/**
			 * 上一号
			 */
			upper() {
				let _this = this;
				if (!_this.is_open) {
					App.showError(_this.title);
					return false;
				}
				let row_no = _this.row_no,
					row_len = row_no.length,
					new_no = Number(row_no),
					str_len = row_len - String(new_no).length; //获取前面0字符的数量
				new_no = String(new_no + 1); //加1后的值
				for (let n = 0; n < str_len; n++) {
					new_no = '0' + new_no;
				}
				if (new_no.length > 9) {
					App.showSuccess('最长9位数');
					return false;
				}
				_this.row_no = new_no;
				_this.is_spk = false;
			},

			/**
			 * 下一号
			 */
			reduce() {
				let _this = this;
				if (!_this.is_open) {
					App.showError(_this.title);
					return false;
				}
				let row_no = _this.row_no,
					row_len = row_no.length,
					new_no = Number(row_no),
					str_len = row_len - String(new_no).length; //获取前面0字符的数量
				new_no = String(new_no - 1); //加1后的值
				if (new_no == '0') {
					App.showSuccess('不可小于或等于0');
					return false;
				}
				for (let n = 0; n < str_len; n++) {
					new_no = '0' + new_no;
				}
				_this.row_no = new_no;
				_this.is_spk = false;
			}

		}
	};
</script>
<style lang="scss" scoped>
	.led {
		height: 150rpx;
		line-height: 150rpx;
		vertical-align: middle;
		font-weight: 900;
		color: #fa3534;
		padding: 0 20rpx;
		font-size: 100rpx;
		text-align: right;
		background-color: #2979ff;
	}

	.key {
		width: 21.5%;
		height: 100rpx;
		display: inline-block;
		margin: 0 0 20rpx 20rpx;
		.but {
			height: 100rpx;
			line-height: 100rpx;
			color: #fff;
			font-weight: 900;
			font-size: 40rpx;
			text-align: center;
		}
	}
</style>
