cxhxy/addons/foodcash/uni_app/pages/call/index.vue

<template>
	<view>
		<view class="uni-header">
			<view class="uni-group hide-on-phone">
				<view class="uni-title">{{$t('call.index.title')}}</view>
			</view>
		</view>
		<view class="uni-container">
			<view class="calling">
				<view class="led">
					{{call_is_open ? call_row_no:call_title}}
				</view>
				<view class="hm-text-align-center">
				<view @click="callRows('1')" class="key hm-bg-warning">1</view>
				<view @click="callRows('2')" class="key hm-bg-warning">2</view>
				<view @click="callRows('3')" class="key hm-bg-warning">3</view>
				<view @click="callSpk()" class="key hm-bg-blue">{{$t('call.index.repeat')}}</view>
				<view @click="callRows('4')" class="key hm-bg-warning">4</view>
				<view @click="callRows('5')" class="key hm-bg-warning">5</view>
				<view @click="callRows('6')" class="key hm-bg-warning">6</view>
				<view @click="callUpper()" class="key hm-bg-blue">
					<uni-icons type="top" size="50" color="#fff"></uni-icons>
				</view>
				<view @click="callRows('7')" class="key hm-bg-warning">7</view>
				<view @click="callRows('7')" class="key hm-bg-warning">8</view>
				<view @click="callRows('7')" class="key hm-bg-warning">9</view>
				<view @click="callReduce()" class="key hm-bg-blue">
					<uni-icons type="bottom" size="50" color="#fff"></uni-icons>
				</view>
				<view @click="callSet()" class="key hm-bg-blue">{{$t('call.index.setting')}}</view>
				<view @click="callRows('0')" class="key hm-bg-warning">0</view>
				<view @click="callClear()" class="key hm-bg-blue">{{$t('call.index.clear')}}</view>
				<view @click="callSpk()" class="key hm-bg-blue">
					<uni-icons type="sound" size="50" color="#fff"></uni-icons>
				</view>
				</view>
			</view>
		</view>
		<!-- #ifndef H5 -->
		<fix-window />
		<!-- #endif -->
	</view>
</template>

<script>
	let App = getApp();
	export default {
		data() {
			return {
				call_show: false,
				call_is_spk: true,
				call_is_open: false,
				call_title: '',
				call_detail: {},
				call_row_no: '',
			}
		},
		onLoad() {
			let _this = this;
			_this.getCalling();

		},
		methods: {
			/**
			 * 获取叫号器
			 */
			getCalling: function() {
				let _this = this;
				App._get('shop.device/detail', {
					dev_type: 'hmcalling'
				}, function(result) {
					if (!result.data) {
						_this.call_title = '请绑定设备';
						return true;
					}
					if (result.data.is_open.value == 1) {
						_this.call_is_open = true;
					} else {
						_this.call_title = '请开启设备';
					}
					_this.call_detail = result.data;
				});
				_this.call_show = true;
			},
			/**
			 * 叫号
			 */
			callSpk: function(e) {
				let _this = this,
					row_no = _this.call_row_no;
				if (!_this.call_is_open) {
					App.showError(_this.call_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('shop.device/spk', {
					row_no: row_no
				}, function(result) {
					_this.call_is_spk = true;
					App.showSuccess(result.msg);
				}, false, function() {});
			},
			
			/**
			 * 拨号
			 */
			callRows(num) {
				let _this = this,
					row_no = _this.call_row_no;
				if (!_this.call_is_open) {
					App.showError(_this.call_title);
					return false;
				}
				if (_this.call_is_spk) {
					row_no = '';
				}
				if (row_no.length == 9) {
					App.showSuccess('最长9位数');
					return false;
				}
				_this.call_row_no = row_no + num;
				_this.call_is_spk = false;
			},
			
			/**
			 * 清除
			 */
			callClear() {
				let _this = this;
				if (!_this.call_is_open) {
					App.showError(_this.call_title);
					return false;
				}
				_this.call_row_no = '';
				_this.call_is_spk = true;
			},
			
			/**
			 * 上一号
			 */
			callUpper() {
				let _this = this;
				if (!_this.call_is_open) {
					App.showError(_this.call_title);
					return false;
				}
				let row_no = _this.call_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.call_row_no = new_no;
				_this.call_is_spk = false;
			},
			
			/**
			 * 下一号
			 */
			callReduce() {
				let _this = this;
				if (!_this.call_is_open) {
					App.showError(_this.call_title);
					return false;
				}
				let row_no = _this.call_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.call_row_no = new_no;
				_this.call_is_spk = false;
			}
		}
	}
</script>

<style lang="scss">
	.calling{
		padding: 10px;
		.led {
			height: 80px;
			line-height: 80px;
			vertical-align: middle;
			font-weight: 900;
			color: #ff495e;
			padding: 0 30px;
			font-size: 50px;
			text-align: right;
			background-color: #1196DB;
		}
		.key {
			width: 23%;
			height: 80px;
			line-height: 80px;
			text-align: center;
			vertical-align: middle;
			display: inline-block;
			margin: 10px 5px 0 5px;
			border-radius: 8px;
			color: #fff;
			font-weight: 900;
			font-size: 30px;
		}
	}
</style>