/**
* r_bindUserHelp.vue
* Version: 0.1
* User: wy
* Date: 2017-09-07
* Copyright(c)  2017. U-GEN Tech.Co,Ltd. All Rights Reserved.
* ID-姓名绑定页面
*/
<template>
    <div>
        <div class="header">
            <v-touch tag="span" class="header-left icon" v-on:tap="onBackTap">&#xe611;</v-touch>
            <p>{{ $t('title.bindUserHelp') }}</p>
        </div>
        <div class="content">
            <ul class="bindUserHelp">
                <li>{{ $t('bindUserHelp.helpTitle') }}</li>
                <li>{{ $t('bindUserHelp.helpCont1') }}</li>
                <li>{{ $t('bindUserHelp.helpCont2') }}</li>
                <li>{{ $t('bindUserHelp.helpCont3') }}</li>
                <li>{{ $t('bindUserHelp.helpCont4') }}</li>
            </ul>
            <u-button :init-param="componentsConfig.bindUserButton.initParam" v-on:u-button-tap="onBindUserButtonTap"></u-button>
            <p class="linkText"><v-touch tag="span" v-on:tap="onBoundUserTap">{{ $t('bindUserHelp.boundUser') }}</v-touch></p>
        </div>
        <u-dialog ref="udialog" :init-param="componentsConfig.dialog.initParam"></u-dialog>
        <u-loading ref="uloading" :init-param="componentsConfig.loading.initParam"></u-loading>
    </div>
</template>  

<script>
    import {iot, uPublic, uComponents} from '../../public/public.js';
    //通用 按钮、dialog、loading组件
    uPublic.componentsInit(['u-button','u-dialog','u-loading']);
    export default {
        data (){
            return {
                //配置组件
                componentsConfig: initComponentsConfig()
            }
        },
        beforeRouteEnter (to, from, next) {
            //alert('beforeRouteEnter 路由bindUserHelp');
            next(vm => {

            })
        },
        beforeRouteUpdate (to, from, next) {
            //alert('beforeRouteUpdate 路由bindUserHelp');
        },
        mounted(){            
        },      
        methods:{
            //tap <
            onBackTap(){
                backTap();
            },
            //tap 绑定姓名
            onBindUserButtonTap(){
                bindUserButtonTap(this);
            },
            //tap 查看已绑定ID姓名
            onBoundUserTap(){
                boundUserTap(this);
            }
        }               
    }

    //配置组件参数
    function initComponentsConfig(){
        return {
            //绑定姓名 button 参数
            bindUserButton: {   
                initParam: {
                    class: 'custom-help-button',
                    text: Vue.t('btn.bindUser')
                }
            },
            dialog: {
                initParam: {
                    class: 'custom-dialog'
                }
            },        
            loading: {
                initParam: {
                    class: 'custom-loading'
                }
            }
        }
    }

    //tap <
    function backTap(){
        iot.navigator.back();
    }

    //tap 绑定姓名
    function bindUserButtonTap(self){
        self.$router.push({path: '/bindUser'});
    }

    //tap 查看已绑定ID姓名
    function boundUserTap(self){
        self.$router.push({path: '/userList'});
    }
</script>