Element UI中的radio框切换年、月、日。

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。

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值