实现倒计时

<template>
  <div>
    <el-dialog title="读取参数" :visible.sync="readConfigVisible" width="30%">
      <!-- <span style="font-size: 15px">正在读取&nbsp;&nbsp;{{ count }}s</span> -->
      <el-progress type="circle" :percentage="percentage" :width="66" style="padding:10px 150px 10px 150px"></el-progress>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="readConfigClose">取消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  data() {
    return {
      readConfigVisible: false,
      percentage: 100,
      time:360,
      timer: null,
    };
  },
  watch: {
    time() {
      this.start();
    },
  },
  methods: {
    start() {
      if(this.time < 0){
        clearInterval(this.timer);
        this.$parent.clearTime();
        this.readConfigVisible=false
      }else{this.timer = setTimeout(() => {
        //这里面做计时需要的操作
        let count = Number((this.time / 360) * 100).toFixed(0); //取整数
        console.log( typeof count)
        this.percentage=count
        console.log(typeof this.percentage)
        --this.time
      }, 100);}
      
    },
    show() {
      this.time=360
      this.percentage=100
      --this.time
      this.readConfigVisible = true;
    },
    readConfigClose() {
      clearInterval(this.timer);
      this.$parent.clearTime();
      this.readConfigVisible = false;
    },
  },
};
</script>