You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
397 lines
11 KiB
397 lines
11 KiB
3 years ago
|
<template>
|
||
|
|
<basic-container>
|
||
|
|
<avue-crud
|
||
|
|
:option="option"
|
||
|
|
:table-loading="loading"
|
||
|
|
:data="data"
|
||
|
|
:page.sync="page"
|
||
|
|
ref="crud"
|
||
|
|
v-model="form"
|
||
|
|
:permission="permissionList"
|
||
|
|
:before-open="beforeOpen"
|
||
|
|
@search-change="searchChange"
|
||
|
|
@search-reset="searchReset"
|
||
|
|
@selection-change="selectionChange"
|
||
|
|
@current-change="currentChange"
|
||
|
|
@size-change="sizeChange"
|
||
|
|
@refresh-change="refreshChange"
|
||
|
|
@on-load="onLoad"
|
||
|
|
>
|
||
|
|
<template slot-scope="scope" slot="reStatusSearch">
|
||
|
|
<el-select v-model="form.reStatus" placeholder="请选择诉求状态">
|
||
|
|
<el-option
|
||
|
|
v-for="item in statusData"
|
||
|
|
:key="item.value"
|
||
|
|
:label="item.label"
|
||
|
|
:value="item.value"
|
||
|
|
></el-option>
|
||
|
|
</el-select>
|
||
|
|
</template>
|
||
|
|
<template slot-scope="scope" slot="timeRangeSearch">
|
||
|
|
<el-date-picker
|
||
|
|
v-model="form.timeRange"
|
||
|
|
type="datetimerange"
|
||
|
|
range-separator="至"
|
||
|
|
start-placeholder="开始日期"
|
||
|
|
end-placeholder="结束日期"
|
||
|
|
>
|
||
|
|
</el-date-picker>
|
||
|
|
</template>
|
||
|
|
<template slot-scope="scope" slot="reTypeSearch">
|
||
|
|
<el-select v-model="form.reType" placeholder="请选择诉求类型">
|
||
|
|
<el-option
|
||
|
|
v-for="item in typeData"
|
||
|
|
:key="item.value"
|
||
|
|
:label="item.label"
|
||
|
|
:value="item.value"
|
||
|
|
></el-option>
|
||
|
|
</el-select>
|
||
|
|
</template>
|
||
|
|
<template slot-scope="scope" slot="windowsSearch">
|
||
|
|
<el-select v-model="form.windows" placeholder="请选择处理窗口">
|
||
|
|
<el-option
|
||
|
|
v-for="item in winData"
|
||
|
|
:key="item.value"
|
||
|
|
:label="item.label"
|
||
|
|
:value="item.value"
|
||
|
|
></el-option>
|
||
|
|
</el-select>
|
||
|
|
</template>
|
||
|
|
<template slot-scope="scope" slot="nameSearch">
|
||
|
|
<el-input v-model="form.name" placeholder="请输入代表姓名"></el-input>
|
||
|
|
</template>
|
||
|
|
<template slot-scope="{ row }" slot="menu">
|
||
|
|
<!-- <el-button
|
||
|
|
size="small"
|
||
|
|
@click="handleRegis(row)"
|
||
|
|
>再次调解</el-button
|
||
|
|
> -->
|
||
|
|
<el-button
|
||
|
|
size="small"
|
||
|
|
@click="handleRecon(row)"
|
||
|
|
>诉求调解</el-button
|
||
|
|
>
|
||
|
|
<el-button
|
||
|
|
size="small"
|
||
|
|
@click="handleList(row)"
|
||
|
|
>调解记录</el-button
|
||
|
|
>
|
||
|
|
</template>
|
||
|
|
<template slot-scope="scope" slot="status">
|
||
|
|
<div v-show="scope.row.status == 0" style="color: #529ce5">待处理</div>
|
||
|
|
<div v-show="scope.row.status == 1" style="color: #91b337">正在处理</div>
|
||
|
|
<div v-show="scope.row.status == 2" style="color: #e99f42">达成协议</div>
|
||
|
|
<div v-show="scope.row.status == 3" style="color: #101010">调解成功</div>
|
||
|
|
</template>
|
||
|
|
<template slot-scope="scope" slot="endTime">
|
||
|
|
<div>{{scope.row.endTime !== '' ? scope.row.endTime : '---/-/---'}}</div>
|
||
|
|
</template>
|
||
|
|
<template slot-scope="scope" slot="menuLeft">
|
||
|
|
<el-button
|
||
|
|
type="primary"
|
||
|
|
icon="el-icon-plus"
|
||
|
|
size="small"
|
||
|
|
@click="addRegister"
|
||
|
|
>诉求登记</el-button
|
||
|
|
>
|
||
|
|
</template>
|
||
|
|
</avue-crud>
|
||
|
|
<el-dialog
|
||
|
|
title="调解记录"
|
||
|
|
:visible.sync="dialogVisible"
|
||
|
|
width="30%"
|
||
|
|
:modal-append-to-body="true"
|
||
|
|
:append-to-body="true"
|
||
|
|
custom-class="resi_list"
|
||
|
|
>
|
||
|
|
<div class="list">
|
||
|
|
<div class="list_box" v-for="item in listData" :key="item.time" @click="listView(item)">
|
||
|
|
<div class="time_txt">{{item.mediateTime}}<span style="margin-left:20px">调解记录</span></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<span slot="footer" class="dialog-footer">
|
||
|
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
||
|
|
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
|
||
|
|
</span>
|
||
|
|
</el-dialog>
|
||
|
|
</basic-container>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { mapGetters } from "vuex";
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
active:'1',
|
||
|
|
form: {},
|
||
|
|
dialogVisible:false,
|
||
|
|
statusData: [
|
||
|
|
{ label: "待处理", value: "0" },
|
||
|
|
{ label: "正在处理", value: "1" },
|
||
|
|
{ label: "达成协议", value: "2" },
|
||
|
|
{ label: "调解成功", value: "3" },
|
||
|
|
],
|
||
|
|
listData:[
|
||
|
|
{
|
||
|
|
id: "122555646684684",
|
||
|
|
mediateTime: "2012-05-15 12:30",
|
||
|
|
talkingAdvice: "接谈意见..........."
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id: "122555646684684",
|
||
|
|
mediateTime: "2022-05-15 12:30",
|
||
|
|
talkingAdvice: "接谈意见..........."
|
||
|
|
}
|
||
|
|
],
|
||
|
|
typeData:[
|
||
|
|
{label:'邻里纠纷',value:0},
|
||
|
|
{label:'婚姻纠纷',value:1},
|
||
|
|
{label:'合同纠纷',value:2},
|
||
|
|
],
|
||
|
|
winData:[
|
||
|
|
{label:'窗口一',value:0},
|
||
|
|
{label:'窗口二',value:1},
|
||
|
|
{label:'窗口三',value:2},
|
||
|
|
],
|
||
|
|
query: {},
|
||
|
|
loading: true,
|
||
|
|
page: {
|
||
|
|
pageSize: 10,
|
||
|
|
currentPage: 1,
|
||
|
|
total: 0,
|
||
|
|
},
|
||
|
|
selectionList: [],
|
||
|
|
option: {
|
||
|
|
searchShowBtn: false,
|
||
|
|
refreshBtn: false,
|
||
|
|
columnBtn: false,
|
||
|
|
height: "auto",
|
||
|
|
calcHeight: 30,
|
||
|
|
tip: false,
|
||
|
|
searchShow: true,
|
||
|
|
searchMenuSpan: 4,
|
||
|
|
searchSpan: 6,
|
||
|
|
border: false,
|
||
|
|
index: true,
|
||
|
|
addBtn: false,
|
||
|
|
viewBtn: false,
|
||
|
|
editBtn: false,
|
||
|
|
delBtn: false,
|
||
|
|
index: true,
|
||
|
|
column: [
|
||
|
|
{
|
||
|
|
label: "诉求状态",
|
||
|
|
prop: "reStatus",
|
||
|
|
search: true,
|
||
|
|
searchslot: true,
|
||
|
|
hide: true,
|
||
|
|
// searchSpan: 4,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "诉求类型",
|
||
|
|
prop: "reType",
|
||
|
|
search: true,
|
||
|
|
searchslot: true,
|
||
|
|
hide: true,
|
||
|
|
// searchSpan: 4,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "处理窗口",
|
||
|
|
prop: "windows",
|
||
|
|
search: true,
|
||
|
|
searchslot: true,
|
||
|
|
hide: true,
|
||
|
|
// searchSpan: 4,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "代表姓名",
|
||
|
|
prop: "name",
|
||
|
|
search: true,
|
||
|
|
searchslot: true,
|
||
|
|
hide: true,
|
||
|
|
// searchSpan: 4,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "登记时间",
|
||
|
|
prop: "timeRange",
|
||
|
|
search: true,
|
||
|
|
searchslot: true,
|
||
|
|
hide: true,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "代表姓名",
|
||
|
|
prop: "peoName",
|
||
|
|
align: "center",
|
||
|
|
overHidden:true,
|
||
|
|
width:70,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "身份证号码",
|
||
|
|
overHidden:true,
|
||
|
|
width:150,
|
||
|
|
prop: "ic_card",
|
||
|
|
align: "center",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "诉求类型",
|
||
|
|
overHidden:true,
|
||
|
|
prop: "type",
|
||
|
|
align: "center",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "登记时间",
|
||
|
|
overHidden:true,
|
||
|
|
prop: "time",
|
||
|
|
align: "center",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "办结时间",
|
||
|
|
slot:true,
|
||
|
|
prop: "endTime",
|
||
|
|
align: "center",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "反应主要问题",
|
||
|
|
overHidden:true,
|
||
|
|
prop: "question",
|
||
|
|
align: "center",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "状态",
|
||
|
|
prop: "status",
|
||
|
|
slot: true,
|
||
|
|
align: "center",
|
||
|
|
},
|
||
|
|
],
|
||
|
|
},
|
||
|
|
data: [],
|
||
|
|
time:'',
|
||
|
|
date:'',
|
||
|
|
};
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
...mapGetters(["permission"]),
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
this.getTime()
|
||
|
|
console.log(this.permission)
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
handleList(){
|
||
|
|
this.dialogVisible = true
|
||
|
|
},
|
||
|
|
handleRegis(){
|
||
|
|
this.$router.push({ path: "/register/add",query:{type:'edit'} });
|
||
|
|
},
|
||
|
|
handleRecon(){
|
||
|
|
this.$router.push({ path: "/register/recon",query:{type:'recon',time:this.date + ' ' + this.time} });
|
||
|
|
},
|
||
|
|
listView(row){
|
||
|
|
this.$router.push({ path: "/register/recon",query:{type:'view',time:row.mediateTime,id:row.id} });
|
||
|
|
},
|
||
|
|
searchReset() {
|
||
|
|
this.query = {};
|
||
|
|
this.form = {};
|
||
|
|
this.onLoad(this.page);
|
||
|
|
},
|
||
|
|
searchChange(params, done) {
|
||
|
|
console.log(this.form);
|
||
|
|
this.query = this.form;
|
||
|
|
this.page.currentPage = 1;
|
||
|
|
this.onLoad(this.page, this.form);
|
||
|
|
done();
|
||
|
|
},
|
||
|
|
fn(str) {
|
||
|
|
let num = null;
|
||
|
|
str >= 10 ? (num = str) : (num = "0" + str);
|
||
|
|
return num;
|
||
|
|
},
|
||
|
|
getTime() {
|
||
|
|
//获取当前时间
|
||
|
|
var date = new Date();
|
||
|
|
var year = date.getFullYear(); //当前年份
|
||
|
|
var month = date.getMonth(); //当前月份
|
||
|
|
var data = date.getDate(); //天
|
||
|
|
var hours = date.getHours(); //小时
|
||
|
|
var minute = date.getMinutes(); //分
|
||
|
|
var second = date.getSeconds(); //秒
|
||
|
|
this.day = date.getDay(); //获取当前星期几
|
||
|
|
// this.getWeek(this.day);
|
||
|
|
this.time = this.fn(hours) + ":" + this.fn(minute);
|
||
|
|
this.date = year + "/" + (month + 1) + "/" + data;
|
||
|
|
},
|
||
|
|
onLoad() {
|
||
|
|
this.loading = false;
|
||
|
|
this.data = [
|
||
|
|
{ peoName: "王二狗", ic_card: "370212188501******", type:'合同纠纷',
|
||
|
|
time:'2020-12-01 09:23',endTime:"2023-05-22 09:12",
|
||
|
|
question:'此处反应问题问合同纠纷类问题，此处反应问题问合同纠纷类问题',status: 0
|
||
|
|
},
|
||
|
|
{ peoName: "张三，李四", ic_card: "371212199501******", type:'合同纠纷',
|
||
|
|
time:'2020-12-01 09:23',endTime:"",
|
||
|
|
question:'此处反应问题问合同纠纷类问题',status: 1
|
||
|
|
},
|
||
|
|
{ peoName: "王五", ic_card: "371212199501******,371212199501******", type:'合同纠纷',
|
||
|
|
time:'2020-12-01 09:23',endTime:"2023-05-22 09:12",
|
||
|
|
question:'此处反应问题问合同纠纷类问题',status: 2
|
||
|
|
},
|
||
|
|
{ peoName: "王五", ic_card: "371212199501******,371212199501******", type:'合同纠纷',
|
||
|
|
time:'2020-12-01 09:23',endTime:"2023-05-22 09:12",
|
||
|
|
question:'此处反应问题问合同纠纷类问题',status: 3
|
||
|
|
},
|
||
|
|
];
|
||
|
|
this.page.total = this.data.length;
|
||
|
|
},
|
||
|
|
addRegister() {
|
||
|
|
this.$router.push({ path: "/register/add",query:{type:'add'} });
|
||
|
|
},
|
||
|
|
handleEdit() {
|
||
|
|
this.$router.push({ path: "/request/add" });
|
||
|
|
},
|
||
|
|
handleDis(row) {
|
||
|
|
this.$confirm(`确认禁用当前处理窗口吗？`, {
|
||
|
|
confirmButtonText: "确定",
|
||
|
|
cancelButtonText: "取消",
|
||
|
|
type: "warning",
|
||
|
|
}).then((res) => {});
|
||
|
|
},
|
||
|
|
handleDelete(row) {
|
||
|
|
this.$confirm(`确认删除当前处理窗口吗？`, {
|
||
|
|
confirmButtonText: "确定",
|
||
|
|
cancelButtonText: "取消",
|
||
|
|
type: "warning",
|
||
|
|
}).then((res) => {});
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
.resi_list{
|
||
|
|
.list{
|
||
|
|
width: 80%;
|
||
|
|
max-height: 246px;
|
||
|
|
overflow-y: auto;
|
||
|
|
|
||
|
|
.list_box{
|
||
|
|
width: 100%;
|
||
|
|
height: 41px;
|
||
|
|
font-size: 20px;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
|
||
|
|
& :hover{
|
||
|
|
cursor: pointer;
|
||
|
|
// .time_txt{
|
||
|
|
color: #4095e5;
|
||
|
|
|
||
|
|
// }
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<style scoped>
|
||
|
|
|
||
|
|
</style>
|