kubbo/dvcp_v2_wxcp_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BUG 26029

Browse Source
This commit is contained in:
aixianling
2021-12-24 22:45:52 +08:00
parent 33685758f3
commit 587dd3f899
7 changed files with 174 additions and 241 deletions
Download Patch File Download Diff File Expand all files Collapse all files

315
src/apps/AppAskForm/components/AddForm.vue → src/apps/AppAskForm/AddForm.vue
View File

@@ -1,156 +1,134 @@
<template> <template>
<div class="add-form" v-if="pageShow"> <div class="add-form" v-if="pageShow">
<div v-show="!isShowConfig"> <div class="header-pic">
<div class="header-pic"> <image v-if="form.headPicture" :src="form.headPicture"/>
<image v-if="form.headPicture" :src="form.headPicture"/> <span @click="upload">更换图片</span>
<span @click="upload">更换图片</span> </div>
</div> <div class="form-info">
<div class="form-info"> <h2>文本选项</h2>
<h2>文本选项</h2> <div class="form-info__wrapper">
<div class="form-info__wrapper">
<textarea class="title" placeholder="请输入标题 (必填）" :maxlength="30" :auto-height="true" <textarea class="title" placeholder="请输入标题 (必填）" :maxlength="30" :auto-height="true"
v-model="form.title"></textarea> v-model="form.title"></textarea>
<textarea <textarea
class="content" class="content"
border="none" border="none"
:clearable="false" :clearable="false"
type="textarea" type="textarea"
v-model="form.tableExplain" v-model="form.tableExplain"
placeholder="请输入表单描述 (选填）" placeholder="请输入表单描述 (选填）"
:maxlength="255"> :maxlength="255">
</textarea> </textarea>
</div>
</div> </div>
<draggable </div>
class="components-list" <draggable
v-model="targetList" class="components-list"
:animation="340" v-model="targetList"
scroll :animation="340"
element="div" scroll
:options="{ element="div"
:options="{
animation: 340, animation: 340,
handle: '.components-item__title' handle: '.components-item__title'
}" }"
draggable=".components-item" draggable=".components-item"
:sort="true"> :sort="true">
<div class="components-item" v-for="(item, index) in targetList" :key="index" <div class="components-item" v-for="(item, index) in targetList" :key="index"
@click="toFiledSetting(item, index)"> @click="toFiledSetting(item, index)">
<div class="components-item__title"> <div class="components-item__title">
<div class="components-item__title--left"> <div class="components-item__title--left">
<em :style="{opacity: item.required ? 1 : 0}">*</em> <em :style="{opacity: item.required ? 1 : 0}">*</em>
<i>{{ index + 1 }}.</i> <i>{{ index + 1 }}.</i>
<h2>{{ item.label }}</h2> <h2>{{ item.label }}</h2>
</div>
<image :src="`${$cdn}askform/sc1.png`" @click.stop="removeComponent(index)"
@touchstart.stop="removeComponent(index)"/>
</div>
<div class="components-item__filed">
<template v-if="(item.type === 'radio')">
<u-radio-group v-model="item.value" wrap>
<u-radio class="u-radio" disabled style="display: block;" v-for="(field, i) in item.options" :key="i">
<image :src="field.img[0].url" v-if="field.img.length"/>
<span>{{ field.label }}</span>
</u-radio>
</u-radio-group>
</template>
<template v-if="(item.type === 'checkbox')">
<u-checkbox-group v-model="item.value" wrap>
<u-checkbox class="u-checkbox" disabled :name="field.label" v-for="(field, i) in item.options" :key="i">
<image :src="field.img[0].url" v-if="field.img.length"/>
<span>{{ field.label }}</span>
</u-checkbox>
</u-checkbox-group>
</template>
<template v-if="(item.type === 'select')">
<div class="components-item__select">
<span>{{ item.placeholder }}</span>
<u-icon name="arrow-down" color="#DEDFDF"/>
</div> </div>
<image :src="`${$cdn}askform/sc1.png`" @click.stop="removeComponent(index)" </template>
@touchstart.stop="removeComponent(index)"/> <template v-if="(item.type === 'upload')">
</div> <div class="components-item__select components-item__textarea components-item__upload">
<div class="components-item__filed"> <image :src="`${$cdn}askform/upload.png`"/>
<template v-if="(item.type === 'radio')"> <span>选择图片（10M以内）</span>
<u-radio-group v-model="item.value" wrap> </div>
<u-radio class="u-radio" disabled style="display: block;" v-for="(field, i) in item.options" :key="i"> </template>
<image :src="field.img[0].url" v-if="field.img.length"/> <template v-if="(item.type === 'input')">
<span>{{ field.label }}</span> <div class="components-item__select">
</u-radio> <span>{{ item.placeholder }}</span>
</u-radio-group> </div>
</template> </template>
<template v-if="(item.type === 'checkbox')"> <template v-if="(item.type === 'textarea')">
<u-checkbox-group v-model="item.value" wrap> <div class="components-item__select components-item__textarea">
<u-checkbox class="u-checkbox" disabled :name="field.label" v-for="(field, i) in item.options" :key="i"> <span>{{ item.placeholder }}</span>
<image :src="field.img[0].url" v-if="field.img.length"/> </div>
<span>{{ field.label }}</span> </template>
</u-checkbox>
</u-checkbox-group>
</template>
<template v-if="(item.type === 'select')">
<div class="components-item__select">
<span>{{ item.placeholder }}</span>
<u-icon name="arrow-down" color="#DEDFDF"/>
</div>
</template>
<template v-if="(item.type === 'upload')">
<div class="components-item__select components-item__textarea components-item__upload">
<image :src="`${$cdn}askform/upload.png`"/>
<span>选择图片（10M以内）</span>
</div>
</template>
<template v-if="(item.type === 'input')">
<div class="components-item__select">
<span>{{ item.placeholder }}</span>
</div>
</template>
<template v-if="(item.type === 'textarea')">
<div class="components-item__select components-item__textarea">
<span>{{ item.placeholder }}</span>
</div>
</template>
</div>
</div> </div>
</draggable>
<div class="add-form__btn" @click="isShow = true">
<image :src="`${$cdn}askform/add.png`"/>
<span>添加问题</span>
</div> </div>
<div class="add-form__footer"> </draggable>
<div class="add-form__footer--item-wrapper"> <div class="add-form__btn" @click="isShow = true">
<div class="add-form__footer--item" @click="toPreview"> <image :src="`${$cdn}askform/add.png`"/>
<image :src="`${$cdn}sass/preview.png`"/> <span>添加问题</span>
<span>预览</span> </div>
</div> <div class="add-form__footer">
<div class="add-form__footer--item" @click="toSetting"> <div class="add-form__footer--item-wrapper">
<image :src="`${$cdn}sass/setting.png`"/> <div class="add-form__footer--item" @click="toPreview">
<span>设置</span> <image :src="`${$cdn}sass/preview.png`"/>
</div> <span>预览</span>
</div>
<div class="add-form__footer--item" @click="toSetting">
<image :src="`${$cdn}sass/setting.png`"/>
<span>设置</span>
</div> </div>
<div @click="onConfirm">立即发布</div>
</div> </div>
<u-popup v-model="isShow" :closeable="false" mode="bottom" @close="isShow = false"> <div @click="onConfirm">立即发布</div>
<div class="add-popup"> </div>
<div class="add-popup__title"> <u-popup v-model="isShow" :closeable="false" mode="bottom" @close="isShow = false">
<h2>添加问题</h2> <div class="add-popup">
<image :src="`${$cdn}askform/zk.png`" mode="aspectFit" @click="isShow = false"/> <div class="add-popup__title">
</div> <h2>添加问题</h2>
<div class="add-popup__list"> <image :src="`${$cdn}askform/zk.png`" mode="aspectFit" @click="isShow = false"/>
<span @click="toFiledSetting('radio')">单选题</span>
<span @click="toFiledSetting('checkbox')">多选题</span>
<span @click="toFiledSetting('select')">单下拉框</span>
<span @click="toFiledSetting('input')">单行填空</span>
<span @click="toFiledSetting('textarea')">多行填空</span>
<span @click="toFiledSetting('upload')">上传图片</span>
</div>
</div> </div>
</u-popup> <div class="add-popup__list">
<span @click="toFiledSetting('radio')">单选题</span>
</div> <span @click="toFiledSetting('checkbox')">多选题</span>
<div class="detail" v-if="isShowConfig"> <span @click="toFiledSetting('select')">单下拉框</span>
<component <span @click="toFiledSetting('input')">单行填空</span>
:is="component" <span @click="toFiledSetting('textarea')">多行填空</span>
:index="filedIndex" <span @click="toFiledSetting('upload')">上传图片</span>
:filed="filed" </div>
@change="onChange" </div>
:targetListData="targetList" </u-popup>
:formData="form"
:filedType="filedType"
@back="isShowConfig = false"
:id="id"
:formConfig="formConfig">
</component>
</div>
</div> </div>
</template> </template>
<script> <script>
import draggable from 'vuedraggable' import draggable from 'vuedraggable'
import FiledConfig from './FiledConfig' import qs from "query-string"
import FormSetting from '../FormSetting'
import PreviewForm from './PreviewForm'
export default { export default {
props: ['params'],
data() { data() {
return { return {
pageShow: false, pageShow: false,
isShowConfig: false,
form: { form: {
tableExplain: '详细描述', tableExplain: '详细描述',
title: '问卷调查', title: '问卷调查',
@@ -180,34 +158,23 @@ export default {
filedIndex: '', filedIndex: '',
isQuote: false, isQuote: false,
touchStart: 0, touchStart: 0,
component: '',
formConfig: {} formConfig: {}
} }
}, },
components: { components: {
draggable, draggable,
PreviewForm,
FormSetting,
FiledConfig
}, },
created() {
mounted() { let {type, isQuote, id} = this.$route.query
this.type = Number(this.params.type) this.type = type
this.isQuote = !!isQuote
if (this.params.isQuote) { if (id) {
this.isQuote = true this.id = id
} this.getInfo(id)
if (this.params.id) {
this.id = this.params.id
this.getInfo(this.params.id)
} else { } else {
this.pageShow = true this.pageShow = true
} }
this.init() this.init()
uni.$on('setting', res => { uni.$on('setting', res => {
this.form = { this.form = {
...this.form, ...this.form,
@@ -224,21 +191,15 @@ export default {
} }
}) })
}, },
methods: { methods: {
toSetting() { toSetting() {
this.component = 'FormSetting' let {formConfig} = this
this.isShowConfig = true uni.navigateTo({url: `./FormSetting?${qs.stringify({formConfig})}`})
}, },
back() { back() {
this.$emit('change', { uni.navigateBack({})
type: 'Tabbar'
})
}, },
onChange(e) { onChange(e) {
}, },
removeComponent(index) { removeComponent(index) {
@@ -246,8 +207,9 @@ export default {
}, },
toPreview() { toPreview() {
this.component = 'PreviewForm' let {form, targetList} = this
this.isShowConfig = true localStorage.setItem("toPreviewForm", JSON.stringify({form, targetList}))
uni.navigateTo({url: `./PreviewForm`})
}, },
upload() { upload() {
@@ -340,18 +302,15 @@ export default {
type: this.type, type: this.type,
templateType: 0 templateType: 0
}).then(res => { }).then(res => {
if (res.code == 0) { if (res?.code == 0) {
setTimeout(() => { uni.navigateTo({
this.$emit('change', { url: `./Result?${qs.stringify({
type: 'Result', linkUrl: res.data.linkUrl,
params: { title: this.form.title,
linkUrl: res.data.linkUrl, tableExplain: this.form.tableExplain,
title: this.form.title, headPicture: this.form.headPicture
tableExplain: this.form.tableExplain, })}`
headPicture: this.form.headPicture })
}
})
}, 600)
} }
}).catch(e => { }).catch(e => {
this.$u.toast(e) this.$u.toast(e)
@@ -377,7 +336,6 @@ export default {
} else { } else {
this.$u.toast(res.msg) this.$u.toast(res.msg)
} }
uni.hideLoading() uni.hideLoading()
}).catch(() => { }).catch(() => {
uni.hideLoading() uni.hideLoading()
@@ -389,16 +347,15 @@ export default {
if (index > -1) { if (index > -1) {
this.filed = type this.filed = type
this.filedIndex = index this.filedIndex = index
this.component = 'FiledConfig' let {filed, filedType} = this
this.isShowConfig = true localStorage.setItem("toFiledConfig", JSON.stringify({index, filed, filedType}))
} else {
return false this.filedIndex = ''
this.filedType = type
let {filed, filedType} = this
localStorage.setItem("toFiledConfig", JSON.stringify({filed, filedType}))
} }
uni.navigateTo({url: `./FiledConfig`})
this.filedIndex = ''
this.filedType = type
this.component = 'FiledConfig'
this.isShowConfig = true
}, },
init() { init() {

9
src/apps/AppAskForm/AppAskForm.vue
View File

@@ -1,13 +1,13 @@
<template> <template>
<div class="form"> <div class="form">
<component v-if="refresh" :is="component" @change="onChange" :params="params"/> <component ref="TabPage" :is="component" @change="onChange" :params="params"/>
</div> </div>
</template> </template>
<script> <script>
import Tabbar from './components/Tabbar.vue' import Tabbar from './components/Tabbar.vue'
import AddForm from './components/AddForm.vue' import AddForm from './AddForm.vue'
import Result from './components/Result.vue' import Result from './Result.vue'
import {mapActions} from "vuex"; import {mapActions} from "vuex";
export default { export default {
@@ -37,9 +37,8 @@ export default {
}, },
onShow() { onShow() {
document.title = "问卷表单" document.title = "问卷表单"
this.refresh = false this.$refs.TabPage?.show()
this.$nextTick(() => { this.$nextTick(() => {
this.refresh = true
this.injectJWeixin(['sendChatMessage', 'selectEnterpriseContact', 'shareAppMessage', 'shareWechatMessage']).then(() => { this.injectJWeixin(['sendChatMessage', 'selectEnterpriseContact', 'shareAppMessage', 'shareWechatMessage']).then(() => {
this.$dict.load(['questionnaireStatus', 'questionnaireType', 'questionnaireFieldType']) this.$dict.load(['questionnaireStatus', 'questionnaireType', 'questionnaireFieldType'])
}) })

30
src/apps/AppAskForm/components/FiledConfig.vue → src/apps/AppAskForm/FiledConfig.vue
View File

@@ -142,45 +142,35 @@
</template> </template>
<script> <script>
import {components} from './config' import {components} from './components/config'
export default { export default {
props: ['filed', 'index', 'filedType'],
data() { data() {
let params = localStorage.getItem("toFiledConfig")
params && (params = JSON.parse(params))
localStorage.removeItem("toFiledConfig")
return { return {
...params,
isShowType: false, isShowType: false,
isShowAnswer: false, isShowAnswer: false,
config: {}
} }
}, },
mounted() {
if (this.index !== '') {
this.config = this.filed
return false
}
console.log(components)
this.config = JSON.parse(JSON.stringify(components.filter(v => v.type === this.filedType)[0]))
},
computed: { computed: {
config() {
return !!this.index ? this.filed : JSON.parse(JSON.stringify(components.filter(v => v.type === this.filedType)[0]))
},
pointTypeName() { pointTypeName() {
if (!this.config.pointDict) return '' if (!this.config.pointDict) return ''
return this.config.pointDict.filter(v => v.dictValue === this.config.pointType)[0].dictName return this.config.pointDict.filter(v => v.dictValue === this.config.pointType)[0].dictName
}, },
defaultType() { defaultType() {
if (!this.config.pointType) return [0] if (!this.config.pointType) return [0]
return [Number(this.config.pointType)] return [Number(this.config.pointType)]
}, },
defaultAnswer() { defaultAnswer() {
if (!this.config.answer) return [0] if (!this.config.answer) return [0]
let index = 0 let index = 0
if (this.config.answer) { if (this.config.answer) {
this.config.options?.forEach((v, i) => { this.config.options?.forEach((v, i) => {
@@ -193,7 +183,6 @@ export default {
return [index] return [index]
} }
}, },
methods: { methods: {
answerChange(e) { answerChange(e) {
this.config.answer = e[0].label this.config.answer = e[0].label
@@ -266,7 +255,7 @@ export default {
}, },
back() { back() {
this.$emit('back') uni.navigateBack({})
}, },
confirm() { confirm() {
@@ -274,7 +263,6 @@ export default {
config: this.config, config: this.config,
index: this.index === '' ? '-1' : this.index index: this.index === '' ? '-1' : this.index
}) })
this.back() this.back()
}, },

14
src/apps/AppAskForm/components/PreviewForm.vue → src/apps/AppAskForm/PreviewForm.vue
View File

@@ -61,15 +61,16 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
props: ['formData', 'targetListData'],
data() { data() {
let params = localStorage.getItem("toPreviewForm")
params && (params = JSON.parse(params))
localStorage.removeItem("toPreviewForm")
return { return {
form: { form: {
tableExplain: '详细描述', tableExplain: '详细描述',
@@ -95,15 +96,10 @@ export default {
isShow: false, isShow: false,
type: 0, type: 0,
id: '', id: '',
touchStart: 0 touchStart: 0,
...params
} }
}, },
mounted() {
this.form = this.formData
this.targetList = this.targetListData
},
methods: { methods: {
getInfo(id) { getInfo(id) {
uni.showLoading() uni.showLoading()

15
src/apps/AppAskForm/components/Result.vue → src/apps/AppAskForm/Result.vue
View File

@@ -33,14 +33,16 @@ import {mapActions} from 'vuex'
export default { export default {
name: 'Result', name: 'Result',
props: ['params'], computed: {
params() {
return this.$route.query || {}
}
},
mounted() { mounted() {
this.injectJWeixin(['sendChatMessage', 'selectEnterpriseContact']) this.injectJWeixin(['sendChatMessage', 'selectEnterpriseContact'])
}, },
methods: { methods: {
...mapActions(['injectJWeixin', 'wxInvoke']), ...mapActions(['injectJWeixin', 'wxInvoke']),
copy() { copy() {
let oInput = document.createElement('input') let oInput = document.createElement('input')
oInput.value = this.params.linkUrl oInput.value = this.params.linkUrl
@@ -50,7 +52,6 @@ export default {
this.$u.toast('已复制') this.$u.toast('已复制')
oInput.remove() oInput.remove()
}, },
share() { share() {
this.injectJWeixin(['shareAppMessage', 'shareWechatMessage']).then(() => { this.injectJWeixin(['shareAppMessage', 'shareWechatMessage']).then(() => {
this.wxInvoke(['shareAppMessage', { this.wxInvoke(['shareAppMessage', {
@@ -61,7 +62,6 @@ export default {
}]) }])
}) })
}, },
shareWechat() { shareWechat() {
this.injectJWeixin(['shareAppMessage', 'shareWechatMessage']).then(() => { this.injectJWeixin(['shareAppMessage', 'shareWechatMessage']).then(() => {
this.wxInvoke(['shareWechatMessage', { this.wxInvoke(['shareWechatMessage', {
@@ -72,11 +72,8 @@ export default {
}]) }])
}) })
}, },
confirm() { confirm() {
this.$emit('change', { uni.navigateBack({})
type: 'Tabbar'
})
} }
}, },
onShow() { onShow() {

24
src/apps/AppAskForm/components/AddList.vue
View File

@@ -26,6 +26,8 @@
</template> </template>
<script> <script>
import qs from "query-string"
export default { export default {
name: 'addList', name: 'addList',
label: '新建项目', label: '新建项目',
@@ -47,30 +49,16 @@ export default {
} }
}, },
mounted() { created() {
this.getList() this.getList()
}, },
methods: { methods: {
toAdd(type) { toAdd(type) {
this.$emit('change', { uni.navigateTo({url: `./AddForm?${qs.stringify({type})}`})
type: 'AddForm',
params: {
type
}
})
}, },
quote(id) { quote(id) {
this.$emit('change', { uni.navigateTo({url: `./AddForm?${qs.stringify({id, isQuote: 1})}`})
type: 'AddForm',
params: {
id,
isQuote: 1
}
})
}, },
getList() { getList() {
this.$http.post(`/app/appquestionnairetemplate/list`, null, { this.$http.post(`/app/appquestionnairetemplate/list`, null, {
params: { params: {
@@ -79,7 +67,7 @@ export default {
size: 10000 size: 10000
} }
}).then(res => { }).then(res => {
if (res.code == 0) { if (res?.code == 0) {
this.list = res.data.records this.list = res.data.records
} }
}) })

8
src/apps/AppAskForm/components/Tabbar.vue
View File

@@ -42,6 +42,14 @@ export default {
methods: { methods: {
onChange(e) { onChange(e) {
this.$emit('change', e) this.$emit('change', e)
},
show() {
if (this.currIndex == 0) {
this.currIndex = -1
this.$nextTick(() => {
this.currIndex = 0
})
}
} }
}, },
onReachBottom() { onReachBottom() {