Skip to content

D
DoorLock
Commit d2cdee4c by wangying
Options

#8 1）device/index.html 添加开启通知弹出框，制作该组件样式 

   2）myInfo/ 添加help.html
parent ca597bec
Showing with 286 additions and 1 deletions
dev/src/lang/zh.json
...@@ -25,7 +25,8 @@ ...@@ -25,7 +25,8 @@
"add": "添加", "add": "添加",
"next": "下一步", "next": "下一步",
"iSee": "我知道了", "iSee": "我知道了",
"unbindDoorlock": "解绑门锁" "unbindDoorlock": "解绑门锁",
"finish": "完成"
}, },
"dialog":{ "dialog":{
"confirm": "确认", "confirm": "确认",
...@@ -337,5 +338,19 @@ ...@@ -337,5 +338,19 @@
"deviceList":{ "deviceList":{
"model": "型号：", "model": "型号：",
"noDeviceTip": "暂无产品型号" "noDeviceTip": "暂无产品型号"
},
"help": {
"title": "如何解决安卓手机收不到消息提醒？",
"contTip": "因部分安卓系统会在锁屏时自动清理后台运行的应用导致无法及时通知，需根据引导进行以下设置后即可随时随地收到消息推送。",
"contTitle": "如何设置：",
"contSubtitle1": "1.设置自启动",
"contText1-1": "安卓5.0以上系统需要设置应用自启动，未加入自启动的应用在杀进程或重新开机后无法推送通知。",
"contText1-2": "在软件授权管理或启动管理中（通常在手机管家或设置菜单中）找到本app并开启自启动。",
"step": "操作步骤：",
"contSubtitle2": "2.设置后台保活",
"contText2-1": "安卓7.0以上系统需要设置受保护的后台应用，未设置的应用在设备进入睡眠后会自动杀掉，只有手动开启应用才能恢复消息推送。",
"contText2-2": "在设置中找到电量与性能，点击受保护的后台应用，找到本app并开启保护。",
"contText3-1": "安卓手机须将应用加入白名单中，否则清理后台杀掉应用进程后，只有手动开启应用才能恢复消息推送。",
"contText3-2": "启动本app后打开多任务页面（清理后台应用的页面），将本app加入白名单。"
} }
} }
\ No newline at end of file
dev/src/view/myInfo/v_help.js 0 → 100644
/**
* v_help.js
* Version: 0.1
* User: wy
* Date: 2017-12-27
* Copyright(c) 2017. U-GEN Tech.Co,Ltd. All Rights Reserved.
* 帮助页面
*/
import config from '../../public/config.js';
import {iot, uPublic, uComponents} from '../../public/public.js';
iot.ready(init);
function init() {
//通用 组件
uPublic.componentsInit(['u-button','u-dialog','u-loading']);
const app = new Vue({
data:{
//配置组件
componentsConfig: initComponentsConfig()
},
mounted(){
},
methods:{
//tap 完成
onFinishButtonTap(){
finishButtonTap();
}
}
}).$mount('#app');
}
//配置组件参数
function initComponentsConfig() {
return {
finishButton: {
initParam: {
class: 'custom-button',
text: Vue.t('btn.finish')
}
},
dialog: {
initParam: {
class: 'custom-dialog'
}
},
loading: {
initParam: {
class: 'custom-loading'
}
}
}
}
//tap 完成
function finishButtonTap(){
}
\ No newline at end of file
web/lib/less/device/device.less
...@@ -479,4 +479,99 @@ ...@@ -479,4 +479,99 @@
.active .u-marquee-text { .active .u-marquee-text {
-webkit-animation: none; -webkit-animation: none;
animation: none; animation: none;
}
.u-notice{
.mask(1051,@CUSTOM-BACKDROP-BG);
.u-notice-box{
width: 335px;
height: 300px;
.transform_center();
background-color: #242635;
color: #00ffff;
border: 1px solid;/*no*/
border-radius: 5px;
.u-notice-title{
position: relative;
padding-top: 10px;
font-size: 16px;
text-align: center;
}
.u-notice-close{
position: absolute;
top: 0;
right: 0;
width: 40px;
height: 100%;
padding-top: 10px;
.iconfont(25px);
}
.u-notice-content{
.bgImgSize(100%,147px,"noticeContBg.png",center,auto 100%);
padding-top: 61px;
}
.u-notice-switch{
width: 150px;
margin: 15px auto;
padding: 10px 0;
text-align: center;
font-size: 12px;
.u-notice-switch-handle{
display: inline-block;
vertical-align: middle;
position: relative;
margin-right: 10px;
width: 17px;
height: 17px;
&:before{
position: absolute;
top: 0;
left: 0;
.iconfont(17px);
}
}
&.u-notice-switch-on .u-notice-switch-handle:before{
content: '\e6aa';
}
&.u-notice-switch-off .u-notice-switch-handle:before{
content: '\e6a9';
}
}
.u-notice-button{
.button(235px);
line-height: 1;
margin: 0 auto;
text-align: center;
padding: 10px 0;
}
.clearfix{
overflow: hidden;
padding: 0 54px;
}
.leftCont{
float: left;
}
.rightCont{
float: right;
}
.logo{
.bgImgSize(15px,15px,"logo1.png",center,cover);
display: inline-block;
vertical-align: middle;
margin: 0 -8px 0 8px;
}
.smallFont{
color: #00b2b2;
font-size: 16px;
.transform(scale(0.5));
display: inline-block;
vertical-align: middle;
}
.tip{
text-align: center;
font-size: 12px;
margin-top: 9px;
line-height: 16px;
}
}
} }
\ No newline at end of file
web/lib/less/myInfo/help.less 0 → 100644
@import "../public/public.less";
@import "../public/header.less";
.title{
span{
.iconfont(16px);
margin-right: 12px;
}
font-size: 16px;
text-align: center;
padding-top: 28px;
}
.helpCont{
margin: 28px 35px 0;
li{
margin-bottom: 17px;
color: #91929a;
font-size: 12px;
line-height: 15px;
text-align: justify;
.contSubtitle{
font-size: 14px;
}
p{
margin-bottom: 8px;
}
}
.white{
color: #fff;
}
.contTitle{
font-size: 16px;
margin-top: 28px;
margin-bottom: 20px;
}
}
\ No newline at end of file
web/view/device/index.html
...@@ -115,6 +115,28 @@ ...@@ -115,6 +115,28 @@
</u-comm-loading> </u-comm-loading>
</div> </div>
</transition> </transition>
<transition name="fade">
<div class="u-notice" v-show="noticeShowFlag">
<div class="u-notice-box">
<p class="u-notice-title">
开启通知
<span class="u-notice-close">&#xe678;</span>
</p>
<div class="u-notice-content">
<div class="clearfix">
<p class="leftCont"><span class="logo"></span><span class="smallFont">U智锁</span></p>
<p class="rightCont"><span class="smallFont">现在</span></p>
</div>
<div class="tip">开启通知后您将可以及时获取门锁报警<br>提醒、门锁开门消息通知。</div>
</div>
<div class="u-notice-switch u-notice-switch-on">
<span class="u-notice-switch-handle"></span>我知道了
</div>
<div class="u-notice-button">前往开启通知设置</div>
</div>
</div>
</transition>
<u-dialog ref="udialog" :init-param="componentsConfig.dialog.initParam"></u-dialog> <u-dialog ref="udialog" :init-param="componentsConfig.dialog.initParam"></u-dialog>
<u-loading ref="uloading" :init-param="componentsConfig.loading.initParam"></u-loading> <u-loading ref="uloading" :init-param="componentsConfig.loading.initParam"></u-loading>
</div> </div>
......
web/view/myInfo/help.html 0 → 100644
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<meta name="format-detection" content="telephone=no"/>
<title></title>
<link rel="stylesheet" type="text/css" href="../../lib/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./help.css">
<style type="text/css">
[v-cloak]{
display: none;
}
</style>
<script type="text/javascript" src="../../lib/js/p.js"></script>
<script type="text/javascript" src="../../lib/js/UIOT.js"></script>
</head>
<body ontouchstart="">
<div id="app" v-cloak>
<div class="content">
<p class="title"><span>&#xe606;</span>{{ $t('help.title') }}</p>
<ul class="helpCont">
<li class="white">{{ $t('help.contTip') }}</li>
<li class="white contTitle">{{ $t('help.contTitle') }}</li>
<li>
<p class="contSubtitle white">{{ $t('help.contSubtitle1') }}</p>
<p>{{ $t('help.contText1-1') }}</p>
<p><span class="white">{{ $t('help.step') }}</span>{{ $t('help.contText1-2') }}</p>
</li>
<li>
<p class="contSubtitle white">{{ $t('help.contSubtitle2') }}</p>
<p>{{ $t('help.contText2-1') }}</p>
<p><span class="white">{{ $t('help.step') }}</span>{{ $t('help.contText2-2') }}</p>
</li>
<li>
<p class="contSubtitle white">3.添加应用白名单</p>
<p>{{ $t('help.contText3-1') }}</p>
<p><span class="white">{{ $t('help.step') }}</span>{{ $t('help.contText3-2') }}</p>
</li>
</ul>
<u-button :init-param="componentsConfig.finishButton.initParam" v-on:u-button-tap="onFinishButtonTap"></u-button>
</div>
<u-dialog ref="udialog" :init-param="componentsConfig.dialog.initParam"></u-dialog>
<u-loading ref="uloading" :init-param="componentsConfig.loading.initParam"></u-loading>
</div>
<script type="text/javascript" src="./help.js" defer async></script>
</body>
</html>
\ No newline at end of file
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