|
|
|
@ -1,103 +1,100 @@ |
|
|
|
<template> |
|
|
|
<div class="statistics-container"> |
|
|
|
<div class="filter-table-view"> |
|
|
|
<el-form ref="filterForm" :inline="true"> |
|
|
|
<el-form-item label="提交时间" prop="endDateTime"> |
|
|
|
<el-date-picker |
|
|
|
v-model="queryConditions.beginDateTime" |
|
|
|
<el-form ref="filterForm" |
|
|
|
:inline="true"> |
|
|
|
<el-form-item label="提交时间" |
|
|
|
prop="endDateTime"> |
|
|
|
<el-date-picker v-model="queryConditions.beginDateTime" |
|
|
|
placeholder="开始时间" |
|
|
|
type="datetime" |
|
|
|
value-format="yyyy-MM-dd HH:mm:ss" |
|
|
|
/> |
|
|
|
value-format="yyyy-MM-dd HH:mm:ss" /> |
|
|
|
<span> 至 </span> |
|
|
|
<el-date-picker |
|
|
|
v-model="queryConditions.endDateTime" |
|
|
|
<el-date-picker v-model="queryConditions.endDateTime" |
|
|
|
:default-time="'23:59:59'" |
|
|
|
placeholder="结束时间" |
|
|
|
type="datetime" |
|
|
|
value-format="yyyy-MM-dd HH:mm:ss" |
|
|
|
/> |
|
|
|
value-format="yyyy-MM-dd HH:mm:ss" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item> |
|
|
|
<el-button type="primary" @click="queryProjectResult">查询</el-button> |
|
|
|
<el-button type="primary" @click="conditionFilterHandle">条件</el-button> |
|
|
|
<el-button type="success" @click="exportProjectResult">导出</el-button> |
|
|
|
<el-button type="success" @click="downloadProjectResultFile">下载附件</el-button> |
|
|
|
<el-button type="primary" |
|
|
|
@click="queryProjectResult">查询</el-button> |
|
|
|
<el-button type="primary" |
|
|
|
@click="conditionFilterHandle">条件</el-button> |
|
|
|
<el-button type="success" |
|
|
|
@click="exportProjectResult">导出</el-button> |
|
|
|
<el-button type="success" |
|
|
|
@click="downloadProjectResultFile">下载附件</el-button> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
</div> |
|
|
|
<div class="result-table-view"> |
|
|
|
<el-table |
|
|
|
:data="projectResultList" |
|
|
|
<el-table :data="projectResultList" |
|
|
|
header-cell-class-name="data-table-header" |
|
|
|
stripe |
|
|
|
@row-dblclick="(row, column, event)=>{ |
|
|
|
this.openDetailDrawerHandle(row) |
|
|
|
}" |
|
|
|
> |
|
|
|
<el-table-column |
|
|
|
type="selection" |
|
|
|
width="55" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
v-for="col in fixedCustomColumns" :key="`t${col}`" |
|
|
|
:label="fixedDefaultLabelFormColumn[col]" |
|
|
|
> |
|
|
|
}"> |
|
|
|
<el-table-column type="selection" |
|
|
|
width="55" /> |
|
|
|
<el-table-column v-for="col in fixedCustomColumns" |
|
|
|
:key="`t${col}`" |
|
|
|
:label="fixedDefaultLabelFormColumn[col]"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ scope.row[col] }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column label="填写人" prop="realName" /> |
|
|
|
<el-table-column label="组织/部门/网格" prop="orgName" /> |
|
|
|
<el-table-column label="来源" prop="clientType" /> |
|
|
|
<el-table-column label="填写人" |
|
|
|
prop="realName" /> |
|
|
|
<el-table-column label="组织/部门/网格" |
|
|
|
prop="orgName" /> |
|
|
|
<el-table-column label="来源" |
|
|
|
prop="clientType" /> |
|
|
|
<!-- <el-table-column label="填写时间" prop="createdTime" /> --> |
|
|
|
|
|
|
|
<el-table-column |
|
|
|
v-for="col in otherCustomColumns" |
|
|
|
:key="col" :label="projectItemColumns[col]" |
|
|
|
show-overflow-tooltip |
|
|
|
> |
|
|
|
<el-table-column v-for="col in otherCustomColumns" |
|
|
|
:key="col" |
|
|
|
:label="projectItemColumns[col]" |
|
|
|
show-overflow-tooltip> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ scope.row['processData'][col] }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column |
|
|
|
v-for="col in fixedFormTailColumns" :key="`t${col}`" |
|
|
|
:label="fixedDefaultLabelFormTailColumn[col]" |
|
|
|
> |
|
|
|
<el-table-column v-for="col in fixedFormTailColumns" |
|
|
|
:key="`t${col}`" |
|
|
|
:label="fixedDefaultLabelFormTailColumn[col]"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ scope.row[col] }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<!-- :render-header="renderHeader" --> |
|
|
|
<el-table-column |
|
|
|
|
|
|
|
fixed="right" |
|
|
|
width="50" |
|
|
|
> |
|
|
|
<el-table-column fixed="right" |
|
|
|
width="50"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button size="small" type="text" @click="openDetailDrawerHandle(scope.row)">查看</el-button> |
|
|
|
<el-button size="small" |
|
|
|
type="text" |
|
|
|
@click="openDetailDrawerHandle(scope.row)">查看</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<el-drawer |
|
|
|
v-if="activeResultRow" |
|
|
|
<el-drawer v-if="activeResultRow" |
|
|
|
:visible.sync="detailDrawer" |
|
|
|
:with-header="false" |
|
|
|
> |
|
|
|
:with-header="false"> |
|
|
|
<el-scrollbar style="height: 100%;"> |
|
|
|
<el-card class="detail-container"> |
|
|
|
<div slot="header" class="clearfix"> |
|
|
|
<div slot="header" |
|
|
|
class="clearfix"> |
|
|
|
<span>提交详情</span> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<div v-for="item in projectItemList" :key="item.id"> |
|
|
|
<div v-for="item in projectItemList" |
|
|
|
:key="item.id"> |
|
|
|
<h4>{{ item.label }}</h4> |
|
|
|
<result-item :field-item-id="Number(item.formItemId)" :project-item-data="item" |
|
|
|
:result-data="activeResultRow" |
|
|
|
/> |
|
|
|
<result-item :field-item-id="Number(item.formItemId)" |
|
|
|
:project-item-data="item" |
|
|
|
:result-data="activeResultRow" /> |
|
|
|
<el-divider /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -105,19 +102,19 @@ |
|
|
|
</el-scrollbar> |
|
|
|
</el-drawer> |
|
|
|
<div style="display: flex; justify-content: center; margin-top: 10px;"> |
|
|
|
<el-pagination |
|
|
|
v-if="total>10" |
|
|
|
<el-pagination v-if="total>10" |
|
|
|
:current-page.sync="queryConditions.current" |
|
|
|
:page-size.sync="queryConditions.size" |
|
|
|
:total="total" |
|
|
|
background |
|
|
|
layout="total, prev, pager, next" |
|
|
|
@current-change="queryProjectResult" |
|
|
|
/> |
|
|
|
@current-change="queryProjectResult" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="custom-col-container"> |
|
|
|
<el-dialog :visible.sync="customColumnDialogVisible" center title="自定义显示列"> |
|
|
|
<el-dialog :visible.sync="customColumnDialogVisible" |
|
|
|
center |
|
|
|
title="自定义显示列"> |
|
|
|
<el-row> |
|
|
|
<el-col :span="3"> |
|
|
|
<span>显示列：</span> |
|
|
|
@ -126,7 +123,9 @@ |
|
|
|
<el-divider /> |
|
|
|
<el-checkbox-group v-model="checkedFixedCustomColumns"> |
|
|
|
<el-row> |
|
|
|
<el-col v-for="(val, key) in fixedDefaultLabelFormColumn" :key="key" :span="4"> |
|
|
|
<el-col v-for="(val, key) in fixedDefaultLabelFormColumn" |
|
|
|
:key="key" |
|
|
|
:span="4"> |
|
|
|
<el-checkbox :label="key">{{ val }}</el-checkbox> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
@ -134,7 +133,9 @@ |
|
|
|
<el-divider /> |
|
|
|
<el-checkbox-group v-model="checkOtherCustomColumns"> |
|
|
|
<el-row> |
|
|
|
<el-col v-for="(val, key) in projectItemColumns" :key="key" :span="8"> |
|
|
|
<el-col v-for="(val, key) in projectItemColumns" |
|
|
|
:key="key" |
|
|
|
:span="8"> |
|
|
|
<el-checkbox :label="key">{{ val }}</el-checkbox> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
@ -142,18 +143,24 @@ |
|
|
|
<el-divider /> |
|
|
|
<el-checkbox-group v-model="checkedFixedTailCustomColumns"> |
|
|
|
<el-row> |
|
|
|
<el-col v-for="(val, key) in fixedDefaultLabelFormTailColumn" :key="key" :span="4"> |
|
|
|
<el-col v-for="(val, key) in fixedDefaultLabelFormTailColumn" |
|
|
|
:key="key" |
|
|
|
:span="4"> |
|
|
|
<el-checkbox :label="key">{{ val }}</el-checkbox> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
</el-checkbox-group> |
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
|
<span slot="footer" |
|
|
|
class="dialog-footer"> |
|
|
|
<el-button @click="customColumnDialogVisible = false">取 消</el-button> |
|
|
|
<el-button type="primary" @click="saveStatisticsCheckedColumns">确 定</el-button> |
|
|
|
<el-button type="primary" |
|
|
|
@click="saveStatisticsCheckedColumns">确 定</el-button> |
|
|
|
</span> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
<data-filter ref="dataFilter" :fields="projectItemList" @filter="dataFilterHandle" /> |
|
|
|
<data-filter ref="dataFilter" |
|
|
|
:fields="projectItemList" |
|
|
|
@filter="dataFilterHandle" /> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
@ -161,14 +168,14 @@ |
|
|
|
import _ from 'lodash' |
|
|
|
import ResultItem from './item' |
|
|
|
import DataFilter from './filter' |
|
|
|
import {getCheckedColumn, saveCheckedColumn} from '@/utils/db' |
|
|
|
import { getCheckedColumn, saveCheckedColumn } from '@/utils/db' |
|
|
|
|
|
|
|
// 头部固定标签 |
|
|
|
const fixedDefaultFormColumn = ['serialNumber'] |
|
|
|
const fixedDefaultLabelFormColumn = {serialNumber: '提交序号'} |
|
|
|
const fixedDefaultLabelFormColumn = { serialNumber: '提交序号' } |
|
|
|
// 尾部固定标签 |
|
|
|
const fixedDefaultFormTailColumn = ['submitAddress', 'createdTime'] |
|
|
|
const fixedDefaultLabelFormTailColumn = { submitAddress: '提交地址', createdTime: '提交时间'} |
|
|
|
const fixedDefaultLabelFormTailColumn = { submitAddress: '提交地址', createdTime: '提交时间' } |
|
|
|
|
|
|
|
export default { |
|
|
|
name: 'ProjectStatisticsList', |
|
|
|
@ -176,7 +183,7 @@ export default { |
|
|
|
ResultItem, |
|
|
|
DataFilter |
|
|
|
}, |
|
|
|
data() { |
|
|
|
data () { |
|
|
|
return { |
|
|
|
projectKey: null, |
|
|
|
customFilterDialogVisible: false, |
|
|
|
@ -212,7 +219,7 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
mounted () { |
|
|
|
this.projectKey = this.$route.query.key |
|
|
|
this.queryConditions.projectKey = this.projectKey |
|
|
|
this.queryProjectResult() |
|
|
|
@ -220,38 +227,38 @@ export default { |
|
|
|
this.queryProject() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
renderHeader() { |
|
|
|
renderHeader () { |
|
|
|
return ( |
|
|
|
<i class="el-icon-setting" style="color:currentColor" |
|
|
|
onClick={() => this.customColumnDialogVisible = true}></i> |
|
|
|
) |
|
|
|
}, |
|
|
|
openDetailDrawerHandle(row) { |
|
|
|
openDetailDrawerHandle (row) { |
|
|
|
this.activeResultRow = row |
|
|
|
this.detailDrawer = true |
|
|
|
}, |
|
|
|
queryProject() { |
|
|
|
queryProject () { |
|
|
|
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/${this.projectKey}`).then(res => { |
|
|
|
this.projectData = res.data |
|
|
|
}) |
|
|
|
}, |
|
|
|
conditionFilterHandle() { |
|
|
|
conditionFilterHandle () { |
|
|
|
this.$refs.dataFilter.showDialogHandle() |
|
|
|
}, |
|
|
|
dataFilterHandle(params, comparisons) { |
|
|
|
dataFilterHandle (params, comparisons) { |
|
|
|
this.queryConditions.extParams = params |
|
|
|
this.queryConditions.extComparisons = comparisons |
|
|
|
this.queryProjectResult() |
|
|
|
}, |
|
|
|
queryProjectResult() { |
|
|
|
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/result/page`, {params: this.queryConditions}).then(res => { |
|
|
|
let {records, total, size} = res.data |
|
|
|
queryProjectResult () { |
|
|
|
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/result/page`, { params: this.queryConditions }).then(res => { |
|
|
|
let { records, total, size } = res.data |
|
|
|
this.projectResultList = records |
|
|
|
this.total = total |
|
|
|
this.queryConditions.size = size |
|
|
|
}) |
|
|
|
}, |
|
|
|
saveStatisticsCheckedColumns() { |
|
|
|
saveStatisticsCheckedColumns () { |
|
|
|
this.customColumnDialogVisible = false |
|
|
|
this.fixedCustomColumns = this.checkedFixedCustomColumns |
|
|
|
this.otherCustomColumns = this.checkOtherCustomColumns |
|
|
|
@ -262,12 +269,12 @@ export default { |
|
|
|
fixedCustomTailColumns: this.fixedFormTailColumns |
|
|
|
}) |
|
|
|
}, |
|
|
|
getDbCheckedColumns() { |
|
|
|
getDbCheckedColumns () { |
|
|
|
let checkedColumn = getCheckedColumn(this.projectKey) |
|
|
|
if (!checkedColumn) { |
|
|
|
return |
|
|
|
} |
|
|
|
let {fixedCustomColumns, otherCustomColumns, fixedCustomTailColumns} = checkedColumn |
|
|
|
let { fixedCustomColumns, otherCustomColumns, fixedCustomTailColumns } = checkedColumn |
|
|
|
if (fixedCustomColumns) { |
|
|
|
this.fixedCustomColumns = fixedCustomColumns |
|
|
|
this.checkedFixedCustomColumns = fixedCustomColumns |
|
|
|
@ -281,7 +288,7 @@ export default { |
|
|
|
this.checkedFixedTailCustomColumns = fixedCustomTailColumns |
|
|
|
} |
|
|
|
}, |
|
|
|
downloadProjectResultFile() { |
|
|
|
downloadProjectResultFile () { |
|
|
|
if (!this.total) { |
|
|
|
this.$message.error('无附件，无法导出') |
|
|
|
return |
|
|
|
@ -289,13 +296,16 @@ export default { |
|
|
|
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/result/download/file`, { |
|
|
|
params: this.queryConditions |
|
|
|
}).then(res => { |
|
|
|
|
|
|
|
this.$process({ |
|
|
|
message: '附件导出中', |
|
|
|
key: res.data |
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
}) |
|
|
|
}, |
|
|
|
exportProjectResult() { |
|
|
|
exportProjectResult () { |
|
|
|
if (!this.total) { |
|
|
|
this.$message.error('无表单有效反馈结果，无法导出') |
|
|
|
return |
|
|
|
@ -315,8 +325,8 @@ export default { |
|
|
|
window.URL.revokeObjectURL(href) // 释放掉blob对象 |
|
|
|
}) |
|
|
|
}, |
|
|
|
queryProjectItems() { |
|
|
|
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/list`, {params: {key: this.projectKey, displayType: false}}).then(res => { |
|
|
|
queryProjectItems () { |
|
|
|
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/list`, { params: { key: this.projectKey, displayType: false } }).then(res => { |
|
|
|
if (res.data) { |
|
|
|
res.data.map(item => { |
|
|
|
_.set(this.projectItemColumns, `field${item.formItemId}`, item.label) |
|
|
|
@ -386,5 +396,4 @@ export default { |
|
|
|
::v-deep .el-drawer__container ::-webkit-scrollbar { |
|
|
|
display: none; |
|
|
|
} |
|
|
|
|
|
|
|
</style> |
|
|
|
|
jianjun
4 years ago