docs: 更新Scheme组件文档

刘汉宸
1 parent 7b36fd81
Showing 1 changed file with 65 additions and 0 deletions Show diff stats
examples/views/docs/component/scheme.md
@@ -0,0 +1,65 @@
+# Scheme 方案
+
+根据JSON Scheme配置自动生成一个包含搜索条件、表格、编辑表单、详情表单的页面
+
+## 基础用法
+
+通过配置`JSON Scheme`快速生成CURD逻辑
+
+::: snippet 通过`list`配置项目
+
+```html
+<template>
+  <z-scheme :list="list">
+    <template #header>
+      <el-tabs v-model="activeName">
+        <el-tab-pane label="待执行" name="wait"></el-tab-pane>
+        <el-tab-pane label="已执行" name="done"></el-tab-pane>
+      </el-tabs>
+    </template>
+    <template #button="{ size, openDialog }">
+      <el-button :size="size" plain>删除</el-button>
+      <el-button :size="size" plain @click="openDialog('other', '追加')">追加操作</el-button>
+    </template>
+    <template #dialog-other="{ model, closeDialog }">
+      <el-tag type="success">其它页面</el-tag>
+      <el-input
+        type="textarea"
+        :rows="2"
+        placeholder="请输入内容"
+        v-model="model.name">
+      </el-input>
+      <el-button @click="closeDialog(closeCallback)">关闭弹出框</el-button>
+    </template>
+  </z-scheme>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      activeName: 'wait',
+      list: [
+        { type: 'el-input', label: '姓名', key: 'name', rules: [{ required: true, message: '请输入', trigger: 'change' }] },
+        { type: 'el-input', label: '年龄', key: 'age' },
+      ]
+    }
+  },
+  methods: {
+    closeCallback() {
+      alert('弹出框已关闭')
+    }
+  }
+}
+</script>
+```
+
+:::
+
+## API
+
+## Attribute 属性
+
+参数|说明|类型|可选值|默认值
+-|-|-|-|-
+list | JSON Scheme配置项列表 | Array | - | []
...	...	@@ -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 \| - \| []
...	...