element-ui 在表格中按钮开关的应用

最近做了一个公司内部使用的功能,功能大致为:
在前台控制定时任务的开关、新增、修改等功能,昨天把接口写好，今天弄页面,页面展示任务列表如何在表格中添加开关控制呢?
页面大致长这样:

image.png

页面代码:

image.png

<el-table-column prop="status" label="任务开关">
          <template slot-scope="scope">
            <el-switch
              active-color="#13ce66"
              inactive-color="#ff4949"
              v-model="scope.row.isOpen"
              :active-value="1"
              :inactive-value="0"
              @change="change(scope.row)"
            ></el-switch>
          </template>
 </el-table-column>

方法:

       change (row){
          this.params.id=row.id
          this.params.isOpen=row.isOpen
          api.openOrColseMallTask(Object.assign(this.params)).then(res => {
            if (res.data.data.flag === true) {
              layer.msg(res.data.data.message,{icon:6,time:1000});
              this.getTableData();
            }else {
              layer.msg(res.data.data.message,{icon:5,time:2000});
            }
          })
        }