parent
7b6faa16a8
commit
6c3026aa49
@ -0,0 +1,250 @@
|
||||
<template>
|
||||
<div>
|
||||
<Modal v-model="isShow" title="备注" footer-hide :width="64">
|
||||
<Button type="primary" shape="circle" icon="ios-add" @click="add"
|
||||
>新增</Button
|
||||
>
|
||||
|
||||
<Table
|
||||
style="margin-top: 10px"
|
||||
:height="320"
|
||||
:data="detail.content"
|
||||
:columns="columns"
|
||||
>
|
||||
</Table>
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { show, save } from "@/api/propertyPlan";
|
||||
export default {
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
key: 1,
|
||||
isShowModal: false,
|
||||
isShow: false,
|
||||
id: "",
|
||||
type: "",
|
||||
|
||||
detail: {},
|
||||
columns: [
|
||||
{
|
||||
key: "title",
|
||||
title: "标题",
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
key: "content",
|
||||
title: "内容",
|
||||
minWidth: 220,
|
||||
align: "left",
|
||||
},
|
||||
{
|
||||
key: "date",
|
||||
title: "日期",
|
||||
width: 160,
|
||||
},
|
||||
{
|
||||
key: 'operate',
|
||||
title: '操作',
|
||||
width: 100,
|
||||
align: 'left',
|
||||
render: (h,{ row }) => {
|
||||
return h('Poptip',{
|
||||
props: {
|
||||
transfer: true,
|
||||
confirm: true,
|
||||
title: "确认要删除吗"
|
||||
},
|
||||
scopedSlots: {
|
||||
default: () => {
|
||||
return h('Button',{
|
||||
props: {
|
||||
ghost: true,
|
||||
size: 'small',
|
||||
type: 'error'
|
||||
}
|
||||
},'删除')
|
||||
}
|
||||
},
|
||||
on: {
|
||||
['on-ok']:_ =>{
|
||||
let contents = this.detail.content.filter(i => i.id !== row.id)
|
||||
save({
|
||||
...this.detail,
|
||||
content_list: contents,
|
||||
attachment_list: this.detail.attachment.map(i => {
|
||||
return {
|
||||
date: i.date,
|
||||
content: i.content,
|
||||
file: i.file.id
|
||||
}
|
||||
})
|
||||
}).then(_ => {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功'
|
||||
})
|
||||
this.getDetail()
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
show() {
|
||||
this.isShow = true;
|
||||
},
|
||||
hidden() {
|
||||
this.isShow = false;
|
||||
},
|
||||
init() {
|
||||
for (let key in this.form) {
|
||||
if (this.form[key] instanceof Array) {
|
||||
this.form[key] = [];
|
||||
} else {
|
||||
this.form[key] = "";
|
||||
}
|
||||
}
|
||||
this.$refs["dialog"].clearValidate();
|
||||
},
|
||||
setId(id) {
|
||||
if (typeof id == "number") {
|
||||
this.id = id;
|
||||
} else {
|
||||
console.error("error typeof id: " + typeof id);
|
||||
}
|
||||
},
|
||||
getId() {
|
||||
return this.id;
|
||||
},
|
||||
setType(type = "add") {
|
||||
let types = ["add", "editor"];
|
||||
if (types.includes(type)) {
|
||||
this.type = type;
|
||||
} else {
|
||||
console.warn("Unknown type: " + type);
|
||||
}
|
||||
},
|
||||
setForm(key = [], value = []) {
|
||||
if (key instanceof Array) {
|
||||
key.forEach((key, index) => {
|
||||
this.form[key] = value[index] ?? "";
|
||||
});
|
||||
}
|
||||
if (typeof key === "string") {
|
||||
this.form[key] = value;
|
||||
}
|
||||
if (!key) {
|
||||
this.init();
|
||||
}
|
||||
},
|
||||
|
||||
async getDetail() {
|
||||
const res = await show({ id: this.getId() });
|
||||
this.detail = res;
|
||||
console.log(res);
|
||||
},
|
||||
|
||||
async add() {
|
||||
let form = {
|
||||
date: this.$moment(new Date()).format("YYYY-MM-DD"),
|
||||
title: "",
|
||||
content: "",
|
||||
};
|
||||
const h = this.$createElement;
|
||||
this.$msgbox({
|
||||
title: "新增备注",
|
||||
message: h(
|
||||
"el-form",
|
||||
{ key: ++this.key, props: { model: form, "label-width": "80px" } },
|
||||
[
|
||||
h("el-form-item", {
|
||||
props: { label: "标题" },
|
||||
scopedSlots: {
|
||||
default: () =>
|
||||
h("input", {
|
||||
class: "el-input__inner",
|
||||
props: { value: form.title },
|
||||
on: {
|
||||
["input"]: (e) => {
|
||||
form.title = e.target.value;
|
||||
},
|
||||
},
|
||||
}),
|
||||
},
|
||||
}),
|
||||
h("el-form-item", {
|
||||
props: { label: "内容" },
|
||||
scopedSlots: {
|
||||
default: () =>
|
||||
h("textarea", {
|
||||
class: "el-textarea__inner",
|
||||
props: { value: form.content },
|
||||
on: {
|
||||
["input"]: (e) => {
|
||||
form.content = e.target.value;
|
||||
},
|
||||
},
|
||||
}),
|
||||
},
|
||||
}),
|
||||
]
|
||||
),
|
||||
showCancelButton: true,
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
beforeClose: (action, instance, done) => {
|
||||
if (action === "confirm") {
|
||||
instance.confirmButtonLoading = true;
|
||||
instance.confirmButtonText = "保存中...";
|
||||
this.detail.content_list = [
|
||||
...this.detail.content.map((i) => {
|
||||
return { title: i.title, content: i.content, date: i.date };
|
||||
}),
|
||||
form,
|
||||
];
|
||||
save(this.detail)
|
||||
.then((_) => {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "保存成功",
|
||||
});
|
||||
instance.confirmButtonLoading = false;
|
||||
done();
|
||||
this.getDetail()
|
||||
})
|
||||
.catch((_) => {
|
||||
instance.confirmButtonLoading = false;
|
||||
});
|
||||
} else {
|
||||
done();
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
isShow(val) {
|
||||
if (val) {
|
||||
this.getDetail();
|
||||
} else {
|
||||
this.id = "";
|
||||
}
|
||||
},
|
||||
},
|
||||
created() {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
::v-deep .el-input__inner {
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue