Commit feae91b0 authored by ww-xxy's avatar ww-xxy

优化办不成事报表

parent 8b85efe6
...@@ -2,12 +2,15 @@ ...@@ -2,12 +2,15 @@
<div class="ff p15"> <div class="ff p15">
<div class="form-box"> <div class="form-box">
<div class="num-dv"> <div class="num-dv">
<a-button :loading="btnLoading" type="primary" class="addclass" @click="handleExportTable"> <a-button :loading="btnLoading" type="primary" class="addclass" @click="handleExportTable">
<span>{{ tableSelectedRows.length ? "导出" : "导出全部" }}</span> <span>{{ tableSelectedRows.length ? "导出" : "导出全部" }}</span>
</a-button> </a-button>
<div class="ml20">提交总次数:<span style="color:#1890ff;font-weight: bold;">{{ numObj ? numObj.count : 0 }}</span></div> <div class="ml20">提交总次数:<span style="color:#1890ff;font-weight: bold;">{{ numObj ? numObj.count : 0
<div class="ml20">回复总次数:<span style="color:#1890ff;font-weight: bold;">{{ numObj ? numObj.reply_count : 0 }}</span></div> }}</span></div>
<div style="font-size:12px;color:#a19a9a;margin-left: 20px;">统计时间段:{{ queryform.time[0] }} ~ {{ queryform.time[1] }}</div> <div class="ml20">回复总次数:<span style="color:#1890ff;font-weight: bold;">{{ numObj ? numObj.reply_count : 0
}}</span></div>
<div style="font-size:12px;color:#a19a9a;margin-left: 20px;">统计时间段:{{ queryform.time[0] }} ~ {{
queryform.time[1] }}</div>
</div> </div>
<a-form :model="queryform" layout="inline"> <a-form :model="queryform" layout="inline">
<a-form-item> <a-form-item>
...@@ -16,8 +19,8 @@ ...@@ -16,8 +19,8 @@
<a-form-item> <a-form-item>
<a-select v-model="queryform.source" style="width: 140px"> <a-select v-model="queryform.source" style="width: 140px">
<a-select-option value="">全部来源</a-select-option> <a-select-option value="">全部来源</a-select-option>
<a-select-option :value="item.value" v-for="item,index in deviceList" <a-select-option :value="item.value" v-for="item, index in deviceList"
:key="index">{{item.label}}</a-select-option> :key="index">{{ item.label }}</a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
...@@ -27,27 +30,27 @@ ...@@ -27,27 +30,27 @@
<a-input v-model:value="queryform.keyword" placeholder="请输入标题或者名字关键字搜索" style="width: 220px" /> <a-input v-model:value="queryform.keyword" placeholder="请输入标题或者名字关键字搜索" style="width: 220px" />
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-button type="primary" class="addclass" @click="getlist">搜索</a-button> <a-button type="primary" class="addclass" @click="getlist">搜索</a-button>
</a-form-item> </a-form-item>
</a-form> </a-form>
</div> </div>
<div class="table-box"> <div class="table-box">
<a-table :dataSource="tabledataSource" :columns="tablecolumns" :pagination="pagination" :scroll="{ y: 590 }" <a-table :dataSource="tabledataSource" :columns="tablecolumns" :pagination="pagination" :scroll="{ y: 590 }"
:row-key="(record) => record.id" @change="changeTablePage" :row-selection="{ :row-key="(record) => record.id" @change="changeTablePage" :row-selection="{
selectedRowKeys: tableSelectedKeys, selectedRowKeys: tableSelectedKeys,
onChange: onSelectChange, onChange: onSelectChange,
}"> }">
<template slot="type" slot-scope="text, record, index"> <template slot="type" slot-scope="text, record, index">
<div>{{typeList.find(item=>record.type).label}}</div> <div>{{ typeList.find(item => record.type).label }}</div>
</template> </template>
<template slot="valid" slot-scope="text, record, index"> <template slot="valid" slot-scope="text, record, index">
<div>{{record.valid == 1 ? '' : ''}}</div> <div>{{ record.valid == 1 ? '' : '' }}</div>
</template> </template>
<template slot="secrecy" slot-scope="text, record, index"> <template slot="secrecy" slot-scope="text, record, index">
<div>{{record.secrecy == 1 ? '' : ''}}</div> <div>{{ record.secrecy == 1 ? '' : '' }}</div>
</template> </template>
<template slot="status" slot-scope="text, record, index"> <template slot="status" slot-scope="text, record, index">
<div>{{record.status == 1 ? '' : ''}}</div> <div>{{ record.status == 1 ? '' : '' }}</div>
</template> </template>
<template slot="操作" slot-scope="text, record, index"> <template slot="操作" slot-scope="text, record, index">
<a-button type="link" @click="detail(record)">详情</a-button> <a-button type="link" @click="detail(record)">详情</a-button>
...@@ -60,37 +63,37 @@ ...@@ -60,37 +63,37 @@
<div style="margin-bottom: 10px;">建议内容</div> <div style="margin-bottom: 10px;">建议内容</div>
<a-descriptions layout="vertical" :column="4"> <a-descriptions layout="vertical" :column="4">
<a-descriptions-item label="问题主题" :span="4"> <a-descriptions-item label="问题主题" :span="4">
{{detailData.title}} {{ detailData.title }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="具体问题" :span="4"> <a-descriptions-item label="具体问题" :span="4">
{{detailData.content}} {{ detailData.content }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="业务名称" :span="4"> <a-descriptions-item label="业务名称" :span="4">
{{detailData.business}} {{ detailData.business }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="办事区县" :span="4"> <a-descriptions-item label="办事区县" :span="4">
{{detailData.region}} {{ detailData.region }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="单位名称" :span="4"> <a-descriptions-item label="单位名称" :span="4">
{{detailData.dept_name}} {{ detailData.dept_name }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="真实姓名"> <a-descriptions-item label="真实姓名">
{{detailData.name}} {{ detailData.name }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="联系电话"> <a-descriptions-item label="联系电话">
{{detailData.phone}} {{ detailData.phone }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="身份证号"> <a-descriptions-item label="身份证号">
{{detailData.idcard}} {{ detailData.idcard }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="电子邮箱"> <a-descriptions-item label="电子邮箱">
{{detailData.email}} {{ detailData.email }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="联系地址" :span="4"> <a-descriptions-item label="联系地址" :span="4">
{{detailData.address}} {{ detailData.address }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="提交时间" :span="4"> <a-descriptions-item label="提交时间" :span="4">
{{detailData.create_time}} {{ detailData.create_time }}
</a-descriptions-item> </a-descriptions-item>
</a-descriptions> </a-descriptions>
</div> </div>
...@@ -98,22 +101,22 @@ ...@@ -98,22 +101,22 @@
<div style="margin-bottom: 10px;">建议答复</div> <div style="margin-bottom: 10px;">建议答复</div>
<a-descriptions layout="vertical" :column="1"> <a-descriptions layout="vertical" :column="1">
<a-descriptions-item label="所属部门"> <a-descriptions-item label="所属部门">
{{detailData.reply_dept}} {{ detailData.reply_dept }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="回复内容"> <a-descriptions-item label="回复内容">
{{detailData.reply_content}} {{ detailData.reply_content }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="附件"> <a-descriptions-item label="附件">
<div class="img-dv" v-if="detailData.reply_url && detailData.reply_url.length > 0"> <div class="img-dv" v-if="detailData.reply_url && detailData.reply_url.length > 0">
<thumbImage :src="item.url" :index="idx" @click="idx = index" fileType="img" <thumbImage :src="item.url" :index="idx" @click="idx = index" fileType="img"
v-for="item,index in detailData.reply_url" :key="index" /> v-for="item, index in detailData.reply_url" :key="index" />
</div> </div>
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="回复人"> <a-descriptions-item label="回复人">
{{detailData.reply_people}} {{ detailData.reply_people }}
</a-descriptions-item> </a-descriptions-item>
<a-descriptions-item label="回复时间"> <a-descriptions-item label="回复时间">
{{detailData.update_time}} {{ detailData.update_time }}
</a-descriptions-item> </a-descriptions-item>
</a-descriptions> </a-descriptions>
</div> </div>
...@@ -127,298 +130,299 @@ ...@@ -127,298 +130,299 @@
</div> </div>
</template> </template>
<script> <script>
import { import {
getImpossible, getImpossible,
getImpossibleInfo, getImpossibleInfo,
getCountImpossible getCountImpossible
} from '@/api/dataAdmin.js' } from '@/api/dataAdmin.js'
import image from '@/components/image/thumbImage' import image from '@/components/image/thumbImage'
import { import {
export2Excel export2Excel
} from "@/utils/js/exportExcel"; } from "@/utils/js/exportExcel";
import moment from 'moment' import moment from 'moment'
export default { export default {
data() { data() {
return { return {
idx: 0, idx: 0,
queryform: { queryform: {
page: 1, page: 1,
size: 10, size: 10,
source: '', source: '',
keyword: null, keyword: null,
time: [moment().format('yyyy-MM-DD'),moment().format('yyyy-MM-DD')], time: [moment().format('yyyy-MM-DD'), moment().format('yyyy-MM-DD')],
reply:'' reply: ''
}, },
deviceList: [{ deviceList: [{
label: '微官网', label: '微官网',
value: 1 value: 1
}, { }, {
label: '自助服务系统', label: '自助服务系统',
value: 2 value: 2
}], }],
btnLoading: false, btnLoading: false,
tableSelectedKeys: [], tableSelectedKeys: [],
tableSelectedRows: [], tableSelectedRows: [],
defaultFileList: [], defaultFileList: [],
visible: false, visible: false,
tablename: "treaty", //接口地址 名称 tablename: "treaty", //接口地址 名称
tablecolumns: [{ tablecolumns: [{
title: "序号", title: "序号",
width: "70px", width: "70px",
align: 'center', align: 'center',
customRender: (text, record, index) => customRender: (text, record, index) =>
(this.queryform.page - 1) * this.queryform.size + (this.queryform.page - 1) * this.queryform.size +
index + index +
1, 1,
}, },
{ {
title: "问题主题", title: "问题主题",
dataIndex: "title", dataIndex: "title",
align: 'center', align: 'center',
scopedSlots: { scopedSlots: {
customRender: (text, record, index) => `${record.title || '--'}` customRender: (text, record, index) => `${record.title || '--'}`
}, },
}, },
{ {
title: "业务名称", title: "业务名称",
dataIndex: "business", dataIndex: "business",
align: 'center', align: 'center',
scopedSlots: { scopedSlots: {
customRender: (text, record, index) => `${record.business || '--'}` customRender: (text, record, index) => `${record.business || '--'}`
}, },
}, },
{ {
title: "真实姓名", title: "真实姓名",
dataIndex: "name", dataIndex: "name",
align: 'center', align: 'center',
customRender: (text, record, index) => `${record.name || '--'}` customRender: (text, record, index) => `${record.name || '--'}`
}, },
{ {
title: "联系电话", title: "联系电话",
dataIndex: "phone", dataIndex: "phone",
align: 'center', align: 'center',
customRender: (text, record, index) => `${record.phone || '--'}` customRender: (text, record, index) => `${record.phone || '--'}`
}, },
{ {
title: "提交日期", title: "提交日期",
dataIndex: "create_time", dataIndex: "create_time",
align: 'center', align: 'center',
customRender: (text, record, index) => `${record.create_time || '--'}` customRender: (text, record, index) => `${record.create_time || '--'}`
}, },
{ {
title: "是否回复", title: "是否回复",
dataIndex: "status", dataIndex: "status",
align: 'center', align: 'center',
scopedSlots: { scopedSlots: {
customRender: "status", customRender: "status",
}, },
}, },
{ {
title: "回复人", title: "回复人",
dataIndex: "reply_people", dataIndex: "reply_people",
align: 'center', align: 'center',
customRender: (text, record, index) => `${record.reply_people || '--'}` customRender: (text, record, index) => `${record.reply_people || '--'}`
}, },
{ {
title: "回复时间", title: "回复时间",
dataIndex: "update_time", dataIndex: "update_time",
align: 'center', align: 'center',
customRender: (text, record, index) => `${record.update_time || '--'}` customRender: (text, record, index) => `${record.update_time || '--'}`
}, },
{ {
title: "所属部门", title: "所属部门",
dataIndex: "reply_dept", dataIndex: "reply_dept",
align: 'center', align: 'center',
customRender: (text, record, index) => `${record.reply_dept || '--'}` customRender: (text, record, index) => `${record.reply_dept || '--'}`
}, },
{ {
title: "操作", title: "操作",
scopedSlots: { scopedSlots: {
customRender: "操作", customRender: "操作",
},
},
], //表头数据
pagination: {
total: 0,
pageSize: 10, //每页中显示10条数据
showSizeChanger: true,
pageSizeOptions: ["10", "20", "50", "100"], //每页中显示的数据
showTotal: total => `共有 ${total} 条数据`, //分页中显示总的数据
}, },
tabledataSource: [], //表格数据 },
columnsSearch: [ ], //表头数据
pagination: {
total: 0,
pageSize: 10, //每页中显示10条数据
showSizeChanger: true,
pageSizeOptions: ["10", "20", "50", "100"], //每页中显示的数据
showTotal: total => `共有 ${total} 条数据`, //分页中显示总的数据
},
tabledataSource: [], //表格数据
columnsSearch: [
], //表格查询条件 ], //表格查询条件
detailData: null, detailData: null,
deplist: [], deplist: [],
numObj: null numObj: null
} }
},
async created() {
this.getlist()
},
methods: {
async getlist() {
getImpossible(this.queryform).then(res => {
this.tabledataSource = res.data.data
this.pagination.total = res.data.total
})
// 统计接口
let {data} = await getCountImpossible(this.queryform)
this.numObj = data || {}
}, },
async created() { changeTablePage(e) {
this.queryform.page = e.current
this.queryform.size = e.pageSize
this.getlist() this.getlist()
let {
data
} = await getCountImpossible()
this.numObj = data
}, },
methods: { onChange(e) {
getlist() { this.queryform.reply = e.target.checked ? 0 : ''
getImpossible(this.queryform).then(res => { },
this.tabledataSource = res.data.data detail(row) {
this.pagination.total = res.data.total getImpossibleInfo({
}) id: row.id
}, }).then(res => {
changeTablePage(e) { this.detailData = res.data
this.queryform.page = e.current this.visible = true
this.queryform.size = e.pageSize })
this.getlist() },
}, // 选中
onChange(e) { onSelectChange(keys, rows) {
this.queryform.reply = e.target.checked ? 0 : '' this.tableSelectedKeys = keys;
}, const res = new Map();
detail(row) { this.tableSelectedRows = [...this.tableSelectedRows, ...rows]
getImpossibleInfo({ .filter((v) => {
id: row.id return !res.has(v.id) && res.set(v.id, 1);
}).then(res => {
this.detailData = res.data
this.visible = true
}) })
}, .filter((v) => {
// 选中 return this.tableSelectedKeys.some((val) => v.id == val);
onSelectChange(keys, rows) { });
this.tableSelectedKeys = keys; },
const res = new Map(); // 导出
this.tableSelectedRows = [...this.tableSelectedRows, ...rows] async handleExportTable() {
.filter((v) => { this.btnLoading = true;
return !res.has(v.id) && res.set(v.id, 1); let obj = {
}) 1: "本地打印",
.filter((v) => { 2: "在线提交",
return this.tableSelectedKeys.some((val) => v.id == val); };
let data = [];
if (this.tableSelectedKeys.length && this.tableSelectedRows.length) {
// 深度克隆避免影响页面表格展示
data = this.$_.cloneDeep(this.tableSelectedRows);
data.forEach((item) => {
Object.keys(obj).forEach((keys) => {
if (item.type == keys) {
item.type = obj[keys];
}
}); });
}, item.status == 1 ? item.status = '' : item.status = ''
// 导出 });
async handleExportTable() { } else {
this.btnLoading = true; let datas = this.$_.cloneDeep(
let obj = { await getImpossible({
1: "本地打印", ...this.queryform,
2: "在线提交", page: 1,
}; size: -1
let data = []; })
if (this.tableSelectedKeys.length && this.tableSelectedRows.length) { );
// 深度克隆避免影响页面表格展示 this.btnLoading = false
data = this.$_.cloneDeep(this.tableSelectedRows); data = datas.data.data
data.forEach((item) => { if (!data.length) return;
Object.keys(obj).forEach((keys) => { for (let item of data) {
if (item.type == keys) { Object.keys(obj).forEach((key) => {
item.type = obj[keys]; if (item.type == key) {
} item.type = obj[key];
}); }
item.status == 1?item.status= '':item.status= ''
}); });
} else { item.status == 1 ? item.status = '' : item.status = ''
let datas = this.$_.cloneDeep(
await getImpossible({
...this.queryform,
page: 1,
size: -1
})
);
this.btnLoading = false
data = datas.data.data
if (!data.length) return;
for (let item of data) {
Object.keys(obj).forEach((key) => {
if (item.type == key) {
item.type = obj[key];
}
});
item.status == 1?item.status= '':item.status= ''
}
} }
}
const tHeader = []
const filterVal = [] const tHeader = []
this.tablecolumns.forEach(v=>{ const filterVal = []
if(v.dataIndex){ this.tablecolumns.forEach(v => {
tHeader.push(v.title) if (v.dataIndex) {
filterVal.push(v.dataIndex) tHeader.push(v.title)
} filterVal.push(v.dataIndex)
}) }
export2Excel( })
tHeader, export2Excel(
filterVal, tHeader,
data, filterVal,
"办不成事报表" + this.$moment().format("YYYYMMDDHHmmss") data,
); "办不成事报表" + this.$moment().format("YYYYMMDDHHmmss")
this.btnLoading = false; );
}, this.btnLoading = false;
} },
} }
}
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.form-box { .form-box {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 10px; margin-bottom: 10px;
.num-dv{
display: flex;
align-items: center;
.ml20{
margin-left: 20px;
}
}
}
.img-dv { .num-dv {
display: flex; display: flex;
flex-wrap: wrap; align-items: center;
img { .ml20 {
width: 40px; margin-left: 20px;
height: 40px;
margin-right: 10px;
margin-bottom: 10px;
} }
} }
}
/deep/.ant-spin-container{
display: block !important;
}
/deep/.ant-drawer-body {
background: #f7f7f7;
padding: 15px;
box-sizing: border-box;
min-height: calc(100vh - 55px);
}
/deep/td {
text-align: left;
}
/deep/.ant-descriptions-item-label{
color: #1890ff;
}
.btn-dv { .img-dv {
background-color: #fff; display: flex;
padding: 15px; flex-wrap: wrap;
margin-top: 20px;
display: flex;
justify-content: flex-end;
}
.content-box { img {
display: flex; width: 40px;
justify-content: space-between; height: 40px;
width: 100%; margin-right: 10px;
margin-bottom: 10px;
} }
}
.content-dv { /deep/.ant-spin-container {
width: calc(50% - 10px); display: block !important;
background: #fff; }
border-radius: 10px;
padding: 10px; /deep/.ant-drawer-body {
} background: #f7f7f7;
</style> padding: 15px;
\ No newline at end of file box-sizing: border-box;
min-height: calc(100vh - 55px);
}
/deep/td {
text-align: left;
}
/deep/.ant-descriptions-item-label {
color: #1890ff;
}
.btn-dv {
background-color: #fff;
padding: 15px;
margin-top: 20px;
display: flex;
justify-content: flex-end;
}
.content-box {
display: flex;
justify-content: space-between;
width: 100%;
}
.content-dv {
width: calc(50% - 10px);
background: #fff;
border-radius: 10px;
padding: 10px;
}</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment