123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309 |
- <template>
- <div class="complaint">
- <div class="search">
- <el-input
- placeholder="请输入地址/投诉人"
- maxlength="20"
- class="search-input"
- clearable
- v-model.trim="mixins_query.likeValue"
- ></el-input>
- <el-select
- placeholder="请选择所属社区"
- v-model="mixins_query.communityId"
- clearable
- >
- <el-option
- v-for="(item, index) in communityList"
- :key="index"
- :label="item.communityName"
- :value="item.id"
- ></el-option>
- </el-select>
- <el-select
- placeholder="请选择投诉类型"
- v-model="mixins_query.type"
- clearable
- >
- <el-option
- v-for="(item, index) in complaintType"
- :key="index"
- :label="item.label"
- :value="item.status"
- >{{
- item.label
- }}</el-option>
- </el-select>
- <el-select
- placeholder="请选择投诉状态"
- v-model="mixins_query.handleStatus"
- clearable
- >
- <el-option
- v-for="(item, index) in complaintStatusSerach"
- :key="index"
- :label="item.label"
- :value="item.status"
- ></el-option>
- </el-select>
- <el-date-picker
- v-model="pickerTime"
- value-format="yyyy-MM-dd"
- type="daterange"
- range-separator="至"
- start-placeholder="开始日期"
- end-placeholder="结束日期"
- :picker-options="pickerOptions"
- @change="timeToggle"
- :editable="false"
- ></el-date-picker>
- <el-button
- type="primary"
- placeholder="状态"
- class="search-btn"
- @click="mixins_search"
- icon="el-icon-search"
- v-preventReClick
- >查询
- </el-button>
- </div>
- <div class="content">
- <div class="roles-wrap">
- <zz-table
- :cols="cols"
- :settings="{ showNumber: true, stripe: true }"
- :data="mixins_list"
- :pageset="mixins_pageset"
- @page-change="pageChange"
- :loading="mixins_onQuery"
- >
- <template
- slot-scope="scope"
- slot="content"
- >
- <div>{{ scope.row.content }}</div>
- </template>
- <template
- slot-scope="scope"
- slot="house"
- >
- <!-- <div>{{ scope.row.unitName }}{{ roomNumber }}</div> -->
- <div>{{ scope.row.communityName }}{{ scope.row.unitName }}{{ scope.row.roomNumber }}</div>
- </template>
- <template
- slot-scope="scope"
- slot="status"
- >
- <div :class="{ statusColor: scope.row.handleStatus === 1 }">
- {{ scope.row.handleStatus | filterComplaintStatus }}
- </div>
- </template>
- <template
- slot-scope="scope"
- slot="opt"
- >
- <div
- class="opt"
- @click="clickEdit(scope.row)"
- >
- <i
- v-if="scope.row.id === 1"
- class="zoniot_font zoniot-icon-chuli"
- ></i>
- <i
- v-else
- class="zoniot_font zoniot-icon-xiangqing"
- ></i>
- <!-- <img
- v-if="scope.row.id === 1"
- src="../../assets/img/icon_chuli@2x.png"
- alt=""
- />
- <img
- v-else
- src="../../assets/img/icon_biaodan@2x.png"
- alt=""
- /> -->
- </div>
- </template>
- </zz-table>
- </div>
- </div>
- </div>
- </template>
- <script>
- import list from '@utils/list.js';
- export default {
- mixins: [list],
- data () {
- return {
- //社区列表
- communityList: [],
- // 投诉类型
- complaintType: [
- {
- status: 1,
- label: '扰民投诉'
- },
- {
- status: 2,
- label: '物业服务'
- },
- {
- status: 3,
- label: '公共卫生'
- },
- {
- status: 4,
- label: '安全建议'
- },
- {
- status: 5,
- label: '其他'
- }
- ],
- // 投诉状态
- complaintStatusSerach: [
- {
- status: 1,
- label: '未处理'
- },
- {
- status: 2,
- label: '已处理'
- },
- {
- status: 3,
- label: '处理中'
- },
- {
- status: 4,
- label: '待评价'
- },
- {
- status: 5,
- label: '已评价'
- }
- ],
- // 查询的时间
- pickerTime: [],
- cols: [
- {
- label: '所属社区',
- prop: 'communityName'
- },
- {
- label: '房间地址',
- prop: 'houseId',
- slot: 'house'
- },
- {
- label: '投诉类型',
- prop: 'type',
- format (val) {
- if (val == '1') {
- return '扰民投诉';
- } else if (val == '2') {
- return '物业服务';
- } else if (val == '3') {
- return '公共卫生';
- } else if (val == '4') {
- return '安全建议';
- } else {
- return '其他';
- }
- }
- },
- {
- label: '投诉人',
- prop: 'userName'
- },
- {
- label: '联系电话',
- prop: 'phone'
- },
- {
- label: '投诉时间',
- prop: 'createDate'
- },
- {
- label: '内容',
- prop: 'content',
- slot: 'content',
- width: 260
- },
- {
- label: '状态',
- prop: 'handleStatus',
- slot: 'status'
- },
- {
- label: '操作',
- prop: 'id',
- slot: 'opt'
- }
- ],
- mixins_post: 'post'
- };
- },
- created () {
- this.getCommunityList();
- this.mixins_dataUrl = '/czc-community/feedback/page';
- this.mixins_search();
- },
- mounted () { },
- methods: {
- timeToggle (e) {
- let start = '00:00:00',
- end = '23:59:59';
- if (!!e) {
- this.mixins_query.startTime = `${e[0]} ${start}`;
- this.mixins_query.endTime = `${e[1]} ${end}`;
- } else {
- this.mixins_query.startTime = ``;
- this.mixins_query.endTime = ``;
- }
- },
- /** 获取社区列表*/
- getCommunityList () {
- this.$http.get('/czc-community/assets/community/list').then(({ data, msg, status }) => {
- if (status == 0) {
- this.communityList = data;
- this.$store.commit('setAreaSelect', data);
- }
- });
- },
- /** 查看处理详情*/
- clickEdit (row) {
- new Promise((resolve) => {
- this.$store.dispatch('addPopup', {
- url: '/propertyManagement/stepPage/indexEdit.vue',
- width: '700px',
- height: '650px',
- props: {
- row,
- callback: resolve
- },
- showResetButton: row.handleStatus == 1 || row.handleStatus == 3 ? true : false,
- showConfirmButton: row.handleStatus == 1 || row.handleStatus == 3 ? false : true,
- showCancelButton: row.handleStatus == 1 || row.handleStatus == 3 ? true : false,
- confirmButtonText: '提交',
- hideStar: row.handleStatus == 1 || row.handleStatus == 3 ? false : true,
- title: '投诉建议'
- });
- }).then(() => {
- this.mixins_search();
- });
- }
- }
- };
- </script>
- <style lang="scss" scoped>
- @import './style.scss';
- /deep/ .el-dialog {
- margin-top: 5vh !important;
- }
- </style>
|