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
HireTest
VueElementTemplate
Commits
3d6a8f0b
Commit
3d6a8f0b
authored
7 years ago
by
赵帅
Browse files
Options
Browse Files
Download
Plain Diff
Merge branch 'master' of 115.28.80.125:softwarefactory/vueelementtemplate
parents
7d433993
eb38f927
Changes
5
Expand all
Show whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
282 additions
and
22 deletions
+282
-22
HmComplexDetail.vue
src/views/haomo/components/details/HmComplexDetail.vue
+5
-3
HmComplexForm.md
src/views/haomo/components/forms/HmComplexForm.md
+198
-0
HmComplexForm.vue
src/views/haomo/components/forms/HmComplexForm.vue
+68
-16
index.vue
src/views/haomo/components/forms/index.vue
+4
-2
HmComplexTable.vue
src/views/haomo/components/tables/HmComplexTable.vue
+7
-1
No files found.
src/views/haomo/components/details/HmComplexDetail.vue
View file @
3d6a8f0b
...
@@ -4,7 +4,7 @@
...
@@ -4,7 +4,7 @@
<el-col
:span=
"12"
class=
"detail-content"
>
<el-col
:span=
"12"
class=
"detail-content"
>
<h2
class=
"title"
>
详情页面
</h2>
<h2
class=
"title"
>
详情页面
</h2>
<el-form
:data=
"detail"
label-width=
"110px"
status-icon
style=
"width:80%;margin:0 auto"
>
<el-form
:data=
"detail"
label-width=
"110px"
status-icon
style=
"width:80%;margin:0 auto"
>
<el-form-item
v-for=
"
column in showColumns
"
:label=
"column.name"
>
<el-form-item
v-for=
"
(column,index) in showColumns"
:key=
"index
"
:label=
"column.name"
>
<div>
{{
detail
[
column
.
codeCamel
]
}}
</div>
<div>
{{
detail
[
column
.
codeCamel
]
}}
</div>
</el-form-item>
</el-form-item>
</el-form>
</el-form>
...
@@ -129,7 +129,7 @@
...
@@ -129,7 +129,7 @@
console
.
log
(
request
.
defaults
)
console
.
log
(
request
.
defaults
)
console
.
log
(
`request.defaults.baseURL:
${
request
.
defaults
.
baseURL
}
`
)
console
.
log
(
`request.defaults.baseURL:
${
request
.
defaults
.
baseURL
}
`
)
},
},
getList
:
function
()
{
getList
:
function
()
{
const
self
=
this
const
self
=
this
self
.
listLoading
=
true
self
.
listLoading
=
true
const
params
=
{}
const
params
=
{}
...
@@ -137,9 +137,11 @@
...
@@ -137,9 +137,11 @@
request
(
self
.
schema
.
modelUnderscorePlural
,
{
request
(
self
.
schema
.
modelUnderscorePlural
,
{
params
:
params
params
:
params
}).
then
(
resp
=>
{
}).
then
(
resp
=>
{
console
.
log
(
'============='
)
console
.
log
(
self
.
schema
.
modelUnderscorePlural
)
self
.
list
=
resp
.
data
self
.
list
=
resp
.
data
// 匹配需要展示的用户
// 匹配需要展示的用户
_
.
each
(
self
.
list
,
function
(
item
)
{
_
.
each
(
self
.
list
,
function
(
item
)
{
if
(
item
.
id
===
self
.
userId
)
{
if
(
item
.
id
===
self
.
userId
)
{
self
.
detail
=
item
self
.
detail
=
item
}
}
...
...
This diff is collapsed.
Click to expand it.
src/views/haomo/components/forms/HmComplexForm.md
View file @
3d6a8f0b
This diff is collapsed.
Click to expand it.
src/views/haomo/components/forms/HmComplexForm.vue
View file @
3d6a8f0b
...
@@ -2,7 +2,6 @@
...
@@ -2,7 +2,6 @@
<el-row
type=
"flex"
class=
"hm-form"
>
<el-row
type=
"flex"
class=
"hm-form"
>
<el-col
:span=
"6"
><div></div></el-col>
<el-col
:span=
"6"
><div></div></el-col>
<el-col
:span=
"12"
style=
"border:1px solid orange"
><div>
<el-col
:span=
"12"
style=
"border:1px solid orange"
><div>
<!--标题-->
<h2
class=
"title"
>
表单页面
</h2>
<h2
class=
"title"
>
表单页面
</h2>
<!--表单部分-->
<!--表单部分-->
<!--
<el-form
:model=
"form"
ref=
"form"
:rules=
"rules"
label-width=
"110px"
status-icon
style=
"width:80%;margin:0 auto"
>
<!--
<el-form
:model=
"form"
ref=
"form"
:rules=
"rules"
label-width=
"110px"
status-icon
style=
"width:80%;margin:0 auto"
>
...
@@ -63,8 +62,8 @@
...
@@ -63,8 +62,8 @@
</el-form-item>
</el-form-item>
</el-form>
-->
</el-form>
-->
<el-form
label-width=
"110px"
status-icon
style=
"width:80%;margin:0 auto"
>
<el-form
label-width=
"110px"
status-icon
style=
"width:80%;margin:0 auto"
>
<el-form-item
v-for=
"
column in showColumns
"
:label=
"column.name"
>
<el-form-item
v-for=
"
(column,index) in showFields"
:key=
"index
"
:label=
"column.name"
>
<el-input
:placeholder=
"column.name"
></el-input>
<el-input
:placeholder=
"column.name"
v-model=
"formModel[column.codeCamel]"
></el-input>
</el-form-item>
</el-form-item>
<el-form-item>
<el-form-item>
<el-col
:span=
"12"
>
<el-col
:span=
"12"
>
...
@@ -95,17 +94,36 @@
...
@@ -95,17 +94,36 @@
components
:
{},
components
:
{},
// 混入公共对象
// 混入公共对象
mixins
:
[],
mixins
:
[],
/**
* 组件所使用的表定义schema。表定义schema,请使用 model2codejs 从pdm文件生成schema。
* 对于所有毫末科技的组件,必须传schema,以完成数据的交互
*/
props
:
{
props
:
{
schema
:
{
schema
:
{
type
:
Object
,
type
:
Object
,
required
:
true
required
:
true
},
/**
* 指定要显示的字段。默认为根据schema得到的所有字段。
*/
fields
:
{
type
:
Array
,
required
:
false
,
validator
:
function
(
value
)
{
if
(
typeof
value
!==
'object'
)
{
console
.
warn
(
`传入的fields不符合要求,必须是数组`
)
return
false
}
return
true
}
}
}
},
},
data
()
{
data
()
{
return
{
return
{
list
:
null
,
form
:
null
,
form
:
null
,
showColumns
:
[]
// 要显示的列数据
formModel
:
{},
// 双向绑定的数据变量
showFields
:
[]
// 要显示的字段
// form: {
// form: {
// name: '',
// name: '',
// gender: '男',
// gender: '男',
...
@@ -156,11 +174,37 @@
...
@@ -156,11 +174,37 @@
methods
:
{
methods
:
{
init
()
{
init
()
{
const
self
=
this
const
self
=
this
// 如果没有传fields,则全部显示
if
(
!
self
.
fields
||
!
self
.
fields
.
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
.
showColumns
.
push
(
tmp
)
self
.
$set
(
tmp
,
'code'
,
tmp
.
code
.
toLowerCase
())
self
.
showFields
.
push
(
tmp
)
})
})
console
.
log
(
self
.
showColumns
)
console
.
log
(
self
.
showFields
)
}
else
{
// 如果传入了fields,则只显示传入的字段
self
.
showFields
=
JSON
.
parse
(
JSON
.
stringify
(
self
.
fields
))
console
.
log
(
'1111111'
)
console
.
log
(
self
.
showFields
)
// 将字符串对象进行替换处理
_
.
each
(
self
.
showFields
,
function
(
column
,
index
)
{
if
(
typeof
column
===
'string'
)
{
// 生成一个新对象
var
tmp
=
_
.
keyBy
(
self
.
schema
[
'columns'
],
'code'
)[
column
.
toUpperCase
()]
console
.
log
(
tmp
)
self
.
$set
(
tmp
,
'code'
,
tmp
.
code
.
toLowerCase
())
self
.
$set
(
self
.
showFields
,
index
,
tmp
)
}
})
console
.
log
(
'2222222'
)
console
.
log
(
self
.
showFields
)
}
// 提取v-model绑定的变量
_
.
each
(
self
.
showFields
,
function
(
item
)
{
self
.
formModel
[
item
.
codeCamel
]
=
''
})
console
.
log
(
self
.
formModel
)
if
(
!
request
.
defaults
.
baseURL
)
{
if
(
!
request
.
defaults
.
baseURL
)
{
request
.
defaults
.
baseURL
=
'/org/api'
request
.
defaults
.
baseURL
=
'/org/api'
}
}
...
@@ -174,14 +218,22 @@
...
@@ -174,14 +218,22 @@
* 验证失败,禁止提交并给出提示
* 验证失败,禁止提交并给出提示
*/
*/
onSubmit
()
{
onSubmit
()
{
this
.
$refs
.
form
.
validate
((
valid
)
=>
{
// this.formModel['X-Auth-Token'] = '111'
if
(
valid
)
{
// console.log(this.formModel)
console
.
log
(
'提交成功!'
)
// console.log(this.schema
)
}
else
{
request
(
this
.
schema
.
modelUnderscorePlural
+
'/new'
,
{
console
.
log
(
'提交失败!!'
)
params
:
this
.
formModel
return
false
}).
then
(
resp
=>
{
}
console
.
log
(
resp
.
data
)
})
})
// this.$refs.form.validate((valid) => {
// if (valid) {
// console.log('提交成功!')
// } else {
// console.log('提交失败!!')
// return false
// }
// })
},
},
// 重置
// 重置
/**
/**
...
...
This diff is collapsed.
Click to expand it.
src/views/haomo/components/forms/index.vue
View file @
3d6a8f0b
<
template
>
<
template
>
<div>
<div>
<hm-complex-form
:schema=
"schema['HmUser']"
>
<hm-complex-form
:schema=
"schema['HmUser']"
:fields=
"showFields"
>
</hm-complex-form>
</hm-complex-form>
</div>
</div>
</
template
>
</
template
>
...
@@ -18,7 +18,9 @@
...
@@ -18,7 +18,9 @@
'hm-complex-form'
:
HmComplexForm
'hm-complex-form'
:
HmComplexForm
},
},
data
()
{
data
()
{
return
{}
return
{
showFields
:
[
'username'
,
'loginid'
,
'password'
,
'mobile'
,
'email'
]
}
},
},
computed
:
{
computed
:
{
},
},
...
...
This diff is collapsed.
Click to expand it.
src/views/haomo/components/tables/HmComplexTable.vue
View file @
3d6a8f0b
...
@@ -21,7 +21,7 @@
...
@@ -21,7 +21,7 @@
<!-- 表格 -->
<!-- 表格 -->
<el-table
:data=
"list"
v-loading=
"listLoading"
element-loading-text=
"给我一点时间"
border
fit
highlight-current-row
<el-table
:data=
"list"
v-loading=
"listLoading"
element-loading-text=
"给我一点时间"
border
fit
highlight-current-row
style=
"width: 100%"
>
style=
"width: 100%"
>
<el-table-column
v-for=
"
column in showColumns
"
align=
"center"
:label=
"column.name"
>
<el-table-column
v-for=
"
(column,index) in showColumns"
:key=
"index
"
align=
"center"
:label=
"column.name"
>
<template
slot-scope=
"scope"
>
<template
slot-scope=
"scope"
>
<span>
{{
scope
.
row
[
column
.
code
]
}}
</span>
<span>
{{
scope
.
row
[
column
.
code
]
}}
</span>
</
template
>
</
template
>
...
@@ -241,16 +241,22 @@
...
@@ -241,16 +241,22 @@
self
.
$set
(
tmp
,
'code'
,
tmp
.
code
.
toLowerCase
())
self
.
$set
(
tmp
,
'code'
,
tmp
.
code
.
toLowerCase
())
self
.
showColumns
.
push
(
tmp
)
self
.
showColumns
.
push
(
tmp
)
})
})
console
.
log
(
self
.
showColumns
)
}
else
{
}
else
{
self
.
showColumns
=
JSON
.
parse
(
JSON
.
stringify
(
self
.
columns
))
self
.
showColumns
=
JSON
.
parse
(
JSON
.
stringify
(
self
.
columns
))
console
.
log
(
'1111111'
)
console
.
log
(
self
.
showColumns
)
// 将字符串对象进行替换处理
// 将字符串对象进行替换处理
_
.
each
(
self
.
showColumns
,
function
(
column
,
index
)
{
_
.
each
(
self
.
showColumns
,
function
(
column
,
index
)
{
if
(
typeof
column
===
'string'
)
{
if
(
typeof
column
===
'string'
)
{
const
tmp
=
_
.
keyBy
(
self
.
schema
[
'columns'
],
'code'
)[
column
.
toUpperCase
()]
const
tmp
=
_
.
keyBy
(
self
.
schema
[
'columns'
],
'code'
)[
column
.
toUpperCase
()]
console
.
log
(
tmp
)
self
.
$set
(
tmp
,
'code'
,
tmp
.
code
.
toLowerCase
())
self
.
$set
(
tmp
,
'code'
,
tmp
.
code
.
toLowerCase
())
self
.
$set
(
self
.
showColumns
,
index
,
tmp
)
self
.
$set
(
self
.
showColumns
,
index
,
tmp
)
}
}
})
})
console
.
log
(
'2222222'
)
console
.
log
(
self
.
showColumns
)
}
}
// 处理过滤条件
// 处理过滤条件
...
...
This diff is collapsed.
Click to expand it.
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