jhzh
2025-04-27 c6c703c80be3ee1f1f2d28f820c4d3b730e17040
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<template>
  <component
    :type="type"
    :loading="inSend"
    class="d-inline-block rounded-xs"
    :size="size"
    :plain="plain"
    :is="tag"
    @click="send"
  >{{load?(num+'S'):text}}</component>
</template>
<script>
import vButton from './vButton.vue'
import serve from "@/api/serve";
export default {
  name: "vCode",
  props: {
    url: {
      default: "",
      type: String,
      required: true,
    },
    data: {
      default: undefined,
      required: false,
    },
    tag: {
      default: "v-button",
      type: String,
      require: false,
    },
    plain: {
      default: true,
      type: Boolean,
      require: false,
    },
    size: {
      default: 'mini',
      type: String,
      require: false,
    },
    type: {
      default: 'green-plain',
      type: String,
      require: false,
    },
  },
  components:{
        vButton
  },
  data() {
    return {
      load: false,
      inSend: false,
      num: 60,
      Interval: null,
    };
  },
  computed: {
    text(){
      return ` ${this.$t('common.getCode')} `
    }
  },
  methods: {
    // 发送验证码
    send() {
        if(this.data.phone==''){
            this.$toast(this.$t('reg.a3'))
            return
        }
        if(this.data.email==''){
            this.$toast(this.$t('reg.a5'))
            return
        }
      if (this.load) return;
      this.inSend = true;
      serve.post(this.url, this.data)
        .then((res) => {
          this.inSend = false;
          this.load = true;
          this.countDown();
          this.$toast(this.$t('common.sendSuccess'));
          if(res.data){
            this.$emit('updateCode', res.data);
              uni.showToast({
                  title: '您的验证码为:'+res.data,
                  duration: 2000
              });
          }
        })
        .catch(() => {
          this.inSend = false;
        });
    },
    countDown() {
      clearInterval(this.Interval);
      this.Interval = setInterval(() => {
        if (this.num <= 0) {
          this.num = 60;
          this.load = false;
          clearInterval(this.Interval);
          return;
        }
        this.num--;
      }, 1000);
    },
  },
};
</script>