vue delete a row
list, click to delete a row:
<el-table :data="tableData" style="width: 100%" class="view_table">
<el-table-column
prop="updateTime"
label="添加时间"
align="center"
min-width="150"
></el-table-column>
<el-table-column
prop="ruleName"
label="任务名称"
align="center"
min-width="90"
>
</el-table-column>
<el-table-column
prop="goodsId"
label="任务内容"
align="center"
min-width="90"
>
<template slot-scope="scope">
<div>
每邀请{
{ scope.row.inviteNum }}人注册,送{
{ scope.row.integral }}积分
</div>
</template>
</el-table-column>
<el-table-column
prop="channel"
align="center"
label="领取限制"
min-width="90"
>
<template slot-scope="scope">
<div>
<div v-if="scope.row.channel === 0">首次</div>
<div v-if="scope.row.channel === 1">每次</div>
</div>
</template>
</el-table-column>
<el-table-column
fixed="right"
align="center"
label="操作"
min-width="120"
>
<template slot-scope="scope">
<el-button type="primary" size="small" @click="editDialogEdit(scope)"
>编辑</el-button
>
<el-button type="primary" size="small" @click="deleteLine(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
Data model:
return {
tableData: [],
}
created
created() {
this.getData();
},
methods:
methods: {
//查询列表接口
getData() {
get("/sys/integral/invite/sel").then((res) => {
if (res.code === 200) {
res.data.forEach((item) => {
if (item.updateTime == null) {
item.updateTime = "";
} else {
item.updateTime = moment(item.updateTime).format(
"YYYY-MM-DD HH:mm:ss"
);
}
});
console.log(res.data);
this.tableData = res.data;
} else {
this.tableData = [];
}
});
},
//删除,带上当前行的id即可row.id
deleteLine(row) {
this.$confirm("此操作将永久删除, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
del("/sys/integral/invite/del?inviteId=" + row.id).then((res) => {
if (res.code === 200) {
this.$message.success("删除成功!");
this.getData();
} else {
try {
this.$message.error(res.data);
} catch {
this.$message.error(res.msg);
}
}
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
});
},
}