Commit d8d837e85b98d67d67fc81d81c50090280d2213c
1 parent
cf9fccec
Exists in
master
and in
1 other branch
Scheme支持配置操作栏宽度和左右
Showing
2 changed files
with
54 additions
and
2 deletions
Show diff stats
examples/views/page/other.vue
| 1 | 1 | <template> |
| 2 | - <div>这是一个非markdown页面</div> | |
| 2 | + <div> | |
| 3 | + <p>这是一个非markdown页面</p> | |
| 4 | + <el-form size="small"> | |
| 5 | + <el-row :gutter="15" type="flex" style="flex-wrap: wrap;"> | |
| 6 | + <template v-for="(item, index) in option.list2"> | |
| 7 | + <el-col v-if="item.group && item.list" :key="index" :span="item.group.span || 24"> | |
| 8 | + <el-row :gutter="15" type="flex" style="flex-wrap: wrap;"> | |
| 9 | + <el-col :span="24">{{ item.group.title || item.group }}</el-col> | |
| 10 | + <el-col v-for="(comp, idx) in item.list" :key="idx" :span="comp.span || 12"> | |
| 11 | + <el-form-item :label="comp.label" :label-width="comp.labelWidth || '120px'" :prop="comp.key" :rules="comp.rules"> | |
| 12 | + <component :is="comp.type"></component> | |
| 13 | + </el-form-item> | |
| 14 | + </el-col> | |
| 15 | + </el-row> | |
| 16 | + </el-col> | |
| 17 | + <el-col v-else :span="item.span || 12" :key="index"> | |
| 18 | + <el-form-item :label="item.label" :label-width="item.labelWidth || '120px'" :prop="item.key" :rules="item.rules"> | |
| 19 | + <component :is="item.type"></component> | |
| 20 | + </el-form-item> | |
| 21 | + </el-col> | |
| 22 | + </template> | |
| 23 | + </el-row> | |
| 24 | + </el-form> | |
| 25 | + </div> | |
| 3 | 26 | </template> |
| 4 | 27 | |
| 5 | 28 | <script> |
| ... | ... | @@ -7,6 +30,35 @@ export default { |
| 7 | 30 | name: 'other', |
| 8 | 31 | data() { |
| 9 | 32 | return { |
| 33 | + option: { | |
| 34 | + groups: ['basic', 'location'], | |
| 35 | + list: [ | |
| 36 | + { type: 'el-input', label: '名称', key: 'name' }, | |
| 37 | + { type: 'el-input', label: '地址', key: 'location' }, | |
| 38 | + ], | |
| 39 | + list2: [ | |
| 40 | + { | |
| 41 | + group: { title: 'basic', span: 12 }, | |
| 42 | + list: [ | |
| 43 | + { type: 'el-input', label: '名称', key: 'name' }, | |
| 44 | + { type: 'el-input-number', label: '名称1', key: 'name1' }, | |
| 45 | + { type: 'el-switch', label: '名称2', key: 'name2' }, | |
| 46 | + { type: 'el-input', label: '名称3', key: 'name3' }, | |
| 47 | + ], | |
| 48 | + }, | |
| 49 | + { | |
| 50 | + group: 'location', | |
| 51 | + list: [ | |
| 52 | + { type: 'el-input', label: '地址', key: 'location' }, | |
| 53 | + ], | |
| 54 | + }, | |
| 55 | + { type: 'el-input', label: '名称', key: 'name' }, | |
| 56 | + { type: 'el-input', label: '地址', key: 'location' }, | |
| 57 | + { type: 'el-input-number', label: '名称1', key: 'name1' }, | |
| 58 | + { type: 'el-switch', label: '名称2', key: 'name2' }, | |
| 59 | + { type: 'el-input', label: '名称3', key: 'name3' }, | |
| 60 | + ] | |
| 61 | + } | |
| 10 | 62 | } |
| 11 | 63 | }, |
| 12 | 64 | methods: { | ... | ... |
packages/scheme/index.vue
| ... | ... | @@ -171,7 +171,7 @@ |
| 171 | 171 | && !$slots['table-operation-btn-append'] |
| 172 | 172 | )" |
| 173 | 173 | > |
| 174 | - <el-table-column slot="$end" prop="$operation" :label="i18n('eagle.scheme.operation') || '操作'" min-width="140" fixed="right"> | |
| 174 | + <el-table-column slot="$end" prop="$operation" :label="i18n('eagle.scheme.operation') || '操作'" :min-width="option.operationWidth || 140" :fixed="option.operationFixed || 'right'"> | |
| 175 | 175 | <div class="eagle-scheme__table-operation" slot-scope="slotScope"> |
| 176 | 176 | <!-- 表格操作栏插槽 - 前置插槽 --> |
| 177 | 177 | <slot v-if="$scopedSlots['table-operation-btn'] || $slots['table-operation-btn']" name="table-operation-btn" :slotScope="slotScope" v-bind="slotMethod"></slot> | ... | ... |