398 lines
8.0 KiB
Vue
398 lines
8.0 KiB
Vue
<template>
|
|
<view class="maincontent contentBg">
|
|
<view class='btnAdd' @click="showEdit(null,null)">添加</view>
|
|
<view class="clear"></view>
|
|
<view v-for="item,index in list" v-if="item" class="item">
|
|
<view class="itemTitle">紧急联系人{{index+1}}</view>
|
|
<view class="center main">
|
|
<view class="phone">{{item}}</view>
|
|
<view class="btns">
|
|
<view class="btnEdit" @click.stop="showEdit(item,index)">修改</view>
|
|
<view class="btnDrop" @click.stop="dropPerson(item,index)">删除</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="line" v-if="index%2==0"></view>
|
|
</view>
|
|
|
|
<mescroll-empty v-show="calcList.length==0" :option="Status.optEmpty"></mescroll-empty>
|
|
|
|
<!-- 编辑弹窗 -->
|
|
<MsgBox ref="editPop">
|
|
<view>
|
|
修改紧急联系人
|
|
</view>
|
|
<view class="w60">
|
|
|
|
<input type="text" placeholder="输入手机号" class="uni-input" v-model="cEdit.txt" />
|
|
</view>
|
|
|
|
</MsgBox>
|
|
|
|
|
|
<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,
|
|
MsgPrompt
|
|
} from '@/utils/MsgPops.js'
|
|
import Common from '@/utils/Common.js';
|
|
var these = null;
|
|
var eventChannel = null;
|
|
export default {
|
|
data() {
|
|
return {
|
|
list: ['', ''],
|
|
cEdit: {
|
|
txt: '',
|
|
index: -1
|
|
},
|
|
Status: {
|
|
optEmpty: {
|
|
tip: '暂无数据',
|
|
icon: '/static/images/common/empty.png'
|
|
}
|
|
},
|
|
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: "/pages/650/HBY650",
|
|
showConfirm: false
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
calcList() {
|
|
let f = this.list.filter((v, i) => {
|
|
return v;
|
|
});
|
|
|
|
return f;
|
|
}
|
|
|
|
},
|
|
|
|
onUnload() {
|
|
|
|
|
|
|
|
},
|
|
onShow() {
|
|
|
|
},
|
|
onHide: function() {
|
|
|
|
},
|
|
|
|
onLoad() {
|
|
|
|
these = this;
|
|
|
|
|
|
eventChannel = this.getOpenerEventChannel();
|
|
|
|
eventChannel.on('device', (data) => {
|
|
|
|
console.log("收到父页面的参数：" + JSON.stringify(data));
|
|
these.device = data;
|
|
|
|
this.list[0] = data.contact1Phone;
|
|
this.list[1] = data.contact2Phone;
|
|
|
|
});
|
|
|
|
|
|
},
|
|
methods: {
|
|
notifyPrevPage(){//通知上一个页面
|
|
if (eventChannel) {
|
|
eventChannel.emit('linkManOver', this.list);
|
|
}
|
|
},
|
|
saveData(json) {
|
|
return request({
|
|
url: "/app/hby018a/device/SetContactPhone",
|
|
method: 'POST',
|
|
data:json
|
|
});
|
|
},
|
|
dropPerson(item, index) {
|
|
showPop({
|
|
iconUrl: '/static/images/common/dell.png',
|
|
borderColor: "#e034344d",
|
|
buttonBgColor: "#E03434",
|
|
bgColor: '#383934cc',
|
|
buttonTextColor: '#FFFFFFde',
|
|
message: "确定删除紧急联系人" + (index + 1),
|
|
buttonText: '确定',
|
|
showSlot: false,
|
|
showCancel: true,
|
|
buttonCancelText: '取消',
|
|
okCallback: () => {
|
|
|
|
let url = '/app/hby018a/device/SetContactPhone';
|
|
|
|
if (!url) {
|
|
this.$set(this.list,index,"");
|
|
return;
|
|
}
|
|
let json = {
|
|
deviceId: this.device.id,
|
|
contact1Phone:index == 0 ? "" : this.list[0],
|
|
contact2Phone: index == 0 ? this.list[1] : ""
|
|
};
|
|
showLoading(these,{text:'请稍候...'});
|
|
this.saveData(json).then(res => {
|
|
if (res && res.code == 200) {
|
|
|
|
this.$set(this.list,index,"");
|
|
this.notifyPrevPage();
|
|
return;
|
|
}
|
|
MsgError(res.msg, '', these);
|
|
}).catch(ex => {
|
|
MsgError(ex.msg, '', these);
|
|
}).finally(() => {
|
|
hideLoading(these)
|
|
});
|
|
|
|
|
|
|
|
}
|
|
}, these, false);
|
|
|
|
},
|
|
showEdit(item, index) {
|
|
if (!item && this.calcList.length >= 2) {
|
|
MsgError('紧急联系人数量达到上限', '', these);
|
|
return;
|
|
}
|
|
if (item) {
|
|
this.cEdit.txt = item;
|
|
this.cEdit.index = index;
|
|
} else {
|
|
this.cEdit.index = this.calcList.length;
|
|
}
|
|
MsgPrompt(these, 'editPop', () => {
|
|
if (this.cEdit.txt.replace(/ /g, '') == '') {
|
|
MsgError('请输入联系人号码', '', these);
|
|
return true;
|
|
}
|
|
let reg = /^1\d{10}$/;
|
|
if (!reg.test(this.cEdit.txt)) {
|
|
MsgError('手机号格式不正确', '', these);
|
|
return true;
|
|
}
|
|
|
|
if (item) {
|
|
let f = this.list.find((v, i) => {
|
|
if (i == index) {
|
|
return false;
|
|
}
|
|
if (v == this.cEdit.txt) {
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
if (f) {
|
|
MsgError('已设置了相同的手机号', '', these);
|
|
return true;
|
|
}
|
|
}
|
|
|
|
let requestCall = () => {
|
|
|
|
this.$set(this.list, this.cEdit.index, this.cEdit.txt)
|
|
|
|
|
|
this.cEdit.txt = "";
|
|
this.cEdit.index = -1;
|
|
}
|
|
|
|
let url = '/app/hby018a/device/SetContactPhone';
|
|
|
|
if (!url) {
|
|
requestCall();
|
|
return;
|
|
}
|
|
let json = {
|
|
deviceId: this.device.id,
|
|
contact1Phone: this.cEdit.index == 0 ? this.cEdit.txt : this.list[0],
|
|
contact2Phone: this.cEdit.index == 0 ? this.list[1] : this.cEdit.txt
|
|
};
|
|
showLoading(these,{text:'请稍候...'});
|
|
this.saveData(json).then(res => {
|
|
if (res && res.code == 200) {
|
|
requestCall();
|
|
this.notifyPrevPage();
|
|
return;
|
|
}
|
|
MsgError(res.msg, '', these);
|
|
}).catch(ex => {
|
|
MsgError(ex.msg, '', these);
|
|
}).finally(() => {
|
|
hideLoading(these)
|
|
});
|
|
|
|
}, false);
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.item .main {
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.line {
|
|
width: 100%;
|
|
height: 0rpx;
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
|
|
margin: 30rpx 0rpx 20rpx 0rpx;
|
|
}
|
|
|
|
|
|
.phone {
|
|
border-radius: 8px;
|
|
background: rgba(26, 26, 26, 1);
|
|
width: calc(100% - 160rpx);
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
text-indent: 20rpx;
|
|
}
|
|
|
|
.btns .btnEdit {
|
|
color: rgba(255, 255, 255, 0.87);
|
|
margin-right: 20rpx;
|
|
}
|
|
|
|
.btns .btnDrop {
|
|
color: rgba(224, 52, 52, 1);
|
|
}
|
|
|
|
.btns {
|
|
width: 160rpx;
|
|
height: 80rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowrap;
|
|
align-content: center;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
font-family: "PingFang SC";
|
|
font-style: Regular;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
|
|
letter-spacing: 0.07px;
|
|
text-align: left;
|
|
|
|
}
|
|
|
|
.itemTitle {
|
|
color: rgba(255, 255, 255, 0.87);
|
|
|
|
font-family: "PingFang SC";
|
|
font-style: Regular;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
line-height: 40rpx;
|
|
height: 40rpx;
|
|
letter-spacing: 0.07px;
|
|
text-align: left;
|
|
}
|
|
|
|
.w60 {
|
|
width: 70%;
|
|
margin-left: 15%;
|
|
}
|
|
|
|
.uni-input {
|
|
margin: 30rpx 0rpx 0rpx 0rpx;
|
|
background-color: #121212;
|
|
width: 100%;
|
|
height: 60rpx;
|
|
color: #ffffffde;
|
|
border: 1rpx solid #BBE600de;
|
|
border-radius: 8rpx;
|
|
font-size: 26rpx;
|
|
text-indent: 8rpx;
|
|
font-family: "PingFang SC";
|
|
line-height: 60rpx;
|
|
caret-color: #BBE600;
|
|
font-weight: 200;
|
|
text-align: left;
|
|
text-indent: 10rpx;
|
|
}
|
|
|
|
.btnAdd {
|
|
float: right;
|
|
color: rgba(255, 255, 255, 0.87);
|
|
font-family: "PingFang SC";
|
|
font-style: Regular;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
line-height: 40rpx;
|
|
height: 40rpx;
|
|
letter-spacing: 0.07px;
|
|
text-align: left;
|
|
}
|
|
|
|
.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> |