5 changed files with 425 additions and 31 deletions
@ -0,0 +1,292 @@ |
|||
<template> |
|||
<el-dialog |
|||
:visible.sync="visible" |
|||
title="党员中心户" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
> |
|||
<el-table |
|||
:data="tableData" |
|||
border |
|||
row-key="id" |
|||
:header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }" |
|||
> |
|||
<el-table-column prop="name" label="姓名"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="!scope.row.ifEdit">{{ scope.row.name }}</span> |
|||
<el-input v-model="tableDataEdit[scope.$index].name" v-else /> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="type" label="职位"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="!scope.row.ifEdit">{{ |
|||
scope.row.type == 1 ? "组长" : scope.row.type == 2 ? "组员" : "" |
|||
}}</span> |
|||
<el-select v-model="tableDataEdit[scope.$index].type" v-else> |
|||
<el-option label="组长" :value="1"></el-option> |
|||
<el-option label="组员" :value="2"></el-option> |
|||
</el-select> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="sort" label="排序"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="!scope.row.ifEdit">{{ scope.row.sort }}</span> |
|||
<el-input v-model="tableDataEdit[scope.$index].sort" v-else /> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="操作" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-button |
|||
type="text" |
|||
v-if="!scope.row.ifEdit" |
|||
size="small" |
|||
@click="onEdit(scope.$index)" |
|||
class="div-table-button--detail" |
|||
> |
|||
修改 |
|||
</el-button> |
|||
<el-button |
|||
type="text" |
|||
v-if="scope.row.ifEdit" |
|||
size="small" |
|||
@click="onSave(tableDataEdit[scope.$index])" |
|||
class="div-table-button--detail" |
|||
> |
|||
保存 |
|||
</el-button> |
|||
<el-button |
|||
type="text" |
|||
v-if="scope.row.ifEdit" |
|||
size="small" |
|||
@click="onClose(scope)" |
|||
class="div-table-button--detail" |
|||
> |
|||
取消 |
|||
</el-button> |
|||
<el-button |
|||
type="text" |
|||
v-if="!scope.row.ifEdit" |
|||
size="small" |
|||
@click="onDelete(scope.row)" |
|||
class="div-table-button--detail" |
|||
> |
|||
删除 |
|||
</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<el-button size="small" style="width: 100%" @click="onAdd" |
|||
>+ 添加</el-button |
|||
> |
|||
<template slot="footer"> |
|||
<el-button @click="handleCancle">关闭</el-button> |
|||
<!-- <el-button type="primary" @click="dataFormSubmitHandle()">{{ |
|||
$t("confirm") |
|||
}}</el-button> --> |
|||
</template> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost, requestGet } from "@/js/dai/request"; |
|||
export default { |
|||
data() { |
|||
return { |
|||
loading: false, |
|||
visible: false, |
|||
dataForm: {}, |
|||
form: {}, |
|||
partyOrgId: null, |
|||
tableData: [], |
|||
tableDataEdit: [], |
|||
}; |
|||
}, |
|||
mounted() { |
|||
// this.visible = true; |
|||
}, |
|||
methods: { |
|||
handleCancle() { |
|||
this.resetData(); |
|||
this.visible = false; |
|||
}, |
|||
async getData() { |
|||
await this.$http |
|||
.get("/resi/partymember/icpartymemberzxh/page", { |
|||
params: { |
|||
pageNo: 1, |
|||
pageSize: 200, |
|||
orgId: this.partyOrgId, |
|||
}, |
|||
}) |
|||
.then((res) => { |
|||
this.tableDataEdit = res.data.data.list; |
|||
this.tableData = res.data.data.list.map((item) => { |
|||
return { |
|||
...item, |
|||
ifEdit: false, |
|||
}; |
|||
}); |
|||
}); |
|||
}, |
|||
resetData() { |
|||
this.partyOrgId = null; |
|||
this.dataForm = {}; |
|||
this.form = {}; |
|||
this.partyOrgId = null; |
|||
this.tableData = []; |
|||
this.tableDataEdit = []; |
|||
}, |
|||
// 表单提交 |
|||
dataFormSubmitHandle() { |
|||
this.$refs["dataForm"].validate((valid) => { |
|||
if (!valid) { |
|||
return false; |
|||
} |
|||
this.$http[!this.dataForm.id ? "post" : "put"]( |
|||
"/resi/partymember/icPartyOrg/", |
|||
this.dataForm |
|||
) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error( |
|||
res.internalMsg |
|||
? res.internalMsg |
|||
: res.msg |
|||
? res.msg |
|||
: "查询失败" |
|||
); |
|||
} |
|||
this.$message({ |
|||
message: this.$t("prompt.success"), |
|||
type: "success", |
|||
duration: 500, |
|||
onClose: () => { |
|||
this.resetData(); |
|||
this.visible = false; |
|||
|
|||
this.$emit("refreshDataList"); |
|||
}, |
|||
}); |
|||
}) |
|||
.catch(() => {}); |
|||
}); |
|||
}, |
|||
onEdit(index) { |
|||
this.tableData[index].ifEdit = true; |
|||
}, |
|||
async onSave(item) { |
|||
const row = { ...item, ifEdit: undefined }; |
|||
let url = "/resi/partymember/icpartymemberzxh"; |
|||
const { data, code, msg } = await requestPost(url, { |
|||
...row, |
|||
orgId: this.partyOrgId, |
|||
}); |
|||
if (code === 0) { |
|||
this.$message({ |
|||
type: "success", |
|||
message: "操作成功", |
|||
}); |
|||
this.getData(); |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
onClose(scope) { |
|||
if (scope.row.id) { |
|||
this.tableData = this.tableData.map((item, i) => { |
|||
if (scope.$index == i) { |
|||
return { |
|||
...item, |
|||
ifEdit: false, |
|||
}; |
|||
} |
|||
return item; |
|||
}); |
|||
this.tableDataEdit = this.tableData; |
|||
} else { |
|||
this.tableData = this.tableData.slice(0, -1); |
|||
this.tableDataEdit = this.tableDataEdit.slice(0, -1); |
|||
} |
|||
}, |
|||
async onDelete(row) { |
|||
this.$confirm("确认删除?", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.deleteActivity(row); |
|||
}) |
|||
.catch((err) => { |
|||
if (err == "cancel") { |
|||
} |
|||
}); |
|||
}, |
|||
async deleteActivity(row) { |
|||
this.$http |
|||
.delete("/resi/partymember/icpartymemberzxh", { data: [row.id] }) |
|||
.then((res) => { |
|||
this.$message({ |
|||
type: "success", |
|||
message: "删除成功", |
|||
}); |
|||
this.getData(); |
|||
}) |
|||
.catch((res) => { |
|||
this.$message.error(res.msg || "删除失败！"); |
|||
}); |
|||
}, |
|||
onAdd() { |
|||
this.tableData = [ |
|||
...this.tableData, |
|||
{ name: null, position: null, ifEdit: true }, |
|||
]; |
|||
this.tableDataEdit = [ |
|||
...this.tableDataEdit, |
|||
{ name: null, position: null, ifEdit: true }, |
|||
]; |
|||
}, |
|||
}, |
|||
computed: {}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/modules/visual/communityManageForm.scss"; |
|||
</style> |
|||
<style lang="scss" scoped> |
|||
.form { |
|||
margin-top: 0; |
|||
} |
|||
.item_width_1 { |
|||
width: 560px; |
|||
|
|||
/deep/.tox .tox-dialog { |
|||
z-index: 20000; |
|||
} |
|||
} |
|||
|
|||
.div_map { |
|||
position: relative; |
|||
} |
|||
.div_searchmap { |
|||
z-index: 5000; |
|||
position: absolute; |
|||
top: 5px; |
|||
left: 5px; |
|||
} |
|||
|
|||
.tinymce_view { |
|||
height: 400px; |
|||
overflow: auto; |
|||
} |
|||
.text_p { |
|||
margin: 0; |
|||
padding: 0 10px; |
|||
border: 1px solid #d9d9d9; |
|||
border-radius: 5px; |
|||
> p { |
|||
margin: 0; |
|||
} |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue