<template>
|
<div class='box-a'>
|
<v-header
|
title="居民留言板"
|
search
|
:bar="bar"
|
@on-search="onSearch"
|
></v-header>
|
<!---->
|
<div class="title-box">
|
<div class="title-l">提示：</div>
|
<div class="title-r">
|
<div class="title-c">1.因留言恐会涉及国家安全、社会安全、个人隐私等，由此系统默认居民的留言为保密状态，仅社区后台、社区工作人员、社区党委可见和回复</div>
|
<div class="title-c">2.若需公开留言，社区后台工作人员可在留言板将“是否公开”开关开启，开启后留言居民可见</div>
|
</div>
|
</div>
|
<!---->
|
<div style="padding-top: 10px">
|
<el-button
|
@click="batch(1)"
|
size="medium"
|
type="primary"
|
>批量公开</el-button>
|
<el-button
|
@click="batch(2)"
|
size="medium"
|
type="primary"
|
>批量保密</el-button>
|
</div>
|
<!-- <div class="table">
|
<el-table
|
:data="tableData"
|
border
|
:header-cell-style="{background: '',height:'20px'}"
|
@selection-change="handleSelectionChange"
|
style="width: 100%"
|
>
|
<el-table-column
|
type="selection"
|
width="50"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="userAccount"
|
label="留言人账号"
|
width="120"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="userName"
|
label="留言人姓名"
|
width="100"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="userPhone"
|
label="联系方式"
|
width="120"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="msgContent"
|
label="留言内容"
|
width="200"
|
height="80"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="sendtoUserName"
|
label="留言对象"
|
width="120"
|
>
|
</el-table-column>
|
<el-table-column
|
label="状态"
|
width="90"
|
>
|
<template slot-scope="{row}">
|
{{row.status==1?'待回复':'已回复'}}
|
</template>
|
</el-table-column>
|
<el-table-column
|
label="是否公开"
|
width="90"
|
>
|
<template slot-scope="{row}">
|
<el-switch
|
@change="switchChe(row)"
|
v-model="row.switch"
|
>
|
</el-switch>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="createAt"
|
label="留言时间"
|
width="200"
|
>
|
</el-table-column>
|
<el-table-column
|
fixed="right"
|
label="操作"
|
>
|
<template slot-scope="{row}">
|
<el-button
|
@click="detail(row)"
|
type="text"
|
>查看详情</el-button>
|
<el-button
|
@click="clear(row)"
|
type="text"
|
>删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div> -->
|
<div class="tab">
|
<v-tool-table
|
:trs="trs"
|
:tds="tableData"
|
first
|
firstWidth="60px"
|
>
|
<template v-slot:first-th>
|
<div>
|
<el-checkbox v-model="alls"></el-checkbox>
|
</div>
|
</template>
|
<template v-slot:first-td="{scope}">
|
<div>
|
<el-checkbox v-model="scope.t_check"></el-checkbox>
|
</div>
|
</template>
|
<template v-slot:status="{scope}">
|
<div>
|
{{scope.status==1?'待回复':'已回复'}}
|
</div>
|
</template>
|
<template v-slot:show="{scope}">
|
<div>
|
<el-switch
|
@change="switchChe(scope)"
|
v-model="scope.switch"
|
>
|
</el-switch>
|
</div>
|
</template>
|
<template v-slot:btn="{scope}">
|
<div class="table_flex">
|
<span @click="detail(scope)">查看详情</span>
|
<span @click="clear(scope)">删除</span>
|
</div>
|
</template>
|
<template v-slot:text="{scope}">
|
<div>
|
<p
|
class="a33"
|
:title="scope.msgContent"
|
>{{scope.msgContent}}</p>
|
</div>
|
</template>
|
</v-tool-table>
|
</div>
|
<v-tool-page
|
:item="paged"
|
@on-page="onPage"
|
></v-tool-page>
|
</div>
|
</template>
|
<script>
|
export default {
|
props: [],
|
components: {},
|
data() {
|
return {
|
tableData: [],
|
cheList: [], //选择的数据
|
paged: { page: 1, total: 0, r: 0, limit: 10 },
|
search: {},
|
bar: [
|
{ title: "留言人账号", name: "userAccount", value: "" },
|
{ title: "留言人姓名", name: "userName",value:"" },
|
{ title: "联系方式", name: "userPhone" },
|
{ title: "留言内容", name: "msgContent" },
|
{
|
title: "留言对象",
|
name: "type",
|
type: "select",
|
list: [
|
{ value: "1", label: "社区团队" },
|
{ value: "2", label: "社区党委" },
|
],
|
},
|
{
|
title: "状态",
|
name: "status",
|
type: "select",
|
list: [
|
{ value: "0", label: "全部" },
|
{ value: "1", label: "待回复" },
|
{ value: "2", label: "已回复" },
|
],
|
},
|
{
|
title: "是否公开",
|
name: "ispublic",
|
type: "select",
|
list: [
|
{ value: "1", label: "公开" },
|
{ value: "2", label: "保密" },
|
],
|
},
|
{ title: "留言时间", name: "time", type: "times", types: "daterange" },
|
],
|
trs: [
|
{ text: "留言人账号", val: "userAccount" },
|
{ text: "留言人姓名", val: "userName" },
|
{ text: "联系方式", val: "userPhone" },
|
{ text: "留言内容", val: "btn", slot: "text" },
|
{ text: "留言对象", val: "sendtoUserName" },
|
{ text: "状态", val: "btn", slot: "status" },
|
{ text: "是否公开", val: "btn", slot: "show" },
|
{ text: "留言时间", val: "createAt" },
|
{ text: "操作", val: "btn" },
|
],
|
tds: [],
|
alls: false,
|
backSearch:{}
|
};
|
},
|
created() {
|
this.initial();
|
},
|
|
mounted() {
|
let searchMsg = demo.$session.get("com-message-search");
|
console.log(searchMsg)
|
if(searchMsg) {
|
this.bar.forEach(d=> {
|
if(d.name == 'userName') {
|
d.value = searchMsg.userName;
|
}
|
if(d.name === 'userAccount') {
|
d.value = searchMsg.userAccount;
|
}
|
if(d.name === 'userPhone') {
|
d.value = searchMsg.userPhone;
|
}
|
if(d.name === 'msgContent') {
|
d.value = searchMsg.msgContent;
|
}
|
if(d.name === 'type') {
|
d.value = searchMsg.type;
|
}
|
if(d.name === 'status') {
|
d.value = searchMsg.status;
|
}
|
if(d.name === 'ispublic') {
|
d.value = searchMsg.ispublic;
|
}
|
if(d.name === 'time') {
|
d.value = searchMsg.time;
|
}
|
});
|
}
|
},
|
|
destroyed() {
|
if(this.$route.name !== 'comMessageDetail') {
|
demo.$session.set("com-message-search", {});
|
}
|
},
|
|
|
inject: ["appPath"],
|
|
methods: {
|
handleSelectionChange(e) {
|
// console.log(e) 勾选时
|
this.cheList = e;
|
},
|
detail(item) {
|
console.log(this.search)
|
demo.$session.set("com-message-detail", item);
|
demo.$session.set("com-message-search", this.search);
|
this.appPath("com_message_detail/" + item.id);
|
},
|
switchChe(e) {
|
//开关变动时
|
// console.log(e)
|
let data = {
|
ids: [e.id],
|
ispublic: e.ispublic == 1 ? 2 : 1,
|
};
|
this.resetmessagepublic(data);
|
},
|
batch(type) {
|
//批量操作 1 公开 2 保密
|
// console.log(22);
|
// let ids = [];
|
let ids = this.tableData
|
.filter((r) => {
|
return r.t_check;
|
})
|
.map((v) => {
|
return v.id;
|
});
|
// this.cheList.map((item) => {
|
// ids.push(item.id);
|
// });
|
let data = {
|
ids: ids,
|
ispublic: type,
|
};
|
this.resetmessagepublic(data);
|
},
|
resetmessagepublic(data) {
|
// 批量操作
|
this.$api.del("communitypartybuilding/resetmessagepublic", data, () => {
|
demo.toast("操作成功");
|
this.initial();
|
});
|
},
|
clear(i) {
|
//删除
|
// console.log(i)
|
let data = {
|
id: i.id,
|
};
|
this.$js.model("", "是否删除", (res) => {
|
if (res) {
|
this.$api.del("communitypartybuilding/deletemessage", data, () => {
|
demo.toast("删除成功");
|
this.initial();
|
});
|
}
|
});
|
},
|
initial() {
|
let v = demo.copy(
|
Object.assign(
|
{},
|
{ pageNum: this.paged.page, pageSize: this.paged.limit },
|
this.search
|
)
|
);
|
this.$api.post(
|
"communitypartybuilding/pagemycommunitymessage",
|
v,
|
(e) => {
|
this.paged.total = e.total;
|
this.paged.r++;
|
this.paged.page = v.pageNum;
|
this.tableData = e.records.map((item) => {
|
// switch ispublic
|
item.switch = item.ispublic == 1;
|
item.t_check = false;
|
return item;
|
});
|
}
|
);
|
},
|
onSearch(e) {
|
if (e.time !== "") {
|
e.publishAtBegin = e.time[0];
|
e.publishAtEnd = e.time[1];
|
}
|
// Object.assign(this.paged, e);
|
this.search = e;
|
this.initial();
|
},
|
// 分页点击
|
onPage(v) {
|
if (v.page === this.paged.page && v.page && !v.reset) {
|
return 0;
|
}
|
this.paged.page = v.page;
|
this.paged.limit = v.limit;
|
this.initial();
|
},
|
},
|
watch: {
|
alls(n) {
|
this.tableData = this.tableData.map((r) => {
|
r.t_check = n;
|
return r;
|
});
|
},
|
},
|
computed: {},
|
};
|
</script>
|
<style scope lang="less">
|
.tab {
|
margin: 20px 0;
|
}
|
.a33 {
|
text-overflow: ellipsis;
|
overflow: hidden;
|
display: -webkit-box;
|
-webkit-line-clamp: 2;
|
-webkit-box-orient: vertical;
|
white-space: initial;
|
line-height: 1.2;
|
}
|
.title-box {
|
display: flex;
|
color: #d6d6d6;
|
font-size: 14px;
|
}
|
.title-l {
|
padding-top: 5px;
|
width: 50px;
|
}
|
.title-c {
|
padding: 5px 0;
|
}
|
.el-table__header th {
|
padding: 0;
|
background: #fafafa;
|
height: 42px !important;
|
}
|
.box-a {
|
overflow: scroll;
|
}
|
.table {
|
padding-top: 10px;
|
}
|
</style>
|
