43 lines
884 B
Vue
43 lines
884 B
Vue
<template>
|
|
<el-container class="pi-panel">
|
|
<el-main class="main">
|
|
<left-panel></left-panel>
|
|
<el-divider direction="vertical" style="height: 100%"/>
|
|
<center-panel :fields="fields" :config="config" @change="setField"></center-panel>
|
|
<el-divider direction="vertical" style="height: 100%"/>
|
|
<right-panel :config="config" :curField="curField"></right-panel>
|
|
</el-main>
|
|
</el-container>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {ref} from "vue"
|
|
import leftPanel from "./left"
|
|
import centerPanel from "./center"
|
|
import rightPanel from "./right"
|
|
|
|
let fields = ref([])
|
|
let config = ref({
|
|
ref: 'formRef',
|
|
model: 'form',
|
|
rules: 'rules',
|
|
size: 'default',
|
|
labelPosition: 'right',
|
|
labelWidth: 100,
|
|
disabled: false
|
|
})
|
|
let curField = ref({})
|
|
|
|
function setField(v) {
|
|
curField.value = v
|
|
curField.value.field = v.id
|
|
}
|
|
|
|
</script>
|
|
|
|
<style scoped>
|
|
.main {
|
|
display: flex;
|
|
}
|
|
</style>
|