Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
V
VueElementTemplate
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
JIRA
JIRA
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
黄瑜
VueElementTemplate
Commits
49574a2d
Commit
49574a2d
authored
Feb 23, 2018
by
王康
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
修改表单字段
parent
a3f3dc15
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
20 additions
and
20 deletions
+20
-20
HmComplexForm.md
src/views/haomo/components/forms/HmComplexForm.md
+3
-3
HmComplexForm.vue
src/views/haomo/components/forms/HmComplexForm.vue
+15
-15
index.vue
src/views/haomo/components/forms/index.vue
+2
-2
No files found.
src/views/haomo/components/forms/HmComplexForm.md
View file @
49574a2d
### 基本使用
### 基本使用
```
jsx
```
jsx
<
hm
-
complex
-
form
:
field
s
=
"['username', 'loginid', 'password', 'mobile', 'email']"
<
hm
-
complex
-
form
:
column
s
=
"['username', 'loginid', 'password', 'mobile', 'email']"
:
schema
=
"{
:
schema
=
"{
'model': 'HmUser',
'model': 'HmUser',
'modelPlural': 'HmUsers',
'modelPlural': 'HmUsers',
...
@@ -205,7 +205,7 @@
...
@@ -205,7 +205,7 @@
<
template
>
<
template
>
<div>
<div>
<hm-complex-form
:schema=
"schema['HmUser']"
<hm-complex-form
:schema=
"schema['HmUser']"
:
fields=
"showField
s"
>
:
columns=
"showUserColumn
s"
>
</hm-complex-form>
</hm-complex-form>
</div>
</div>
</
template
>
</
template
>
...
@@ -413,7 +413,7 @@
...
@@ -413,7 +413,7 @@
]
]
}
}
},
},
show
Field
s
:
[
'username'
,
'loginid'
,
'password'
,
'mobile'
,
'email'
]
show
UserColumn
s
:
[
'username'
,
'loginid'
,
'password'
,
'mobile'
,
'email'
]
}
}
},
},
created
()
{
created
()
{
...
...
src/views/haomo/components/forms/HmComplexForm.vue
View file @
49574a2d
...
@@ -8,7 +8,7 @@
...
@@ -8,7 +8,7 @@
<!--表单部分-->
<!--表单部分-->
<el-form
ref=
"form"
:model=
"formModel"
:rules=
"rules"
label-width=
"110px"
<el-form
ref=
"form"
:model=
"formModel"
:rules=
"rules"
label-width=
"110px"
style=
"width:80%;margin:0 auto"
>
style=
"width:80%;margin:0 auto"
>
<el-form-item
v-for=
"(column,index) in show
Field
s"
:key=
"index"
:label=
"column.name"
:prop=
"column.codeCamel"
>
<el-form-item
v-for=
"(column,index) in show
UserColumn
s"
:key=
"index"
:label=
"column.name"
:prop=
"column.codeCamel"
>
<el-input
v-if=
"column.codeCamel==='password'"
type=
"password"
:placeholder=
"column.name"
<el-input
v-if=
"column.codeCamel==='password'"
type=
"password"
:placeholder=
"column.name"
v-model=
"formModel[column.codeCamel]"
></el-input>
v-model=
"formModel[column.codeCamel]"
></el-input>
<el-input
v-if=
"column.codeCamel!=='password'"
:placeholder=
"column.name"
<el-input
v-if=
"column.codeCamel!=='password'"
:placeholder=
"column.name"
...
@@ -58,12 +58,12 @@
...
@@ -58,12 +58,12 @@
/**
/**
* 指定要显示的字段。默认为根据schema得到的所有字段。
* 指定要显示的字段。默认为根据schema得到的所有字段。
*/
*/
field
s
:
{
column
s
:
{
type
:
Array
,
type
:
Array
,
required
:
false
,
required
:
false
,
validator
:
function
(
value
)
{
validator
:
function
(
value
)
{
if
(
typeof
value
!==
'object'
)
{
if
(
typeof
value
!==
'object'
)
{
console
.
warn
(
`传入的
field
s不符合要求,必须是数组`
)
console
.
warn
(
`传入的
column
s不符合要求,必须是数组`
)
return
false
return
false
}
}
...
@@ -75,7 +75,7 @@
...
@@ -75,7 +75,7 @@
return
{
return
{
form
:
null
,
form
:
null
,
formModel
:
{},
// 双向绑定的数据变量
formModel
:
{},
// 双向绑定的数据变量
show
Field
s
:
[],
// 要显示的字段
show
UserColumn
s
:
[],
// 要显示的字段
// form: {
// form: {
// name: '',
// name: '',
// gender: '男',
// gender: '男',
...
@@ -119,34 +119,34 @@
...
@@ -119,34 +119,34 @@
methods
:
{
methods
:
{
init
()
{
init
()
{
const
self
=
this
const
self
=
this
// 如果没有传
field
s,则全部显示
// 如果没有传
column
s,则全部显示
if
(
!
self
.
fields
||
!
self
.
field
s
.
length
)
{
if
(
!
self
.
columns
||
!
self
.
column
s
.
length
)
{
_
.
each
(
self
.
schema
[
'columns'
],
function
(
column
)
{
_
.
each
(
self
.
schema
[
'columns'
],
function
(
column
)
{
const
tmp
=
JSON
.
parse
(
JSON
.
stringify
(
column
))
const
tmp
=
JSON
.
parse
(
JSON
.
stringify
(
column
))
// self.$set(tmp, 'code', tmp.code.toLowerCase())
// self.$set(tmp, 'code', tmp.code.toLowerCase())
self
.
show
Field
s
.
push
(
tmp
)
self
.
show
UserColumn
s
.
push
(
tmp
)
})
})
// console.log(self.show
Field
s)
// console.log(self.show
UserColumn
s)
}
else
{
//
如果传入了field
s,则只显示传入的字段
}
else
{
//
column
s,则只显示传入的字段
self
.
show
Fields
=
JSON
.
parse
(
JSON
.
stringify
(
self
.
field
s
))
self
.
show
UserColumns
=
JSON
.
parse
(
JSON
.
stringify
(
self
.
column
s
))
// console.log('1111111')
// console.log('1111111')
// console.log(self.show
Field
s)
// console.log(self.show
UserColumn
s)
// 将字符串对象进行替换处理
// 将字符串对象进行替换处理
_
.
each
(
self
.
show
Field
s
,
function
(
column
,
index
)
{
_
.
each
(
self
.
show
UserColumn
s
,
function
(
column
,
index
)
{
if
(
typeof
column
===
'string'
)
{
if
(
typeof
column
===
'string'
)
{
// 生成一个新对象
// 生成一个新对象
console
.
log
(
column
)
console
.
log
(
column
)
const
tmp
=
_
.
keyBy
(
self
.
schema
[
'columns'
],
'code'
)[
column
.
toUpperCase
()]
const
tmp
=
_
.
keyBy
(
self
.
schema
[
'columns'
],
'code'
)[
column
.
toUpperCase
()]
// console.log(tmp)
// console.log(tmp)
// self.$set(tmp, 'code', tmp.code.toLowerCase())
// self.$set(tmp, 'code', tmp.code.toLowerCase())
self
.
$set
(
self
.
show
Field
s
,
index
,
tmp
)
self
.
$set
(
self
.
show
UserColumn
s
,
index
,
tmp
)
}
}
})
})
// console.log('2222222')
// console.log('2222222')
console
.
log
(
self
.
show
Field
s
)
console
.
log
(
self
.
show
UserColumn
s
)
}
}
// 提取v-model绑定的变量
// 提取v-model绑定的变量
_
.
each
(
self
.
show
Field
s
,
function
(
item
)
{
_
.
each
(
self
.
show
UserColumn
s
,
function
(
item
)
{
self
.
formModel
[
item
.
codeCamel
]
=
''
self
.
formModel
[
item
.
codeCamel
]
=
''
})
})
console
.
log
(
self
.
formModel
)
console
.
log
(
self
.
formModel
)
...
...
src/views/haomo/components/forms/index.vue
View file @
49574a2d
<
template
>
<
template
>
<div>
<div>
<hm-complex-form
:schema=
"schema['HmUser']"
:
fields=
"showField
s"
>
<hm-complex-form
:schema=
"schema['HmUser']"
:
columns=
"showUserColumn
s"
>
</hm-complex-form>
</hm-complex-form>
</div>
</div>
</
template
>
</
template
>
...
@@ -19,7 +19,7 @@
...
@@ -19,7 +19,7 @@
},
},
data
()
{
data
()
{
return
{
return
{
show
Field
s
:
[
'username'
,
'loginid'
,
'password'
,
'mobile'
,
'email'
]
show
UserColumn
s
:
[
'username'
,
'loginid'
,
'password'
,
'mobile'
,
'email'
]
}
}
},
},
computed
:
{
computed
:
{
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment