fix
This commit is contained in:
吴红兵
@@ -1,139 +1,134 @@
|
||||
<!-- 敏感信息授权按钮组件 -->
|
||||
<template>
|
||||
<div>
|
||||
<el-button class="grant-btn" type="text" @click="grantPrivilege">敏感信息授权</el-button>
|
||||
<el-dialog append-to-body title="敏感信息短信授权"
|
||||
v-model:visible="dialogVisible">
|
||||
|
||||
<el-form>
|
||||
<el-form-item label="手机号">
|
||||
<el-row>{{mobile}}</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="验证码">
|
||||
<el-col :span="11">
|
||||
<el-input type="number" style="display: inline-block" maxlength="6" placeholder="请输入验证码" v-model="form.code"></el-input>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<el-button style="display: inline;margin-left: 5px;" plain type="text" @click.prevent="getCode()">{{title}}</el-button>
|
||||
</el-col>
|
||||
|
||||
</el-form-item>
|
||||
<el-alert :closable="false">验证通过后将去除脱敏，有效期为30分钟，请尽快操作</el-alert>
|
||||
<el-alert type="warning" :closable="false">手机号码登记后统一维护，如有修改，请联系相关部门。教职工(组织人事处) 学生(班主任) 驻校人员(后勤处)</el-alert>
|
||||
</el-form>
|
||||
|
||||
<template v-slot:footer>
|
||||
<span class="dialog-footer" style="text-aligin:center">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="checkCode">确 定</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<div>
|
||||
<el-button class="grant-btn" type="text" @click="grantPrivilege">敏感信息授权</el-button>
|
||||
<el-dialog append-to-body title="敏感信息短信授权" v-model:visible="dialogVisible">
|
||||
<el-form>
|
||||
<el-form-item label="手机号">
|
||||
<el-row>{{ mobile }}</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="验证码">
|
||||
<el-col :span="11">
|
||||
<el-input type="number" style="display: inline-block" maxlength="6" placeholder="请输入验证码" v-model="form.code"></el-input>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<el-button style="display: inline; margin-left: 5px" plain type="text" @click.prevent="getCode()">{{ title }}</el-button>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-alert :closable="false">验证通过后将去除脱敏，有效期为30分钟，请尽快操作</el-alert>
|
||||
<el-alert type="warning" :closable="false"
|
||||
>手机号码登记后统一维护，如有修改，请联系相关部门。教职工(组织人事处) 学生(班主任) 驻校人员(后勤处)</el-alert
|
||||
>
|
||||
</el-form>
|
||||
|
||||
<template v-slot:footer>
|
||||
<span class="dialog-footer" style="text-aligin: center">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="checkCode">确 定</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import request from '@/router/axios'
|
||||
import request from '@/router/axios';
|
||||
export default {
|
||||
name: "sensitive",
|
||||
data(){
|
||||
return{
|
||||
dialogVisible: false,
|
||||
second: '', //倒计时
|
||||
disabled: false, //是否禁用按钮
|
||||
timer: null, //计时器
|
||||
form:{
|
||||
code:''
|
||||
},
|
||||
mobile:'**'
|
||||
}
|
||||
name: 'sensitive',
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
second: '', //倒计时
|
||||
disabled: false, //是否禁用按钮
|
||||
timer: null, //计时器
|
||||
form: {
|
||||
code: '',
|
||||
},
|
||||
mobile: '**',
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return this.disabled ? `重新获取 ( ${this.second} ) s` : '获取验证码';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
grantPrivilege() {
|
||||
this.dialogVisible = true;
|
||||
this.form.code = '';
|
||||
this.getMobile();
|
||||
},
|
||||
getCode() {
|
||||
// console.log('点击')
|
||||
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return this.disabled ? `重新获取 ( ${this.second} ) s` : '获取验证码';
|
||||
},
|
||||
},
|
||||
methods:{
|
||||
grantPrivilege(){
|
||||
this.dialogVisible = true
|
||||
this.form.code = ''
|
||||
this.getMobile()
|
||||
},
|
||||
getCode() {
|
||||
// console.log('点击')
|
||||
let that = this;
|
||||
let s = 60; //倒计时间
|
||||
if (!that.timer) {
|
||||
that.second = s;
|
||||
that.disabled = true;
|
||||
|
||||
let that = this
|
||||
let s = 60 //倒计时间
|
||||
if (!that.timer) {
|
||||
that.second = s
|
||||
that.disabled = true
|
||||
that.timer = setInterval(() => {
|
||||
if (that.second > 0 && this.second <= s) {
|
||||
that.second--;
|
||||
} else {
|
||||
that.disabled = false;
|
||||
clearInterval(that.timer);
|
||||
this.timer = null;
|
||||
}
|
||||
}, 1000);
|
||||
|
||||
that.timer = setInterval(() => {
|
||||
if (that.second > 0 && this.second <= s) {
|
||||
that.second--
|
||||
} else {
|
||||
that.disabled = false
|
||||
clearInterval(that.timer)
|
||||
this.timer = null
|
||||
}
|
||||
}, 1000)
|
||||
|
||||
that.sendCode()
|
||||
}
|
||||
},
|
||||
getMobile(){
|
||||
request({
|
||||
url: '/admin/mobile/getMobile',
|
||||
method: 'get'
|
||||
}).then(response => {
|
||||
console.log(response.data)
|
||||
if (response.data.data) {
|
||||
this.mobile = response.data.data
|
||||
} else {
|
||||
this.$message.error(response.data.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
sendCode(){
|
||||
request({
|
||||
url: '/admin/mobile/codeSensitive',
|
||||
method: 'get'
|
||||
}).then(response => {
|
||||
console.log(response.data)
|
||||
if (response.data.data) {
|
||||
this.$message.success("短信发送成功")
|
||||
} else {
|
||||
this.$message.error(response.data.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
checkCode(){
|
||||
request({
|
||||
url: '/admin/mobile/checkSensitiveCode',
|
||||
method: 'post',
|
||||
data:{'code':this.form.code}
|
||||
}).then(response => {
|
||||
console.log(response.data)
|
||||
if (response.data.data) {
|
||||
this.dialogVisible = false
|
||||
this.$message.success("校验通过")
|
||||
|
||||
} else {
|
||||
this.$message.error("校验失败")
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
that.sendCode();
|
||||
}
|
||||
},
|
||||
getMobile() {
|
||||
request({
|
||||
url: '/admin/mobile/getMobile',
|
||||
method: 'get',
|
||||
}).then((response) => {
|
||||
console.log(response.data);
|
||||
if (response.data.data) {
|
||||
this.mobile = response.data.data;
|
||||
} else {
|
||||
this.$message.error(response.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
sendCode() {
|
||||
request({
|
||||
url: '/admin/mobile/codeSensitive',
|
||||
method: 'get',
|
||||
}).then((response) => {
|
||||
console.log(response.data);
|
||||
if (response.data.data) {
|
||||
this.$message.success('短信发送成功');
|
||||
} else {
|
||||
this.$message.error(response.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
checkCode() {
|
||||
request({
|
||||
url: '/admin/mobile/checkSensitiveCode',
|
||||
method: 'post',
|
||||
data: { code: this.form.code },
|
||||
}).then((response) => {
|
||||
console.log(response.data);
|
||||
if (response.data.data) {
|
||||
this.dialogVisible = false;
|
||||
this.$message.success('校验通过');
|
||||
} else {
|
||||
this.$message.error('校验失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.wrapper {
|
||||
display: inline-block;
|
||||
}
|
||||
.grant-btn{
|
||||
marigin: 0px 5px !important;
|
||||
color: #f39217;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
display: inline-block;
|
||||
}
|
||||
.grant-btn {
|
||||
marigin: 0px 5px !important;
|
||||
color: #f39217;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user