更换ws地址

admin

2026-02-06 8402f0794434bac13c0de02d47fb5c28d6e2639c

 src/components/elalert.vue

@@ -1,7 +1,11 @@
<!--  -->
<template>
    <el-alert v-show="alertShow" :closable="closable" :title="texts" :type="elType" center>
    </el-alert>
    <div v-if="$store.state.elAlertShow">
        <el-alert :closable="closable" :title="$store.state.elAlertText" :type="$store.state.elAlertType" center
            style="z-index:99999999999999999;position: fixed;top: 0;bottom: 0;margin: auto;">
        </el-alert>
    </div>

</template>

<script>
@@ -26,15 +30,22 @@
    },
    data() {
        return {

            timer: null // 保存定时器引用
        }
    },
    //监听alertShow变成true时，2秒后自动关闭
    watch: {
        alertShow: function (val) {
        // 监听vuex中的elAlertShow变化
        '$store.state.elAlertShow': function (val) {
            // 清除之前的定时器
            if (this.timer) {
                clearTimeout(this.timer);
                this.timer = null;
            }
            if (val) {
                setTimeout(() => {
                    this.$emit('closeAlert')
                this.timer = setTimeout(() => {
                    this.$store.commit('elAlertShow', { 'elAlertShow': false });
                    this.timer = null;
                }, 2000)
            }
        }
@@ -47,32 +58,34 @@
    mounted() {

    },
    methods:{
        //定时调用父组件方法关闭弹窗
        closeAlert(){
            //定时调用父组件方法关闭弹窗
            setTimeout(()=>{
                this.$emit('closeAlert')
            },2000)
    //生命周期 - 销毁前
    beforeDestroy() {
        // 组件销毁前清除定时器
        if (this.timer) {
            clearTimeout(this.timer);
            this.timer = null;
        }
        
    },
    methods: {
        //定时调用父组件方法关闭弹窗
        closeAlert() {
            //定时调用父组件方法关闭弹窗
            setTimeout(() => {
                this.$emit('closeAlert')
            }, 2000)
        },

    }
}
</script>
<style scoped lang="less">
/* @import url(); 引入css类 */
/deep/.el-alert{
  width: 70%!important;
  height: 1rem!important;
  position: absolute!important;
  top: 0!important;
  bottom: 0!important;
  left: 0!important;
  right: 0!important;
  margin: auto!important;
  font-size: 0.3rem!important;
}
/deep/.el-alert__title{
  font-size: 0.3rem!important;


.tit {
    width: 1rem;
    height: 1rem;
    position: absolute;
    top: 50%;
}
</style>