zfb_cms/src/pages/clean/index.vue

<!--  -->
<template>
  <div class='con' v-loading.fullscreen.lock="loading">
    <div class="h-header">
      <vcenter>
        <div class="h-input"><span>手机号：</span></div>
        <div>
          <el-input v-model="userName" placeholder="输入手机号清除"></el-input>
        </div>
        <div>
          <el-button :disabled="disabled" @click="search" type="primary">清除状态</el-button>
        </div>
      </vcenter>
    </div>
  </div>
</template>

<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// 例如：import 《组件名称》 from '《组件路径》';
import vcenter from '@/components/vcenter'
import { async } from 'q';

export default {
  // import引入的组件需要注入到对象中才能使用
  components: {
    vcenter
  },
  data() {
    // 这里存放数据
    return {
      userName: '',
      disabled: true,
      loading:false,
    }
  },
  watch: {
    userName(value) {
      const reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
      if (!value) {
        return this.disabled = true
      }
      if (!reg_tel.test(value)) {
        return this.disabled = true
      } else {
        return this.disabled = false
      }
    }
  },
  // 方法集合
  methods: {
    async search() {
      this.loading = true
      const res = await this.$http({
        method: 'post',
        data: {
          userName:this.userName,
        },
        url: '/loginOutByUser?userName='+this.userName,
        headers: {
          token: window.localStorage.getItem('zfb_token')
        }
      })
      this.loading = false
      if(res.code !== 200){
          // this.$message.error(res.message || res.error || '操作失败');
      }else{
          this.$message({message:'清除成功',type: 'success'});
      }
    }
  },
  // 生命周期 - 创建完成（可以访问当前this实例）
  created() {

  },
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {
  },
  beforeCreate(){}, // 生命周期 - 创建之前
  beforeMount(){}, // 生命周期 - 挂载之前
  beforeUpdate(){}, // 生命周期 - 更新之前
  updated(){}, // 生命周期 - 更新之后
  beforeDestroy(){}, // 生命周期 - 销毁之前
  destroyed(){}, // 生命周期 - 销毁完成
  activated(){} // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>

<style lang="scss" scoped>
@import '@/assets/style/info.scss'
</style>