Skip to content

D
DoorLock
Commit 8e3435ae by 朱建香
Options

#29 

1.取消按钮样式修改
2.取消按钮点击后超时失败没有关闭
#30
关联和未关联页面修改【未完成】
parent 9a7ff923
Showing with 311 additions and 97 deletions
dev/src/lang/zh.json
......@@ -163,7 +163,7 @@
"opendoorMsgPush": "开门消息推送",
"unbindDialogTip": "确认解除绑定",
"unbindSuccess": "<img src='../../resources/image/green_unbindSuccess_icon.png'>解绑成功",
"unbindFailue": "<img src='../../resources/image/green_unbindFail_icon.png'>解绑失败"
"unbindFailue": "<img src='../../resources/image/green_unbindSuccess_icon.png'>解绑失败"
},
"editName":{
"nameInputTip": "请输入门锁名称",
......@@ -262,7 +262,7 @@
"unbindDialogTip": "<img src='../../resources/image/green_unbind_icon.png'>解绑后，该用户不能对门锁下的信息进行查看",
"deleteUserDialogTip": "删除后，用户对应的开锁id取消关联，同时失去信息查看权限。",
"unbindSuccess": "<img src='../../resources/image/green_unbindSuccess_icon.png'>解绑成功",
"unbindFailue": "<img src='../../resources/image/green_unbindFail_icon.png'>解绑失败",
"unbindFailue": "<img src='../../resources/image/green_unbindSuccess_icon.png'>解绑失败",
"guideStep1Tip1": "邀请绑定成功",
"guideStep1Tip2": "（受邀用户可查看开门记录，报警记录等<br>相关门锁信息）",
"guideStep3Tip": "关联后可了解<br>该用户的开门情况",
......@@ -291,6 +291,7 @@
"unlockInfo":{
"bindUnlockInfo": "已关联的开锁信息",
"noInfoTip": "尚未关联开锁信息",
"bindSoon": "快速关联",
"passwordOpenDoor": "密码",
"fingerprintOpenDoor": "指纹",
"ICcardOpenDoor": "IC卡",
......@@ -335,7 +336,8 @@
"logoutDialogTip": "确定要退出系统吗？"
},
"editNickname": {
"nickNameInputTip": "请输入昵称"
"nickNameInputTip": "请输入昵称",
"nickNameTypeTip": "请输入中文、字母和数字"
},
"editPassword": {
"newPasswordInputTip": "请输入新密码",
......@@ -388,8 +390,5 @@
"tip": "版本更新",
"update":"更新",
"miss": "暂不更新"
},
"textTip":{
"textType": "请输入中文、字母和数字"
}
}
\ No newline at end of file
dev/src/view/addDevice/v_wifiAdd.js
......@@ -165,8 +165,14 @@ function connectButtonTap(self){
}
},1000);
uComponents.showProcess(self, 0, Vue.t('addDevice.loading'), [{
"class": 'custom-process-button', 'text': Vue.t('btn.cancel'), 'callback': () => {
"class": 'custom-process-button custom-process-cancelButton', 'text': Vue.t('btn.cancel'), 'callback': () => {
uComponents.hideProcess(self);
window.clearInterval(self.timeout);
//停止配网
iot.business.sds.stopFindDevices({
success: (response) => {},
error: (error) => {}
});
}
}]);
iot.business.sds.findWifi({
......@@ -194,8 +200,14 @@ function connectButtonTap(self){
iotDebug.upload(iot,'配网中');
}
uComponents.showProcess(self, 0, Vue.t('wifiAdd.wifiBinding'), [{
"class": 'custom-process-button', 'text': Vue.t('btn.cancel'), 'callback': () => {
"class": 'custom-process-button custom-process-cancelButton', 'text': Vue.t('btn.cancel'), 'callback': () => {
uComponents.hideProcess(self);
window.clearInterval(self.timeout);
//停止配网
iot.business.sds.stopFindDevices({
success: (response) => {},
error: (error) => {}
});
}
}]);
}else if(response.data == 'provisioned success'){
......@@ -207,8 +219,14 @@ function connectButtonTap(self){
}
//wifi连接成功，停止连接wifi
uComponents.showProcess(self, 0, Vue.t('wifiAdd.wifiBindSuccess'), [{
"class": 'custom-process-button', 'text': Vue.t('btn.cancel'), 'callback': () => {
"class": 'custom-process-button custom-process-cancelButton', 'text': Vue.t('btn.cancel'), 'callback': () => {
uComponents.hideProcess(self);
window.clearInterval(self.timeout);
//停止配网
iot.business.sds.stopFindDevices({
success: (response) => {},
error: (error) => {}
});
}
}]);
}
......@@ -242,8 +260,14 @@ function connectButtonTap(self){
iotDebug.upload(iot,'激活中');
}
uComponents.showProcess(self, 0, Vue.t('wifiAdd.deviceActivating'), [{
"class": 'custom-process-button', 'text': Vue.t('btn.cancel'), 'callback': () => {
"class": 'custom-process-button custom-process-cancelButton', 'text': Vue.t('btn.cancel'), 'callback': () => {
uComponents.hideProcess(self);
window.clearInterval(self.timeout);
//停止配网
iot.business.sds.stopFindDevices({
success: (response) => {},
error: (error) => {}
});
}
}]);
}else if(response.data == "joined success"){
......
dev/src/view/doorlockUsers/v_unlockInfo.js
......@@ -21,7 +21,13 @@ function init() {
unlockInfoList: [],
openLockInfoList: [],
extras: {},
role: null
role: null,
lockItems: [],
selectItem: 0,
unlockInfoListTip: '暂无数据',
noHistoryTip: '暂无历史记录',
tipShowFlag: true,
infoList: []
},
mounted(){
this.extras = iot.navigator.getExtras();
......@@ -35,6 +41,7 @@ function init() {
self.unlockInfoList = [];
getBindedLockInfo(self);
});
this.lockItems = [{text: Vue.t('unlockInfo.bindSoon')},{text: Vue.t('unlockInfo.bindUnlockInfo')}];
},
methods:{
getUnlockInfoList(){
......@@ -49,6 +56,18 @@ function init() {
setOpenLockInfoList(list){
this.openLockInfoList = list;
},
getSelectItem(){
return this.selectItem;
},
setSelectItem(index){
this.selectItem = index;
},
getInfoList(){
return this.infoList;
},
setInfoList(list){
this.infoList = list;
},
//tap <
onBackTap(){
backTap();
......@@ -60,7 +79,13 @@ function init() {
//tap list row btn
onUnlockInfoListButtonTap(value, buttonValue){
unlockInfoListButtonTap(this, value, buttonValue);
}
},
onItemChange(key){
itemChange(this, key);
},
onImgButtonTap(index, buttonIndex){
imgButtonTap(this, index, buttonIndex);
}
}
}).$mount('#app');
}
......@@ -144,17 +169,19 @@ function getBindedLockInfo(self){
list[i] = {
title: Vue.t('unlockInfo.'+config.openDoorMode[data[i].mode]+'')+j+'',
subtitle: 'ID:'+data[i].openId,
buttons: self.extras.role ? [] : [{'text': data[i].mode == 20 ? Vue.t('unlockInfo.cancelHijack') : data[i].mode == 2 ? Vue.t('unlockInfo.setHijack') : ''},{'text': Vue.t('unlockInfo.cancelAssociated')}]
// buttons: self.extras.role ? [] : [{'text': data[i].mode == 20 ? Vue.t('unlockInfo.cancelHijack') : data[i].mode == 2 ? Vue.t('unlockInfo.setHijack') : ''},{'text': Vue.t('unlockInfo.cancelAssociated')}]
buttons: self.extras.role ? [] : (data[i].mode == 20 || data[i].mode == 2) ? [{"imgSrc": data[i].mode == 20 ? "../../resources/image/green_deleteHijack_icon.png" : "../../resources/image/green_setHijack_icon.png"},{"imgSrc": "../../resources/image/green_deleteUnlockInfo_icon.png"}] : [{"imgSrc": "../../resources/image/green_deleteUnlockInfo_icon.png"}]
};
j++;
lastMode = data[i].mode;
}
self.setUnlockInfoList(self.getUnlockInfoList().concat(list));
self.setInfoList(self.getUnlockInfoList());
console.log(self.getUnlockInfoList());
//更新列表数据
uComponents.changeSwipeList(self, self.getUnlockInfoList());
// uComponents.changeSwipeList(self, self.getUnlockInfoList());
}else{
uComponents.changeSwipeList(self, []);
// uComponents.changeSwipeList(self, []);
}
},
error: (error) => {
......@@ -299,3 +326,27 @@ function unlockInfoListButtonTap(self, value, buttonValue) {
);
}
}
function itemChange(self, key){
self.setInfoList([]);
if(key == 0){
//获取未关联的开门记录
self.setInfoList([
{"title": "aaaa", "subtitle": "bbbbb", "buttons": [{"imgSrc": "../../resources/image/green_addUnlckInfo_icon.png"}]}
]);
}else if(key == 1){
//获取已关联的开门记录
self.setUnlockInfoList([]);
getBindedLockInfo(self);
// self.setInfoList([
// {"title": "门锁ID", "subtitle": "bbbbb", "buttons": [{"imgSrc": "../../resources/image/green_setHijack_icon.png"},{"imgSrc": "../../resources/image/green_deleteUnlockInfo_icon.png"}]}
// ]);
}
console.log(key);
self.setSelectItem(key);
}
function imgButtonTap(self, index, buttonIndex){
console.log(index, buttonIndex);
}
web/lib/less/doorlockUsers/unlockInfo.less
......@@ -50,52 +50,98 @@
.u-swipe-list();
.custom-swipe-list{
position: absolute;
top: 44px;
bottom: 0;
left: 0;
height: auto;
.u-swipe-list-scroll .u-swipe-list-row{
.u-swipe-list-handle{
background-color: @CUSTOM-UNLOCKINFO-SWIPELIST-COMPONENT-ROW-BG;
padding: 0 42px;
height: 55px;
font-size: @CUSTOM-UNLOCKINFO-SWIPELIST-COMPONENT-TEXT-FONTSIZE;
.u-swipe-list-title{
float: left;
}
.u-swipe-list-subtitle{
float: right;
}
}
.u-swipe-list-button{
right: 32px;
div{
width: 85px;
color: @CUSTOM-UNLOCKINFO-SWIPELIST-COMPONENT-BUTTON-COLOR;
font-size: @CUSTOM-UNLOCKINFO-SWIPELIST-COMPONENT-BUTTON-FONTSIZE;
&:nth-last-of-type(1),
&:nth-last-of-type(2){
background-color: @CUSTOM-UNLOCKINFO-SWIPELIST-COMPONENT-BUTTON-BG;
}
}
}
&:after{
.white_gradient_border();
}
&.active .u-swipe-list-handle{
left: -202px;
}
}
//上拉加载
.u-swipe-list-load{
.listLoad();
}
//swipeList 无内容
.u-swipeList-tip{
.listNoCont("unlockNoCont.png",70px 70px);
}
.tab{
.display-box();
position: relative;
border-bottom: 1px solid #575a6d;/*no*/
li{
.flex();
text-align: center;
height: 45px;
line-height: 45px;
position: relative;
color: #575a6d;
font-size: 16px;
&:after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 2px /*except*/;
background-color: transparent;
}
}
.active{
color: #fff;
&:after{
background-color: #FFF;
}
}
}
.infoList-list{
width: 100%;
overflow: auto;
position: absolute;
top: 90px;
bottom: 0;
left: 0;
.infoList-list-scroll .infoList-list-row{
position: relative;
height: 55px;
padding: 0 42px;
.display-box();
.box-vertical-alignment();
.infoList-list-handle{
.u-swipe-list-title{
.text_oneRow_ellipsis();
font-size: 16px;
}
.u-swipe-list-subtitle{
.text_oneRow_ellipsis();
}
}
.infoList-list-button{
position: absolute;
top: 0;
bottom: 0;
right: 25px;
z-index: 1;
.display-box();
.box-vertical-alignment();
.infoList-list-buttonCont{
float: left;
padding: 10px;
margin: 0 5px;
img{
width: 23px;
height: 23px;
}
}
}
&:after{
.defaultBorder();
.white_gradient_border();
}
}
//上拉加载
.infoList-list-load{
text-align: center;
}
//list 无内容
.infoList-list-tip{
.transformV_center(left,0);
width: 100%;
text-align: center;
.listNoCont("unlockNoCont.png",70px 70px);
}
//list 无历史记录
.noHistory-list-tip{
.listNoCont("noCont.png",70px 70px);
}
}
//绑定开锁信息
......
web/resources/image/noCont.png
web/resources/image/noCont.png

3.54 KB | W: | H:

web/resources/image/noCont.png

3.62 KB | W: | H:

web/resources/image/noCont.png
web/resources/image/noCont.png
web/resources/image/noCont.png
web/resources/image/noCont.png
  • 2-up
  • Swipe
  • Onion skin
web/resources/image/unlockNoCont.png
web/resources/image/unlockNoCont.png

5.4 KB | W: | H:

web/resources/image/unlockNoCont.png

5.35 KB | W: | H:

web/resources/image/unlockNoCont.png
web/resources/image/unlockNoCont.png
web/resources/image/unlockNoCont.png
web/resources/image/unlockNoCont.png
  • 2-up
  • Swipe
  • Onion skin
web/view/doorlockUsers/unlockInfo.css
......@@ -615,64 +615,139 @@ p {
text-align: center;
}
.custom-swipe-list {
.tab {
display: -webkit-box;
display: -webkit-flex;
display: flex;
position: relative;
border-bottom: 1px solid #575a6d;
}
.tab li {
-webkit-box-flex: 1;
-webkit-flex: 1;
flex: 1;
text-align: center;
height: 1.2rem;
line-height: 1.2rem;
position: relative;
color: #575a6d;
font-size: 0.427rem;
}
.tab li:after {
content: '';
position: absolute;
top: 1.173rem;
bottom: 0;
left: 0;
height: auto;
right: 0;
height: 0.053rem ;
background-color: transparent;
}
.custom-swipe-list .u-swipe-list-scroll .u-swipe-list-row .u-swipe-list-handle {
background-color: #242635;
padding: 0 1.12rem;
height: 1.467rem;
font-size: 0.427rem;
.tab .active {
color: #fff;
}
.custom-swipe-list .u-swipe-list-scroll .u-swipe-list-row .u-swipe-list-handle .u-swipe-list-title {
float: left;
.tab .active:after {
background-color: #FFF;
}
.custom-swipe-list .u-swipe-list-scroll .u-swipe-list-row .u-swipe-list-handle .u-swipe-list-subtitle {
float: right;
.infoList-list {
width: 100%;
overflow: auto;
position: absolute;
top: 2.4rem;
bottom: 0;
left: 0;
}
.custom-swipe-list .u-swipe-list-scroll .u-swipe-list-row .u-swipe-list-button {
right: 0.853rem;
.infoList-list .infoList-list-scroll .infoList-list-row {
position: relative;
height: 1.467rem;
padding: 0 1.12rem;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
}
.custom-swipe-list .u-swipe-list-scroll .u-swipe-list-row .u-swipe-list-button div {
width: 2.267rem;
color: #00ffff;
.infoList-list .infoList-list-scroll .infoList-list-row .infoList-list-handle .u-swipe-list-title {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-size: 0.427rem;
}
.custom-swipe-list .u-swipe-list-scroll .u-swipe-list-row .u-swipe-list-button div:nth-last-of-type(1),
.custom-swipe-list .u-swipe-list-scroll .u-swipe-list-row .u-swipe-list-button div:nth-last-of-type(2) {
background-color: transparent;
.infoList-list .infoList-list-scroll .infoList-list-row .infoList-list-handle .u-swipe-list-subtitle {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.infoList-list .infoList-list-scroll .infoList-list-row .infoList-list-button {
position: absolute;
top: 0;
bottom: 0;
right: 0.667rem;
z-index: 1;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
}
.infoList-list .infoList-list-scroll .infoList-list-row .infoList-list-button .infoList-list-buttonCont {
float: left;
padding: 0.267rem;
margin: 0 0.133rem;
}
.infoList-list .infoList-list-scroll .infoList-list-row .infoList-list-button .infoList-list-buttonCont img {
width: 0.613rem;
height: 0.613rem;
}
.custom-swipe-list .u-swipe-list-scroll .u-swipe-list-row:after {
.infoList-list .infoList-list-scroll .infoList-list-row:after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 1px;
background: #bbb;
background: -webkit-linear-gradient(left, #242635, #fff, #242635);
background: linear-gradient(to right, #242635, #fff, #242635);
}
.custom-swipe-list .u-swipe-list-scroll .u-swipe-list-row.active .u-swipe-list-handle {
left: -5.387rem;
.infoList-list .infoList-list-load {
text-align: center;
}
.custom-swipe-list .u-swipe-list-load {
color: #00ffff;
.infoList-list .infoList-list-tip {
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: 100%;
text-align: center;
background-image: url("../../resources/image/unlockNoCont.png");
background-position: top center;
background-repeat: no-repeat;
-webkit-background-size: 1.867rem 1.867rem;
background-size: 1.867rem 1.867rem;
color: #91929a;
font-size: 0.427rem;
-webkit-transform: scale(0.7);
transform: scale(0.7);
height: 0.933rem;
line-height: 0.933rem;
padding-top: 2.347rem;
}
.custom-swipe-list .u-swipeList-tip {
background-image: url("../../resources/image/unlockNoCont.png");
.infoList-list .noHistory-list-tip {
background-image: url("../../resources/image/noCont.png");
background-position: top center;
background-repeat: no-repeat;
-webkit-background-size: 1.867rem 1.867rem;
......
web/view/doorlockUsers/unlockInfo.html
......@@ -19,7 +19,6 @@
<script type="text/javascript" src="../../lib/js/UIOT.js"></script>
</head>
<body ontouchstart="">
<div id="app" v-cloak>
<div class="header">
<v-touch tag="span" class="header-left icon" v-on:tap="onBackTap">&#xe611;</v-touch>
......@@ -27,9 +26,30 @@
<v-touch tag="span" class="header-right" v-on:tap="onAddTap" v-show="!role">{{ $t('btn.add') }}</v-touch>
</div>
<div class="content">
<p class="title">{{ $t('unlockInfo.bindUnlockInfo') }}</p>
<u-swipe-list ref="uswipelist" :init-param="componentsConfig.unlockInfoList.initParam"
v-on:u-swipe-list-button-tap="onUnlockInfoListButtonTap(arguments[0],arguments[1])"></u-swipe-list>
<!--<p class="title">{{ $t('unlockInfo.bindUnlockInfo') }}</p>-->
<ul class="tab">
<v-touch tag="li" v-for="(item, key, index) in lockItems" v-text="lockItems[key].text"
:class="{active: (selectItem == key)}" v-on:tap="onItemChange(key)">
</v-touch>
</ul>
<!--<u-swipe-list ref="uswipelist" :init-param="componentsConfig.unlockInfoList.initParam"
v-on:u-swipe-list-button-tap="onUnlockInfoListButtonTap(arguments[0],arguments[1])"></u-swipe-list>-->
<div class="infoList-list">
<ul class="infoList-list-scroll" v-show="infoList.length">
<li class="infoList-list-row" v-for="(item, index) in infoList">
<div class="infoList-list-handle">
<p class="infoList-list-title">{{ item.title }}</p>
<p class="infoList-list-subtitle">{{ item.subtitle }}</p>
</div>
<div class="infoList-list-button">
<v-touch tag="div" class="infoList-list-buttonCont" v-for="(button, buttonIndex) in item.buttons"v-on:tap="onImgButtonTap(index, buttonIndex)">
<img :src="button.imgSrc">
</v-touch>
</div>
</li>
</ul>
<p class="infoList-list-tip" v-bind:class="{'noHistory-list-tip':selectItem == 0}" v-show="tipShowFlag && (infoList.length == 0)">{{ selectItem == 0 ? noHistoryTip : unlockInfoListTip }}</p>
</div>
</div>
<u-dialog ref="udialog" :init-param="componentsConfig.dialog.initParam"></u-dialog>
<u-loading ref="uloading" :init-param="componentsConfig.loading.initParam"></u-loading>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment