Commit a29201a2 authored by 稚屿's avatar 稚屿
Browse files

修正单词拼写错误

parent 612c4293
export default [ export default [
{ {
layout: 'colFormItem', layout: 'colFormItem',
tagIcon: 'input', tagIcon: 'input',
label: '手机号', label: '手机号',
vModel: 'mobile', vModel: 'mobile',
formId: 6, formId: 6,
tag: 'el-input', tag: 'el-input',
placeholder: '请输入手机号', placeholder: '请输入手机号',
defaultValue: '', defaultValue: '',
span: 24, span: 24,
style: { width: '100%' }, style: { width: '100%' },
clearable: true, clearable: true,
prepend: '', prepend: '',
append: '', append: '',
'prefix-icon': 'el-icon-mobile', 'prefix-icon': 'el-icon-mobile',
'suffix-icon': '', 'suffix-icon': '',
maxlength: 11, maxlength: 11,
'show-word-limit': true, 'show-word-limit': true,
readonly: false, readonly: false,
disabled: false, disabled: false,
required: true, required: true,
changeTag: true, changeTag: true,
regList: [{ regList: [{
pattern: '/^1(3|4|5|7|8|9)\\d{9}$/', pattern: '/^1(3|4|5|7|8|9)\\d{9}$/',
message: '手机号格式错误' message: '手机号格式错误'
}] }]
} }
] ]
This diff is collapsed.
import { isArray } from 'util' import { isArray } from 'util'
import { exportDefault, titleCase } from '@/utils/index' import { exportDefault, titleCase } from '@/utils/index'
import { trigger } from './config' import { trigger } from './config'
const units = { const units = {
KB: '1024', KB: '1024',
MB: '1024 / 1024', MB: '1024 / 1024',
GB: '1024 / 1024 / 1024' GB: '1024 / 1024 / 1024'
} }
let confGlobal let confGlobal
const inheritAttrs = { const inheritAttrs = {
file: '', file: '',
dialog: 'inheritAttrs: false,' dialog: 'inheritAttrs: false,'
} }
export function makeUpJs(conf, type) { export function makeUpJs(conf, type) {
confGlobal = conf = JSON.parse(JSON.stringify(conf)) confGlobal = conf = JSON.parse(JSON.stringify(conf))
const dataList = [] const dataList = []
const ruleList = [] const ruleList = []
const optionsList = [] const optionsList = []
const propsList = [] const propsList = []
const methodList = mixinMethod(type) const methodList = mixinMethod(type)
const uploadVarList = [] const uploadVarList = []
conf.fields.forEach(el => { conf.fields.forEach(el => {
buildAttributes(el, dataList, ruleList, optionsList, methodList, propsList, uploadVarList) buildAttributes(el, dataList, ruleList, optionsList, methodList, propsList, uploadVarList)
}) })
const script = buildexport( const script = buildexport(
conf, conf,
type, type,
dataList.join('\n'), dataList.join('\n'),
ruleList.join('\n'), ruleList.join('\n'),
optionsList.join('\n'), optionsList.join('\n'),
uploadVarList.join('\n'), uploadVarList.join('\n'),
propsList.join('\n'), propsList.join('\n'),
methodList.join('\n') methodList.join('\n')
) )
confGlobal = null confGlobal = null
return script return script
} }
function buildAttributes(el, dataList, ruleList, optionsList, methodList, propsList, uploadVarList) { function buildAttributes(el, dataList, ruleList, optionsList, methodList, propsList, uploadVarList) {
buildData(el, dataList) buildData(el, dataList)
buildRules(el, ruleList) buildRules(el, ruleList)
if (el.options && el.options.length) { if (el.options && el.options.length) {
buildOptions(el, optionsList) buildOptions(el, optionsList)
if (el.dataType === 'dynamic') { if (el.dataType === 'dynamic') {
const model = `${el.vModel}Options` const model = `${el.vModel}Options`
const options = titleCase(model) const options = titleCase(model)
buildOptionMethod(`get${options}`, model, methodList) buildOptionMethod(`get${options}`, model, methodList)
} }
} }
if (el.props && el.props.props) { if (el.props && el.props.props) {
buildProps(el, propsList) buildProps(el, propsList)
} }
if (el.action && el.tag === 'el-upload') { if (el.action && el.tag === 'el-upload') {
uploadVarList.push( uploadVarList.push(
`${el.vModel}Action: '${el.action}', `${el.vModel}Action: '${el.action}',
${el.vModel}fileList: [],` ${el.vModel}fileList: [],`
) )
methodList.push(buildBeforeUpload(el)) methodList.push(buildBeforeUpload(el))
if (!el['auto-upload']) { if (!el['auto-upload']) {
methodList.push(buildSubmitUpload(el)) methodList.push(buildSubmitUpload(el))
} }
} }
if (el.children) { if (el.children) {
el.children.forEach(el2 => { el.children.forEach(el2 => {
buildAttributes(el2, dataList, ruleList, optionsList, methodList, propsList, uploadVarList) buildAttributes(el2, dataList, ruleList, optionsList, methodList, propsList, uploadVarList)
}) })
} }
} }
function mixinMethod(type) { function mixinMethod(type) {
const list = []; const const list = []; const
minxins = { minxins = {
file: confGlobal.formBtns ? { file: confGlobal.formBtns ? {
submitForm: `submitForm() { submitForm: `submitForm() {
this.$refs['${confGlobal.formRef}'].validate(valid => { this.$refs['${confGlobal.formRef}'].validate(valid => {
if(!valid) return if(!valid) return
// TODO 提交表单 // TODO 提交表单
}) })
},`, },`,
resetForm: `resetForm() { resetForm: `resetForm() {
this.$refs['${confGlobal.formRef}'].resetFields() this.$refs['${confGlobal.formRef}'].resetFields()
},` },`
} : null, } : null,
dialog: { dialog: {
onOpen: 'onOpen() {},', onOpen: 'onOpen() {},',
onClose: `onClose() { onClose: `onClose() {
this.$refs['${confGlobal.formRef}'].resetFields() this.$refs['${confGlobal.formRef}'].resetFields()
},`, },`,
close: `close() { close: `close() {
this.$emit('update:visible', false) this.$emit('update:visible', false)
},`, },`,
handelConfirm: `handelConfirm() { handleConfirm: `handleConfirm() {
this.$refs['${confGlobal.formRef}'].validate(valid => { this.$refs['${confGlobal.formRef}'].validate(valid => {
if(!valid) return if(!valid) return
this.close() this.close()
}) })
},` },`
} }
} }
const methods = minxins[type] const methods = minxins[type]
if (methods) { if (methods) {
Object.keys(methods).forEach(key => { Object.keys(methods).forEach(key => {
list.push(methods[key]) list.push(methods[key])
}) })
} }
return list return list
} }
function buildData(conf, dataList) { function buildData(conf, dataList) {
if (conf.vModel === undefined) return if (conf.vModel === undefined) return
let defaultValue let defaultValue
if (typeof (conf.defaultValue) === 'string' && !conf.multiple) { if (typeof (conf.defaultValue) === 'string' && !conf.multiple) {
defaultValue = `'${conf.defaultValue}'` defaultValue = `'${conf.defaultValue}'`
} else { } else {
defaultValue = `${JSON.stringify(conf.defaultValue)}` defaultValue = `${JSON.stringify(conf.defaultValue)}`
} }
dataList.push(`${conf.vModel}: ${defaultValue},`) dataList.push(`${conf.vModel}: ${defaultValue},`)
} }
function buildRules(conf, ruleList) { function buildRules(conf, ruleList) {
if (conf.vModel === undefined) return if (conf.vModel === undefined) return
const rules = [] const rules = []
if (trigger[conf.tag]) { if (trigger[conf.tag]) {
if (conf.required) { if (conf.required) {
const type = isArray(conf.defaultValue) ? 'type: \'array\',' : '' const type = isArray(conf.defaultValue) ? 'type: \'array\',' : ''
let message = isArray(conf.defaultValue) ? `请至少选择一个${conf.vModel}` : conf.placeholder let message = isArray(conf.defaultValue) ? `请至少选择一个${conf.vModel}` : conf.placeholder
if (message === undefined) message = `${conf.label}不能为空` if (message === undefined) message = `${conf.label}不能为空`
rules.push(`{ required: true, ${type} message: '${message}', trigger: '${trigger[conf.tag]}' }`) rules.push(`{ required: true, ${type} message: '${message}', trigger: '${trigger[conf.tag]}' }`)
} }
if (conf.regList && isArray(conf.regList)) { if (conf.regList && isArray(conf.regList)) {
conf.regList.forEach(item => { conf.regList.forEach(item => {
if (item.pattern) { if (item.pattern) {
rules.push(`{ pattern: ${eval(item.pattern)}, message: '${item.message}', trigger: '${trigger[conf.tag]}' }`) rules.push(`{ pattern: ${eval(item.pattern)}, message: '${item.message}', trigger: '${trigger[conf.tag]}' }`)
} }
}) })
} }
ruleList.push(`${conf.vModel}: [${rules.join(',')}],`) ruleList.push(`${conf.vModel}: [${rules.join(',')}],`)
} }
} }
function buildOptions(conf, optionsList) { function buildOptions(conf, optionsList) {
if (conf.vModel === undefined) return if (conf.vModel === undefined) return
if (conf.dataType === 'dynamic') { conf.options = [] } if (conf.dataType === 'dynamic') { conf.options = [] }
const str = `${conf.vModel}Options: ${JSON.stringify(conf.options)},` const str = `${conf.vModel}Options: ${JSON.stringify(conf.options)},`
optionsList.push(str) optionsList.push(str)
} }
function buildProps(conf, propsList) { function buildProps(conf, propsList) {
if (conf.dataType === 'dynamic') { if (conf.dataType === 'dynamic') {
conf.valueKey !== 'value' && (conf.props.props.value = conf.valueKey) conf.valueKey !== 'value' && (conf.props.props.value = conf.valueKey)
conf.labelKey !== 'label' && (conf.props.props.label = conf.labelKey) conf.labelKey !== 'label' && (conf.props.props.label = conf.labelKey)
conf.childrenKey !== 'children' && (conf.props.props.children = conf.childrenKey) conf.childrenKey !== 'children' && (conf.props.props.children = conf.childrenKey)
} }
const str = `${conf.vModel}Props: ${JSON.stringify(conf.props.props)},` const str = `${conf.vModel}Props: ${JSON.stringify(conf.props.props)},`
propsList.push(str) propsList.push(str)
} }
function buildBeforeUpload(conf) { function buildBeforeUpload(conf) {
const unitNum = units[conf.sizeUnit]; let rightSizeCode = ''; let acceptCode = ''; const const unitNum = units[conf.sizeUnit]; let rightSizeCode = ''; let acceptCode = ''; const
returnList = [] returnList = []
if (conf.fileSize) { if (conf.fileSize) {
rightSizeCode = `let isRightSize = file.size / ${unitNum} < ${conf.fileSize} rightSizeCode = `let isRightSize = file.size / ${unitNum} < ${conf.fileSize}
if(!isRightSize){ if(!isRightSize){
this.$message.error('文件大小超过 ${conf.fileSize}${conf.sizeUnit}') this.$message.error('文件大小超过 ${conf.fileSize}${conf.sizeUnit}')
}` }`
returnList.push('isRightSize') returnList.push('isRightSize')
} }
if (conf.accept) { if (conf.accept) {
acceptCode = `let isAccept = new RegExp('${conf.accept}').test(file.type) acceptCode = `let isAccept = new RegExp('${conf.accept}').test(file.type)
if(!isAccept){ if(!isAccept){
this.$message.error('应该选择${conf.accept}类型的文件') this.$message.error('应该选择${conf.accept}类型的文件')
}` }`
returnList.push('isAccept') returnList.push('isAccept')
} }
const str = `${conf.vModel}BeforeUpload(file) { const str = `${conf.vModel}BeforeUpload(file) {
${rightSizeCode} ${rightSizeCode}
${acceptCode} ${acceptCode}
return ${returnList.join('&&')} return ${returnList.join('&&')}
},` },`
return returnList.length ? str : '' return returnList.length ? str : ''
} }
function buildSubmitUpload(conf) { function buildSubmitUpload(conf) {
const str = `submitUpload() { const str = `submitUpload() {
this.$refs['${conf.vModel}'].submit() this.$refs['${conf.vModel}'].submit()
},` },`
return str return str
} }
function buildOptionMethod(methodName, model, methodList) { function buildOptionMethod(methodName, model, methodList) {
const str = `${methodName}() { const str = `${methodName}() {
// TODO 发起请求获取数据 // TODO 发起请求获取数据
this.${model} this.${model}
},` },`
methodList.push(str) methodList.push(str)
} }
function buildexport(conf, type, data, rules, selectOptions, uploadVar, props, methods) { function buildexport(conf, type, data, rules, selectOptions, uploadVar, props, methods) {
const str = `${exportDefault}{ const str = `${exportDefault}{
${inheritAttrs[type]} ${inheritAttrs[type]}
components: {}, components: {},
props: [], props: [],
data () { data () {
return { return {
${conf.formModel}: { ${conf.formModel}: {
${data} ${data}
}, },
${conf.formRules}: { ${conf.formRules}: {
${rules} ${rules}
}, },
${uploadVar} ${uploadVar}
${selectOptions} ${selectOptions}
${props} ${props}
} }
}, },
computed: {}, computed: {},
watch: {}, watch: {},
created () {}, created () {},
mounted () {}, mounted () {},
methods: { methods: {
${methods} ${methods}
} }
}` }`
return str return str
} }
<template> <template>
<div> <div>
<el-dialog <el-dialog
v-bind="$attrs" v-bind="$attrs"
width="500px" width="500px"
:close-on-click-modal="false" :close-on-click-modal="false"
:modal-append-to-body="false" :modal-append-to-body="false"
v-on="$listeners" v-on="$listeners"
@open="onOpen" @open="onOpen"
@close="onClose" @close="onClose"
> >
<el-row :gutter="15"> <el-row :gutter="15">
<el-form <el-form
ref="elForm" ref="elForm"
:model="formData" :model="formData"
:rules="rules" :rules="rules"
size="medium" size="medium"
label-width="100px" label-width="100px"
> >
<el-col :span="24"> <el-col :span="24">
<el-form-item label="生成类型" prop="type"> <el-form-item label="生成类型" prop="type">
<el-radio-group v-model="formData.type"> <el-radio-group v-model="formData.type">
<el-radio-button <el-radio-button
v-for="(item, index) in typeOptions" v-for="(item, index) in typeOptions"
:key="index" :key="index"
:label="item.value" :label="item.value"
:disabled="item.disabled" :disabled="item.disabled"
> >
{{ item.label }} {{ item.label }}
</el-radio-button> </el-radio-button>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item v-if="showFileName" label="文件名" prop="fileName"> <el-form-item v-if="showFileName" label="文件名" prop="fileName">
<el-input v-model="formData.fileName" placeholder="请输入文件名" clearable /> <el-input v-model="formData.fileName" placeholder="请输入文件名" clearable />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form> </el-form>
</el-row> </el-row>
<div slot="footer"> <div slot="footer">
<el-button @click="close"> <el-button @click="close">
取消 取消
</el-button> </el-button>
<el-button type="primary" @click="handelConfirm"> <el-button type="primary" @click="handleConfirm">
确定 确定
</el-button> </el-button>
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
inheritAttrs: false, inheritAttrs: false,
props: ['showFileName'], props: ['showFileName'],
data() { data() {
return { return {
formData: { formData: {
fileName: undefined, fileName: undefined,
type: 'file' type: 'file'
}, },
rules: { rules: {
fileName: [{ fileName: [{
required: true, required: true,
message: '请输入文件名', message: '请输入文件名',
trigger: 'blur' trigger: 'blur'
}], }],
type: [{ type: [{
required: true, required: true,
message: '生成类型不能为空', message: '生成类型不能为空',
trigger: 'change' trigger: 'change'
}] }]
}, },
typeOptions: [{ typeOptions: [{
label: '页面', label: '页面',
value: 'file' value: 'file'
}, { }, {
label: '弹窗', label: '弹窗',
value: 'dialog' value: 'dialog'
}] }]
} }
}, },
computed: { computed: {
}, },
watch: {}, watch: {},
mounted() {}, mounted() {},
methods: { methods: {
onOpen() { onOpen() {
if (this.showFileName) { if (this.showFileName) {
this.formData.fileName = `${+new Date()}.vue` this.formData.fileName = `${+new Date()}.vue`
} }
}, },
onClose() { onClose() {
}, },
close(e) { close(e) {
this.$emit('update:visible', false) this.$emit('update:visible', false)
}, },
handelConfirm() { handleConfirm() {
this.$refs.elForm.validate(valid => { this.$refs.elForm.validate(valid => {
if (!valid) return if (!valid) return
this.$emit('confirm', { ...this.formData }) this.$emit('confirm', { ...this.formData })
this.close() this.close()
}) })
} }
} }
} }
</script> </script>
<template> <template>
<div> <div>
<el-dialog <el-dialog
v-bind="$attrs" v-bind="$attrs"
:close-on-click-modal="false" :close-on-click-modal="false"
:modal-append-to-body="false" :modal-append-to-body="false"
v-on="$listeners" v-on="$listeners"
@open="onOpen" @open="onOpen"
@close="onClose" @close="onClose"
> >
<el-row :gutter="0"> <el-row :gutter="0">
<el-form <el-form
ref="elForm" ref="elForm"
:model="formData" :model="formData"
:rules="rules" :rules="rules"
size="small" size="small"
label-width="100px" label-width="100px"
> >
<el-col :span="24"> <el-col :span="24">
<el-form-item <el-form-item
label="选项名" label="选项名"
prop="label" prop="label"
> >
<el-input <el-input
v-model="formData.label" v-model="formData.label"
placeholder="请输入选项名" placeholder="请输入选项名"
clearable clearable
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24"> <el-col :span="24">
<el-form-item <el-form-item
label="选项值" label="选项值"
prop="value" prop="value"
> >
<el-input <el-input
v-model="formData.value" v-model="formData.value"
placeholder="请输入选项值" placeholder="请输入选项值"
clearable clearable
> >
<el-select <el-select
slot="append" slot="append"
v-model="dataType" v-model="dataType"
:style="{width: '100px'}" :style="{width: '100px'}"
> >
<el-option <el-option
v-for="(item, index) in dataTypeOptions" v-for="(item, index) in dataTypeOptions"
:key="index" :key="index"
:label="item.label" :label="item.label"
:value="item.value" :value="item.value"
:disabled="item.disabled" :disabled="item.disabled"
/> />
</el-select> </el-select>
</el-input> </el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form> </el-form>
</el-row> </el-row>
<div slot="footer"> <div slot="footer">
<el-button <el-button
type="primary" type="primary"
@click="handelConfirm" @click="handleConfirm"
> >
确定 确定
</el-button> </el-button>
<el-button @click="close"> <el-button @click="close">
取消 取消
</el-button> </el-button>
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { isNumberStr } from '@/utils/index' import { isNumberStr } from '@/utils/index'
export default { export default {
components: {}, components: {},
inheritAttrs: false, inheritAttrs: false,
props: [], props: [],
data() { data() {
return { return {
id: 100, id: 100,
formData: { formData: {
label: undefined, label: undefined,
value: undefined value: undefined
}, },
rules: { rules: {
label: [ label: [
{ {
required: true, required: true,
message: '请输入选项名', message: '请输入选项名',
trigger: 'blur' trigger: 'blur'
} }
], ],
value: [ value: [
{ {
required: true, required: true,
message: '请输入选项值', message: '请输入选项值',
trigger: 'blur' trigger: 'blur'
} }
] ]
}, },
dataType: 'string', dataType: 'string',
dataTypeOptions: [ dataTypeOptions: [
{ {
label: '字符串', label: '字符串',
value: 'string' value: 'string'
}, },
{ {
label: '数字', label: '数字',
value: 'number' value: 'number'
} }
] ]
} }
}, },
computed: {}, computed: {},
watch: { watch: {
// eslint-disable-next-line func-names // eslint-disable-next-line func-names
'formData.value': function (val) { 'formData.value': function (val) {
this.dataType = isNumberStr(val) ? 'number' : 'string' this.dataType = isNumberStr(val) ? 'number' : 'string'
} }
}, },
created() {}, created() {},
mounted() {}, mounted() {},
methods: { methods: {
onOpen() { onOpen() {
this.formData = { this.formData = {
label: undefined, label: undefined,
value: undefined value: undefined
} }
}, },
onClose() {}, onClose() {},
close() { close() {
this.$emit('update:visible', false) this.$emit('update:visible', false)
}, },
handelConfirm() { handleConfirm() {
this.$refs.elForm.validate(valid => { this.$refs.elForm.validate(valid => {
if (!valid) return if (!valid) return
if (this.dataType === 'number') { if (this.dataType === 'number') {
this.formData.value = parseFloat(this.formData.value) this.formData.value = parseFloat(this.formData.value)
} }
this.formData.id = this.id++ this.formData.id = this.id++
this.$emit('commit', this.formData) this.$emit('commit', this.formData)
this.close() this.close()
}) })
} }
} }
} }
</script> </script>
This diff is collapsed.
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment