Commit 1c191c87a9faf0879a1b122a192cd6ad223f9c99
1 parent
7b36fd81
Exists in
master
and in
3 other branches
docs: 更新Scheme组件文档
Showing
1 changed file
with
65 additions
and
0 deletions
Show diff stats
| @@ -0,0 +1,65 @@ | @@ -0,0 +1,65 @@ | ||
| 1 | +# Scheme 方案 | ||
| 2 | + | ||
| 3 | +根据JSON Scheme配置自动生成一个包含搜索条件、表格、编辑表单、详情表单的页面 | ||
| 4 | + | ||
| 5 | +## 基础用法 | ||
| 6 | + | ||
| 7 | +通过配置`JSON Scheme`快速生成CURD逻辑 | ||
| 8 | + | ||
| 9 | +::: snippet 通过`list`配置项目 | ||
| 10 | + | ||
| 11 | +```html | ||
| 12 | +<template> | ||
| 13 | + <z-scheme :list="list"> | ||
| 14 | + <template #header> | ||
| 15 | + <el-tabs v-model="activeName"> | ||
| 16 | + <el-tab-pane label="待执行" name="wait"></el-tab-pane> | ||
| 17 | + <el-tab-pane label="已执行" name="done"></el-tab-pane> | ||
| 18 | + </el-tabs> | ||
| 19 | + </template> | ||
| 20 | + <template #button="{ size, openDialog }"> | ||
| 21 | + <el-button :size="size" plain>删除</el-button> | ||
| 22 | + <el-button :size="size" plain @click="openDialog('other', '追加')">追加操作</el-button> | ||
| 23 | + </template> | ||
| 24 | + <template #dialog-other="{ model, closeDialog }"> | ||
| 25 | + <el-tag type="success">其它页面</el-tag> | ||
| 26 | + <el-input | ||
| 27 | + type="textarea" | ||
| 28 | + :rows="2" | ||
| 29 | + placeholder="请输入内容" | ||
| 30 | + v-model="model.name"> | ||
| 31 | + </el-input> | ||
| 32 | + <el-button @click="closeDialog(closeCallback)">关闭弹出框</el-button> | ||
| 33 | + </template> | ||
| 34 | + </z-scheme> | ||
| 35 | +</template> | ||
| 36 | + | ||
| 37 | +<script> | ||
| 38 | +export default { | ||
| 39 | + data() { | ||
| 40 | + return { | ||
| 41 | + activeName: 'wait', | ||
| 42 | + list: [ | ||
| 43 | + { type: 'el-input', label: '姓名', key: 'name', rules: [{ required: true, message: '请输入', trigger: 'change' }] }, | ||
| 44 | + { type: 'el-input', label: '年龄', key: 'age' }, | ||
| 45 | + ] | ||
| 46 | + } | ||
| 47 | + }, | ||
| 48 | + methods: { | ||
| 49 | + closeCallback() { | ||
| 50 | + alert('弹出框已关闭') | ||
| 51 | + } | ||
| 52 | + } | ||
| 53 | +} | ||
| 54 | +</script> | ||
| 55 | +``` | ||
| 56 | + | ||
| 57 | +::: | ||
| 58 | + | ||
| 59 | +## API | ||
| 60 | + | ||
| 61 | +## Attribute 属性 | ||
| 62 | + | ||
| 63 | +参数|说明|类型|可选值|默认值 | ||
| 64 | +-|-|-|-|- | ||
| 65 | +list | JSON Scheme配置项列表 | Array | - | [] |