elink-star
/
tduck-front
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'release'

master
jianjun 4 years ago
parent
fb278054c0 cc6f1a7bfc
commit
92bd52127b
13 changed files with 768 additions and 700 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 13
      src/api/index.js
  2. 428
      src/assets/styles/form/home.scss
  3. 2
      src/components/parser/Parser.vue
  4. 118
      src/views/form/editor/IconsDialog.vue
  5. 78
      src/views/form/index.vue
  6. 143
      src/views/form/preview/index.vue
  7. 1
      src/views/form/publish/index.vue
  8. 10
      src/views/form/setting/index.vue
  9. 613
      src/views/form/statistics/list.vue
  10. 2
      src/views/form/statistics/public.vue
  11. 35
      src/views/form/theme/index.vue
  12. 23
      src/views/form/write/index.vue
  13. 2
      src/views/project/my/index.vue

13
src/api/index.js
View File

@ -69,7 +69,7 @@ api.interceptors.response.use(
*/ */
let errCodes = [500, 405, 403] let errCodes = [500, 405, 403]
const res = response.data const res = response.data
if (res.code === 200) { if (res.code === 0) {
return Promise.resolve(res) return Promise.resolve(res)
} else if (errCodes.includes(res.code)) { } else if (errCodes.includes(res.code)) {
// 这里做错误提示，如果使用了 element ui 则可以使用 Message 进行提示 // 这里做错误提示，如果使用了 element ui 则可以使用 Message 进行提示
@ -112,8 +112,15 @@ api.interceptors.response.use(
result = await api.request(response.config) result = await api.request(response.config)
}) })
return Promise.resolve(result) return Promise.resolve(result)
} }else {
return Promise.resolve(res) Message({
message: res.msg || 'Error',
type: 'error',
duration: 5 * 1000
})
return Promise.reject(res)
}
// return Promise.resolve(res)
}, },
error => { error => {
Message({ Message({

428
src/assets/styles/form/home.scss
View File

@ -1,271 +1,271 @@
@import '../resources/variables'; @import "../resources/variables";
$selectedColor: rgba(24, 144, 255, 0.05); $selectedColor: rgba(24, 144, 255, 0.05);
$lighterBlue: #1890ff; $lighterBlue: #1890ff;
.form-edit-container { .form-edit-container {
position: relative; position: relative;
width: 100%; width: 100%;
height: calc(100vh - 60px); height: 100vh;
overflow-y: hidden; overflow-y: hidden;
} }
.components-list { .components-list {
padding: 8px; padding: 8px;
box-sizing: border-box; box-sizing: border-box;
height: 100%; height: 100%;
.components-item { .components-item {
display: inline-block; display: inline-block;
width: 48%; width: 48%;
margin: 1%; margin: 1%;
transition: transform 0ms !important; transition: transform 0ms !important;
} }
} }
.components-draggable { .components-draggable {
padding-bottom: 20px; padding-bottom: 20px;
} }
.components-title { .components-title {
font-size: 14px; font-size: 14px;
color: #222; color: #222;
margin: 6px 2px; margin: 6px 2px;
.svg-icon { .svg-icon {
color: #666; color: #666;
font-size: 18px; font-size: 18px;
} }
} }
.components-body { .components-body {
padding: 8px 10px; padding: 8px 10px;
background: $selectedColor; background: $selectedColor;
font-size: 12px; font-size: 12px;
cursor: move; cursor: move;
border: 1px dashed $selectedColor; border: 1px dashed $selectedColor;
border-radius: 3px; border-radius: 3px;
.svg-icon {
color: #777;
font-size: 15px;
}
&:hover {
border: 1px dashed $--color-primary;
color: $--color-primary;
.svg-icon { .svg-icon {
color: #777; color: $--color-primary;
font-size: 15px;
}
&:hover {
border: 1px dashed $--color-primary;
color: $--color-primary;
.svg-icon {
color: $--color-primary;
}
} }
}
} }
.left-board { .left-board {
width: 260px; width: 260px;
position: absolute; position: absolute;
left: 10px; left: 10px;
top: 0; top: 0;
margin-top: 5px; margin-top: 5px;
height: calc(100vh - 80px); height: calc(100vh - 20px);
background-color: rgba(255, 255, 255, 100); background-color: rgba(255, 255, 255, 100);
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
border: 1px solid rgba(255, 255, 255, 100); border: 1px solid rgba(255, 255, 255, 100);
} }
.el-menu.el-menu--horizontal { .el-menu.el-menu--horizontal {
border-bottom: none; border-bottom: none;
} }
.left-scrollbar { .left-scrollbar {
height: calc(100vh - 80px); height: calc(100vh - 20px);
overflow: hidden; overflow: hidden;
margin: 5px; margin: 5px;
border-radius: 7px; border-radius: 7px;
} }
.center-scrollbar { .center-scrollbar {
height: calc(100vh - 60px); height: 100vh;
overflow: hidden; overflow: hidden;
width: 90%; width: 90%;
margin: 20px auto 0; margin: 20px auto 0;
box-sizing: border-box; box-sizing: border-box;
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
border: 2px solid rgba(255, 255, 255, 100); border: 2px solid rgba(255, 255, 255, 100);
overflow-y: hidden; overflow-y: hidden;
} }
.center-board { .center-board {
height: calc(100vh - 220px); height: calc(100vh - 220px);
width: auto; width: auto;
margin: 0 350px 80px 260px; margin: 0 350px 80px 260px;
box-sizing: border-box; box-sizing: border-box;
} }
.empty-info { .empty-info {
position: absolute; position: absolute;
top: 36%; top: 36%;
left: 0; left: 0;
right: 0; right: 0;
text-align: center; text-align: center;
font-size: 18px; font-size: 18px;
color: $--color-primary; color: $--color-primary;
letter-spacing: 4px; letter-spacing: 4px;
} }
.action-bar { .action-bar {
position: relative; position: relative;
height: 42px; height: 42px;
text-align: right; text-align: right;
padding: 0 15px; padding: 0 15px;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid #f1e8e8; border: 1px solid #f1e8e8;
border-top: none; border-top: none;
border-left: none; border-left: none;
.delete-btn { .delete-btn {
color: #f56c6c; color: #f56c6c;
} }
} }
.center-board-row { .center-board-row {
padding: 12px 12px 15px 12px; padding: 12px 12px 15px 12px;
box-sizing: border-box; box-sizing: border-box;
overflow-y: hidden; overflow-y: hidden;
& > .el-form { & > .el-form {
// 69 = 12+15+42 // 69 = 12+15+42
height: calc(100vh - 69px); height: calc(100vh - 69px);
} }
} }
.drawing-board { .drawing-board {
height: 100%; height: 100%;
position: relative;
.components-body {
padding: 0;
margin: 0;
font-size: 0;
}
.sortable-ghost {
position: relative; position: relative;
.components-body { display: block;
padding: 0; overflow: hidden;
margin: 0; &::before {
font-size: 0; content: " ";
} position: absolute;
.sortable-ghost { left: 0;
position: relative; right: 0;
display: block; top: 0;
overflow: hidden; height: 3px;
&::before { background: $--color-primary;
content: " "; z-index: 2;
position: absolute;
left: 0;
right: 0;
top: 0;
height: 3px;
background: $--color-primary;
z-index: 2;
}
} }
.components-item.sortable-ghost { }
width: 100%; .components-item.sortable-ghost {
height: 60px; width: 100%;
background-color: $selectedColor; height: 60px;
background-color: $selectedColor;
}
.active-from-item {
& > .el-form-item {
background: $selectedColor;
border-radius: 6px;
} }
.active-from-item { & > .drawing-item-copy,
& > .el-form-item { & > .drawing-item-delete {
background: $selectedColor; display: initial;
border-radius: 6px;
}
& > .drawing-item-copy,
& > .drawing-item-delete {
display: initial;
}
& > .component-name {
color: $lighterBlue;
}
} }
.el-form-item { & > .component-name {
margin-bottom: 15px; color: $lighterBlue;
} }
}
.el-form-item {
margin-bottom: 15px;
}
} }
.drawing-item { .drawing-item {
position: relative; position: relative;
cursor: move; cursor: move;
&.unfocus-bordered:not(.active-from-item) > div:first-child { &.unfocus-bordered:not(.active-from-item) > div:first-child {
border: 1px dashed #ccc; border: 1px dashed #ccc;
} }
.el-form-item { .el-form-item {
padding: 12px 10px; padding: 12px 10px;
} }
} }
.drawing-row-item { .drawing-row-item {
position: relative; position: relative;
cursor: move; cursor: move;
box-sizing: border-box; box-sizing: border-box;
border: 1px dashed #ccc; border: 1px dashed #ccc;
border-radius: 3px; border-radius: 3px;
padding: 0 2px; padding: 0 2px;
margin-bottom: 15px; margin-bottom: 15px;
.drawing-row-item { .drawing-row-item {
margin-bottom: 2px; margin-bottom: 2px;
} }
.el-col { .el-col {
margin-top: 22px; margin-top: 22px;
} }
.el-form-item { .el-form-item {
margin-bottom: 0; margin-bottom: 0;
} }
.drag-wrapper { .drag-wrapper {
min-height: 80px; min-height: 80px;
} }
&.active-from-item { &.active-from-item {
border: 1px dashed $lighterBlue; border: 1px dashed $lighterBlue;
} }
.component-name { .component-name {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
font-size: 12px; font-size: 12px;
color: #bbb; color: #bbb;
display: inline-block; display: inline-block;
padding: 0 6px; padding: 0 6px;
} }
} }
.drawing-item, .drawing-item,
.drawing-row-item { .drawing-row-item {
&:hover { &:hover {
& > .el-form-item { & > .el-form-item {
background: $selectedColor; background: $selectedColor;
border-radius: 6px; border-radius: 6px;
}
& > .drawing-item-copy,
& > .drawing-item-delete {
display: initial;
}
} }
& > .drawing-item-copy, & > .drawing-item-copy,
& > .drawing-item-delete { & > .drawing-item-delete {
display: none; display: initial;
position: absolute;
top: -10px;
width: 22px;
height: 22px;
line-height: 22px;
text-align: center;
border-radius: 50%;
font-size: 12px;
border: 1px solid;
cursor: pointer;
z-index: 1;
} }
& > .drawing-item-copy { }
right: 56px; & > .drawing-item-copy,
border-color: $lighterBlue; & > .drawing-item-delete {
color: $lighterBlue; display: none;
background: #fff; position: absolute;
&:hover { top: -10px;
background: $lighterBlue; width: 22px;
color: #fff; height: 22px;
} line-height: 22px;
text-align: center;
border-radius: 50%;
font-size: 12px;
border: 1px solid;
cursor: pointer;
z-index: 1;
}
& > .drawing-item-copy {
right: 56px;
border-color: $lighterBlue;
color: $lighterBlue;
background: #fff;
&:hover {
background: $lighterBlue;
color: #fff;
} }
& > .drawing-item-delete { }
right: 24px; & > .drawing-item-delete {
border-color: #f56c6c; right: 24px;
color: #f56c6c; border-color: #f56c6c;
background: #fff; color: #f56c6c;
&:hover { background: #fff;
background: #f56c6c; &:hover {
color: #fff; background: #f56c6c;
} color: #fff;
} }
}
} }
.form-name-text { .form-name-text {
padding: 6px 10px; padding: 6px 10px;
border: 1px dashed transparent; border: 1px dashed transparent;
line-height: 30px; line-height: 30px;
margin: 0; margin: 0;
} }
.form-name-text input { .form-name-text input {
border: none; border: none;
background-color: transparent; background-color: transparent;
} }
[contenteditable]:focus { [contenteditable]:focus {
outline: none; outline: none;
background-color: #f4f4f4; background-color: #f4f4f4;
border: 1px solid #f4f4f4; border: 1px solid #f4f4f4;
} }

2
src/components/parser/Parser.vue
View File

@ -473,6 +473,7 @@ export default {
} }
// 处理其他输入必填校验 // 处理其他输入必填校验
const validateOtherInput = (rule, value, callback) => { const validateOtherInput = (rule, value, callback) => {
// 0 等于选中其他 // 0 等于选中其他
if (value == 0 || (Array.isArray(value) && value.includes(0))) { if (value == 0 || (Array.isArray(value) && value.includes(0))) {
if (!this[this.formConf.labelFormModel][`${rule.field}other`]) { if (!this[this.formConf.labelFormModel][`${rule.field}other`]) {
@ -485,6 +486,7 @@ export default {
} }
} }
if (Array.isArray(config.regList)) { if (Array.isArray(config.regList)) {
// 必填其他输入框校验 // 必填其他输入框校验
if (['RADIO', 'CHECKBOX'].includes(cur.typeId)) { if (['RADIO', 'CHECKBOX'].includes(cur.typeId)) {
const required = { validator: validateOtherInput, message: cur.placeholder } const required = { validator: validateOtherInput, message: cur.placeholder }

118
src/views/form/editor/IconsDialog.vue
View File

@ -1,38 +1,32 @@
<template> <template>
<div class="icon-dialog"> <div class="icon-dialog">
<el-dialog <el-dialog v-bind="$attrs"
v-bind="$attrs" width="980px"
width="980px" :modal-append-to-body="false"
:modal-append-to-body="false" v-on="$listeners"
v-on="$listeners" @open="onOpen"
@open="onOpen" @close="onClose">
@close="onClose" <div slot="title">
> 选择图标
<div slot="title"> <el-input v-model="key"
选择图标 size="mini"
<el-input :style="{width: '260px'}"
v-model="key" placeholder="请输入图标名称"
size="mini" prefix-icon="el-icon-search"
:style="{width: '260px'}" clearable />
placeholder="请输入图标名称" </div>
prefix-icon="el-icon-search" <ul class="icon-ul">
clearable <li v-for="icon in iconList"
/> :key="icon"
</div> :class="active===icon?'active-item':''"
<ul class="icon-ul"> @click="onSelect(icon)">
<li <i :class="icon" />
v-for="icon in iconList" <div>{{ icon }}</div>
:key="icon" </li>
:class="active===icon?'active-item':''" </ul>
@click="onSelect(icon)" </el-dialog>
> </div>
<i :class="icon" />
<div>{{ icon }}</div>
</li>
</ul>
</el-dialog>
</div>
</template> </template>
<script> <script>
/* eslint-disable */ /* eslint-disable */
@ -41,37 +35,37 @@ import iconList from '@/utils/icon.json'
const originList = iconList.map(name => `el-icon-${name}`) const originList = iconList.map(name => `el-icon-${name}`)
export default { export default {
inheritAttrs: false, inheritAttrs: false,
props: ['current'], props: ['current'],
data() { data () {
return { return {
iconList: originList, iconList: originList,
active: null, active: null,
key: '' key: ''
} }
},
watch: {
key (val) {
if (val) {
this.iconList = originList.filter(name => name.indexOf(val) > -1)
} else {
this.iconList = originList
}
}
},
methods: {
onOpen () {
this.active = this.current
this.key = ''
}, },
watch: { onClose () {
key(val) {
if (val) {
this.iconList = originList.filter(name => name.indexOf(val) > -1)
} else {
this.iconList = originList
}
}
}, },
methods: { onSelect (icon) {
onOpen() { this.active = icon
this.active = this.current this.$emit('select', icon)
this.key = '' this.$emit('update:visible', false)
},
onClose() {
},
onSelect(icon) {
this.active = icon
this.$emit('select', icon)
this.$emit('update:visible', false)
}
} }
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -120,7 +114,7 @@ export default {
box-sizing: border-box; box-sizing: border-box;
.el-dialog__header { .el-dialog__header {
padding-top: 14px; // padding-top: 14px;
} }
.el-dialog__body { .el-dialog__body {

78
src/views/form/index.vue
View File

@ -13,21 +13,21 @@
</el-button> </el-button>
</el-row> </el-row>
</el-card> --> </el-card> -->
<div class="main-container"> <div v-if="!previewDialogVisible"
class="main-container">
<div class="left-menu-container"> <div class="left-menu-container">
<el-menu :collapse="isCollapse" <el-menu :collapse="isCollapse"
:default-active="defaultActiveMenu" :default-active="defaultActiveMenu"
class="el-menu-vertical"> class="el-menu-vertical">
<el-menu-item class="el-menu-item-per" <el-menu-item class="el-menu-item-per"
v-for="menuItem in (publishStatus?menuItemList2:menuItemList)" v-for="menuItem in menuShow"
:key="menuItem.key" :key="menuItem.key"
:index="menuItem.route" :index="menuItem.route"
@click="menuSelectHandle(menuItem.route,menuItem.key)"> @click="menuSelectHandle(menuItem.route,menuItem.key)">
<i :class="menuItem.icon" <i :class="menuItem.icon"
style="margin-top:1px;align-items:center;" /> style="margin-top:1px;align-items:center;" />
<span style="white-space:pre-wrap" <span slot="title">{{ menuItem.title }}</span>
slot="title">{{ menuItem.title }}</span>
</el-menu-item> </el-menu-item>
</el-menu> </el-menu>
@ -43,12 +43,19 @@
<router-view /> <router-view />
</div> </div>
</div> </div>
<el-dialog :visible.sync="previewDialogVisible" <div v-if="previewDialogVisible">
<pre-view :key="previewKey"
:showCloseBtn="true"
:preview-qrcode="true"
@diaCancal="diaCancal" />
</div>
<!-- <el-dialog :visible.sync="previewDialogVisible"
class="dialog"
destroy-on-close destroy-on-close
fullscreen> fullscreen>
<pre-view :key="previewKey" <pre-view :key="previewKey"
:preview-qrcode="true" /> :preview-qrcode="true" />
</el-dialog> </el-dialog> -->
</div> </div>
</template> </template>
@ -61,13 +68,14 @@ export default {
components: { PreView }, components: { PreView },
data () { data () {
return { return {
publishStatus: true, publishStatus: 1,
previewKey: +new Date(), previewKey: +new Date(),
previewDialogVisible: false, previewDialogVisible: false,
defaultActiveMenu: '', defaultActiveMenu: '',
projectKey: null, projectKey: null,
isCollapse: false, isCollapse: false,
menuItemList: [ menuShow: [],
menuItemList1: [
{ {
key: 'edit', key: 'edit',
title: '编辑', title: '编辑',
@ -141,6 +149,23 @@ export default {
title: '返回', title: '返回',
icon: 'el-icon-back' icon: 'el-icon-back'
} }
], menuItemList3: [
{
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-back'
}
] ]
} }
}, },
@ -152,18 +177,28 @@ export default {
this.getProjectStatus() this.getProjectStatus()
}, },
methods: { methods: {
menuInit () {
this.menuShow = this.publishStatus === 1 ? this.menuItemList1 : this.publishStatus === 2 ? this.menuItemList2 : this.menuItemList3
},
diaCancal () {
this.previewDialogVisible = false
},
getProjectStatus () { getProjectStatus () {
this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/${this.projectKey}`).then(res => { this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/${this.projectKey}`).then(res => {
if (res.data.status == 1) { console.log('状态', res.data.status)
this.publishStatus = false this.publishStatus = res.data.status
} else {
this.publishStatus = true
if (this.publishStatus === 3) {
this.menuSelectHandle('/project/form/statistics', 'static')
} }
this.menuInit()
}) })
}, },
@ -239,19 +274,21 @@ export default {
.main-container { .main-container {
width: 100vw; width: 100vw;
height: calc(100vh - 60px); height: 100vh;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
.right-content-container { .right-content-container {
width: calc(100vw - 100px); width: 100vw;
height: calc(100vh - 60px); height: 100vh;
overflow-x: hidden; overflow-x: hidden;
} }
} }
.left-menu-container { .left-menu-container {
max-width: 100px; width: 130px;
min-width: 130px;
max-width: 200px;
text-align: center; text-align: center;
position: relative; position: relative;
display: flex; display: flex;
@ -267,8 +304,8 @@ export default {
min-height: 400px; min-height: 400px;
} }
.el-menu-item-per { .el-menu-item-per {
display: flex; // display: flex;
line-height: 20px; // line-height: 20px;
} }
.el-icon-d-arrow-left, .el-icon-d-arrow-left,
@ -277,13 +314,16 @@ export default {
cursor: pointer; cursor: pointer;
font-weight: 550; font-weight: 550;
color: #000; color: #000;
margin-bottom: 100px; margin-bottom: 20px;
&:hover { &:hover {
color: rgb(32, 160, 255); color: rgb(32, 160, 255);
} }
} }
} }
::v-deep.el-dialog__header {
padding-top: 0px;
}
::v-deep.preview-container { ::v-deep.preview-container {
background-color: #ffffff; background-color: #ffffff;

143
src/views/form/preview/index.vue
View File

@ -1,41 +1,45 @@
<template> <template>
<div class="preview-container"> <div class="preview-container">
<el-tabs v-if="projectConfig.projectKey" type="card"> <el-button v-if="showCloseBtn"
<el-tab-pane> @click="diaCancal"
<span slot="label"><i class="el-icon-mobile" /> class="btn_close"
手机 icon="el-icon-close"
</span> circle></el-button>
<div class="preview-layer"> <el-tabs v-if="projectConfig.projectKey"
<div class="preview-bg" /> type="card">
<div class="preview-phone"> <el-tab-pane>
<iframe id="preview-html" <span slot="label"><i class="el-icon-mobile" />
:src="mobilePreviewUrl" 手机
class="preview-html" frameborder="0" </span>
name="preview-html" <div class="preview-layer">
scrolling="auto" <div class="preview-bg" />
/> <div class="preview-phone">
</div> <iframe id="preview-html"
</div> :src="mobilePreviewUrl"
<!-- <div v-if="mobilePreviewUrl&&previewQrcode" class="qrcode-view"> class="preview-html"
frameborder="0"
name="preview-html"
scrolling="auto" />
</div>
</div>
<!-- <div v-if="mobilePreviewUrl&&previewQrcode" class="qrcode-view">
<p>手机扫码查看效果</p> <p>手机扫码查看效果</p>
<vue-qr <vue-qr
v-if="mobilePreviewUrl&&previewQrcode" :size="194" :text="mobilePreviewUrl" v-if="mobilePreviewUrl&&previewQrcode" :size="194" :text="mobilePreviewUrl"
/> />
</div> --> </div> -->
</el-tab-pane> </el-tab-pane>
<el-tab-pane> <el-tab-pane>
<span slot="label"><i class="el-icon-monitor" /> <span slot="label"><i class="el-icon-monitor" />
电脑 电脑
</span> </span>
<el-scrollbar style="height: 77vh;overflow-x: hidden!important;"> <el-scrollbar style="height: 77vh;overflow-x: hidden!important;">
<project-form <project-form v-if="projectConfig.projectKey"
v-if="projectConfig.projectKey" :project-config="projectConfig" />
:project-config="projectConfig" </el-scrollbar>
/> </el-tab-pane>
</el-scrollbar> </el-tabs>
</el-tab-pane> </div>
</el-tabs>
</div>
</template> </template>
<script> <script>
@ -43,42 +47,56 @@ import ProjectForm from './ProjectForm'
// import VueQr from 'vue-qr' // import VueQr from 'vue-qr'
export default { export default {
name: 'PreView', name: 'PreView',
components: { components: {
ProjectForm ProjectForm
// VueQr // VueQr
}, },
props: { props: {
previewQrcode: null previewQrcode: null,
}, showCloseBtn: {
data() { type: Boolean,
return { default: false
projectKey: null, }
mobilePreviewUrl: '', },
projectConfig: { data () {
projectKey: '', return {
showBtns: true projectKey: null,
} mobilePreviewUrl: '',
} projectConfig: {
}, projectKey: '',
mounted() { showBtns: true
this.projectKey = this.$route.query.key }
let url = window.location.protocol + '//' + window.location.host
this.mobilePreviewUrl = `${url}/${process.env.VUE_APP_PUBLIC_PATH}/project/view?key=${this.projectKey}`
this.$set(this.projectConfig, 'projectKey', this.projectKey)
} }
},
mounted () {
this.projectKey = this.$route.query.key
let url = window.location.protocol + '//' + window.location.host
this.mobilePreviewUrl = `${url}/${process.env.VUE_APP_PUBLIC_PATH}/project/view?key=${this.projectKey}`
this.$set(this.projectConfig, 'projectKey', this.projectKey)
},
methods: {
diaCancal () {
this.$emit("diaCancal")
},
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.preview-container { .preview-container {
margin: 0; margin: 0;
padding-top: 30px; padding-top: 15px;
background-color: #f7f7f7; background-color: #f7f7f7;
position: relative;
} }
::v-deep .el-tabs--card>.el-tabs__header .el-tabs__nav{ .btn_close {
border: 1px solid #E4E7ED!important; position: absolute;
right: 200px;
top: 20px;
}
::v-deep .el-tabs--card > .el-tabs__header .el-tabs__nav {
border: 1px solid #e4e7ed !important;
} }
::v-deep .el-tabs__header { ::v-deep .el-tabs__header {
width: 300px; width: 300px;
@ -110,16 +128,16 @@ div.preview-layer .preview-bg {
div.preview-layer .preview-phone { div.preview-layer .preview-phone {
width: 372px; width: 372px;
height: 744px; height: 744px;
background: url('~@/assets/images/appearset_bgc_big.png'); background: url("~@/assets/images/appearset_bgc_big.png");
background-size: 372px 744px; background-size: 372px 744px;
z-index: 1000; z-index: 1000;
} }
.qrcode-view{ .qrcode-view {
position: absolute; position: absolute;
top: 0; top: 0;
right: 20px; right: 20px;
p{ p {
text-align: center; text-align: center;
font-size: 12px; font-size: 12px;
color: #303133; color: #303133;
@ -142,5 +160,4 @@ div.preview-layer .preview-phone {
border-bottom-width: 0; border-bottom-width: 0;
border-left-width: 0; border-left-width: 0;
} }
</style> </style>

1
src/views/form/publish/index.vue
View File

@ -236,6 +236,7 @@ export default {
this.msgSuccess('停止成功') this.msgSuccess('停止成功')
this.$parent.getProjectStatus() this.$parent.getProjectStatus()
this.getProjectStatus() this.getProjectStatus()
// this.$router.push({ path: '/home' })
} }
}) })
}, },

10
src/views/form/setting/index.vue
View File

@ -6,8 +6,7 @@
class="project-setting-container" class="project-setting-container"
justify="center" justify="center"
type="flex"> type="flex">
<el-col :offset="3" <el-col :span="6"
:span="5"
class="project-setting-view"> class="project-setting-view">
<p class="project-setting-title"> <p class="project-setting-title">
提交设置 提交设置
@ -104,7 +103,8 @@
</el-col> </el-col>
</el-row> --> </el-row> -->
</el-col> </el-col>
<el-col :span="6" <el-col :offset="3"
:span="6"
class="project-setting-view text-center"> class="project-setting-view text-center">
<p class="project-setting-title"> <p class="project-setting-title">
回收设置 回收设置
@ -776,7 +776,7 @@ export default {
<style scoped> <style scoped>
.project-setting-container { .project-setting-container {
width: 100%; width: 100%;
height: 100%; height: 100vh;
min-height: 85vh; min-height: 85vh;
padding-top: 30px; padding-top: 30px;
margin: 0; margin: 0;
@ -784,7 +784,7 @@ export default {
} }
.project-setting-view { .project-setting-view {
height: 100%; height: 98%;
line-height: 20px; line-height: 20px;
border-radius: 7px; border-radius: 7px;
color: rgba(16, 16, 16, 100); color: rgba(16, 16, 16, 100);

613
src/views/form/statistics/list.vue
View File

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

2
src/views/form/statistics/public.vue
View File

@ -150,7 +150,7 @@ export default {
} }
.el-main { .el-main {
background-color: rgba(247, 247, 247, 90); background-color: rgba(247, 247, 247, 90);
height: calc(100vh - 60px); height: 100vh;
} }
@media screen and (max-width: 750px) { @media screen and (max-width: 750px) {
.public-result-table { .public-result-table {

35
src/views/form/theme/index.vue
View File

@ -1,17 +1,10 @@
<template> <template>
<div class="theme-container"> <div class="theme-container">
<div class="left-container"> <div v-if="false"
class="left-container">
<el-scrollbar class="left-scrollbar-container"> <el-scrollbar class="left-scrollbar-container">
<p class="theme-title">外观主题</p> <p class="theme-title">外观主题</p>
<div class="tag-wr"> <el-row>
<div class="tag-title">风格</div>
<div class="tag-list">
<div v-for="item in styleList" :key="item.key" class="tag-item"
:class="{'tag-item-on':activeStyle==item.key}" @click="activeStyleHandle(item)">
{{ item.label }}</div>
</div>
</div>
<!-- <el-row>
<el-col :span="6"> <el-col :span="6">
<span class="theme-prompt-text">风格</span> <span class="theme-prompt-text">风格</span>
</el-col> </el-col>
@ -22,18 +15,8 @@
class="style-btn" class="style-btn"
@click="activeStyleHandle(item)">{{ item.label }}</span> @click="activeStyleHandle(item)">{{ item.label }}</span>
</el-col> </el-col>
</el-row> --> </el-row>
<div class="tag-wr"> <el-row style="margin-top:20px">
<div class="tag-title">颜色</div>
<div class="tag-list">
<div class="tag-item"
:class="{'tag-item-on':activeColor==''}" @click="activeColorHandle('')">全部</div>
<div v-for="c in colorList" :key="c" class="tag-item tag-c"
:style="{backgroundColor: c}"
:class="{'tag-item-on':activeColor==c}" @click="activeColorHandle(c)"></div>
</div>
</div>
<!-- <el-row>
<el-col :span="6"> <el-col :span="6">
<span class="theme-prompt-text">颜色</span> <span class="theme-prompt-text">颜色</span>
</el-col> </el-col>
@ -409,7 +392,7 @@ export default {
<style scoped> <style scoped>
.theme-container { .theme-container {
width: 100%; width: 100vw;
height: 100%; height: 100%;
background-color: #f7f7f7; background-color: #f7f7f7;
overflow: hidden; overflow: hidden;
@ -425,7 +408,7 @@ export default {
border: 1px solid rgba(255, 255, 255, 100); border: 1px solid rgba(255, 255, 255, 100);
background-color: white; background-color: white;
width: 20%; width: 20%;
height: calc(100vh - 60px); height: 100vh;
} }
.left-scrollbar-container { .left-scrollbar-container {
height: 100%; height: 100%;
@ -499,7 +482,7 @@ export default {
} }
.right-container { .right-container {
width: 310px; width: 310px;
height: calc(100vh - 60px); height: 100vh;
line-height: 20px; line-height: 20px;
text-align: center; text-align: center;
padding: 22px; padding: 22px;
@ -568,7 +551,7 @@ export default {
.tag-item:nth-child(4n) { .tag-item:nth-child(4n) {
margin-right: 0; margin-right: 0;
} }
.tag-c { .tag-c {
width: 40px; width: 40px;
height: 20px; height: 20px;

23
src/views/form/write/index.vue
View File

@ -47,6 +47,7 @@ import loadWXJs from '@/utils/loadWxSdk'
import defaultValue from '@/utils/defaultValue' import defaultValue from '@/utils/defaultValue'
import { getQueryString } from '@/utils' import { getQueryString } from '@/utils'
import constants from '@/utils/constants' import constants from '@/utils/constants'
import ELEMENT from 'element-ui'
const uaParser = require('ua-parser-js') const uaParser = require('ua-parser-js')
const ua = uaParser(navigator.userAgent) const ua = uaParser(navigator.userAgent)
@ -288,10 +289,18 @@ export default {
let projectKey = this.projectConfig.projectKey let projectKey = this.projectConfig.projectKey
this.$router.replace({ path: '/project/public/result', query: { projectKey } }) this.$router.replace({ path: '/project/public/result', query: { projectKey } })
}, },
submitForm (data) { async submitForm (data) {
const loading = ELEMENT.Loading.service({
fullscreen: true,
lock: true,
text: '提交中',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.5)'
})
// 完成时间 // 完成时间
let inActiveTime = document.getElementById('inActiveTime').innerText let inActiveTime = document.getElementById('inActiveTime').innerText
this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/result/create?access_key=${this.accessKey}`, { await this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/result/create?access_key=${this.accessKey}`, {
'completeTime': inActiveTime, 'completeTime': inActiveTime,
'projectKey': this.projectConfig.projectKey, 'projectKey': this.projectConfig.projectKey,
'submitOs': ua.os.name, 'submitOs': ua.os.name,
@ -307,7 +316,8 @@ export default {
'orgType': this.orgType,//人员所属类型(组织:agency;部门:dept;网格:grid) 'orgType': this.orgType,//人员所属类型(组织:agency;部门:dept;网格:grid)
'realName': this.realName,//填写人姓名 'realName': this.realName,//填写人姓名
//'accessKey':this.accessKey //'accessKey':this.accessKey
}).then(() => { }).then((res) => {
this.writeStatus = 2 this.writeStatus = 2
if (this.userProjectSetting.submitJumpUrl) { if (this.userProjectSetting.submitJumpUrl) {
setTimeout(() => { setTimeout(() => {
@ -315,7 +325,12 @@ export default {
}, 1000) }, 1000)
} }
}) },
(msg) => {
// debugger
})
// debugger
loading.close()
} }
} }
} }

2
src/views/project/my/index.vue
View File

File diff suppressed because one or more lines are too long
Write Preview
Loading…
Cancel
Save