<template>
    <div class="irrigateSet sensorSet sensorSet-con">
        <div class="table-title">
            <img src="../../assets/image/sensor.png" alt=""> {{$t('sensorSet.pageTitle')}}
            
            <div class="tips" @click="model = true">{{$t('sensorSet.sensorDescription')}}</div>
        </div>
        <div class="sensor-view">
            <div class="left scroll">
                <div @click="toIndex(index)" :class="active == index ? 'active' : ''" v-for="item, index in 48"
                    :key="index">
                    <div>
                     {{$t('sensorSet.sensorChannel', {index:index + 1})}}
                    </div>
                </div>
            </div>
            <div class="right">
                <div class="right-top">
                    <div class="right-sel">
                        <div @click="changeOpen(active)">
                            <div v-if="getOpenTrue(active)" class="no-sel"></div>
                            <div v-else class="sel"></div>
                             {{$t('sensorSet.validity')}}
                        </div>

                        <!-- <div class="sensor-type">
                           <template v-for="item, index in openTypeList" >
                            <div class="sensor-type-div" v-if="active==index" >
                                <div class="sensor-sel">
                                    <div>
                                        <div @click="changeTypeOpen(index, '0')" :class="item == '1' ? 'no-sel' : 'sel'">
                                        </div>
                                        485通讯类型的传感器
                                    </div>
                                    <div>
                                        <div @click="changeTypeOpen(index, '1')" :class="item == '0' ? 'no-sel' : 'sel'">
                                        </div>
                                        4-20ma模拟量类型的传感器
                                    </div>
                                </div>
                            </div>
                           </template>
                        </div> -->
                    </div>
                    <div class="input-sel">
                        <div class="title">{{$t('sensorSet.sensorType')}} <span v-if="active>39">{{$t('sensorSet.analogSensor')}}</span></div>
                        <el-dropdown @command="handleCommand">
                            <div class="el-dropdown-link">
                                <input v-model="sensorType" type="text" class="input-input" :placeholder="$t('sensorSet.selectSensorType')">
                                <div class="arrow"><img src="../../assets/image/arrow.png" alt=""></div>
                            </div>
                            <el-dropdown-menu slot="dropdown">
                                <el-dropdown-item v-for="item, index in typeList" :key="index" :command="item.value">{{
                                    item.label }}</el-dropdown-item>

                            </el-dropdown-menu>
                        </el-dropdown>
                    </div>
                    <!-- <div class="right-sel">
                            <div @click="sel2 = !sel2">
                                <div v-if="!sel2" class="no-sel"></div>
                                <div v-else class="sel"></div>
                                通讯类传感器
                            </div>
                            <div @click="sel3 = !sel3">
                                <div v-if="!sel3" class="no-sel"></div>
                                <div v-else class="sel"></div>
                                模拟量传感器
                            </div>
                        </div> -->
                </div>
                <div class="right-bottom">
                    <div>
                        <div class="input-main">
                            <div>{{$t('sensorSet.calibration.lowAD')}}</div>
                            <input @blur="blurChange(20904 + (active * 5 + 1), $event)"
                                v-model="inputDataNew[20904 + (active * 5 + 1)]"
                                @input="change(20904 + (active * 5 + 1), $event)" type="number" placeholder="0.0">
                        </div>
                        <div class="input-main">
                            <div>{{$t('sensorSet.calibration.lowData')}}</div>
                            <input @blur="blurChange1(20904 + (active * 5 + 2), $event)"
                                v-model="inputDataNew[20904 + (active * 5 + 2)]"
                                @input="change1(20904 + (active * 5 + 2), $event)" type="number" placeholder="0.0">
                        </div>
                    </div>
                    <div>
                        <div class="input-main">
                            <div>{{$t('sensorSet.calibration.highAD')}}</div>
                            <input @blur="blurChange(20904 + (active * 5 + 3), $event)"
                                v-model="inputDataNew[20904 + (active * 5 + 3)]"
                                @input="change(20904 + (active * 5 + 3), $event)" type="number" placeholder="0.0">
                        </div>
                        <div class="input-main">
                            <div>{{$t('sensorSet.calibration.highData')}}</div>
                            <input @blur="blurChange1(20904 + (active * 5 + 4), $event)"
                                v-model="inputDataNew[20904 + (active * 5 + 4)]"
                                @input="change1(20904 + (active * 5 + 4), $event)" type="number" placeholder="0.0">
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- <div class="sensor-type">
            <div class="sensor-title">通道输入信号类型</div>
            <div class="sensor-type-div" v-for="item, index in openTypeList" :key="index">
                <div class="name">第{{ index + 1 }}通道</div>
                <div class="sensor-sel">
                    <div>
                        <div @click="changeTypeOpen(index, '0')" :class="item == '1' ? 'no-sel' : 'sel'"></div>
                        485通讯类型的传感器
                    </div>
                    <div>
                        <div @click="changeTypeOpen(index, '1')" :class="item == '0' ? 'no-sel' : 'sel'"></div>
                        4-20ma模拟量类型的传感器
                    </div>
                </div>
            </div>
        </div> -->
        <el-dialog :modal-append-to-body="false" :show-close="false" :close-on-click-modal="true" :visible.sync="model"
            width="760px">
            <div class="page-title title-402">{{$t('sensorSet.sensorInstructions.title')}}</div>
            <div class="tips-model">
                <div class="tips-model-title">{{$t('sensorSet.sensorInstructions.part1')}}</div>
            
                <div class="tips-model-text">
                    1. {{$t('sensorSet.sensorInstructions.parameters', {index:'1#-6#'})}}
                </div>
                <div class="tips-model-text">
                    2. {{$t('sensorSet.sensorInstructions.parameters', {index:'7#-12#'})}}
                </div>
                <div class="tips-model-text">
                    3. {{$t('sensorSet.sensorInstructions.parameters', {index:'13#-18#'})}}
                </div>
                <div class="tips-model-text">
                    4. {{$t('sensorSet.sensorInstructions.parameters', {index:'19#-24#'})}}
                </div>
                <div class="tips-model-text">
                    5. {{$t('sensorSet.sensorInstructions.parameters', {index:'25#-30#'})}}
                </div>
                <div class="tips-model-text">
                    6. {{$t('sensorSet.sensorInstructions.parameters', {index:'31#-36#'})}}
                </div>
                <div class="">
                 {{$t('sensorSet.sensorInstructions.communicationMatch')}}
                </div>
                <div class="tips-model-table">
                    <div class="tips-model-th">
                    <div></div>
                    <div class="tips-model-text">{{$t('sensorSet.calibration.lowAD1')}}</div>
                    <div class="tips-model-text">{{$t('sensorSet.calibration.lowData1')}}</div>
                    <div class="tips-model-text">{{$t('sensorSet.calibration.highAD1')}}</div>
                    <div class="tips-model-text">{{$t('sensorSet.calibration.highData1')}}</div>
                </div>
                <div class="tips-model-tr">
                    <div class="tips-model-text">{{$t('sensorSet.sensorInstructions.temperature')}}</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">-40</div>
                    <div class="tips-model-text">1000</div>
                    <div class="tips-model-text">60</div>
                </div>
                <div class="tips-model-tr">
                    <div class="tips-model-text">{{$t('sensorSet.sensorInstructions.humidity')}}</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">1000</div>
                    <div class="tips-model-text">100</div>
                </div>
                <div class="tips-model-tr">
                    <div class="tips-model-text">{{$t('sensorSet.sensorInstructions.light')}}</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">2000</div>
                    <div class="tips-model-text">200</div>
                </div>
                <div class="tips-model-tr">
                    <div class="tips-model-text">{{$t('sensorSet.sensorInstructions.co2')}}</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">5000</div>
                    <div class="tips-model-text">5000</div>
                </div>
                <div class="tips-model-tr">
                    <div class="tips-model-text">{{$t('sensorSet.sensorInstructions.soilTemp')}}</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">-40</div>
                    <div class="tips-model-text">1000</div>
                    <div class="tips-model-text">60</div>
                </div>
                <div class="tips-model-tr">
                    <div class="tips-model-text">{{$t('sensorSet.sensorInstructions.soilMoisture')}}</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">0</div>
                    <div class="tips-model-text">1000</div>
                    <div class="tips-model-text">100</div>
                </div>
                </div>
                <div class="">
                   &nbsp;
                </div>
                <div class="tips-model-title">{{$t('sensorSet.sensorInstructions.part2')}}</div>
             
                <div class="tips-model-text">
                     {{$t('sensorSet.sensorInstructions.phEcSensor',{index:'37',type:'1#PH传感器'})}}
                    ({{$t('sensorSet.sensorInstructions.matchRelation')}}0 -0,1000-100)
                </div>
                <div class="tips-model-text">
                      {{$t('sensorSet.sensorInstructions.phEcSensor',{index:'38',type:'1#EC传感器'})}}
                    ({{$t('sensorSet.sensorInstructions.matchRelation')}}0 -0,1000-1000)
                </div>
                <div class="tips-model-text">
                      {{$t('sensorSet.sensorInstructions.phEcSensor',{index:'39',type:'2#PH传感器'})}}
                    ({{$t('sensorSet.sensorInstructions.matchRelation')}}0 -0,1000-100)
                </div>
                <div class="tips-model-text">
                      {{$t('sensorSet.sensorInstructions.phEcSensor',{index:'40',type:'2#EC传感器'})}}
                    ({{$t('sensorSet.sensorInstructions.matchRelation')}}0 -0,1000-1000)
                </div>
                <div class="">
                   &nbsp;
                </div>
                <div class="tips-model-title">{{$t('sensorSet.sensorInstructions.part3')}}</div>
                <div class="">
                    {{$t('sensorSet.sensorInstructions.matchRelation')}}
                </div>
                <div class="tips-model-text">
                    {{$t('sensorSet.sensorInstructions.analogRange')}}
                </div>
            </div>

            <div class="model-return">
                <div @click="model = false" class="btn green">
                    <img src="../../assets/image/return.png" alt="" />{{$t('text.return')}}
                </div>
            </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
    data() {
        return {
            active: 0,
            sel1: true,
            sel2: false,
            sel3: false,
            inputData: [],
            inputDataNew:[],
            sensorType: '',//当前传感器类型
            openList1: [],//当前有效的传感器
            openList2: [],//当前有效的传感器
            openList3: [],//当前有效的传感器
            openTypeList: [],//八个通道输入信号的类型
      loading:null,
      
      model: false,
        }
    },
    watch: {
        'active'(newVal, oldVal) {
            this.getSensorType()
        },
        '$store.state.equipmentIndex'(newVal, oldVal) {
     
      this.dataInit();
    },
    },
        computed: {
  typeList() {
    return this.$store.state.typeList.map(item => {
      return {
        ...item,
        label: this.$t(`types.${item.value}`) // 假设你为每个value创建了对应的翻译key
      }
    })
  }
},
    mounted() {
      
        this.dataInit()
        //input获取焦点后全选
        let inputList = document.querySelectorAll('input');
        for (let index = 0; index < inputList.length; index++) {
            inputList[index].onfocus = this.selectValue;//input放入焦点，全选文本
        }
    },
    methods: {
        //countType计算类型 
        //0是原数据 
        //1是原数据-400 
        //2是原数据/10 
        //3是(原数据-400) / 10
        countType1(data) {
            var num = data - 400
            return num
        },
        countType2(data) {
            var num = data / 10
            return num
        },
        countType3(data) {

            var num = (data - 400) / 10
            return num
        },
        countType4(data) {

var num = (data - 1000) / 10
return num
},
        //反向计算提交
        sendCountType1(data) {
            var num = data + 400
            return num
        },
        sendCountType2(data) {
            var num = data * 10
            return num
        },
        sendCountType3(data) {

            var num = (data * 10) + 400
            return num
        },
        sendCountType4(data) {

var num = (data* 10)+1000
return num
},
        //类型选择
        handleCommand(command) {
            this.typeList.forEach((el, index) => {
                if (el.value == command) {
                    this.sensorType = el.label
                }
            })
            var dataNum = {
                target: {
                    value: command,
                },
            };
            this.changeBtn(20904 + (this.active * 5), dataNum);
        },
        //根据类型反向计算赋值给inputData
        getSaveCountData(){
            for (var i = 0; i < 48; i++) {
                this.typeList.forEach((el, index) => {
                    if (el.value == this.inputData[20904 + (i * 5)]) {
                        if (el.countType == 0) {
                            this.inputData[20904 + (i * 5 + 2)]= this.inputDataNew[20904 + (i * 5 + 2)]
                            this.inputData[20904 + (i * 5 + 4)]=this.inputDataNew[20904 + (i * 5 + 4)]
                        } else if (el.countType == 1) {
                            this.inputData[20904 + (i * 5 + 2)] = this.sendCountType1(this.inputDataNew[20904 + (i * 5 + 2)])
                            this.inputData[20904 + (i * 5 + 4)] = this.sendCountType1(this.inputDataNew[20904 + (i * 5 + 4)])
                        } else if (el.countType == 2) {
                           this.inputData[20904 + (i * 5 + 2)] = this.sendCountType2(this.inputDataNew[20904 + (i * 5 + 2)])
                            this.inputData[20904 + (i * 5 + 4)] = this.sendCountType2(this.inputDataNew[20904 + (i * 5 + 4)])
                        } else if (el.countType == 3) {
                            this.inputData[20904 + (i * 5 + 2)] = this.sendCountType3(this.inputDataNew[20904 + (i * 5 + 2)])
                            this.inputData[20904 + (i * 5 + 4)] = this.sendCountType3(this.inputDataNew[20904 + (i * 5 + 4)])
                        } else if (el.countType == 4) {
                            this.inputData[20904 + (i * 5 + 2)] = this.sendCountType4(this.inputDataNew[20904 + (i * 5 + 2)])
                            this.inputData[20904 + (i * 5 + 4)] = this.sendCountType4(this.inputDataNew[20904 + (i * 5 + 4)])
                        }

                    }
                })
            } 
        },
        //根据类型修改数据
        getCountData() {
            for (var i = 0; i < 48; i++) {
                this.typeList.forEach((el, index) => {
                    if (el.value == this.inputData[20904 + (i * 5)]) {
                        if (el.countType == 0) {
                            this.inputDataNew[20904 + (i * 5 + 2)] = this.inputData[20904 + (i * 5 + 2)]
                            this.inputDataNew[20904 + (i * 5 + 4)] = this.inputData[20904 + (i * 5 + 4)]
                        } else if (el.countType == 1) {
                            this.inputDataNew[20904 + (i * 5 + 2)] = this.countType1(this.inputData[20904 + (i * 5 + 2)])
                            this.inputDataNew[20904 + (i * 5 + 4)] = this.countType1(this.inputData[20904 + (i * 5 + 4)])
                        } else if (el.countType == 2) {
                           this.inputDataNew[20904 + (i * 5 + 2)] = this.countType2(this.inputData[20904 + (i * 5 + 2)])
                            this.inputDataNew[20904 + (i * 5 + 4)] = this.countType2(this.inputData[20904 + (i * 5 + 4)])
                        } else if (el.countType == 3) {
                            this.inputDataNew[20904 + (i * 5 + 2)] = this.countType3(this.inputData[20904 + (i * 5 + 2)])
                            this.inputDataNew[20904 + (i * 5 + 4)] = this.countType3(this.inputData[20904 + (i * 5 + 4)])
                        } else if (el.countType == 4) {
                            this.inputDataNew[20904 + (i * 5 + 2)] = this.countType4(this.inputData[20904 + (i * 5 + 2)])
                            this.inputDataNew[20904 + (i * 5 + 4)] = this.countType4(this.inputData[20904 + (i * 5 + 4)])
                        }

                    }
                })
            } 
        },
        getSensorType() {
            this.typeList.forEach((el, index) => {
                if (el.value == this.inputData[20904 + (this.active * 5)]) {
                    this.sensorType = el.label
                }
            })
        },
        toIndex(index) {
            this.active = index
        },
        padString(str, length) {
            return str.padStart(length, '0');
        },
        changeOpen(active) {
            if (active >= 0 && active < 16) {
                if (this.openList1[active] == '1') {
                    this.openList1[active] = '0'
                } else {
                    this.openList1[active] = '1'
                }
                var revList = this.openList1.slice().reverse()
                var num = revList.join("");
                var dataNum = {
                    target: {
                        value: parseInt(num, 2),
                    },
                };
                this.changeBtn('20901', dataNum);
            } else if (active >= 16 && active < 32) {
                if (this.openList2[active - 16] == '1') {
                    this.openList2[active - 16] = '0'
                } else {
                    this.openList2[active - 16] = '1'
                }
                var revList = this.openList2.slice().reverse()
                var num = revList.join("");
                var dataNum = {
                    target: {
                        value: parseInt(num, 2),
                    },
                };
                this.changeBtn('20902', dataNum);
            } else if (active >= 32 && active < 48) {
                if (this.openList3[active - 32] == '1') {
                    this.openList3[active - 32] = '0'
                } else {
                    this.openList3[active - 32] = '1'
                }
                var revList = this.openList3.slice().reverse()
                var num = revList.join("");
                var dataNum = {
                    target: {
                        value: parseInt(num, 2),
                    },
                };
                this.changeBtn('20903', dataNum);
            }
            this.$forceUpdate();
        },
        changeTypeOpen(index, num) {
            this.openTypeList[index] = num
            this.$forceUpdate();
            var openTypeList = this.openTypeList.slice().reverse()
            var num = openTypeList.join("");
            var dataNum = {
                target: {
                    value: parseInt(num, 2),
                },
            };
            this.changeBtn('20900', dataNum);
        },
        getTypeOpen(active) {
            if (this.openTypeList[active] == '1') {
                return true
            } else {
                return false
            }
        },
        getOpenTrue(active) {
            if (active >= 0 && active < 16) {
                if (this.openList1[active] == '1') {
                    return false
                } else {
                    return true
                }
            } else if (active >= 16 && active < 32) {
                if (this.openList2[active - 16] == '1') {
                    return false
                } else {
                    return true
                }
            } else if (active >= 32 && active < 48) {
                if (this.openList3[active - 32] == '1') {
                    return false
                } else {
                    return true
                }
            }


        },
        getOpen() {
            this.openList1 = []
            this.openList2 = []
            this.openList3 = []
            var num1 = this.inputData['20901']?this.inputData['20901']:0
            var num11 = this.padString(num1.toString(2), 16)
            var openList1New
            openList1New = num11.split("")
            openList1New.forEach((el, index) => {
                this.openList1.push(openList1New[openList1New.length - index - 1])
            })

            var num2 = this.inputData['20902']?this.inputData['20902']:0
            var num22 = this.padString(num2.toString(2), 16)
            var openList2New
            openList2New = num22.split("")
            openList2New.forEach((el, index) => {
                this.openList2.push(openList2New[openList2New.length - index - 1])
            })

            var num3 = this.inputData['20903']?this.inputData['20903']:0
            var num33 = this.padString(num3.toString(2), 16)
            var openList3New
            openList3New = num33.split("")
            openList3New.forEach((el, index) => {
                this.openList3.push(openList3New[openList3New.length - index - 1])
            })

            this.openTypeList = []
            var num4 = this.inputData['20900']?this.inputData['20900']:0
            var num44 = this.padString(num4.toString(2), 8)
            var openList4New
            openList4New = num44.split("")
            openList4New.forEach((el, index) => {
                this.openTypeList.push(openList4New[openList4New.length - index - 1])
            })
        },
        dataInit() {
            var store = this.$store.state
            var data = {
                deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,

            };
            this.loading = this.$loading({
    lock: true,
    text: this.$t('message.loading'),
    spinner: 'el-icon-loading',
    background: 'rgba(0, 0, 0, 0.7)'
  });
            this.api.getReadControlSensorChannel(data).then((res) => {
                this.loading.close()
                if (res.data.code == 200) {
                    this.inputData = JSON.parse(JSON.stringify(res.data.data));
                    this.inputDataNew = res.data.data;
                    // this.getData272()
                    this.getOpen()
                    this.getSensorType()
                    this.getCountData()
                } else {
                    this.$message.error(res.data.msg);
                }
            });
        },
     //全选文本
     selectValue(e) {
      
      var store = this.$store.state
            store.nowInput=e.target.value
            e.currentTarget.select();
    },
        getSendData(number) {
            var number1 = number
            this.typeList.some((el, index) => {
                if (el.value == this.inputData[20904 + (this.active * 5)]) {
                    if (el.countType == 0) {
                        number1 = number
                    } else if (el.countType == 1) {
                        number1 = this.sendCountType1(number)
                    } else if (el.countType == 2) {
                        number1 = this.sendCountType2(number)
                    } else if (el.countType == 3) {
                        number1 = this.sendCountType3(number)
                    } else if (el.countType == 4) {
                        number1 = this.sendCountType4(number)
                    }
                }
            })
            return number1
        },
        //需要反向计算提交
        change1(code, el) {
            // var store = this.$store.state
            // var data = {
            //     equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
            //     regAddress: code,
            //     num: this.getSendData(el.target.value),
            // };
            // this.delayTimer(0, data);
        },
        //需要反向计算提交
        blurChange1(code, el) {
            console.log(el.target.value,1);
            var store = this.$store.state
            var data = {
                equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
                regAddress: code,
                num: this.getSendData(el.target.value),
            }; //避免开启多个计时器
            console.log(data.num,this.inputData[code],1.5);
          if(data.num!=this.inputData[code]){
            // this.timer && clearInterval(this.timer);
                this.changeData(data);
          }
               
        },
        //失去焦点
        blurChange(code, el) {
            var store = this.$store.state
            var data = {
                equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
                regAddress: code,
                num: el.target.value,
            }; //避免开启多个计时器
            if(data.num!=this.inputData[code]){
                this.changeData(data);
                // this.timer && clearInterval(this.timer);
            }
        },
        changeBtn(code, el) {
            var store = this.$store.state
            var data = {
                equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
                regAddress: code,
                num: el.target.value,
            };
            this.delayTimerBtn(0, data);
        },
        //切换btn的限制 写入停止后j*100毫秒调取函数
        delayTimerBtn(i, data) {
            const that = this;
            //整体接口
            let j = this.$store.state.lateSendBtn;
            //避免开启多个计时器
            this.timer && clearInterval(this.timer);

            this.timer = setInterval(() => {
                ++i;
                if (i == j) {
                    that.changeData(data);
                    clearInterval(this.timer);
                }
            }, 100);
        },
        change(code, el) {
            // var store = this.$store.state
            // var data = {
            //     equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
            //     regAddress: code,
            //     num: el.target.value,
            // };
            // this.delayTimer(0, data);
        },
        //限制 写入停止后j*100毫秒调取函数
        delayTimer(i, data) {
            const that = this;
            //整体接口
            let j = this.$store.state.lateSend;
            //避免开启多个计时器
            this.timer && clearInterval(this.timer);

            this.timer = setInterval(() => {
                ++i;
                if (i == j) {
                    that.changeData(data);
                    clearInterval(this.timer);
                }
            }, 100);
        },
        changeData(data) {
            console.log(data.num,2);
            // this.timer && clearInterval(this.timer);
            var store = this.$store.state
          this.api.postControlWrite(data).then((res) => {
            // this.timer && clearInterval(this.timer);
              if (res.data.code == 200) {
                  this.$message({
                      message: res.data.msg,
                      type: "success",
                  });
                  store.nowInput=''
                  this.getSaveCountData()
                  // this.dataInit();
                  for (var i = 0; i < 48; i++) {
                    if((20904 + (i * 5))==data.regAddress){
                        this.inputData[20904 + (i * 5)]=data.num
                    }
                 }
                
        
                  setTimeout(() => {
                    this.getCountData()
                    // this.inputData[data.regAddress]==data.num
                  }, 0);
              } else {
                  this.inputData[data.regAddress]=store.nowInput
                  this.$message.error(res.data.msg);
              }
              this.timer = null
          });
        },
    },

}
</script>
<style lang="scss"></style>
    