<el-table-column prop="online" label="上/下线" align="center">
<template slot-scope="scope" v-if="scope.row.checkStatus==1">
<el-switch
:disabled="switchControl(scope.row)"//根据时间判断是否禁用,可以传方法,switchControl在方法里面写时间判断
v-model="scope.row.online"
:active-value="1"
:inactive-value="0"
active-color="#13ce66"
inactive-color="#ff4949"
@change="switchChange(scope.row)"
></el-switch>
</template>
</el-table-column>
2.disabled里面写方法然后验证
//判断是否超出时间不可上线
switchControl(row){
let getTimeStart=row.onlineTime.split(',')[0];
let getTimeEnd=row.onlineTime.split(',')[1];
let currentTime=dayjs().year()+ '-' +(dayjs().month()+1)+ '-' +dayjs().date()+' '+dayjs().hour()+':'+ dayjs().minute()+':'+dayjs().second();
if(dayjs(currentTime).isBefore(dayjs(getTimeStart))&&dayjs(currentTime).isBefore(dayjs(getTimeEnd))){ //超出时间了
return true; //disabled如果是true就是禁用
}
},
3.上/下线:
- 审核通过后,若在上线时间段内,自动上线,且可手动进行上线/下线操作;
在change方法里面写
//上/下线
switchChange(row) {
let info = ''
if(row.online==0){
info = '是否确定要上线?'
}else{
info = '是否确定要下线?'
}
this.$confirm(info, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
let data={
id:row.id,
online: row.online ? 1 : 0
};
projectsEdit(data).then(res => {
if (res.status == 0) {
this.onSubmit();
} else {
this.onSubmit();
this.$message.warning(res.message);
}
})
.catch(error => {
this.onSubmit();
});
})
.catch(() => {
this.onSubmit();
});
},
网友评论