<template>
    <div>
        <van-nav-bar
                title="dialog弹层"
                left-arrow
                @click-left="back"
        />
        <div class="page">
            <ul>
                <li class="section">
                    <y-button topic="main" text="confirm" @click="fnClick(1)"></y-button>
                </li>
                <li class="section">
                    <y-button topic="main" text="local" v-on:click="uiShow = true"></y-button>
                    <y-dialog dis-global
                              prop-tips-cancel="联系客服"
                              :prop-uishow.sync="uiShow"
                              prop-title="skldjfasd">
                        <y-button topic="main"
                                  slot="cancel"
                                  plain
                                  text="联系客服"
                                  size="small"
                                  custom-class="y_dialog_button"></y-button>
                    </y-dialog>
                </li>
                <li class="section">
                    <y-button topic="main" text="失败" v-on:click="fnClickB(3)"></y-button>
                </li>
                <li class="section">
                    <y-button topic="main" text="HTML" v-on:click="fnClickC()"></y-button>
                </li>
                <li class="section">
                    <y-button topic="main" text="topic:window" v-on:click="fnClickD()"></y-button>
                </li>
            </ul>
        </div>
    </div>
</template>

<script>
    import {NavBar} from 'vant';
    import yButton from '../components/yButton'
    import yDialog from "../components/yDialog";

    export default {
        components: {
            [NavBar.name]: NavBar,
            yButton,
            yDialog
        },
        data:()=>{
            return {
                tipsShow:false,
                tipsShowB:false,
                uiShow:false
            }
        },
        methods:{
            fnClick(e){
                yDialog.confirm("你好");
            },
            fnClickB(e){
                yDialog.dialog("你好",{
                    buttonEnterTopic:"gray",
                });
            },
            fnClickC(e){
                yDialog.dialog("sdlkfjklsadf<br/>dsafsdfasdf",{
                    isHtml:true
                });
            },
            fnClickD(e){
                yDialog.dialog(
                    "<div>" +
                    "<h5>活动说明</h5>" +
                    "<div><ul> " +
                    "<li>新用户注册即可获得XXX元大礼包</li>" +
                    "<li>本活动属于新注册用户专享福利，每位用户仅享受1次<li/>" +
                    "*在法律许可范围内，yesaway保留对活动的解释权</div>" +
                    "</ul></div>" +
                    "</div>",{
                    isHtml:true,
                    topic:"window"
                });
            },
            back:()=>{
                window.history.go(-1);
            }
        },
        mounted(){
            //yDialog.confirm("你好");
        }
    }
</script>

<style scoped>
    .page {
        padding: 10px;
    }
</style>
