Element UI中的radio框切换年、月、日。
今天上班写了年、月、日、的切换并且带有提示框的发请求获取数据,纠结了很久才想到可以定义一个方法来动态获取当前点击的数据来进行发请求。接口是一样的,只是参数发请求传的参数不一样。
效果如下:
点击每一个按钮会提示是否需要更改当前所点击的时间,可以取消或者确定。
取消和确定切换之后会进行提示。(因为此接口是内部接口外网访问不到,导致确定之后返回的是取消切换)
代码如下
<template>
<div>
<el-radio-group v-model="radio" @change="handelfox">
<el-radio label="每年"></el-radio>
<el-radio label="每半年"></el-radio>
<el-radio label="每月"></el-radio>
<el-radio label="每日"></el-radio>
</el-radio-group>
</div>
</template>
<script>
export default {
data(){
return {
radio:"",
}
},
methods: {
handelfox(val){
let that = this
that.$confirm('是否切换为'+val +'这个时间?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then((action, done )=>{
if(action === 'confirm'){
let temp = null
temp = that.radio === "每年"?
"每年":that.radio === "每半年"?
"每半年":that.radio === "每月"?
"每月":that.radio ==="每日"?
"每日":""
that.submil(temp)
done
}
}).catch(()=>{
this.$message({
type: 'info',
message: '已取消切换'
});
})
},
submil(temp){
let url = "/scheduledTask/updata"
if(!temp)return false
this.$axios.post(url,{
backupTime:temp
}).then((res)=>{
data = res.data
if(data.code === 20000){
this.$message({
type: 'success',
message: '切换'+data.message
});
}
})
}
}
}
</script>
最近刚开始写博客,如果本文章有错误的地方还需要多多指导。最后祝大家的代码永无Bug。