<template>
	<view class="maincontent contentBg">

		<view class="text-content">
			<view class="uni-textarea">
				<textarea class="textarea" v-model="txt" placeholder-class="placehoderClass"
					placeholder="SOS求救短信内容二十字以内" :auto-height="true" maxlength="20" cursor-color="#BBE600" />
			</view>


		</view>
		<view class="footBtn">
			<view class="fright convert" @click.stop="saveTxt()">保存</view>
			<view class="clear"></view>
		</view>

		<view class="title">常用短信</view>
		<view class="staItem" v-for="item,index in list" @click="copyTo(item,index)">{{item}}</view>


		<MsgBox ref="msgPop" />
		<global-loading ref="loading" />
	</view>
</template>

<script>
	import request from '@/utils/request.js';
	import {
		showLoading,
		hideLoading,
		updateLoading
	} from '@/utils/loading.js';

	import {
		MsgSuccess,
		MsgError,
		MsgClose,
		MsgWarning,
		showPop,
		MsgInfo
	} from '@/utils/MsgPops.js'
	import Common from '@/utils/Common.js';
	import api from '@/api/670/HBY670.js';

	var these = null;
	var eventChannel = null;
	export default {
		data() {
			return {
				txt: '',
				oldTxt:'',
				list: ['出现危险，速来救我！', '被困险境，万分危急，求援！', '生死关头，请立刻报警'],
				device: {
					id: "",
					deviceName: "",
					deviceImei: "",
					deviceMac: "",
					communicationMode: 0,
					devicePic: "",
					typeName: "",
					bluetoothName: null,
					deviceStatus: null,
					bindingTime: "",
					onlineStatus: 0,
					battery: "0",
					latitude: null,
					longitude: null,
					alarmStatus: null,
					detailPageUrl: "",
					showConfirm: false,
					sosSmsMsg:null
				}
			}
		},
		computed: {


		},

		onUnload() {


		},
		onShow() {

		},
		onHide: function() {

		},

		onLoad() {

			these = this;


			eventChannel = this.getOpenerEventChannel();

			eventChannel.on('device', (data)=> {

				console.log("收到父页面的参数：" + JSON.stringify(data));
				these.device = data;
				if(data.sosSmsMsg){
					this.txt=data.sosSmsMsg;
				}
				this.init();
			});


		},
		methods: {
			init(){
				api.getDetail(this.device.id).then(res => {
				
					if (res && res.code == 200) {
						let data = res.data;
						if(data.length){
							data=data[0];
						}
						this.txt=data.sosSmsMsg;
					}
				});
			},
			copyTo(item, index) {
				this.txt = item;
			},

			saveTxt() {
				if (this.txt.replace(/ /g, '') == '') {
					MsgError('请输入通知内容', '', these);
					return;
				}

				showLoading(this, {
					text: '请稍候...'
				});
				console.log("this.device=",this.device);
				request({
					url: '/app/hby018a/device/SetSmsMsg',
					method: 'POST',
					data: {
						sendMsg: this.txt,
						deviceIds: [this.device.id]
					}
				}).then(res => {
					if (res && res.code == 200) {
						MsgSuccess('操作成功', '', these);
						
						if(eventChannel){
							eventChannel.emit('MsgOver', this.txt);
						}
						
						return;
					}
					MsgError(res.msg, '', these);
				}).catch(ex => {
					MsgError('出现错误,操作失败', '', these);
				}).finally(() => {
					hideLoading(these)
				})
			}

		}

	}
</script>

<style>
	.staItem {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 8px;
		background: rgba(26, 26, 26, 1);
		text-indent: 30rpx;
		color: rgba(255, 255, 255, 0.6);
		font-family: "PingFang SC";
		font-style: Regular;
		font-size: 28rpx;
		font-weight: 400;
		letter-spacing: 0.07px;
		margin-bottom: 25rpx;
	}

	.title {
		color: rgba(255, 255, 255, 0.87);
		margin: 15rpx 0rpx;
		font-family: "PingFang SC";
		font-style: Regular;
		font-size: 28rpx;
		font-weight: 400;
		line-height: 40rpx;
		width: 100%;
		height: 40rpx;
		letter-spacing: 0.07px;
		text-align: left;
	}

	.footBtn .convert {
		/* 组合 99 */
		width: 130rpx;
		height: 55rpx;
		line-height: 55rpx;
		border-radius: 180px;
		color: #232323;
		background-color: #AED600;
		text-align: center;
		font-family: 'PingFang SC';
		font-size: 24rpx;
		font-weight: 400;
		letter-spacing: 12rpx;
	}

	.placehoderClass {
		color: rgba(255, 255, 255, 0.6);

		font-family: PingFang SC;
		font-size: 32rpx;
		font-weight: 400;
		line-height: 44rpx;
		letter-spacing: 0.14px;
	}

	.textarea {
		min-height: 200rpx;

		width: 100%;
		box-sizing: border-box;
	}

	.text-content {
		border-radius: 16rpx;
		background: rgba(26, 26, 26, 1);
		width: 100%;
		height: auto;
		box-sizing: border-box;
		padding: 20rpx;
		margin-bottom: 20rpx;
	}

	.content {
		padding: 30rpx;
		width: 100%;
		min-height: 100vh;
		height: auto;
	}


	.navbarRight .img {
		width: 35rpx;
		height: 35rpx;
		margin-right: 20rpx;
	}

	.uni-navbar--fixed {
		top: 0rpx;
	}

	/deep/ .uni-navbar--fixed {
		top: 0px;
	}

	/deep/ .uni-navbar__placeholder {
		display: none !important;
	}
</style>