Commit 8e4401a457bc80fe01bae75d1ef748788ca3e684
1 parent
19ba5c39
Exists in
master
and in
1 other branch
更新开发指南
Showing
11 changed files
with
57 additions
and
19 deletions
Show diff stats
examples/styles/markdown.scss
| @@ -93,6 +93,10 @@ | @@ -93,6 +93,10 @@ | ||
| 93 | & > br, p > br { | 93 | & > br, p > br { |
| 94 | clear: both; | 94 | clear: both; |
| 95 | } | 95 | } |
| 96 | + a { | ||
| 97 | + color: $primary; | ||
| 98 | + text-decoration: none; | ||
| 99 | + } | ||
| 96 | blockquote { | 100 | blockquote { |
| 97 | padding: 8px 16px; | 101 | padding: 8px 16px; |
| 98 | background-color: rgba($primary, 0.1); | 102 | background-color: rgba($primary, 0.1); |
examples/views/docs/component/detail.md
| @@ -6,7 +6,7 @@ | @@ -6,7 +6,7 @@ | ||
| 6 | 6 | ||
| 7 | 配置项list将无视配置的type，统一渲染为label | 7 | 配置项list将无视配置的type，统一渲染为label |
| 8 | 8 | ||
| 9 | -:::snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，每一项都已设置为**el-form-item**的子组件 | 9 | +::: snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，每一项都已设置为**el-form-item**的子组件 |
| 10 | 10 | ||
| 11 | ```html | 11 | ```html |
| 12 | <template> | 12 | <template> |
examples/views/docs/component/form.md
| @@ -6,7 +6,7 @@ | @@ -6,7 +6,7 @@ | ||
| 6 | 6 | ||
| 7 | 配置项list中通过type可以配置任意组件，不受框架限制 | 7 | 配置项list中通过type可以配置任意组件，不受框架限制 |
| 8 | 8 | ||
| 9 | -:::snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，每一项都已设置为**el-form-item**的子组件，通过`rules`配置校验规则 | 9 | +::: snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，每一项都已设置为**el-form-item**的子组件，通过`rules`配置校验规则 |
| 10 | 10 | ||
| 11 | ```html | 11 | ```html |
| 12 | <template> | 12 | <template> |
| @@ -44,7 +44,7 @@ export default { | @@ -44,7 +44,7 @@ export default { | ||
| 44 | 44 | ||
| 45 | 对配置项进行分组 | 45 | 对配置项进行分组 |
| 46 | 46 | ||
| 47 | -:::snippet 在配置项属性中设置`group`参数，没有设置分组的配置项默认归为`基本信息`分组 | 47 | +::: snippet 在配置项属性中设置`group`参数，没有设置分组的配置项默认归为`基本信息`分组 |
| 48 | 48 | ||
| 49 | ```html | 49 | ```html |
| 50 | <template> | 50 | <template> |
| @@ -78,7 +78,7 @@ export default { | @@ -78,7 +78,7 @@ export default { | ||
| 78 | 78 | ||
| 79 | 有些时候默认的分组样式并不能满足项目需求，因此这里支持自定义 | 79 | 有些时候默认的分组样式并不能满足项目需求，因此这里支持自定义 |
| 80 | 80 | ||
| 81 | -:::snippet 使用`Object`对象的方式配置分组信息，并在组件中使用具名插槽`slot`配置分组标题 | 81 | +::: snippet 使用`Object`对象的方式配置分组信息，并在组件中使用具名插槽`slot`配置分组标题 |
| 82 | 82 | ||
| 83 | ```html | 83 | ```html |
| 84 | <template> | 84 | <template> |
examples/views/docs/component/scheme.md
| @@ -6,7 +6,7 @@ Scheme是一个数据驱动的解决方案，通过既定的业务配置参数 | @@ -6,7 +6,7 @@ Scheme是一个数据驱动的解决方案，通过既定的业务配置参数 | ||
| 6 | 6 | ||
| 7 | 配置项list中通过type可以配置任意组件，不受框架限制 | 7 | 配置项list中通过type可以配置任意组件，不受框架限制 |
| 8 | 8 | ||
| 9 | -:::snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，每一项都已设置为**el-form-item**的子组件，通过`rules`配置校验规则 | 9 | +::: snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，每一项都已设置为**el-form-item**的子组件，通过`rules`配置校验规则 |
| 10 | 10 | ||
| 11 | ```html | 11 | ```html |
| 12 | <template> | 12 | <template> |
examples/views/docs/component/search.md
| @@ -6,7 +6,7 @@ Search 搜索组件是一个使用`list`来配置生成的搜索表单 | @@ -6,7 +6,7 @@ Search 搜索组件是一个使用`list`来配置生成的搜索表单 | ||
| 6 | 6 | ||
| 7 | 配置项list中通过type可以配置任意组件，不受框架限制 | 7 | 配置项list中通过type可以配置任意组件，不受框架限制 |
| 8 | 8 | ||
| 9 | -:::snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，支持通过`rules`配置校验规则 | 9 | +::: snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，支持通过`rules`配置校验规则 |
| 10 | 10 | ||
| 11 | ```html | 11 | ```html |
| 12 | <template> | 12 | <template> |
| @@ -53,7 +53,7 @@ export default { | @@ -53,7 +53,7 @@ export default { | ||
| 53 | 53 | ||
| 54 | 在使用`list`的同时，也支持通过`slot`传入组件，以满足不同的业务需求 | 54 | 在使用`list`的同时，也支持通过`slot`传入组件，以满足不同的业务需求 |
| 55 | 55 | ||
| 56 | -:::snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，支持通过`rules`配置校验规则 | 56 | +::: snippet 使用`list`属性设置数据源，列表项中的`type`指定组件类型，支持通过`rules`配置校验规则 |
| 57 | 57 | ||
| 58 | ```html | 58 | ```html |
| 59 | <template> | 59 | <template> |
examples/views/docs/component/select.md
| @@ -4,7 +4,7 @@ | @@ -4,7 +4,7 @@ | ||
| 4 | 4 | ||
| 5 | ## 基础用法 | 5 | ## 基础用法 |
| 6 | 6 | ||
| 7 | -:::snippet 通过`dataSource`属性设置数据源 | 7 | +::: snippet 通过`dataSource`属性设置数据源 |
| 8 | 8 | ||
| 9 | ```html | 9 | ```html |
| 10 | <template> | 10 | <template> |
| @@ -31,7 +31,7 @@ export default { | @@ -31,7 +31,7 @@ export default { | ||
| 31 | 31 | ||
| 32 | ## 数据源 | 32 | ## 数据源 |
| 33 | 33 | ||
| 34 | -:::snippet 通过`dataSource`属性设置数据源，支持函数和`Promise` | 34 | +::: snippet 通过`dataSource`属性设置数据源，支持函数和`Promise` |
| 35 | 35 | ||
| 36 | ```html | 36 | ```html |
| 37 | <template> | 37 | <template> |
examples/views/docs/component/table.md
| @@ -6,7 +6,7 @@ | @@ -6,7 +6,7 @@ | ||
| 6 | 6 | ||
| 7 | 表格列可以通过`list`动态配置 | 7 | 表格列可以通过`list`动态配置 |
| 8 | 8 | ||
| 9 | -:::snippet 使用`list`属性设置数据源，每一项都已设置为**el-table-column**，数据源格式与`Form`相同 | 9 | +::: snippet 使用`list`属性设置数据源，每一项都已设置为**el-table-column**，数据源格式与`Form`相同 |
| 10 | 10 | ||
| 11 | ```html | 11 | ```html |
| 12 | <template> | 12 | <template> |
| @@ -57,7 +57,7 @@ export default { | @@ -57,7 +57,7 @@ export default { | ||
| 57 | 57 | ||
| 58 | 表格列可以通过`slot`动态配置，名称对应各列的列名 | 58 | 表格列可以通过`slot`动态配置，名称对应各列的列名 |
| 59 | 59 | ||
| 60 | -:::snippet 可以使用`slot`加`slot-scope`的方式，新版vue可以使用`#slotname`的形式 | 60 | +::: snippet 可以使用`slot`加`slot-scope`的方式，新版vue可以使用`#slotname`的形式 |
| 61 | 61 | ||
| 62 | ```html | 62 | ```html |
| 63 | <template> | 63 | <template> |
examples/views/docs/guide/installation.md
| 1 | # 安装 | 1 | # 安装 |
| 2 | 2 | ||
| 3 | -## npm安装 | ||
| 4 | \ No newline at end of file | 3 | \ No newline at end of file |
| 4 | +本组件库处于未开发完成状态，暂时为私有库，仅供内部项目使用，当前最新版本号为`0.4.1` | ||
| 5 | + | ||
| 6 | +> 注意：由于yunweidashi.com服务器的SSL证书未经过第三方机构签署，因此在使用本私有库时，需要在git中设置忽略ssl验证`git config http.sslVerify "false"` | ||
| 7 | + | ||
| 8 | +## npm安装 | ||
| 9 | +```bash | ||
| 10 | +npm install --save git+https://frameworkweb:frame1WorkwEb@git.yunweidashi.com/framework/eagle-web-toolkit.git#版本号 | ||
| 11 | +``` | ||
| 12 | + | ||
| 13 | +## yarn安装 | ||
| 14 | +```bash | ||
| 15 | +yarn git+https://frameworkweb:frame1WorkwEb@git.yunweidashi.com/framework/eagle-web-toolkit.git#版本号 | ||
| 16 | +``` | ||
| 5 | \ No newline at end of file | 17 | \ No newline at end of file |
examples/views/docs/guide/introduce.md
| @@ -4,12 +4,21 @@ | @@ -4,12 +4,21 @@ | ||
| 4 | 4 | ||
| 5 | ## 特性 | 5 | ## 特性 |
| 6 | 6 | ||
| 7 | -额 | 7 | +数据驱动视图、组件模块化替换、任意组件渲染 |
| 8 | 8 | ||
| 9 | ::: html | 9 | ::: html |
| 10 | -<div style="display: flex; align-items: center;"> | ||
| 11 | - <img src="/img/logo.svg" style="width: 100px;" /> | ||
| 12 | - <i class="el-icon-plus" style="padding: 0 20px;"></i> | 10 | +<div style="display: flex; align-items: center;padding: 30px 0;"> |
| 13 | <img src="/img/vue.svg" style="width: 100px;" /> | 11 | <img src="/img/vue.svg" style="width: 100px;" /> |
| 12 | + <i class="el-icon-plus" style="padding: 0 40px;"></i> | ||
| 13 | + <img src="/img/element.svg" style="width: 100px;" /> | ||
| 14 | + <i class="el-icon-right" style="padding: 0 40px;"></i> | ||
| 15 | + <img src="/img/logo.svg" style="width: 100px;" /> | ||
| 14 | </div> | 16 | </div> |
| 15 | -::: | ||
| 16 | \ No newline at end of file | 17 | \ No newline at end of file |
| 18 | +::: | ||
| 19 | + | ||
| 20 | +**Vue.js**提供核心驱动，**Element**组成基本结构，**EAGLE WEB TOOLKIT**渲染配置项数据 | ||
| 21 | + | ||
| 22 | +## 谁在使用 | ||
| 23 | + | ||
| 24 | +* [翌车科技](http://www.yichekeji.com/) | ||
| 25 | +* [申服科技](http://www.shenfutech.com/) | ||
| 17 | \ No newline at end of file | 26 | \ No newline at end of file |
| @@ -0,0 +1,13 @@ | @@ -0,0 +1,13 @@ | ||
| 1 | +<?xml version="1.0" encoding="UTF-8"?> | ||
| 2 | +<svg width="307px" height="350px" viewBox="0 0 307 350" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||
| 3 | + <!-- Generator: Sketch 55.2 (78181) - https://sketchapp.com --> | ||
| 4 | + <title>下载 (1)</title> | ||
| 5 | + <desc>Created with Sketch.</desc> | ||
| 6 | + <g id="页面1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||
| 7 | + <g id="画板" transform="translate(-592.000000, -579.000000)" fill="#409EFF" fill-rule="nonzero"> | ||
| 8 | + <g id="下载-(1)" transform="translate(591.000000, 579.000000)"> | ||
| 9 | + <path d="M307.783571,250.687971 C307.696126,265.213128 300.151167,268.4532 300.151167,268.4532 C300.151167,268.4532 169.953072,343.686264 161.488117,348.399902 C153.100463,352.000122 147.494332,348.399902 147.494332,348.399902 C147.494332,348.399902 11.2605187,269.389079 6.28799132,265.915672 C1.3141975,262.442265 1.19734354,257.032423 1.19734354,257.032423 C1.19734354,257.032423 1.33574,100.578187 1.19734354,93.3333616 C1.0620225,86.0872683 10.1035568,80.6431878 10.1035568,80.6431878 L146.222054,1.96588276 C154.602105,-2.45735368 162.760395,1.96588276 162.760395,1.96588276 C162.760395,1.96588276 283.00837,71.8613893 296.334334,79.3737893 C309.395459,85.5838209 307.783571,98.4084168 307.783571,98.4084168 C307.783571,98.4084168 307.86467,237.188729 307.783571,250.687971 L307.783571,250.687971 Z M253.436939,93.6630754 C225.565949,77.6212343 159.909328,39.5786107 159.909328,39.5786107 C159.909328,39.5786107 153.503589,36.1166161 146.924241,39.5786107 L40.0541897,101.151382 C40.0541897,101.151382 32.9552862,105.413566 33.0617852,111.083373 C33.1707112,116.753181 33.0617852,239.196178 33.0617852,239.196178 C33.0617852,239.196178 33.1529708,243.430464 37.0585075,246.148066 C40.9627778,248.865668 147.922801,310.700942 147.922801,310.700942 C147.922801,310.700942 152.325084,313.518725 158.909501,310.700942 C165.556011,307.011952 267.77794,248.133957 267.77794,248.133957 C267.77794,248.133957 273.702141,245.597698 273.77057,234.230183 C273.789579,230.952068 273.798449,218.227654 273.798449,202.240343 L153.447831,275.166679 L153.447831,247.267825 C153.447831,235.809005 162.318292,228.245879 162.318292,228.245879 L268.770164,164.100073 C272.787217,159.9051 273.615971,153.18528 273.787044,150.643949 C273.783243,138.991104 273.778173,128.811827 273.774372,122.363388 L153.447831,195.274506 L153.447831,166.107522 C153.447831,154.648702 161.051083,149.621835 161.051083,149.621835 L253.436939,93.6630754 Z" id="Shape-Copy"></path> | ||
| 10 | + </g> | ||
| 11 | + </g> | ||
| 12 | + </g> | ||
| 13 | +</svg> | ||
| 0 | \ No newline at end of file | 14 | \ No newline at end of file |
webpack/markdown-loader.js
| @@ -32,9 +32,9 @@ module.exports = function(source) { | @@ -32,9 +32,9 @@ module.exports = function(source) { | ||
| 32 | // permalinkBefore: true, // 在标题前创建锚点 | 32 | // permalinkBefore: true, // 在标题前创建锚点 |
| 33 | permalinkSymbol: '#', // 锚点标志 | 33 | permalinkSymbol: '#', // 锚点标志 |
| 34 | }); | 34 | }); |
| 35 | - // 使用【markdown-it-container】插件解析【:::snippet :::】代码块为vue渲染 | 35 | + // 使用【markdown-it-container】插件解析【::: snippet :::】代码块为vue渲染 |
| 36 | markdownIt.use(MarkdownItContainer, "snippet", { | 36 | markdownIt.use(MarkdownItContainer, "snippet", { |
| 37 | - // 验证代码块为【:::snippet :::】才进行渲染 | 37 | + // 验证代码块为【::: snippet :::】才进行渲染 |
| 38 | validate(params) { | 38 | validate(params) { |
| 39 | return params.trim().match(/^snippet\s*(.*)$/); | 39 | return params.trim().match(/^snippet\s*(.*)$/); |
| 40 | }, | 40 | }, |