jiangyy 4 years ago
parent
commit
d7829676b0
  1. 146
      src/components/parser/Parser.vue
  2. 2
      src/views/form/editor/RightPanel.vue
  3. 8
      src/views/form/index.vue
  4. 14
      src/views/form/publish/index.vue

146
src/components/parser/Parser.vue

@ -1,6 +1,6 @@
<script>
import {deepClone} from '@/utils/index'
import {evalExpression} from '@/utils/expression'
import { deepClone } from '@/utils/index'
import { evalExpression } from '@/utils/expression'
import render from '@/components/render/render.js'
import _ from 'lodash'
@ -24,10 +24,10 @@ const processType = {
}
const layouts = {
colFormItem(h, scheme) {
colFormItem (h, scheme) {
const config = scheme.__config__
const listeners = buildListeners.call(this, scheme)
const {formConfCopy} = this
const { formConfCopy } = this
let labelWidth = config.labelWidth ? `${config.labelWidth}px` : null
if (config.showLabel === false) labelWidth = '0'
let label = config.label
@ -48,12 +48,12 @@ const layouts = {
<el-col span={config.span} style={colStyle} cid={cidAttr}>
<el-form-item label-width={labelWidth} prop={scheme.__vModel__}
label={config.showLabel ? label : ''}>
<render conf={scheme} {...{on: listeners}} />
<render conf={scheme} {...{ on: listeners }} />
</el-form-item>
</el-col>
)
},
rowFormItem(h, scheme) {
rowFormItem (h, scheme) {
let child = renderChildren.apply(this, arguments)
if (scheme.type === 'flex') {
child = <el-row type={scheme.type} justify={scheme.justify} align={scheme.align}>
@ -70,8 +70,8 @@ const layouts = {
}
}
function renderFrom(h) {
const {formConfCopy} = this
function renderFrom (h) {
const { formConfCopy } = this
return (
<el-row gutter={formConfCopy.gutter}>
@ -82,7 +82,7 @@ function renderFrom(h) {
label-width={`${formConfCopy.labelWidth}px`}
ref={formConfCopy.formRef}
// model https://github.com/vuejs/jsx/issues/49#issuecomment-472013664
props={{model: this[formConfCopy.formModel]}}
props={{ model: this[formConfCopy.formModel] }}
rules={this[formConfCopy.formRules]}
>
{renderFormItem.call(this, h, formConfCopy.fields)}
@ -93,8 +93,8 @@ function renderFrom(h) {
}
// eslint-disable-next-line no-unused-vars
function formBtns(h) {
const {formConfCopy} = this
function formBtns (h) {
const { formConfCopy } = this
let style = {
'background-color': formConfCopy.submitBtnColor,
'border-color': formConfCopy.submitBtnColor
@ -127,7 +127,7 @@ function formBtns(h) {
}
function renderFormItem(h, elementList) {
function renderFormItem (h, elementList) {
return elementList.map(scheme => {
const config = scheme.__config__
const layout = layouts[config.layout]
@ -139,34 +139,34 @@ function renderFormItem(h, elementList) {
})
}
function renderChildren(h, scheme) {
function renderChildren (h, scheme) {
const config = scheme.__config__
if (!Array.isArray(config.children)) return null
return renderFormItem.call(this, h, config.children)
}
function setUpload(config, scheme, response, file) {
function setUpload (config, scheme, response, file) {
let newValue = JSON.parse(this[this.formConf.formModel][scheme.__vModel__])
if (!newValue) {
newValue = []
}
newValue.push({fileName: file.name, url: response.data})
newValue.push({ fileName: file.name, url: response.data })
this.$set(config, 'defaultValue', newValue)
this.$set(this[this.formConf.formModel], scheme.__vModel__, newValue)
setValueLabel.call(this, {type: 'file', files: newValue}, config, scheme)
setValueLabel.call(this, { type: 'file', files: newValue }, config, scheme)
}
function deleteUpload(config, scheme, file, fileList) {
function deleteUpload (config, scheme, file, fileList) {
let newValue = []
fileList.forEach(element => {
newValue.push({fileName: element.name, url: element.url})
newValue.push({ fileName: element.name, url: element.url })
})
this.$set(config, 'defaultValue', newValue)
this.$set(this[this.formConf.formModel], scheme.__vModel__, newValue)
setValueLabel.call(this, {type: 'file', files: newValue}, config, scheme)
setValueLabel.call(this, { type: 'file', files: newValue }, config, scheme)
}
function setValue(event, config, scheme) {
function setValue (event, config, scheme) {
this.$set(config, 'defaultValue', event)
this.$set(this[this.formConf.formModel], scheme.__vModel__, event)
setValueLabel.call(this, event, config, scheme)
@ -186,7 +186,7 @@ function setValue(event, config, scheme) {
console.log(this.logicTriggerItemList)
document.querySelector(`div[cid="${r.triggerFormItemId}"]`).style.display = ''
} else {
_.remove(this.logicTriggerItemList, function(n) {
_.remove(this.logicTriggerItemList, function (n) {
return n == r.triggerFormItemId
})
document.querySelector(`div[cid="${r.triggerFormItemId}"]`).style.display = 'none'
@ -198,21 +198,21 @@ function setValue(event, config, scheme) {
/**
* 分页下一页
*/
function nextPage(page) {
function nextPage (page) {
switchPage.call(this, 'next', page)
}
/**
* 分页上一页
*/
function prevPage(page) {
function prevPage (page) {
switchPage.call(this, 'prev', page)
}
/**
* 切换页
*/
function switchPage(eventName, page) {
function switchPage (eventName, page) {
this.$refs[this.formConf.formRef].validate(valid => {
if (!valid) {
setTimeout(() => {
@ -234,7 +234,8 @@ function switchPage(eventName, page) {
/**
* radio checkbox 其他输入框值处理
*/
function setOtherValueLabel(event, config) {
function setOtherValueLabel (event, config) {
let value = this[this.formConf.formModel][config.__vModel__]
//
this.$nextTick(() => {
@ -253,35 +254,68 @@ function setOtherValueLabel(event, config) {
* @param config
* @param scheme
*/
function setValueLabel(event, config, scheme) {
function setValueLabel (event, config, scheme) {
console.log(event)
console.log(config)
console.log(scheme)
// input
let tagOptionKey = processType[config.tag]
if (tagOptionKey) {
if (event instanceof Array) {
//
let labelArr = new Array()
if (!event.includes(0)) {
if (!event.includes(0) && config.tag != 'el-cascader') {
// other
this.$set(this[this.formConf.labelFormModel], `${scheme.__vModel__}other`, '')
//
document.querySelector('.' + config.tag).querySelector('.item-other-input').value = ''
}
// debugger
if (config.tag === 'el-cascader') {
let labelFormModelArray = []
if (scheme.props.props.multiple) {//
event.forEach(item => {
let itemObj = getCascaderData(item, tagOptionKey, scheme)
labelFormModelArray.push(itemObj)
})
} else {//
let itemObj = getCascaderData(event, tagOptionKey, scheme)
labelFormModelArray.push(itemObj)
}
this.$set(this[this.formConf.labelFormModel], scheme.__vModel__, labelFormModelArray)
} else {
let labelArr = new Array()
event.forEach(item => {
//
let {label} = getObject(_.get(scheme, tagOptionKey), 'value', item)
let { label } = getObject(_.get(scheme, tagOptionKey), 'value', item)
labelArr.push(label)
})
this.$set(this[this.formConf.labelFormModel], scheme.__vModel__, labelArr.join(','))
}
console.log('最终结果')
console.log(this[this.formConf.labelFormModel])
} else {
//
if (event == 0) {
console.log(this[this.formConf.labelFormModel][`${scheme.__vModel__}other`])
// labelfieldfieldother
let item = _.find(_.get(scheme, tagOptionKey), {'value': event})
let item = _.find(_.get(scheme, tagOptionKey), { 'value': event })
this.$set(this[this.formConf.labelFormModel], scheme.__vModel__, item.label)
this.$set(this[this.formConf.labelFormModel], `${scheme.__vModel__}other`, this[this.formConf.labelFormModel][`${scheme.__vModel__}other`])
} else {
let item = _.find(_.get(scheme, tagOptionKey), {'value': event})
let item = _.find(_.get(scheme, tagOptionKey), { 'value': event })
this.$set(this[this.formConf.labelFormModel], scheme.__vModel__, item.label)
// other
this.$set(this[this.formConf.labelFormModel], `${scheme.__vModel__}other`, '')
@ -296,19 +330,43 @@ function setValueLabel(event, config, scheme) {
}
}
function getObject(array, key, value) {
function getCascaderData (array, tagOptionKey, scheme) {
let labelArr = new Array()
array.forEach(item => {
//
let { label } = getObject(_.get(scheme, tagOptionKey), 'value', item)
labelArr.push(label)
})
const item = array[array.length - 1]
let itemObj = getObject(_.get(scheme, tagOptionKey), 'value', item)
itemObj.labels = labelArr
itemObj.pathName = labelArr.join(scheme.separator)
return itemObj
}
function getObject (array, key, value) {
let o
array.some(function iter(a) {
array.some(function iter (a) {
if (a[key].isArray) {
this.getObject(a[key], key, value)
} else {
if (a[key] === value) {
o = a
return true
}
return Array.isArray(a.children) && a.children.some(iter)
}
})
return o
}
function buildListeners(scheme) {
function buildListeners (scheme) {
const config = scheme.__config__
const methods = this.formConf.__methods__ || {}
const listeners = {}
@ -345,7 +403,7 @@ export default {
required: false
}
},
data() {
data () {
const data = {
formConfCopy: deepClone(this.formConf),
[this.formConf.formModel]: deepClone(this.formModel),
@ -360,7 +418,7 @@ export default {
return data
},
methods: {
initLabelFormData(componentList, formData) {
initLabelFormData (componentList, formData) {
//
componentList.forEach(cur => {
let temConfig = cur.__config__
@ -380,7 +438,7 @@ export default {
})
formData[cur.__vModel__] = labelStr
} else {
let {label} = _.find(_.get(cur, tagOptionKey), {'value': defaultValue})
let { label } = _.find(_.get(cur, tagOptionKey), { 'value': defaultValue })
formData[cur.__vModel__] = label
}
}
@ -388,7 +446,7 @@ export default {
if (temConfig.children) this.initLabelFormData(temConfig.children, formData)
})
},
initFormData(componentList, formData) {
initFormData (componentList, formData) {
//
componentList.forEach(cur => {
const config = cur.__config__
@ -399,7 +457,7 @@ export default {
if (config.children) this.initFormData(config.children, formData)
})
},
buildRules(componentList, rules) {
buildRules (componentList, rules) {
componentList.forEach(cur => {
//
let triggerShow = _.indexOf(this.logicTriggerItemList, cur.formItemId) > -1
@ -431,11 +489,11 @@ export default {
if (Array.isArray(config.regList)) {
//
if (['RADIO', 'CHECKBOX'].includes(cur.typeId)) {
const required = {validator: validateOtherInput, message: cur.placeholder}
const required = { validator: validateOtherInput, message: cur.placeholder }
config.regList.push(required)
}
if (config.required) {
const required = {required: config.required, message: cur.placeholder}
const required = { required: config.required, message: cur.placeholder }
if (Array.isArray(config.defaultValue)) {
required.type = 'array'
required.message = `请至少选择一个${config.label}`
@ -452,11 +510,11 @@ export default {
if (config.children) this.buildRules(config.children, rules)
})
},
resetForm() {
resetForm () {
this.formConfCopy = deepClone(this.formConf)
this.$refs[this.formConf.formRef].resetFields()
},
submitForm() {
submitForm () {
this.$refs[this.formConf.formRef].validate(valid => {
if (!valid) {
//
@ -478,7 +536,7 @@ export default {
})
}
},
render(h) {
render (h) {
return renderFrom.call(this, h)
}
}

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

@ -1256,7 +1256,7 @@ export default {
children.splice(index, 1);
},
addNode (data) {
debugger
data.pid = this.currentPID
this.currentNode.push(data);
},

8
src/views/form/index.vue

@ -18,7 +18,7 @@
<el-menu :collapse="isCollapse"
:default-active="defaultActiveMenu"
class="el-menu-vertical">
<el-menu-item v-for="menuItem in (publishStatus? menuItemList2:menuItemList)"
<el-menu-item v-for="menuItem in (menuItemList)"
:key="menuItem.key"
:index="menuItem.route"
@click="menuSelectHandle(menuItem.route,menuItem.key)">
@ -121,6 +121,12 @@ export default {
icon: 'el-icon-data-line',
route: '/project/form/statistics'
},
{
key: 'publish',
title: '发布',
icon: 'el-icon-video-play',
route: '/project/form/publish'
},
{
key: 'preview',
title: '预览',

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

@ -21,7 +21,7 @@
:props="props"
:data="data"
show-checkbox
:default-expand-all="true" />
:default-expand-all="false" />
</el-form-item>
</el-form>
</div>
@ -186,7 +186,7 @@ export default {
agencyId: customerId
}
this.$api.post(`/data/aggregator/org/agencytree`, params).then((res) => {
debugger
this.data = res.data
})
},
@ -240,6 +240,16 @@ export default {
})
},
publishProject () {
this.resolveAgency()
if (this.selAgencyList.length === 0) {
this.$message(
{
message: "请选择发布范围",
type: 'warning'
}
)
return false
}
this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/publish`, { key: this.projectKey }).then(() => {
this.publishStatus = true

Loading…
Cancel
Save