| 提交 | 用户 | 时间 | ||
| e57a89 | 1 | import { makeMap } from '@/utils/index' |
| 懒 | 2 | |
| 3 | // 参考https://github.com/vuejs/vue/blob/v2.6.10/src/platforms/web/server/util.js | |
| 4 | const isAttr = makeMap( | |
| 5 | 'accept,accept-charset,accesskey,action,align,alt,async,autocomplete,' | |
| 6 | + 'autofocus,autoplay,autosave,bgcolor,border,buffered,challenge,charset,' | |
| 7 | + 'checked,cite,class,code,codebase,color,cols,colspan,content,http-equiv,' | |
| 8 | + 'name,contenteditable,contextmenu,controls,coords,data,datetime,default,' | |
| 9 | + 'defer,dir,dirname,disabled,download,draggable,dropzone,enctype,method,for,' | |
| 10 | + 'form,formaction,headers,height,hidden,high,href,hreflang,http-equiv,' | |
| 11 | + 'icon,id,ismap,itemprop,keytype,kind,label,lang,language,list,loop,low,' | |
| 12 | + 'manifest,max,maxlength,media,method,GET,POST,min,multiple,email,file,' | |
| 13 | + 'muted,name,novalidate,open,optimum,pattern,ping,placeholder,poster,' | |
| 14 | + 'preload,radiogroup,readonly,rel,required,reversed,rows,rowspan,sandbox,' | |
| 15 | + 'scope,scoped,seamless,selected,shape,size,type,text,password,sizes,span,' | |
| 16 | + 'spellcheck,src,srcdoc,srclang,srcset,start,step,style,summary,tabindex,' | |
| 17 | + 'target,title,type,usemap,value,width,wrap' | |
| 18 | ) | |
| 19 | ||
| 20 | function vModel(self, dataObject, defaultValue) { | |
| 21 | dataObject.props.value = defaultValue | |
| 22 | ||
| 23 | dataObject.on.input = val => { | |
| 24 | self.$emit('input', val) | |
| 25 | } | |
| 26 | } | |
| 27 | ||
| 28 | const componentChild = { | |
| 29 | 'el-button': { | |
| 30 | default(h, conf, key) { | |
| 31 | return conf[key] | |
| 32 | }, | |
| 33 | }, | |
| 34 | 'el-input': { | |
| 35 | prepend(h, conf, key) { | |
| 36 | return <template slot="prepend">{conf[key]}</template> | |
| 37 | }, | |
| 38 | append(h, conf, key) { | |
| 39 | return <template slot="append">{conf[key]}</template> | |
| 40 | } | |
| 41 | }, | |
| 42 | 'el-select': { | |
| 43 | options(h, conf, key) { | |
| 44 | const list = [] | |
| 45 | conf.options.forEach(item => { | |
| 46 | list.push(<el-option label={item.label} value={item.value} disabled={item.disabled}></el-option>) | |
| 47 | }) | |
| 48 | return list | |
| 49 | } | |
| 50 | }, | |
| 51 | 'el-radio-group': { | |
| 52 | options(h, conf, key) { | |
| 53 | const list = [] | |
| 54 | conf.options.forEach(item => { | |
| 55 | if (conf.optionType === 'button') list.push(<el-radio-button label={item.value}>{item.label}</el-radio-button>) | |
| 56 | else list.push(<el-radio label={item.value} border={conf.border}>{item.label}</el-radio>) | |
| 57 | }) | |
| 58 | return list | |
| 59 | } | |
| 60 | }, | |
| 61 | 'el-checkbox-group': { | |
| 62 | options(h, conf, key) { | |
| 63 | const list = [] | |
| 64 | conf.options.forEach(item => { | |
| 65 | if (conf.optionType === 'button') { | |
| 66 | list.push(<el-checkbox-button label={item.value}>{item.label}</el-checkbox-button>) | |
| 67 | } else { | |
| 68 | list.push(<el-checkbox label={item.value} border={conf.border}>{item.label}</el-checkbox>) | |
| 69 | } | |
| 70 | }) | |
| 71 | return list | |
| 72 | } | |
| 73 | }, | |
| 74 | 'el-upload': { | |
| 75 | 'list-type': (h, conf, key) => { | |
| 76 | const list = [] | |
| 77 | if (conf['list-type'] === 'picture-card') { | |
| 78 | list.push(<i class="el-icon-plus"></i>) | |
| 79 | } else { | |
| 80 | list.push(<el-button size="small" type="primary" icon="el-icon-upload">{conf.buttonText}</el-button>) | |
| 81 | } | |
| 82 | if (conf.showTip) { | |
| 83 | list.push(<div slot="tip" class="el-upload__tip">只能上传不超过 {conf.fileSize}{conf.sizeUnit} 的{conf.accept}文件</div>) | |
| 84 | } | |
| 85 | return list | |
| 86 | } | |
| 87 | } | |
| 88 | } | |
| 89 | ||
| 90 | export default { | |
| 91 | render(h) { | |
| 92 | const dataObject = { | |
| 93 | attrs: {}, | |
| 94 | props: {}, | |
| 95 | on: {}, | |
| 96 | style: {} | |
| 97 | } | |
| 98 | const confClone = JSON.parse(JSON.stringify(this.conf)) | |
| 99 | const children = [] | |
| 100 | ||
| 101 | const childObjs = componentChild[confClone.tag] | |
| 102 | if (childObjs) { | |
| 103 | Object.keys(childObjs).forEach(key => { | |
| 104 | const childFunc = childObjs[key] | |
| 105 | if (confClone[key]) { | |
| 106 | children.push(childFunc(h, confClone, key)) | |
| 107 | } | |
| 108 | }) | |
| 109 | } | |
| 110 | ||
| 111 | Object.keys(confClone).forEach(key => { | |
| 112 | const val = confClone[key] | |
| 113 | if (key === 'vModel') { | |
| 114 | vModel(this, dataObject, confClone.defaultValue) | |
| 115 | } else if (dataObject[key]) { | |
| 116 | dataObject[key] = val | |
| 117 | } else if (!isAttr(key)) { | |
| 118 | dataObject.props[key] = val | |
| 119 | } else { | |
| 120 | dataObject.attrs[key] = val | |
| 121 | } | |
| 122 | }) | |
| 123 | return h(this.conf.tag, dataObject, children) | |
| 124 | }, | |
| 125 | props: ['conf'] | |
| 126 | } | |
