Browse Source

发布范围

old
jiangyy 4 years ago
parent
commit
0e046a1b48
  1. 1
      src/router/index.js
  2. 6
      src/views/form/editor/RightPanel.vue
  3. 69
      src/views/form/index.vue
  4. 178
      src/views/form/publish/index.vue
  5. 38
      src/views/form/statistics/analysis.vue
  6. 66
      src/views/form/statistics/chart.vue
  7. 172
      src/views/form/statistics/list.vue
  8. 64
      src/views/form/statistics/public.vue

1
src/router/index.js

@ -52,6 +52,7 @@ router.beforeEach((to, from, next) => {
console.log('ro.query', to.query)
localStorage.setItem('loginSource', 'epmet')
localStorage.setItem('customerId', to.query.customerId)
store.dispatch('user/getUserInfo', to.query.token)
store.dispatch('user/setTokens', to.query.token)
next()

6
src/views/form/editor/RightPanel.vue

@ -971,6 +971,7 @@ export default {
loading: null,
currentTab: "field",
currentNode: null,
currentPID: Number,
dialogVisible: false,
iconsVisible: false,
currentIconModel: null,
@ -1215,6 +1216,7 @@ export default {
},
addTreeItem () {
++this.idGlobal;
this.currentPID = 0
this.dialogVisible = true;
this.currentNode = this.activeData.options;
},
@ -1238,10 +1240,12 @@ export default {
);
},
append (data) {
if (!data.children) {
this.$set(data, "children", []);
}
this.dialogVisible = true;
this.currentPID = data.id
this.currentNode = data.children;
},
remove (node, data) {
@ -1252,6 +1256,8 @@ export default {
children.splice(index, 1);
},
addNode (data) {
debugger
data.pid = this.currentPID
this.currentNode.push(data);
},
setOptionValue (item, val) {

69
src/views/form/index.vue

@ -17,25 +17,23 @@
<div class="left-menu-container">
<el-menu :collapse="isCollapse"
:default-active="defaultActiveMenu"
class="el-menu-vertical"
>
<el-menu-item v-for="menuItem in menuItemList"
class="el-menu-vertical">
<el-menu-item v-for="menuItem in (publishStatus? menuItemList2:menuItemList)"
:key="menuItem.key"
:index="menuItem.route"
@click="menuSelectHandle(menuItem.route,menuItem.key)"
>
@click="menuSelectHandle(menuItem.route,menuItem.key)">
<i :class="menuItem.icon" />
<span slot="title">{{ menuItem.title }}</span>
</el-menu-item>
</el-menu>
<i v-if="!isCollapse"
class="el-icon-d-arrow-left"
@click="collapseHandle"
/>
@click="collapseHandle" />
<i v-else
class="el-icon-d-arrow-right"
@click="collapseHandle"
/>
@click="collapseHandle" />
</div>
<div class="right-content-container">
<router-view />
@ -43,11 +41,9 @@
</div>
<el-dialog :visible.sync="previewDialogVisible"
destroy-on-close
fullscreen
>
fullscreen>
<pre-view :key="previewKey"
:preview-qrcode="true"
/>
:preview-qrcode="true" />
</el-dialog>
</div>
</template>
@ -59,9 +55,9 @@ import { formConf } from '@/components/generator/config'
export default {
name: 'NewIndex',
components: { PreView },
data() {
data () {
return {
publishStatus: false,
previewKey: +new Date(),
previewDialogVisible: false,
defaultActiveMenu: '',
@ -117,18 +113,51 @@ export default {
title: '返回',
icon: 'el-icon-edit'
}
],
menuItemList2: [
{
key: 'static',
title: '统计',
icon: 'el-icon-data-line',
route: '/project/form/statistics'
},
{
key: 'preview',
title: '预览',
icon: 'el-icon-view'
},
{
key: 'back',
title: '返回',
icon: 'el-icon-edit'
}
]
}
},
async created() {
async created () {
this.projectKey = this.$route.query.key
this.defaultActiveMenu = this.$route.path
this.isCollapse = this.$store.state.form.isCollapse
this.getProjectStatus()
},
methods: {
menuSelectHandle(route, key) {
getProjectStatus () {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/${this.projectKey}`).then(res => {
if (res.data.status == 1) {
this.publishStatus = false
} else {
this.publishStatus = true
}
})
},
menuSelectHandle (route, key) {
if (key === 'preview') {
this.previewDialogVisible = true
@ -139,16 +168,16 @@ export default {
} else { this.$router.replace({ path: route, query: { key: this.projectKey } }) }
},
openPreviewHandle() {
openPreviewHandle () {
this.previewKey = +new Date()
this.previewDialogVisible = true
},
saveProjectAsTemplateHandle() {
saveProjectAsTemplateHandle () {
this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/template/save`, { key: this.projectKey }).then(() => {
this.msgSuccess('保存成功')
})
},
collapseHandle() {
collapseHandle () {
let isCollapse = !this.isCollapse
this.$store.dispatch('form/setIsCollapse', isCollapse).then(() => {
this.isCollapse = isCollapse

178
src/views/form/publish/index.vue

@ -4,34 +4,40 @@
<div v-if="!publishStatus"
class="publish-btn-view">
<div>
<el-form label-width="90px">
<el-form label-width="150px">
<el-form-item label="小程序端">
<el-radio-group v-model="clientType">
<el-radio-button label="resi">居民端</el-radio-button>
<el-radio-button label="work">工作端</el-radio-button>
<el-radio-group class="form_item"
@change="clientChange"
v-model="clientType">
<el-radio label="resi">居民端</el-radio>
<el-radio label="gov">工作端</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="发布范围">
<el-tree ref="tree"
<el-tree class="form_item"
ref="tree"
style="background-color:#f7f7f7"
:props="props"
:data="data"
show-checkbox
:default-expand-all="true"
@node-click="nodeClick"
@check="check"
@check-change="handleCheckChange" />
:default-expand-all="true" />
</el-form-item>
</el-form>
</div>
<div style="text-align:center">
<div style="text-align:left;margin-left:200px;margin-top:50px">
<el-button class="publish-btn"
size="medium"
type="primary"
@click="publishProject">
<i class="el-icon-document-checked el-icon--right">开始发布</i>
</el-button>
<!-- <el-button class="publish-btn"
size="medium"
type="primary"
@click="resolveAgency">
<i class="el-icon-document-checked el-icon--right">获取组织</i>
</el-button> -->
</div>
</div>
<div v-if="publishStatus"
@ -64,19 +70,19 @@
<div>
<p class="success-title">恭喜您发布成功</p>
</div>
<!-- <div>
<div>
<p class="link-text"> {{ writeLink }}</p>
</div> -->
</div>
<el-row>
<!-- <el-col :offset="2"
<el-col :offset="2"
:span="6">
<el-button v-clipboard:copy="writeLink"
<!-- <el-button v-clipboard:copy="writeLink"
v-clipboard:error="()=>{this.msgError('复制失败')}"
v-clipboard:success="()=>{this.msgSuccess('复制成功')}" type="primary"
>
v-clipboard:success="()=>{this.msgSuccess('复制成功')}"
type="primary">
复制链接
</el-button>
</el-col> -->
</el-button> -->
</el-col>
<el-col :span="12">
<el-button type="danger"
@click="stopPublishProject">
@ -115,71 +121,112 @@ export default {
clientType: 'resi',
props: {
// label: 'name',
// children: 'zones'
label: 'orgName',
children: 'subOrgList'
},
count: 1,
data: [{
id: 1,
label: '一级 1',
children: [{
id: 4,
label: '二级 1-1',
children: [{
id: 9,
label: '三级 1-1-1'
orgId: 1,
orgName: '一级 1',
subOrgList: [{
orgId: 4,
orgName: '二级 1-1',
subOrgList: [{
orgId: 9,
orgName: '三级 1-1-1'
}, {
id: 10,
label: '三级 1-1-2'
orgId: 10,
orgName: '三级 1-1-2'
}]
}]
}, {
id: 2,
label: '一级 2',
children: [{
id: 5,
label: '二级 2-1'
orgId: 2,
orgName: '一级 2',
subOrgList: [{
orgId: 5,
orgName: '二级 2-1'
}, {
id: 6,
label: '二级 2-2'
orgId: 6,
orgName: '二级 2-2'
}]
}, {
id: 3,
label: '一级 3',
children: [{
id: 7,
label: '二级 3-1'
orgId: 3,
orgName: '一级 3',
subOrgList: [{
orgId: 7,
orgName: '二级 3-1'
}, {
id: 8,
label: '二级 3-2'
}]
orgId: 8,
orgName: '二级 3-2'
}]
}],
selAgencyList: [],
agencyArrayCopy: []
}
},
mounted () {
this.projectKey = this.$route.query.key
let url = window.location.protocol + '//' + window.location.host
this.writeLink = `${url}/s/${this.projectKey}`
this.getProjectStatus()
},
methods: {
currentChange (data, node) {
console.log(data, node)
},
check () {
clientChange (label) {
this.clientType = label
this.loadAgencyList()
},
handleCheckChange (data, checked, indeterminate) {
data.select = true
console.log(data, checked, indeterminate)
// console.log('');
// console.log(this.data)
loadAgencyList () {
const customerId = localStorage.getItem('customerId')
let params = {
client: this.clientType,
agencyId: customerId
}
this.$api.post(`/data/aggregator/org/agencytree`, params).then((res) => {
debugger
})
},
nodeClick (a, b, c) {
console.log(a, b, c)
//
resolveAgency () {
let selAll = this.$refs.tree.getCheckedNodes(false, false)
// console.log(selAll)
this.selAgencyList = []
this.agencyArrayCopy = JSON.parse(JSON.stringify(this.data))
selAll.forEach(element => {
// debugger
let orgId = element.orgId
this.resursionTree(this.agencyArrayCopy, orgId)
});
console.log(this.selAgencyList)
},
handleNodeClick (data) {
// console.log(data);
//
resursionTree (orgArray, orgId) {
for (let i = 0; i < orgArray.length; i++) {
let item = orgArray[i]
// debugger
if (item && item.orgId === orgId) {
// debugger
this.selAgencyList.push(orgArray[i])
orgArray[i] = {}
break
} else if (item.subOrgList && item.subOrgList.length > 0) {
// debugger
this.resursionTree(item.subOrgList, orgId)
}
}
// console.log(this.agencyArrayCopy)
},
getProjectStatus () {
@ -188,16 +235,16 @@ export default {
this.publishStatus = true
} else {
this.publishStatus = false
this.loadAgencyList()
}
})
},
publishProject () {
const aaa = this.$refs.tree.getCheckedNodes(false, false)
console.log(aaa)
// this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/publish`, { key: this.projectKey }).then(() => {
// this.publishStatus = true
// this.msgSuccess('')
// })
this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/publish`, { key: this.projectKey }).then(() => {
this.publishStatus = true
this.msgSuccess('发布成功')
})
},
stopPublishProject () {
this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/stop`, { 'key': this.projectKey }).then(res => {
@ -284,4 +331,7 @@ export default {
font-size: 14px;
}
}
.form_item {
padding-left: 20px;
}
</style>

38
src/views/form/statistics/analysis.vue

@ -1,33 +1,33 @@
<template>
<div class="analysis">
<div v-if="list.length && list.length !== 0">
<div v-for="(item, index) in list" :key="index">
<div v-for="(item, index) in list"
:key="index">
<div class="content">
<div class="title">
<span style="font-size: 16px">Q{{ item.label }}{{ item.type }}</span>
<div>
<span>图表类型</span>
<el-select v-model="item.chartType" placeholder="请选择">
<el-option
v-for="subItem in options"
<el-select v-model="item.chartType"
placeholder="请选择">
<el-option v-for="subItem in options"
:key="subItem.value"
:label="subItem.label"
:value="subItem.value"
/>
:value="subItem.value" />
</el-select>
</div>
</div>
<line-chart
class="chart"
<line-chart class="chart"
:chart-option="getCharData(item)"
:width="'90vw'"
/>
:width="'90vw'" />
</div>
<el-divider />
</div>
</div>
<data-empty v-else style="padding: 20px" desc="只有单选、多选、下拉框组件可以生成图表" />
<data-empty v-else
style="padding: 20px"
desc="只有单选、多选、下拉框组件可以生成图表" />
</div>
</template>
@ -37,7 +37,7 @@ export default {
components: {
LineChart
},
data() {
data () {
return {
barChartOptionData: {
tooltip: {
@ -91,7 +91,7 @@ export default {
/* {
value: "ring",
label: "环形图",
}, */
}, */
{
value: 'bar',
label: '柱状图'
@ -103,20 +103,20 @@ export default {
]
}
},
mounted() {
mounted () {
this.getData()
},
methods: {
getData() {
getData () {
this.$api
.get('/user/project/report/analysis', {
.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/report/analysis`, {
params: { projectKey: this.$route.query.key }
})
.then(res => {
this.list = res.data
})
},
getCharData(data) {
getCharData (data) {
const config = {
tooltip: {
backgroundColor: 'rgba(255,255,255,0.8)', // rgba
@ -174,10 +174,10 @@ export default {
fontWeight: 'bold'
}
}
}else{
}else{
delete config.series[0].radius
delete config.series[0].label
} */
} */
config.series[0].data = []
Object.keys(data.map).forEach(key => {
config.series[0].data.push({ name: key, value: data.map[key] })

66
src/views/form/statistics/chart.vue

@ -7,16 +7,17 @@
<div>
<p class="text-center">有效回收量</p>
<count-to :end-val="projectStats.completeCount"
style="font-size: 20px;"
/>
style="font-size: 20px;" />
</div>
<div>
<p>总浏览量</p>
<count-to :end-val="projectStats.viewCount" style="font-size: 20px;" />
<count-to :end-val="projectStats.viewCount"
style="font-size: 20px;" />
</div>
<div>
<p>回收率</p>
<count-to :end-val="projectStats.completeRate" style="font-size: 20px;" />
<count-to :end-val="projectStats.completeRate"
style="font-size: 20px;" />
%
</div>
<div>
@ -28,24 +29,31 @@
</div>
</div>
<div class="line-chat">
<line-chart :width="'95vw'" :chart-option="lineChartOptionData" />
<line-chart :width="'95vw'"
:chart-option="lineChartOptionData" />
</div>
<p class="tag-title">表单提交地域分布图</p>
<div style="width: 90%">
<map-chart :width="'100vw'" :chart-option="mapChartOptionData" :height="'450px'" />
<map-chart :width="'100vw'"
:chart-option="mapChartOptionData"
:height="'450px'" />
</div>
<el-divider />
<div style="display: flex; flex-direction: row; justify-content: space-around;">
<div style="width: 50%;">
<p class="tag-title">常用设备</p>
<div>
<pie-chart :width="'48vw'" :chart-option="pieChartOptionData" :height="'250px'" />
<pie-chart :width="'48vw'"
:chart-option="pieChartOptionData"
:height="'250px'" />
</div>
</div>
<div style="width: 50%;">
<p class="tag-title">来源渠道</p>
<div>
<bar-chart :width="'48vw'" :chart-option="barChartOptionData" :height="'250px'" />
<bar-chart :width="'48vw'"
:chart-option="barChartOptionData"
:height="'250px'" />
</div>
</div>
</div>
@ -57,7 +65,7 @@ import LineChart from '@/components/echarts/LineChart'
import MapChart from '@/components/echarts/MapChart'
import CountTo from '@/components/CountTo'
import BarChart from '@/components/echarts/BarChart'
import {timeFormat} from '@/utils'
import { timeFormat } from '@/utils'
export default {
name: 'StatisticsChart',
@ -68,7 +76,7 @@ export default {
BarChart,
LineChart
},
data() {
data () {
return {
projectListData: null,
projectStats: {
@ -132,10 +140,10 @@ export default {
type: 'piecewise',
show: false,
pieces: [
{min: 1500},
{min: 900, max: 1500},
{min: 310, max: 1000},
{min: 1, max: 300}
{ min: 1500 },
{ min: 900, max: 1500 },
{ min: 310, max: 1000 },
{ min: 1, max: 300 }
],
color: ['#E0022B', '#E09107', '#A3E00B']
},
@ -239,20 +247,20 @@ export default {
}
}
},
created() {
created () {
this.activeProjectKey = this.$route.query.key
this.projectChangeHandle()
}, methods: {
projectChangeHandle() {
projectChangeHandle () {
this.getProjectStats()
this.getProjectSituation()
this.getProjectSubmitPosition()
this.getProjectSubmitDevice()
this.getProjectSubmitSource()
},
getProjectStats() {
this.$api.get('/user/project/report/stats', {params: {projectKey: this.activeProjectKey}}).then(res => {
getProjectStats () {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/report/stats`, { params: { projectKey: this.activeProjectKey } }).then(res => {
this.projectStats = res.data
if (this.projectStats.completeCount) {
let rate = this.projectStats.completeCount / this.projectStats.viewCount
@ -264,8 +272,8 @@ export default {
}
})
},
getProjectSituation() {
this.$api.get('/user/project/report/situation', {params: {projectKey: this.activeProjectKey}}).then(res => {
getProjectSituation () {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/report/situation`, { params: { projectKey: this.activeProjectKey } }).then(res => {
this.lineChartOptionData.xAxis.data = res.data.map(item => {
return item.createdTime
})
@ -281,8 +289,8 @@ export default {
})
},
//
getProjectSubmitPosition() {
this.$api.get('/user/project/report/position', {params: {projectKey: this.activeProjectKey}}).then(res => {
getProjectSubmitPosition () {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/report/position`, { params: { projectKey: this.activeProjectKey } }).then(res => {
this.mapChartOptionData.series = [
{
name: '提交数',
@ -295,14 +303,14 @@ export default {
color: 'rgb(0,0,0)'
},
data: Object.keys(res.data).map(key => {
return {name: key.replace(/省(s?)|市(s?)|\//ig, ''), value: res.data[key]}
return { name: key.replace(/省(s?)|市(s?)|\//ig, ''), value: res.data[key] }
})
}
]
})
},
getProjectSubmitSource() {
this.$api.get('/user/project/report/source', {params: {projectKey: this.activeProjectKey}}).then(res => {
getProjectSubmitSource () {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/report/source`, { params: { projectKey: this.activeProjectKey } }).then(res => {
if (res.data && res.data.length) {
this.barChartOptionData.yAxis.data = res.data.map(item => {
return item.browserName ? item.browserName : '其他'
@ -320,11 +328,11 @@ export default {
}
})
},
getProjectSubmitDevice() {
this.$api.get('/user/project/report/device', {params: {projectKey: this.activeProjectKey}}).then(res => {
getProjectSubmitDevice () {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/report/device'`, { params: { projectKey: this.activeProjectKey } }).then(res => {
if (res.data && res.data.length) {
this.pieChartOptionData.series[0].data = res.data.map(item => {
return {value: item.count, name: item.osName ? item.osName : '其他'}
return { value: item.count, name: item.osName ? item.osName : '其他' }
})
}
})
@ -337,7 +345,7 @@ export default {
.dashboard-container {
margin: 0;
padding: 0;
overflow-x: hidden!important;
overflow-x: hidden !important;
}
.tag-title {
font-size: 16px;

172
src/views/form/statistics/list.vue

@ -1,98 +1,93 @@
<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
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>
<el-table-column
:render-header="renderHeader"
<el-table-column :render-header="renderHeader"
fixed="right"
width="50"
>
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="item.formItemId" :project-item-data="item"
:result-data="activeResultRow"
/>
<result-item :field-item-id="item.formItemId"
:project-item-data="item"
:result-data="activeResultRow" />
<el-divider />
</div>
</div>
@ -100,19 +95,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>
@ -121,7 +116,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>
@ -129,7 +126,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>
@ -137,18 +136,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>
@ -156,14 +161,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',
@ -171,7 +176,7 @@ export default {
ResultItem,
DataFilter
},
data() {
data () {
return {
projectKey: null,
customFilterDialogVisible: false,
@ -207,45 +212,45 @@ export default {
}
}
},
mounted() {
mounted () {
this.projectKey = this.$route.query.key
this.queryConditions.projectKey = this.projectKey
this.queryProjectResult()
this.queryProjectItems()
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() {
this.$api.get(`/user/project/${this.projectKey}`).then(res => {
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('/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
@ -256,12 +261,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
@ -275,12 +280,12 @@ export default {
this.checkedFixedTailCustomColumns = fixedCustomTailColumns
}
},
downloadProjectResultFile() {
downloadProjectResultFile () {
if (!this.total) {
this.$message.error('无附件,无法导出')
return
}
this.$api.get('/user/project/result/download/file', {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/result/download/file`, {
params: this.queryConditions
}).then(res => {
this.$process({
@ -289,12 +294,12 @@ export default {
})
})
},
exportProjectResult() {
exportProjectResult () {
if (!this.total) {
this.$message.error('无表单有效反馈结果,无法导出')
return
}
this.$api.get('user/project/result/export', {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}user/project/result/export`, {
params: this.queryConditions,
responseType: 'blob'
}).then(res => {
@ -309,8 +314,8 @@ export default {
window.URL.revokeObjectURL(href) // blob
})
},
queryProjectItems() {
this.$api.get('/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)
@ -380,5 +385,4 @@ export default {
::v-deep .el-drawer__container ::-webkit-scrollbar {
display: none;
}
</style>

64
src/views/form/statistics/public.vue

@ -2,36 +2,32 @@
<el-container>
<el-header class="el-page-header">
<h5 v-if="projectData">{{ projectData.name }}</h5>
<el-button type="primary" @click="openFormHandle">访问表单</el-button>
<el-button type="primary"
@click="openFormHandle">访问表单</el-button>
</el-header>
<el-main>
<el-table
:data="projectResultList"
class="public-result-table"
>
<el-table :data="projectResultList"
class="public-result-table">
<el-table-column type="expand">
<template slot-scope="props">
<el-form class="public-table-expand" label-position="left">
<el-form-item v-for="item in projectItemList" :key="item.id" :label="item.label">
<result-item :field-item-id="item.formItemId" :project-item-data="item"
:result-data="props.row"
/>
<el-form class="public-table-expand"
label-position="left">
<el-form-item v-for="item in projectItemList"
:key="item.id"
:label="item.label">
<result-item :field-item-id="item.formItemId"
:project-item-data="item"
:result-data="props.row" />
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column
label="提交序号"
prop="serialNumber"
/>
<el-table-column
label="提交地址"
prop="submitAddress"
/>
<el-table-column
label="提交时间"
prop="createdTime"
/>
<el-table-column label="提交序号"
prop="serialNumber" />
<el-table-column label="提交地址"
prop="submitAddress" />
<el-table-column label="提交时间"
prop="createdTime" />
</el-table>
</el-main>
</el-container>
@ -55,7 +51,7 @@ export default {
}
]
},
data() {
data () {
return {
projectResultList: [],
projectItemList: [],
@ -105,7 +101,7 @@ export default {
}]
}
},
created() {
created () {
this.projectKey = this.$route.query.projectKey
this.queryConditions.projectKey = this.projectKey
this.queryProjectResult()
@ -113,24 +109,24 @@ export default {
this.queryProject()
},
methods: {
openFormHandle() {
this.$router.replace({path: `/s/${this.projectKey}`})
openFormHandle () {
this.$router.replace({ path: `/s/${this.projectKey}` })
},
queryProject() {
this.$api.get(`/user/project/${this.projectKey}`).then(res => {
queryProject () {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/${this.projectKey}`).then(res => {
this.projectData = res.data
})
},
queryProjectResult() {
this.$api.get('/user/project/result/public/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/public/page`, { params: this.queryConditions }).then(res => {
let { records, total, size } = res.data
this.projectResultList = records
this.total = total
this.queryConditions.size = size
})
},
queryProjectItems() {
this.$api.get('/user/project/item/list', {params: {key: this.projectKey, displayType: true}}).then(res => {
queryProjectItems () {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/list`, { params: { key: this.projectKey, displayType: true } }).then(res => {
if (res.data) {
res.data.map(item => {
_.set(this.projectItemColumns, `field${item.formItemId}`, item.label)
@ -143,7 +139,6 @@ export default {
}
</script>
<style lang="scss" scoped>
.el-header {
display: flex;
flex-direction: row;
@ -181,5 +176,4 @@ export default {
width: 50%;
}
}
</style>

Loading…
Cancel
Save