Browse Source

add public write result

old
wangqing 4 years ago
parent
commit
dea04f6c5d
  1. 2
      src/assets/styles/resources/element-variables.scss
  2. 24
      src/assets/styles/resources/variables.scss
  3. 9
      src/components/generator/config.js
  4. 12
      src/components/parser/Parser.vue
  5. 2
      src/components/render/slots/el-carousel.js
  6. 5
      src/router/modules/project.js
  7. 4
      src/utils/convert.js
  8. 17
      src/views/form/setting/index.vue
  9. 33
      src/views/form/statistics/index.vue
  10. 55
      src/views/form/statistics/item.vue
  11. 185
      src/views/form/statistics/public.vue
  12. 24
      src/views/form/write/index.vue

2
src/assets/styles/resources/element-variables.scss

@ -19,6 +19,8 @@ $--border-color-lighter: #e6ebf5;
$--table-border: 1px solid #dfe6ec;
$--box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
/* icon font path, required */
$--font-path: "~element-ui/lib/theme-chalk/fonts";
@import "../../../../node_modules/element-ui/packages/theme-chalk/src/index";

24
src/assets/styles/resources/variables.scss

@ -1,23 +1,23 @@
// base color
$blue:#324157;
$light-blue:#3a71a8;
$red:#c03639;
$blue: #324157;
$light-blue: #3a71a8;
$red: #c03639;
$pink: #e65d6e;
$green: #30b08f;
$tiffany: #4ab7bd;
$yellow:#fec171;
$yellow: #fec171;
$panGreen: #30b08f;
$backgroundColor: rgba(247, 247, 247, 90);
// sidebar
$menuText:#bfcbd9;
$menuActiveText:#409eff;
$subMenuActiveText:#f4f4f5; // https://github.com/ElemeFE/element/issues/12951
$menuText: #bfcbd9;
$menuActiveText: #409eff;
$subMenuActiveText: #f4f4f5; // https://github.com/ElemeFE/element/issues/12951
$menuBg:#304156;
$menuHover:#263445;
$menuBg: #304156;
$menuHover: #263445;
$subMenuBg:#1f2d3d;
$subMenuHover:#001528;
$subMenuBg: #1f2d3d;
$subMenuHover: #001528;
$sideBarWidth: 210px;

9
src/components/generator/config.js

@ -496,6 +496,7 @@ export const imageComponents = [
__config__: {
label: '图片展示',
showLabel: false,
displayType: true,
labelWidth: null,
showDefaultValue: false,
showRequired: false,
@ -505,7 +506,7 @@ export const imageComponents = [
tagIcon: 'image',
layout: 'colFormItem',
span: 24,
required: true,
required: false,
regList: [],
changeTag: true
},
@ -522,6 +523,7 @@ export const imageComponents = [
__config__: {
label: '图片轮播',
showLabel: false,
displayType: true,
labelWidth: null,
defaultValue: null,
showDefaultValue: false,
@ -579,6 +581,7 @@ export const assistComponents = [
__config__: {
label: '文字描述',
defaultValue: '描述文字',
displayType: true,
showDefaultValue: true,
showRequired: false,
showClearable: false,
@ -600,6 +603,7 @@ export const assistComponents = [
__config__: {
label: '分割线',
defaultValue: '分割线',
displayType: true,
showLabel: false,
showDefaultValue: false,
showRequired: false,
@ -644,6 +648,7 @@ export const assistComponents = [
__config__: {
label: '分页',
defaultValue: '分页',
displayType: true,
showLabel: false,
showDefaultValue: false,
showRequired: false,
@ -667,7 +672,7 @@ export const assistComponents = [
]
// 个人信息组件
export const personalInfoComponents = [
export const personalInfoComponents = [
{
typeId: 'INPUT',
__config__: {

12
src/components/parser/Parser.vue

@ -150,9 +150,9 @@ function setUpload(config, scheme, response, file, fileList) {
newValue = []
}
newValue.push({fileName: file.name, url: response.data})
this.$set(config, 'defaultValue', JSON.stringify(newValue))
this.$set(this[this.formConf.formModel], scheme.__vModel__, JSON.stringify(newValue))
setValueLabel.call(this, {type: 'file', files: JSON.stringify(newValue)}, config, scheme)
this.$set(config, 'defaultValue', newValue)
this.$set(this[this.formConf.formModel], scheme.__vModel__, newValue)
setValueLabel.call(this, {type: 'file', files: newValue}, config, scheme)
}
function deleteUpload(config, scheme, file, fileList) {
@ -160,9 +160,9 @@ function deleteUpload(config, scheme, file, fileList) {
fileList.forEach(element => {
newValue.push({fileName: element.name, url: element.url})
})
this.$set(config, 'defaultValue', JSON.stringify(newValue))
this.$set(this[this.formConf.formModel], scheme.__vModel__, JSON.stringify(newValue))
setValueLabel.call(this, {type: 'file', files: JSON.stringify(newValue)}, config, scheme)
this.$set(config, 'defaultValue', newValue)
this.$set(this[this.formConf.formModel], scheme.__vModel__, newValue)
setValueLabel.call(this, {type: 'file', files: newValue}, config, scheme)
}
function setValue(event, config, scheme) {

2
src/components/render/slots/el-carousel.js

@ -4,7 +4,7 @@ export default {
let style = 'height: 100%;'
conf.__slot__.options.forEach(item => {
list.push(<el-carousel-item style={'text-align: center;'}>
<span>{item.label}</span>
<p>{item.label}</p>
<el-image fit="contain" style={style} src={item.image}></el-image>
</el-carousel-item>)
})

5
src/router/modules/project.js

@ -32,6 +32,11 @@ export default [
meta: {requireLogin: false},
component: () => import(/* webpackChunkName: 'root' */ '@/views/form/preview/ProjectForm.vue')
},
{
path: '/project/public/result',
meta: {requireLogin: false},
component: () => import(/* webpackChunkName: 'root' */ '@/views/form/statistics/public')
},
{
path: '/s/:key',
meta: {requireLogin: false},

4
src/utils/convert.js

@ -20,6 +20,7 @@ export function formItemConvertData(item, projectKey) {
'regList': item.__config__.regList,
'showLabel': item.__config__.showLabel,
'span': item.__config__.span,
'displayType': item.displayType,
'projectKey': projectKey
}
let expand = {}
@ -64,6 +65,7 @@ export function dbDataConvertForItemJson(data) {
jsonItem.dId = data.id
jsonItem.sort = data.sort
jsonItem.typeId = data.type
jsonItem.displayType = data.displayType
jsonItem.__config__.span = data.span
jsonItem.__config__.formId = data.formItemId
jsonItem.__config__.label = data.label
@ -97,7 +99,9 @@ const dataParams = {
// 单行文本
'INPUT': {
'prepend': '__slot__.prepend',
'prefixIcon': 'prefix-icon',
'maxlength': 'maxlength',
'showWordLimit': 'show-word-limit',
'append': '__slot__.append'
},
// 多行文本

17
src/views/form/setting/index.vue

@ -5,7 +5,6 @@
<p class="project-setting-title">
提交设置
</p>
<p class="project-setting-label">提交后</p>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">显示提示图片</p>
@ -87,8 +86,21 @@
/>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">公开反馈结果</p>
</el-col>
<el-col :span="12">
<el-switch
v-model="userProjectSettingData.publicResult"
@change="()=>{
this.saveUserProjectSetting()
}"
/>
</el-col>
</el-row>
</el-col>
<el-col :span="6" class="project-setting-view" style="text-align: center;">
<el-col :span="6" class="project-setting-view text-center">
<p class="project-setting-title">
回收设置
</p>
@ -572,6 +584,7 @@ export default {
submitPromptText: '提交成功 !',
submitJumpUrl: '',
wxWrite: false,
publicResult: false,
timedNotEnabledPromptText: '填写尚未启用',
timedDeactivatePromptText: '填写尚已经停用',
timedQuantitativeQuantity: null,

33
src/views/form/statistics/index.vue

@ -65,6 +65,7 @@
</el-table-column>
</el-table>
<el-drawer
v-if="activeResultRow"
:visible.sync="detailDrawer"
:with-header="false"
>
@ -76,25 +77,10 @@
<div>
<div v-for="item in projectItemList" :key="item.id">
<h4>{{ item.label }}</h4>
<!-- 如果是文件输入-->
<div
v-if="item.type==17 &&activeResultRow&&activeResultRow['processData'][`field${item.formItemId}`]"
>
<el-link
v-for="file in JSON.parse(activeResultRow['processData'][`field${item.formItemId}`]['files'])"
:key="file"
:href="file.url" target="_blank"
type="primary"
>
<span> {{ file.fileName }}</span>
</el-link>
</div>
<el-tag v-else>
{{
activeResultRow ?
activeResultRow['processData'][`field${item.formItemId}`] : ''
}}
</el-tag>
<result-item :field-item-id="item.formItemId" :project-item-data="item"
:result-data="activeResultRow"
/>
<el-divider />
</div>
</div>
</el-card>
@ -146,7 +132,7 @@
<script>
import _ from 'lodash'
import ResultItem from './item'
import {getCheckedColumn, saveCheckedColumn} from '@/utils/db'
const fixedDefaultFormColumn = ['serialNumber', 'submitAddress', 'createTime']
@ -154,7 +140,9 @@ const fixedDefaultLabelFormColumn = {serialNumber: '提交序号', submitAddress
export default {
name: 'ProjectStatistics',
components: {},
components: {
ResultItem
},
data() {
return {
projectKey: null,
@ -297,7 +285,8 @@ export default {
margin: 6px auto;
}
.detail-container {
padding: 10px;
padding: 20px;
height: 100% !important;
}
.filter-table-view {
width: 80%;

55
src/views/form/statistics/item.vue

@ -0,0 +1,55 @@
<template>
<div>
<div v-if="projectItemData.type=='UPLOAD'">
<div v-if="getItemValue['files']">
<el-link
v-for="file in getItemValue['files']"
:key="file"
:href="file.url" target="_blank"
type="primary"
>
<span> {{ file.fileName }}</span>
</el-link>
</div>
<span v-else>/</span>
</div>
<div v-else>
{{ getItemValue ? getItemValue : '/' }}
</div>
</div>
</template>
<script>
export default {
name: 'ResultItem',
props: {
projectItemData: {
type: Object,
default: function() {
return {}
}
},
resultData: {
type: Object,
default: function() {
return {}
}
},
fieldItemId: {
type: Number,
default: 0
}
},
computed: {
processData() {
return this.resultData ? this.resultData['processData'] : {}
},
getItemValue() {
return this.processData[`field${this.fieldItemId}`] ? this.processData[`field${this.fieldItemId}`] : ''
}
}
}
</script>

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

@ -0,0 +1,185 @@
<template>
<el-container>
<el-header class="el-page-header">
<h5 v-if="projectData">{{ projectData.name }}</h5>
<el-button type="primary" @click="openFormHandle">访问表单</el-button>
</el-header>
<el-main>
<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-item>
</el-form>
</template>
</el-table-column>
<el-table-column
label="提交序号"
prop="serialNumber"
/>
<el-table-column
label="提交地址"
prop="submitAddress"
/>
<el-table-column
label="提交时间"
prop="createTime"
/>
</el-table>
</el-main>
</el-container>
</template>
<script>
import _ from 'lodash'
import ResultItem from './item'
export default {
name: 'StatisticsPublic',
components: {
ResultItem
},
metaInfo: {
title: '反馈结果',
meta: [
{
name: 'viewport',
content: 'width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=2,user-scalable=yes'
}
]
},
data() {
return {
projectResultList: [],
projectItemList: [],
projectData: null,
projectItemColumns: {},
//
queryConditions: {
current: 1,
size: 10,
projectKey: '',
beginDateTime: '',
endDateTime: ''
},
projectKey: null,
tableData: [{
id: '12987122',
name: '好滋好味鸡蛋仔',
category: '江浙小吃、小吃零食',
desc: '荷兰优质淡奶,奶香浓而不腻',
address: '上海市普陀区真北路',
shop: '王小虎夫妻店',
shopId: '10333'
}, {
id: '12987123',
name: '好滋好味鸡蛋仔',
category: '江浙小吃、小吃零食',
desc: '荷兰优质淡奶,奶香浓而不腻',
address: '上海市普陀区真北路',
shop: '王小虎夫妻店',
shopId: '10333'
}, {
id: '12987125',
name: '好滋好味鸡蛋仔',
category: '江浙小吃、小吃零食',
desc: '荷兰优质淡奶,奶香浓而不腻',
address: '上海市普陀区真北路',
shop: '王小虎夫妻店',
shopId: '10333'
}, {
id: '12987126',
name: '好滋好味鸡蛋仔',
category: '江浙小吃、小吃零食',
desc: '荷兰优质淡奶,奶香浓而不腻',
address: '上海市普陀区真北路',
shop: '王小虎夫妻店',
shopId: '10333'
}]
}
},
created() {
this.projectKey = this.$route.query.projectKey
this.queryConditions.projectKey = this.projectKey
this.queryProjectResult()
this.queryProjectItems()
this.queryProject()
},
methods: {
openFormHandle() {
this.$router.replace({path: `/s/${this.projectKey}`})
},
queryProject() {
this.$api.get(`/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
this.projectResultList = records
this.total = total
this.queryConditions.size = size
})
},
queryProjectItems() {
this.$api.get('/user/project/item/list', {params: {key: this.projectKey}}).then(res => {
if (res.data) {
res.data.map(item => {
_.set(this.projectItemColumns, `field${item.formItemId}`, item.label)
})
}
this.projectItemList = res.data
})
}
}
}
</script>
<style lang="scss" scoped>
.el-header {
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
.el-button {
height: 50%;
}
}
.el-main {
background-color: $backgroundColor;
height: calc(100vh - 60px);
}
@media screen and (max-width: 750px) {
.public-result-table {
width: 100% !important;
}
.el-header {
justify-content: space-between !important;
}
}
.public-result-table {
width: 60%;
margin: 0 auto;
}
.public-table-expand {
font-size: 0;
label {
width: 90px;
color: #99a9bf;
}
.el-form-item {
margin-right: 0;
margin-bottom: 0;
width: 50%;
}
}
</style>

24
src/views/form/write/index.vue

@ -31,6 +31,9 @@
fit="cover"
/>
</div>
<el-button v-if="userProjectSetting.publicResult" type="primary" @click="openPublicResultHandle">
查看数据
</el-button>
</div>
</div>
</template>
@ -39,7 +42,7 @@
import ProjectForm from '../preview/ProjectForm'
import loadWXJs from '@/utils/loadWxSdk'
import defaultValue from '@/utils/defaultValue'
import { getQueryString} from '@/utils'
import {getQueryString} from '@/utils'
import constants from '@/utils/constants'
const uaParser = require('ua-parser-js')
@ -73,11 +76,13 @@ export default {
wxSignature: {}
}
},
beforeCreate() {
let meta = document.createElement('meta')
meta.content = 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'
meta.name = 'viewport'
document.getElementsByTagName('head')[0].appendChild(meta)
metaInfo: {
meta: [
{
name: 'viewport',
content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'
}
]
},
created() {
let key = this.$route.query.key || this.$route.params.key
@ -237,6 +242,9 @@ export default {
}
})
},
/**
* 仅在微信打开
*/
onlyWxOpenHandle() {
let wxUa = navigator.userAgent.toLowerCase()
let isWeixin = wxUa.indexOf('micromessenger') != -1
@ -245,6 +253,10 @@ export default {
document.body.innerHTML = '<div class="weui_msg"><div class="weui_icon_area"><i class="weui_icon_info weui_icon_msg"></i></div><div class="weui_text_area"><h4 class="weui_msg_title">请在微信客户端打开链接</h4></div></div>'
}
},
openPublicResultHandle() {
let projectKey = this.projectConfig.projectKey
this.$router.replace({path: '/project/public/result', query: {projectKey}})
},
submitForm(data) {
//
let inActiveTime = document.getElementById('inActiveTime').innerText

Loading…
Cancel
Save