You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
181 lines
3.3 KiB
181 lines
3.3 KiB
<script>
|
|
import formBuilder from '@/utils/formBuilder'
|
|
export default {
|
|
props: {
|
|
device: {
|
|
type: String,
|
|
default: 'desktop',
|
|
required: true
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
info: [
|
|
{
|
|
id: 1,
|
|
type: "text",
|
|
gs_x: 1,
|
|
gs_y: 1,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "aaa",
|
|
label: "aaa",
|
|
help_text: 'write aaa'
|
|
},
|
|
{
|
|
id: 2,
|
|
type: "textarea",
|
|
gs_x: 7,
|
|
gs_y: 1,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "bbb",
|
|
label: "bbb",
|
|
help_text: 'write bbb'
|
|
},
|
|
{
|
|
id: 3,
|
|
type: "date",
|
|
gs_x: 1,
|
|
gs_y: 2,
|
|
gs_height: 1,
|
|
gs_width: 4,
|
|
name: "ccc",
|
|
label: "ccc",
|
|
help_text: 'write ccc'
|
|
},
|
|
{
|
|
id: 4,
|
|
type: "datetime",
|
|
gs_x: 5,
|
|
gs_y: 2,
|
|
gs_height: 1,
|
|
gs_width: 4,
|
|
name: "ddd",
|
|
label: "ddd",
|
|
help_text: 'write ddd'
|
|
},
|
|
{
|
|
id: 5,
|
|
type: "select",
|
|
gs_x: 1,
|
|
gs_y: 3,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "eee",
|
|
label: "eee",
|
|
help_text: 'write eee'
|
|
},
|
|
{
|
|
id: 6,
|
|
type: "radio",
|
|
gs_x: 1,
|
|
gs_y: 4,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "fff",
|
|
label: "fff",
|
|
help_text: 'write fff'
|
|
},
|
|
{
|
|
id: 7,
|
|
type: "file",
|
|
gs_x: 1,
|
|
gs_y: 5,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "ggg",
|
|
label: "ggg",
|
|
help_text: 'write ggg'
|
|
},
|
|
{
|
|
id: 8,
|
|
type: "label",
|
|
gs_x: 1,
|
|
gs_y: 6,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "hhh",
|
|
label: "hhh",
|
|
},
|
|
{
|
|
id: 9,
|
|
type: "static",
|
|
gs_x: 1,
|
|
gs_y: 7,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "iii",
|
|
label: "iii",
|
|
},
|
|
{
|
|
id: 10,
|
|
type: "hr",
|
|
gs_x: 1,
|
|
gs_y: 8,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "jjj",
|
|
label: "jjj",
|
|
},
|
|
{
|
|
id: 11,
|
|
type: "choice",
|
|
gs_x: 1,
|
|
gs_y: 9,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "kkk",
|
|
label: "kkk",
|
|
},
|
|
{
|
|
id: 12,
|
|
type: "choices",
|
|
gs_x: 1,
|
|
gs_y: 10,
|
|
gs_height: 1,
|
|
gs_width: 6,
|
|
name: "lll",
|
|
label: "lll",
|
|
},
|
|
],
|
|
form: {
|
|
aaa: "",
|
|
bbb: ""
|
|
},
|
|
file: {
|
|
ggg: []
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
},
|
|
computed: {
|
|
|
|
},
|
|
render(h) {
|
|
return h('el-form', {
|
|
class: 'form',
|
|
props: {
|
|
model: this.form,
|
|
'label-position': 'top'
|
|
}
|
|
},this.info.map(field => formBuilder.bind(this)(this.device, field, h)))
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.form {
|
|
display: grid;
|
|
grid-template-columns: repeat(12, 1fr);
|
|
grid-gap: 20px;
|
|
}
|
|
::v-deep .el-form-item {
|
|
margin-bottom: 0;
|
|
}
|
|
::v-deep .el-form-item__label {
|
|
padding-bottom: 0;
|
|
}
|
|
</style>
|