<template>
  <div class="nus_toastitem"
    v-if="nameText"
    v-html="nameText">
  </div>
</template>

<script>
import { initEvent } from 'nimble-lib';
export default {
    props: {
        /**
         * 内容名称
         */
        nameText: {
            type: String
        },
        /**
         * 关闭toast的毫秒数
         */
        time: {
            type: Number,
            default: 3000
        }
    },
    mounted () {
        this._initCom();
    },
    beforeDestroy () {
        clearTimeout(this.timer);
    },
    methods: {
        /**
         * 初始化组件
         */
        _initCom () {
            const _that = this;
            if (_that.timer !== undefined && _that.timer !== null) {
                clearTimeout(_that.timer);
            }
            _that.timer = setTimeout(() => {
                _that.timer = null;
                _that.$emit('close', initEvent('close'));
            }, _that.time || 3000);
        }
    }
};
</script>

<style lang='scss'>
@import '../../../../_assets/style/_iconFont.scss';
@import '../../../../_assets/style/_var.scss';
@import '../../../../_assets/style/_mixin.scss';

.nus_toastitem {
    pointer-events: auto;
    text-align: center;
    line-height: 1;
    border-radius: 4px;
    padding: 14px 12px;
    box-sizing: border-box;
    background: $nutoast-cont-bg;
    min-width: 243px;
    white-space: normal;
    word-break: break-all;
    word-wrap: break-word;
    line-height: 1.375;
}

</style>
