diff --git a/docs/.vuepress/config.js b/docs/.vuepress/config.js index 467bf6a3..de41538f 100644 --- a/docs/.vuepress/config.js +++ b/docs/.vuepress/config.js @@ -41,106 +41,72 @@ module.exports = { editLinkText: '在 GitHub 上编辑此页', lastUpdated: '最后更新', nav: [ - { text: '指南', link: '/zh/guide/' }, - { text: '插件', link: '/zh/plugins/' }, - { text: '组件', link: '/zh/components/' }, - { text: '文章', link: '/zh/article/' }, - { text: '其它', link: '/zh/others/' }, - { text: '预览', link: 'https://fairyever.gitee.io/d2-admin-preview/#/index' } + { + text: '学习', + items: [ + { text: '教程', link: '/zh/learn-guide/' }, + { text: '相关知识', link: '/zh/learn-knowledge/' } + ] + }, + { + text: '系统', + items: [ + { text: '内置组件', link: '' }, + { text: '插件', link: '' }, + { text: 'vuex', link: '' }, + { text: '菜单', link: '' }, + { text: '路由', link: '' }, + { text: '主题系统', link: '' }, + { text: '数据持久化', link: '' }, + { text: 'CSS 实用类', link: '' }, + { text: 'JS Util', link: '' } + ] + }, + { + text: '生态', + items: [ + { text: 'D2 Admin start kit', link: '' }, + { text: 'D2 Admin ICE', link: '' }, + { text: 'D2 CRUD', link: '' }, + { text: 'D2 Ribbons', link: '' } + ] + }, + { + text: '其它', + items: [ + { text: '文章归档', link: '' }, + { text: '更新日志', link: '' }, + { text: '参与者名单', link: '' }, + { + text: '关注我们', + items: [ + { text: '掘金', link: '' }, + { text: 'CSDN', link: '' }, + { text: 'segmentfault', link: '' }, + { text: '知乎', link: '' }, + { text: '微信公众号', link: '' } + ] + } + ] + }, + { text: '常见问题', link: '' } ], sidebar: { - '/zh/guide/': sideBarGuide('指南'), - '/zh/plugins/': sideBarPlugins('插件'), - '/zh/components/': sideBarComponents('组件'), - '/zh/article/': sideBarArticle('Cookbook', '版本更新'), - '/zh/others/': sideBarOthers('其它') + '/zh/learn-guide/': sideBarLearnGuide() } } } } } -function sideBarGuide (title) { +function sideBarLearnGuide () { return [ { - title, collapsable: false, children: [ '', - 'getting-started', - 'question', - 'plagiarize', - 'change-log' + 'getting-started' ] } ] -} - -function sideBarPlugins () { - return [ - '', - 'data-export', - 'data-import', - 'i18n', - 'mock', - 'vuex', - 'util' - ] -} - -function sideBarComponents (title) { - return [ - { - title, - collapsable: false, - children: [ - '', - 'charts', - 'charts-new', - 'container', - 'count-up', - 'highlight', - 'icon-select', - 'icon-svg', - 'icon', - 'markdown' - ] - } - ] -} - -function sideBarArticle (titleCookBook, titleUpdate) { - return [ - { - title: titleCookBook, - collapsable: false, - children: [ - 'cookbook/what-is-cookbook', - 'cookbook/combinable-questionnaire', - ] - }, - { - title: titleUpdate, - collapsable: false, - children: [ - 'update/ice-1.1.2', - 'update/1.1.5', - 'update/1.1.4', - 'update/0.0.0' - ] - } - ] -} - -function sideBarOthers (title) { - return [ - { - title, - collapsable: false, - children: [ - '', - 'css' - ] - } - ] -} +} \ No newline at end of file diff --git a/docs/zh/article/README.md b/docs/zh/article/README.md deleted file mode 100644 index 37a1c102..00000000 --- a/docs/zh/article/README.md +++ /dev/null @@ -1,3 +0,0 @@ -# 文章 - -请在侧边栏目录选择文章阅读 \ No newline at end of file diff --git a/docs/zh/article/cookbook/combinable-questionnaire.md.REMOVED.git-id b/docs/zh/article/cookbook/combinable-questionnaire.md.REMOVED.git-id deleted file mode 100644 index c09f454c..00000000 --- a/docs/zh/article/cookbook/combinable-questionnaire.md.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -7016ea14567961c24eb1fdee492e0c996099f752 \ No newline at end of file diff --git a/docs/zh/article/cookbook/what-is-cookbook.md b/docs/zh/article/cookbook/what-is-cookbook.md deleted file mode 100644 index 53c4758c..00000000 --- a/docs/zh/article/cookbook/what-is-cookbook.md +++ /dev/null @@ -1,3 +0,0 @@ -# 什么是 Cookbook - -计算机领域的 Cookbook 指的是实用经典案例的意思,是对一些普遍性问题的解决方案的总结和整理。 \ No newline at end of file diff --git a/docs/zh/article/update/0.0.0.md b/docs/zh/article/update/0.0.0.md deleted file mode 100644 index 40a0747b..00000000 --- a/docs/zh/article/update/0.0.0.md +++ /dev/null @@ -1,123 +0,0 @@ -# 公布项目 - -![github-banner](http://fairyever.qiniudn.com/github-banner.png) - -# 介绍 - -D2Admin 是一个开源的管理系统前端集成方案 - -[Github仓库](https://github.com/d2-projects/d2-admin) - [预览地址](https://fairyever.gitee.io/d2-admin-preview/#/index) - [中文文档](https://fairyever.gitee.io/d2-admin-doc/zh/) - -D2Admin 是完全开源免费的管理系统集成方案,由 [FairyEver](https://github.com/FairyEver) 在工作之余完全由兴趣驱动完成,如果你也一样喜欢前端开发,欢迎加入我们的讨论/学习群,群内可以`提问答疑`,`分享学习资料`或者随便扯淡 - -**QQ群** - -群号 806395827 欢迎大家 - -**微信群** - -作者微信 liyang1711467488 - -> 微信群需要先加群主才可以拉进群 - -## 功能 - -* 首屏加载等待动画 避免首次加载白屏尴尬 -* 简约主题 -* 每个插件和组件都配有介绍文档 -* 图片资源 sketch 源文件( 可以在这个文件内重新生成所有图片资源 ) -* 登陆和注销 -* 根据路由自动生成菜单 -* 可折叠侧边栏 -* 方便的菜单设置 -* 多国语言支持 -* 富文本编辑器 -* Markdown 编辑器 -* 全屏功能 -* Fontawesome 图标库 -* 图标选择器(组件) -* 自动引入下载的 SVG 图标 -* 前端假数据支持( mock ) -* 集成蚂蚁金服出品的 G2 图表 -* 图表自适应可拖拽大小的卡片容器(示例) -* 简化剪贴板操作 -* 简化Cookie操作 -* 时间日期计算工具 -* 导入 Excel ( xlsx 格式 + csv 格式 ) -* 数据导出 Excel ( xlsx 格式 + csv 格式 ) -* 数据导出文本 -* 数字动画 -* 可拖拽调整大小的切分布局 -* 可拖拽调整大小和位置的网格布局 -* 提供三种方便的页面容器组件(正常卡片,隐形容器,填满页面) -* 代码高亮显示 -* 加载并解析(或者直接指定资源) markdown 文件 -* GitHub 样式的 markdown 显示组件 -* markdown 内代码高亮 -* 为 markdown 扩展了百度云链接解析和优化显示 -* 右键菜单组件 -* 自定义滚动条和滚动控制 -* 内置4种主题 -* 公用样式抽离,方便的主题定制 -* 支持百万级数据量的表格组件 -* 打包后随意目录部署(已经做好兼容设置) - -## TODO - -D2Admin 仍然处于开发中,这里有一些计划: - -* 分离出简化版本 -* 推出基于 [ice](https://alibaba.github.io/ice) 平台的版本 -* 增加右上角通知中心 -* 增加一些实例页面以提供业务页面布局建议 -* 更换图表库 -* 多 tab 页结构 -* 面包屑导航 -* 树型表格组件 -* `1.1.0 完成` 抽离项目里的文档,集中存放在文档站点 -* `1.1.0 完成` 对主界面进行一次完善,调整整体布局和颜色 -* `1.1.0 完成` 切换主题功能 - -欢迎你为 D2Admin 的开发作出贡献(代码编写/文档翻译)。 - -## 目录结构 - -``` -├─ build -├─ config -├─ docs // 文档 -├─ src -│ ├─ assets // 资源 -│ │ ├─ icons -│ │ ├─ image -│ │ ├─ library -│ │ └─ style -│ ├─ components // 组件 -│ │ ├─ charts -│ │ ├─ core -│ │ └─ demo -│ ├─ i18n // 多国语 -│ ├─ menu // 菜单 -│ ├─ mock // 模拟数据 -│ ├─ pages // 页面 -│ ├─ plugin // 插件 -│ ├─ router // 路由 -│ ├─ store // vuex -│ ├─ utils -│ ├─ App.vue -│ └─ main.js -├─ static // 静态资源 -├─ .babelrc -├─ .editorconfig -├─ .eslintignore -├─ .eslintrc.js -├─ .gitattributes -├─ .gitignore -├─ .postcssrc.js -├─ LICENSE -├─ README.md -├─ deploy.sh -├─ design.sketch // 设计文件 -├─ index.html -└─ package.json -``` \ No newline at end of file diff --git a/docs/zh/article/update/1.1.4.md b/docs/zh/article/update/1.1.4.md deleted file mode 100644 index 7cd6a38e..00000000 --- a/docs/zh/article/update/1.1.4.md +++ /dev/null @@ -1,219 +0,0 @@ -# 版本发布 1.1.4 - -![github-banner](http://fairyever.qiniudn.com/github-banner.png) - -D2Admin 是一个 **注重外观表现** 的管理系统 **PC端** 集成方案,现在正在紧张开发维护。 - -## 前言 - -距离 D2Admin 正式和大家见面(开源),已经过去一个多月了。 - -![Snip20180703_4](http://fairyever.qiniudn.com/Snip20180703_4.png) - -现在想想这一个月真是很忙碌,几乎所有的业余时间都用在了开源项目上,公司没事的时候在写,晚上回家每天都要写到一点左右,回家火车上都在忙着改代码... - -![Snip20180703_5-squashed](http://fairyever.qiniudn.com/Snip20180703_5-squashed.jpg) - -上图:好友不幸骨折,守着他编码...(希望他早点康复) - -有天我和朋友说,感觉真是开源个项目,把自己整个人都开源了,一个人又要设计又要写代码又要写文档还要回答问题,除了上班吃睡就都是它了! - -但是就我个人而言,我感觉倒也是一种不错的体验。 - -通过这个开源产品,认识了很多朋友,有了自己的小交流群,平日没事了大家一起讨论讨论问题也挺不错。当然也新认识了一些大佬(膜拜),通过交流也有不小的收获。 - -## 介绍 - -废话不多说了,一介码农也没有什么文采,今天也是趁着发版的机会小发表一些想法,下面就介绍一下这一个月来究竟升级了什么吧,先放几张截图吧: - -### 预览 - -经典主题: - -![Snip20180703_6-squashed](http://fairyever.qiniudn.com/Snip20180703_6-squashed.png) - -集成组件和插件: - -![Snip20180703_7-squashed](http://fairyever.qiniudn.com/Snip20180703_7-squashed.png) - -图标选择器: - -![Snip20180703_8-squashed](http://fairyever.qiniudn.com/Snip20180703_8-squashed.png) - -版本检查: - -![Snip20180703_10-squashed](http://fairyever.qiniudn.com/Snip20180703_10-squashed.png) - -灰度模式: - -![Snip20180703_11-squashed](http://fairyever.qiniudn.com/Snip20180703_11-squashed.png) -![Snip20180704_9](http://fairyever.qiniudn.com/Snip20180704_9.png) -![Snip20180705_1](http://fairyever.qiniudn.com/Snip20180705_1.png) - -数据持久化: - -![Snip20180703_12-squashed](http://fairyever.qiniudn.com/Snip20180703_12-squashed.png) - -图表: - -![Snip20180703_13-squashed](http://fairyever.qiniudn.com/Snip20180703_13-squashed.png) - -主题: - -![Snip20180703_14-squashed](http://fairyever.qiniudn.com/Snip20180703_14-squashed.png) - -响应大家需求,这次最大的升级:多标签页: - -![Snip20180703_15](http://fairyever.qiniudn.com/Snip20180703_15.png) - -上面是我随便截了几张图片 如果你感兴趣的话可以去体验地址一趟 -> [体验地址](https://fairyever.gitee.io/d2-admin-preview/#/index) <-。 - -项目现在集成了不少的库和插件,第一次加载确实有些慢,以后有空了优化一下。 - -另外大家实际使用的时候建议使用 [简化版模板](https://github.com/d2-projects/d2-admin-start-kit)。 - -### 完整功能列表 - -* 首屏加载等待动画 避免首次加载白屏尴尬 -* 简约主题 -* 每个插件和组件都配有介绍文档 -* 图片资源 sketch 源文件( 可以在这个文件内重新生成所有图片资源 ) -* 登陆和注销 -* 根据路由自动生成菜单 -* 可折叠侧边栏 -* 方便的菜单设置 -* 多国语言支持 -* 富文本编辑器 -* Markdown 编辑器 -* 全屏功能 -* Fontawesome 图标库 -* 图标选择器(组件) -* 自动引入下载的 SVG 图标 -* 前端假数据支持( mock ) -* 集成蚂蚁金服出品的 G2 图表 -* 图表自适应可拖拽大小的卡片容器(示例) -* 简化剪贴板操作 -* 简化Cookie操作 -* 时间日期计算工具 -* 导入 Excel ( xlsx 格式 + csv 格式 ) -* 数据导出 Excel ( xlsx 格式 + csv 格式 ) -* 数据导出文本 -* 数字动画 -* 可拖拽调整大小的切分布局 -* 可拖拽调整大小和位置的网格布局 -* 提供三种方便的页面容器组件(正常卡片,隐形容器,填满页面) -* 代码高亮显示 -* 加载并解析(或者直接指定资源) markdown 文件 -* GitHub 样式的 markdown 显示组件 -* markdown 内代码高亮 -* 为 markdown 扩展了百度云链接解析和优化显示 -* 右键菜单组件 -* 自定义滚动条和滚动控制 -* 内置5种主题 -* 公用样式抽离,方便的主题定制 -* 支持百万级数据量的表格组件 -* 打包后随意目录部署(已经做好兼容设置) -* 支持临时菜单配置 -* 提供“试验台”功能 方便展示系统功能调用方法 `1.1.4 +` -* 多标签页模式 `1.1.4 +` -* 美化滚动条 `1.1.4 +` -* 持久化存储 `1.1.4 +` - -### 更新列表 - -这个列表在这里也可以查看 -> [中文文档 | 更新日志](https://fairyever.gitee.io/d2-admin-doc/zh/guide/change-log.html#v1-1-0) - -#### 1.1.4 - -* [ 修改 ] 全局状态管理设计优化 -* [ 修改 ] 主题调优 -* [ 新增 ] playground 模块,方便测试和展示一些功能实现方式/调用方法 -* [ 新增 ] 灰度模式 -* [ 新增 ] 多页模式 -* [ 新增 ] 多页模式缓存 -* [ 新增 ] 多页模式快速关闭(关闭左侧 右侧 全部 其它) -* [ 修改 ] 侧边栏滚动优化 -* [ 新增 ] `d2-container` 填充模式自定义滚动条 -* [ 新增 ] `d2-container` 组件卡片和隐形模式自定义滚动条 -* [ 新增 ] 现在页面标题可以根据路由做出对应变化了 -* [ 新增 ] 版本检查机制 -* [ 新增 ] `d2-container` 隐形模式支持 header 插槽 -* [ 新增 ] 版本检查可以设置为不显示提示框 -* [ 新增 ] 集成 json 查看组件 -* [ 新增 ] 添加了所有图表种类的演示页面 -* [ 修改 ] 修改布局方式,解决了在 Firefox 上 better-scroll 初始化拿不到正确高度的 bug -* [ 新增 ] 右上角显示用户名,用户名持久存储 - -#### 1.1.3 - -* [ 修复 ] 侧边栏在折叠时不显示的 bug -* [ 新增 ] v-charts 插件 -* [ 新增 ] 一些演示图表(后续打算把 v-charts 文档上有示例性的演示都展示一下) -* [ 修改 ] D2Admin 经典主题颜色调整 -* [ 新增 ] violet 主题 -* [ 新增 ] 菜单图标 -* [ 修改 ] 新制作了 Fork me 图片 - -#### 1.1.2 - -* [ 修改 ] 删除了 G2 相关的依赖 - -#### 1.1.1 - -* [ 修改 ] 删除了 G2 相关的代码(移除图表库) -* [ 优化 ] 侧边栏取值逻辑 - -#### 1.1.0 - -* [ 修改 ] 顶栏和侧边栏菜单新的结构生成方式,新的方案使用 数据 + 递归组件 实现无限制多级菜单 -* [ 修改 ] 路由注册回归最简单的写法 -* [ 修复 ] 首次加载 loading 样式类名和程序内类名冲突,新的加载类名使用 d2-app-loading 前缀 -* [ 修改 ] 所有类似 dd- 的样式前缀(包括自动注册图标的id前缀)统一改为 d2- -* [ 修复 ] 修复 d2-highlight 组件和 d2-markdown 组件的样式冲突 -* [ 修改 ] 内置组件名称统一改为 d2- 前缀,统一使用横线连接 (kebab-case) 风格 -* [ 修改 ] 顶栏 logo 阴影删除 -* [ 新增 ] 主题系统 -* [ 新增 ] 三个主题,分别为 d2admin 经典,简约线条,流星 -* [ 修改 ] d2-markdown 组件 md 参数改名为 source -* [ 修改 ] 删除了 d2-markdown 组件中图片的白色背景 -* [ 修改 ] 删除 timeago 插件,更换为更强大的 dayjs -* [ 新增 ] Tomorrow Night Blue 主题 -* [ 修改 ] src/assets/style/public-class.scss 写法优化 -* [ 新增 ] [vue-bigdata-table](https://github.com/lison16/vue-bigdata-table)组件 -* [ 修复 ] 侧边栏内容超过一屏后显示错误 -* [ 新增 ] 自定义滚动条演示页面 -* [ 新增 ] 流星主题新增背景图片上层的半透明遮罩 -* [ 修复 ] 主题设置失效bug -* [ 修复 ] router守卫验证登陆部分代码修改 -* [ 修复 ] d2-container 组件改为同步注册(之前的异步注册会有 mounted 生命周期问题,即 slot 内的页面在 mounted 生命周期内拿不到 dom) -* [ 修复 ] d2-container 组件重构 flex 布局 -* [ 新增 ] 404 page -* [ 新增 ] 顶栏联系方式 -* [ 新增 ] 右键菜单组件 -* [ 新增 ] 菜单配置支持空菜单(项目开发的时候有可能需要先把菜单做好查看效果) -* [ 优化 ] 页面左侧菜单滚动条优化 -* [ 修复 ] CSS 边距工具类都加上了 `!important` 来保证在覆盖样式时生效 -* [ 修复 ] IE11 兼容性修复 - -写这篇文章的时候心情竟然出奇地平静,终于发新版了,总算松了一口气... - -### 下阶段的计划: - -* ice 版本 -* bug 修复 - -## 项目地址 - -| 地址 | 描述 | -| --- | --- | -| [团队主页](https://github.com/d2-projects) | D2Admin 所属的团队主页 | -| [中文文档](http://d2admin.fairyever.com/zh/) | 中文文档 | -| [完整版 预览地址](https://fairyever.gitee.io/d2-admin-preview/#/index) | 完整版 预览地址 | -| [完整版 github](https://github.com/d2-projects/d2-admin) | 完整版 Github 仓库 | -| [完整版 码云](https://gitee.com/fairyever/d2-admin) | 完整版 码云镜像仓库 | -| [简化版 预览地址](https://fairyever.gitee.io/d2-admin-start-kit-preview/#/index) | 简化版 预览地址 | -| [简化版 github](https://github.com/d2-projects/d2-admin-start-kit) | 简化版 Github 仓库 | -| [简化版 码云](https://gitee.com/fairyever/d2-admin-start-kit) | 简化版 码云镜像仓库 | - -在最后,如果你看完了,并且觉得还不错,希望可以到 [项目主页](https://github.com/d2-projects/d2-admin) 上点一个 **star** 作为你对这个项目的认可与支持,谢谢。 - diff --git a/docs/zh/article/update/1.1.5.md.REMOVED.git-id b/docs/zh/article/update/1.1.5.md.REMOVED.git-id deleted file mode 100644 index 2600a1c6..00000000 --- a/docs/zh/article/update/1.1.5.md.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -05ccbdf3de53a90253dd94be5732f56d8b7235e9 \ No newline at end of file diff --git a/docs/zh/article/update/ice-1.1.2.md b/docs/zh/article/update/ice-1.1.2.md deleted file mode 100644 index 03427e20..00000000 --- a/docs/zh/article/update/ice-1.1.2.md +++ /dev/null @@ -1,226 +0,0 @@ -# D2Admin ICE 发布 - -# 可视化搭建前端工程 - 阿里飞冰了解一下 - -飞冰官方网站 [https://alibaba.github.io/ice](https://alibaba.github.io/ice) - -每次新做一个项目,无论大小都要干这些事: - -* 框架选型 -* 初始化脚手架(比如使用 **create-react-app** 或者 **vue-cli**) -* 也可能你选择了开源脚手架,克隆仓库 -* 四处找轮子 -* 安装各种依赖 -* 新建页面,写逻辑 -* 设计菜单 -* 设计路由 -* 新建页面的时候去复制旧的页面修改 -* 把新的页面注册路由,注册菜单 -* 做完了这个页面做下个,新建文件,复制代码,注册路由... - -**烦不烦?要优雅!** - -今天介绍阿里的开源产品:[飞冰](https://alibaba.github.io/ice) - -## 飞冰是什么 - -![](http://fairyever.qiniudn.com/20180803020053.png) - -"海量可复用物料,通过 GUI 工具极速构建中后台应用"。 - -这句 slogan 还是非常准确的: - -飞冰是一套综合解决方案,用来极速构建中后台应用(其实也可以做非中后台应用)。 - -可以做到极速是通过『海量可复用物料』和『GUI 开发工具』实现的。 - -使用飞冰的开发工作流是这样的: - -`下载 GUI 工具并安装` => `可视化的选择我们提供的初始模板创建项目` => `可视化的创建页面并选择我们提供的 100+ 高质量可复用区块` => `生成代码进行二次开发` => `开发完成之后点击打包编译出 HTML、JS、CSS 文件` => `部署使用` - -在整个流程中,你可以完全通过 GUI 工具点击操作,无需安装配置 Node 环境等前端开发工具,也无需配置 webpack 等构建脚本,我们已经按照淘宝前端最佳实践全部内置。此外,绝大部分的业务需求,我们都已经开发出对应的物料,可以通过 GUI 进行可视化的拼装,尽可能避免你去编写额外的业务逻辑。 - -### 物料源 - -下面是一张很长的图片,为了体积考虑这张图比较模糊,但是可以感受一下 ICE 的区块数量: - -> 原始网页链接 [https://alibaba.github.io/ice/block](https://alibaba.github.io/ice/block) - -![](http://fairyever.qiniudn.com/20180803005118.jpg) - -目前为止 ICE 已经支持 react vue Angular 三大主流框架的物料资源 - -![](http://fairyever.qiniudn.com/20180803005219.png) - -打比方我现在项目需要富文本编辑器,可以看到区块里提供了三款编辑器可供选择 - -![](http://fairyever.qiniudn.com/20180803005411.png) - -所有的这些,都是使用 GUI 就可以加入到项目中使用的,下面将会展示如何从安装 iceworks 客户端到在项目中新建页面。 - -## 如何使用 - -### 安装 - -> 为了真实演示,特意删掉了以前安装的 app - -演示系统为 macOS,iceworks 支持 Windows 版本。 - -iceworks 下载地址 [https://alibaba.github.io/ice/iceworks](https://alibaba.github.io/ice/iceworks) - -![](http://fairyever.qiniudn.com/20180803005813.png) - -稍微等待了一会儿,下载完成。安装后得到了这样一个 App: - -![](http://fairyever.qiniudn.com/20180803010417.png) - -### 上手 - -安装后打开看到一个很简单的界面: - -![](http://fairyever.qiniudn.com/20180803010628.png) - -切换到模板标签可以看到飞冰目前提供的脚手架列表: - -![](http://fairyever.qiniudn.com/20180803010704.png) - -区块标签可以看到区块列表 - -![](http://fairyever.qiniudn.com/20180803011044.gif) - -插件 - -![](http://fairyever.qiniudn.com/20180803011128.png) - -设置 - -![](http://fairyever.qiniudn.com/20180803011150.png) - -这就是表面上所有的功能,下面我们来建一个项目体验一下 - -### 新建 vue 项目 - -飞冰是从 react 开始做的,现在 vue 和 Angular 物料源还比较少,我们切换到 vue 选项卡里... - -![](http://fairyever.qiniudn.com/20180803011329.png) - -**是不是混进了什么奇怪的东西!** - -![](http://fairyever.qiniudn.com/20180803011519.png) - -没错,D2Admin 出了 ICE 版! - -在我和阿里的开发者**一个月**的对接之后,D2Admin ICE 诞生了,作为飞冰平台上第一个**非官方 vue 脚手架**,D2Admin ICE 承担的希望还是很大的!下面使用这个脚手架做演示,展示如何**不写代码**建页面,**不写代码**出图表! - -选择 D2Admin ICE 作为起始模板后会让我们填写项目保存地址: - -![](http://fairyever.qiniudn.com/20180803011843.png) - -填写完成后开始下载模板,下载后会提示我是否要立刻安装依赖: - -![](http://fairyever.qiniudn.com/20180803012018.gif) - -为了避免动态图过大我没有录安装过程: - -![](http://fairyever.qiniudn.com/20180803012215.png) - -在写上面的时候已经提示我依赖安装完成了(很人性化有没有): - -![](http://fairyever.qiniudn.com/20180803012311.png) - -![](http://fairyever.qiniudn.com/20180803012346.png) - -ennn...没毛病。 - -### 启动项目 - -点击 `启动调试服务` 会在本地打开调试服务,vue 项目默认执行的是 `npm start`: - -![](http://fairyever.qiniudn.com/20180803012548.gif) - -打开显示的链接,可以看到项目已经稳稳地跑起来了: - -![](http://fairyever.qiniudn.com/20180803012748.png) - -D2Admin ICE 实质上是 [d2-admin-start-kit](https://github.com/d2-projects/d2-admin-start-kit) 的特别版本,为适应 ICE 的逻辑修改了一部分代码,可以看到模板十分干净,没有了任何完整版的示例 demo: - -![](http://fairyever.qiniudn.com/20180803012914.png) - -关闭 ICE 内集成的终端后可以看到项目面板,可以显示出现在有哪些页面,安装了哪些依赖等: - -![](http://fairyever.qiniudn.com/20180803013159.png) - -### 新建页面 - -点击 `新建页面` 会打开新建页面界面: - -![](http://fairyever.qiniudn.com/20180803013712.png) - -随便选择一个区块新建一个页面(中间的等待时间是 iceworks 在从 npm 下载区块代码) - -![](http://fairyever.qiniudn.com/20180803013831.gif) - -选择区块: - -![](http://fairyever.qiniudn.com/20180803014037.png) - -效果: - -![](http://fairyever.qiniudn.com/20180803014058.png) - -下面尝试一下选择多个区块: - -![](http://fairyever.qiniudn.com/20180803014157.png) - -![](http://fairyever.qiniudn.com/20180803014244.png) - -自动生成了菜单: - -![](http://fairyever.qiniudn.com/20180803014402.png) - -页面效果: - -![](http://fairyever.qiniudn.com/20180803014605.gif) - -检查一下自动生成的代码目录: - -![](http://fairyever.qiniudn.com/20180803014743.png) - -自动生成的页面组件: - -![](http://fairyever.qiniudn.com/20180803015016.png) - -自动生成的样式文件: - -![](http://fairyever.qiniudn.com/20180803015047.png) - -该有的都有了,不该有的也有了,连生命周期钩子都帮你写了一遍! - -## 结语 - -演示一遍下来后,我生成了两个页面,没有写一行代码,剩下的操作就是修修改改,把多个页面都需要的组件提取一下,做做修改工作。 - -D2Admin 团队也会在以后的时间里尽力和 ICE 团队合作开发 vue 公用区块,加速 ICE 的 vue 生态建设,也希望众多的 vuer 都可以参与进来,平台有了,社区繁荣起来才是对大家都有利的事情。 - -D2Admin ICE 将会保持和 D2Admin Start Kit 一致更新,如果你看到完整版的 D2Admin 实在喜欢,从完整版做减法也未尝不可 :) - -## D2 Projects - -| 地址 | 描述 | -| --- | --- | -| [团队主页](https://github.com/d2-projects) | D2Admin 所属的团队主页 | -| [中文文档](http://d2admin.fairyever.com/zh/) | 中文文档 | -| [D2Admin 完整版 预览地址](https://fairyever.gitee.io/d2-admin-preview/#/index) | 完整版 预览地址 | -| [D2Admin 完整版 github](https://github.com/d2-projects/d2-admin) | 完整版 Github 仓库 | -| [D2Admin 完整版 码云](https://gitee.com/fairyever/d2-admin) | 完整版 码云镜像仓库 | -| [D2Admin 简化版 预览地址](https://fairyever.gitee.io/d2-admin-start-kit-preview/#/index) | 简化版 预览地址 | -| [D2Admin 简化版 github](https://github.com/d2-projects/d2-admin-start-kit) | 简化版 Github 仓库 | -| [D2Admin 简化版 码云](https://gitee.com/fairyever/d2-admin-start-kit) | 简化版 码云镜像仓库 | - -开源项目组官方公众号 - - - -[本文在项目文档中收录位置](http://d2admin.fairyever.com/zh/article/update/ice-1.1.2.html) - -在最后,如果你看完了,并且觉得还不错,希望可以到 [项目主页](https://github.com/d2-projects/d2-admin) 上点一个 **star** 作为你对这个项目的认可与支持,谢谢。 \ No newline at end of file diff --git a/docs/zh/components/README.md b/docs/zh/components/README.md deleted file mode 100644 index 2fd73b8a..00000000 --- a/docs/zh/components/README.md +++ /dev/null @@ -1,3 +0,0 @@ -# 组件概述 - -d2-admin(以下简称 d2admin)封装(或者集成第三方)了一些组件,方便开发者进行开发,具体组件文档请从左侧列表进入 \ No newline at end of file diff --git a/docs/zh/components/charts-new.md b/docs/zh/components/charts-new.md deleted file mode 100644 index 7e423905..00000000 --- a/docs/zh/components/charts-new.md +++ /dev/null @@ -1,13 +0,0 @@ -# 图表 [ v-charts ] 新 - -::: tip -`1.1.0` 版本使用的是 `G2` 图表库,`1.1.3` 开始使用 `v-charts` -::: - -## 介绍 - -在使用 echarts 生成图表时,经常需要做繁琐的数据类型转化、修改复杂的配置项,v-charts 的出现正是为了解决这个痛点。基于 Vue2.0 和 echarts 封装的 v-charts 图表组件,只需要统一提供一种对前后端都友好的数据格式设置简单的配置项,便可轻松生成常见的图表。 - -[v-charts 文档](https://v-charts.js.org/#/) - -处于对用户使用方便的角度考虑,从 `1.1.3` 开始使用 v-charts。项目中已经安装并注册完毕 v-charts,你可以直接使用 \ No newline at end of file diff --git a/docs/zh/components/charts.md b/docs/zh/components/charts.md deleted file mode 100644 index 024f7039..00000000 --- a/docs/zh/components/charts.md +++ /dev/null @@ -1,76 +0,0 @@ -# 图表 [ G2 ] 旧 - -::: tip -此文档仅对 `1.1.0` 及其以下版本有效,`1.1.1` 开始变更了图表库 -::: - -## 介绍 - -D2Admin 集成了由蚂蚁金服出品的 **G2** 图表库 - -## 实现方式 - -`src/components/charts/register.js` 为注册图表组件的文件 - -`src/components/charts/G2` 为图表组件存放位置 - -`src/components/charts/G2/mixins/G2.js` 是图表最主要的文件,这是一个所有的图表组件都会使用的 mixin,这个 mixin 主要有以下用途 - - - 将 G2 和 DataSet 绑定到 data 上,方便组件使用,省去重复 `import G2 from '@antv/g2'` 等 - - 将 [G2 Chart类](http://antv.alipay.com/zh-cn/g2/3.x/api/chart.html#_Chart) 的属性全部暴露为 Vue 组件参数,这些参数会在初始化图表时用到 - - 提供了额外的设置参数,比如自动高度,自动初始化,初始化延时 - - 关闭 G2 的体验改进计划打点请求 - - data 上的 chart 对象 - - 自动初始化(或者不初始化)图表 - - `creatChart` 方法,根据参数设置生成 data 上的 chart 对象 - - `resize` 方法 - -在图表组件中使用这个 mixin 示例 - -``` vue - - - -``` - -上面的代码段展示了如何使用 mixin 快速制作一个图表组件,只需根据某个图表的个性化需要,在组件中重新定义 `init` 和 `changeData` 方法即可 - -你可以修改这个 mixin 去实现更多的功能,同时影响所有的图表组件 - -::: tip -这只仅仅是作者个人对于图表封装的一个实现思路 -::: - -## 为什么没有选择其他产品 - -G2 完全可以胜任一般的后台界面报表图表需求,而且官网文档清晰友好 - -如果你需要更酷炫的图表,也完全可以剔除集成的库,换用 百度的[echarts](http://echarts.baidu.com/) 或者超级强大的 [d3.js](https://d3js.org/) \ No newline at end of file diff --git a/docs/zh/components/container.md.REMOVED.git-id b/docs/zh/components/container.md.REMOVED.git-id deleted file mode 100644 index 2712e40f..00000000 --- a/docs/zh/components/container.md.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -be315dc4b20db4a72f9543b102c601365693b67d \ No newline at end of file diff --git a/docs/zh/components/count-up.md b/docs/zh/components/count-up.md deleted file mode 100644 index a8f1844b..00000000 --- a/docs/zh/components/count-up.md +++ /dev/null @@ -1,29 +0,0 @@ -# 数字动画 - -## 参数 - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| start | 起始值 | 非 | Number | | 0 | -| end | 结束值 | 是 | Number | | 0 | -| decimals | 小数位数 | 非 | Number | | 0 | -| duration | 持续时间 | 非 | Number | | 2 | -| options | 设置项 | 非 | Object | | 空对象 | -| callback | 回调函数 | 非 | Function | | 空函数 | - -## 示例 - -``` vue -// 基本使用方法 - - -// 设置始末值 - - -// 设置动画时间 - -``` - -组件会在页面上渲染 `` 标签 - -组件根据 [countUp.js](https://github.com/inorganik/countUp.js) 封装,`options` 参数详见原始插件文档 \ No newline at end of file diff --git a/docs/zh/components/highlight.md b/docs/zh/components/highlight.md deleted file mode 100644 index f8830d31..00000000 --- a/docs/zh/components/highlight.md +++ /dev/null @@ -1,22 +0,0 @@ -# 代码高亮 - -## 参数 - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| code | 代码字符串 | 非 | String | | console.log('you lost code prop') | -| format-html | 是否格式化 HTML | 非 | Boolean | | false | - -::: tip -format 建议只在内容为 HTML 的时候打开,如果内容不是 HTML,设置为 true 会有负面效果 -::: - -## 示例 - -``` vue - -``` - -::: tip -本框架只是提供代码高亮的简单实现,如需实现更高级的设置请修改组件代码 -::: \ No newline at end of file diff --git a/docs/zh/components/icon-select.md b/docs/zh/components/icon-select.md deleted file mode 100644 index c44e6c8f..00000000 --- a/docs/zh/components/icon-select.md +++ /dev/null @@ -1,12 +0,0 @@ -# 图标 - 选择器 - -## 参数 - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| value | 绑定的值,可以使用 v-model | 非 | String | | | -| placeholder | 占位符,显示在未选择之前的按钮和输入框中 | 非 | String | | 请选择 | -| placement | 界面探出方向 | 非 | String | 同 Popover 组件 placement 参数 | right | -| clearable | 是否允许清空 | 非 | Boolean | | true | -| userInput | 是否允许用户自由输入 | 非 | Boolean | | false | -| autoClose | 是否在选择后自动关闭 | 非 | Boolean | | true | \ No newline at end of file diff --git a/docs/zh/components/icon-svg.md b/docs/zh/components/icon-svg.md deleted file mode 100644 index 2bbdd0d5..00000000 --- a/docs/zh/components/icon-svg.md +++ /dev/null @@ -1,34 +0,0 @@ -# 图标 - SVG - -## 参数 - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| name | 图标名称 | 非 | String | src/assets/icons/svg 中 .svg 文件名 | 空 | - -## 使用方法 - -首先将下载的 .svg 图标放入 `src/assets/icons/svg` 文件夹下 - -然后使用组件 - -``` vue - -``` - -## 获取已经注册的所有图标 - -你已经发现了,只需要将图标文件放入项目中就会自动注册 - -这是因为已经对 `webpack` 和 `svg-sprite-loader` 进行了相关设置,`src/assets/icons/svg` 文件夹中的图标会自动注册到项目中,文件全部打包成 svg-sprite,名称注册到 `Vue.$IconSvg` 属性中 - -所以如果你需要检查项目中已经注册的所有图标,可以通过如下方式 - -``` js -// 在 vue 单文件组件中 -console.log(this.$IconSvg) -``` - -## 参考 - -演示图标来源 [iconfont.cn @龙正昆《常用的50个4px双色图标库》](http://iconfont.cn/collections/detail?spm=a313x.7781069.1998910419.d9df05512&cid=4878) \ No newline at end of file diff --git a/docs/zh/components/icon.md b/docs/zh/components/icon.md deleted file mode 100644 index aae2eab4..00000000 --- a/docs/zh/components/icon.md +++ /dev/null @@ -1,41 +0,0 @@ -# 图标 - -## 参数 - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| name | 图标名称 | 非 | String | font-awesome 所有图标名 | font-awesome | - -## 使用方法 - -基本 - -``` vue -// 这样用没有毛病 但是也没什么用 - - -// 指定图标名称 - - -// 设置行内样式 - - -// 设置 class - -``` - -这个组件只是简化了写法而已 - -``` vue - -// 等同于 - -``` - -## 参考 - -图标索引 - -[Font Awesome 中文网](http://www.fontawesome.com.cn/faicons/) - -[fontawesome.com](https://fontawesome.com/icons?d=gallery) \ No newline at end of file diff --git a/docs/zh/components/image/baiduyun.png.REMOVED.git-id b/docs/zh/components/image/baiduyun.png.REMOVED.git-id deleted file mode 100644 index b72710d1..00000000 --- a/docs/zh/components/image/baiduyun.png.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -3a5bb0f2628d9251bbe7474c0535258784cf770b \ No newline at end of file diff --git a/docs/zh/components/markdown.md b/docs/zh/components/markdown.md deleted file mode 100644 index cb8af8b1..00000000 --- a/docs/zh/components/markdown.md +++ /dev/null @@ -1,88 +0,0 @@ -# markdown 渲染器 - -## 参数 - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| url | markdown文件地址 | 非 | String | | 无 | -| source | markdown内容 | 非 | String | | 无 | -| highlight | 代码高亮 | 非 | Boolean | | false | -| baidupan | 百度网盘分享链接显示优化 | 非 | Boolean | | true | - -## 使用方法 - -加载一个.md文件 - -``` vue - -``` - -加载资源 - -```vue - - - -``` - -D2Admin 已经帮你配置好 webpack,你可以使用以下方式加载 markdown 文件 - -```vue - - - -``` - -## 百度网盘分享链接优化 - -当书写类似下面的分享链接时 - -::: tip -需要 `baidupan = true` -::: - -``` -普通分享链接 - -> https://pan.baidu.com/s/1kW6uUwB - -私密分享链接 - -> 链接: https://pan.baidu.com/s/1ggFW21l 密码: 877y -``` - -markdown 中引用部分的文本由于被识别为百度云的分享链接,所以不会被当做 `blockquote` 渲染(非百度云链接的引用行不会改变),会以一种特别的块来显示,效果见下 - -![效果](./image/baiduyun.png) - -::: tip -了解 D2Admin 是如何在 markdown 中匹配百度云链接的? [查看源码](https://github.com/d2-projects/d2-admin/blob/master/src/components/core/d2-markdown/index.vue) -::: \ No newline at end of file diff --git a/docs/zh/guide/change-log.md b/docs/zh/guide/change-log.md deleted file mode 100644 index ae6eb9ad..00000000 --- a/docs/zh/guide/change-log.md +++ /dev/null @@ -1,129 +0,0 @@ -# 更新日志 - -## v1.1.8 - -* [ 新增 ] 增加了错误收集和日志收集功能 -* [ 新增 ] 增加了一个表格示例页面 -* [ 修改 ] bug 修复 - -## v1.1.7 - -* [ 修改 ] 多标签页右键菜单 bug 修复 - -## v1.1.6 - -* [ 新增 ] 新增加了多页控制组件 tab 按钮上的右键操作菜单,现在你可以在 D2Admin 中像使用浏览器一样操作多标签页 - -## v1.1.5 - -* [ 修改 ] vue-cli3 项目重构,目录调整 -* [ 修改 ] 全局状态管理设计优化 -* [ 修改 ] 多标签页操作全部转移至 vuex -* [ 修改 ] 修复了多标签页无法清除缓存的 bug -* [ 修改 ] bug fixed [#38](https://github.com/d2-projects/d2-admin/issues/38) -* [ 修改 ] bug fixed [#41](https://github.com/d2-projects/d2-admin/issues/41) -* [ 修改 ] 侧边栏和顶栏菜单数据控制转移到 vuex 集中管理 -* [ 修改 ] 页面最小宽度设置 -* [ 新增 ] d2-highlight 组件新增 format-html 参数 -* [ 新增 ] 自动获取用户浏览器 UA -* [ 新增 ] playground 新增浏览器信息查看界面 -* [ 修改 ] 登陆注销逻辑移至 vuex -* [ 新增 ] 登陆页面新增快速选择用户示例 -* [ 新增 ] 侧边栏切换控制辑移至 vuex -* [ 新增 ] 判断手机浏览自动跳转至提示页面 -* [ 修改 ] 侧边栏弹出菜单尺寸缩小以容纳更多菜单 -* [ 修改 ] d2-container 组件重构,每种模式现都支持 scroll 属性以及 header footer 插槽 -* [ 修改 ] 修复全屏按钮退出全屏状态不更新的 bug -* [ 修改 ] 修复多标签页缓存逻辑 bug -* [ 新增 ] 持久化存储根据系统版本区分数据,防止因更新导致数据错乱 -* [ 新增 ] 注销画面灰度效果 -* [ 新增 ] .d2-card 样式类,可以让 el-card 具有跟随主题变化的样式 -* [ 新增 ] ElementUI 表格组件全部示例移植 -* [ 新增 ] 全局状态管理 playground -* [ 新增 ] 用户私有持久化数据 playground -* [ 新增 ] 侧边栏和顶栏菜单设置 playground -* [ 新增 ] d2-container 组件 card 模式下 footer 样式优化 -* [ 修改 ] 侧边栏折叠模式下弹出菜单尺寸缩小 -* [ 修改 ] 默认取消了侧边栏的自定义滚动条显示 -* [ 新增 ] cookie 读写包装 -* [ 新增 ] 持久化存储读写包装,提供快速操作当前用户数据的 mutation -* [ 新增 ] 持久化存储读写包装,提供快速操作所有用户共享数据的 mutation -* [ 新增 ] 侧边栏折叠状态现在会根据用户区分记录,刷新页面保留之前的状态 - -## v1.1.4 - -* [ 修改 ] 全局状态管理设计优化 -* [ 修改 ] 主题调优 -* [ 新增 ] playground 模块,方便测试和展示一些功能实现方式/调用方法 -* [ 新增 ] 灰度模式 -* [ 新增 ] 多页模式 -* [ 新增 ] 多页模式缓存 -* [ 新增 ] 多页模式快速关闭(关闭左侧 右侧 全部 其它) -* [ 修改 ] 侧边栏滚动优化 -* [ 新增 ] `d2-container` 填充模式自定义滚动条 -* [ 新增 ] `d2-container` 组件卡片和隐形模式自定义滚动条 -* [ 新增 ] 现在页面标题可以根据路由做出对应变化了 -* [ 新增 ] 版本检查机制 -* [ 新增 ] `d2-container` 隐形模式支持 header 插槽 -* [ 新增 ] 版本检查可以设置为不显示提示框 -* [ 新增 ] 集成 json 查看组件 -* [ 新增 ] 添加了所有图表种类的演示页面 -* [ 修改 ] 修改布局方式,解决了在 Firefox 上 better-scroll 初始化拿不到正确高度的 bug -* [ 新增 ] 右上角显示用户名,用户名持久存储 - -## v1.1.3 - -* [ 修复 ] 侧边栏在折叠时不显示的 bug -* [ 新增 ] v-charts 插件 -* [ 新增 ] 一些演示图表(后续打算把 v-charts 文档上有示例性的演示都展示一下) -* [ 修改 ] D2Admin 经典主题颜色调整 -* [ 新增 ] violet 主题 -* [ 新增 ] 菜单图标 -* [ 修改 ] 新制作了 Fork me 图片 - -## v1.1.2 - -* [ 修改 ] 删除了 G2 相关的依赖 - -## v1.1.1 - -* [ 修改 ] 删除了 G2 相关的代码(移除图表库) -* [ 优化 ] 侧边栏取值逻辑 - -## v1.1.0 - -* [ 修改 ] 顶栏和侧边栏菜单新的结构生成方式,新的方案使用 数据 + 递归组件 实现无限制多级菜单 -* [ 修改 ] 路由注册回归最简单的写法 -* [ 修复 ] 首次加载 loading 样式类名和程序内类名冲突,新的加载类名使用 d2-app-loading 前缀 -* [ 修改 ] 所有类似 dd- 的样式前缀(包括自动注册图标的id前缀)统一改为 d2- -* [ 修复 ] 修复 d2-highlight 组件和 d2-markdown 组件的样式冲突 -* [ 修改 ] 内置组件名称统一改为 d2- 前缀,统一使用横线连接 (kebab-case) 风格 -* [ 修改 ] 顶栏 logo 阴影删除 -* [ 新增 ] 主题系统 -* [ 新增 ] 三个主题,分别为 d2admin 经典,简约线条,流星 -* [ 修改 ] d2-markdown 组件 md 参数改名为 source -* [ 修改 ] 删除了 d2-markdown 组件中图片的白色背景 -* [ 修改 ] 删除 timeago 插件,更换为更强大的 dayjs -* [ 新增 ] Tomorrow Night Blue 主题 -* [ 修改 ] src/assets/style/public-class.scss 写法优化 -* [ 新增 ] [vue-bigdata-table](https://github.com/lison16/vue-bigdata-table)组件 -* [ 修复 ] 侧边栏内容超过一屏后显示错误 -* [ 新增 ] 自定义滚动条演示页面 -* [ 新增 ] 流星主题新增背景图片上层的半透明遮罩 -* [ 修复 ] 主题设置失效bug -* [ 修复 ] router守卫验证登陆部分代码修改 -* [ 修复 ] d2-container 组件改为同步注册(之前的异步注册会有 mounted 生命周期问题,即 slot 内的页面在 mounted 生命周期内拿不到 dom) -* [ 修复 ] d2-container 组件重构 flex 布局 -* [ 新增 ] 404 page -* [ 新增 ] 顶栏联系方式 -* [ 新增 ] 右键菜单组件 -* [ 新增 ] 菜单配置支持空菜单(项目开发的时候有可能需要先把菜单做好查看效果) -* [ 优化 ] 页面左侧菜单滚动条优化 -* [ 修复 ] CSS 边距工具类都加上了 `!important` 来保证在覆盖样式时生效 -* [ 修复 ] IE11 兼容性修复 - -## v1.0.0 - -[https://github.com/d2-projects/d2-admin/releases/tag/v1.0.0](https://github.com/d2-projects/d2-admin/releases/tag/v1.0.0) - -这是第一个版本,还有一点小问题,但是已经可用 \ No newline at end of file diff --git a/docs/zh/guide/image/join@2x.png.REMOVED.git-id b/docs/zh/guide/image/join@2x.png.REMOVED.git-id deleted file mode 100644 index 597c865a..00000000 --- a/docs/zh/guide/image/join@2x.png.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -f7a47389e6c0773e9d218227678ebb8850ea87e8 \ No newline at end of file diff --git a/docs/zh/guide/image/preview@2x.png.REMOVED.git-id b/docs/zh/guide/image/preview@2x.png.REMOVED.git-id deleted file mode 100644 index 7b05e991..00000000 --- a/docs/zh/guide/image/preview@2x.png.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -27e431bd9e4752dd51fe827a1281d606bd7bdf07 \ No newline at end of file diff --git a/docs/zh/guide/plagiarize.md b/docs/zh/guide/plagiarize.md deleted file mode 100644 index 28c4a3db..00000000 --- a/docs/zh/guide/plagiarize.md +++ /dev/null @@ -1,49 +0,0 @@ ---- -sidebarDepth: 3 ---- - -# 借鉴 D2Admin 的项目 - -以下开源项目中借鉴了 D2Admin 代码。 - -本页面不明确指出哪些是借鉴哪些是抄袭,由读者自行判断。 - -本页面作用是指明哪些东西是 D2Admin 原创的,避免大家看到和其它项目有类似设计时发生误会以为 D2 抄袭他人(误会发生过)。 - -::: tip -图片右键在新标签页打开查看大图 -::: - -**此页面截图都会标注日期,只新增,不删除,只代表当时日期的状态** - -## nx-admin - -[https://github.com/mgbq/nx-admin](https://github.com/mgbq/nx-admin) - -### 2018年7月29日 - -* 项目首页已经放置 D2Admin 链接 - -| D2Admin | nx-admin | -| --- | --- | -| ![](http://fairyever.qiniudn.com/20180727103812.png) | ![](http://fairyever.qiniudn.com/20180727103329.png) | -| ![](http://fairyever.qiniudn.com/20180727103923.png) | ![](http://fairyever.qiniudn.com/20180727103931.png) | -| ![](http://fairyever.qiniudn.com/20180727104208.png) | ![](http://fairyever.qiniudn.com/20180727104213.png) | -| ![](http://fairyever.qiniudn.com/20180727104225.png) | ![](http://fairyever.qiniudn.com/20180727104232.png) | -| ![](http://fairyever.qiniudn.com/20180727104240.png) | ![](http://fairyever.qiniudn.com/20180727104245.png) | -| ![](http://fairyever.qiniudn.com/20180729104137.png) | ![](http://fairyever.qiniudn.com/20180729104152.png) | - -## avue - -[https://github.com/nmxiaowei/avue](https://github.com/nmxiaowei/avue) - -### 2018年7月29日 - -* 项目首页已经放置 D2Admin 链接 - -| D2Admin | avue | -| --- | --- | -| ![](http://fairyever.qiniudn.com/20180729105741.png) | ![](http://fairyever.qiniudn.com/20180729105748.png) | -| ![](http://fairyever.qiniudn.com/20180729110207.png) | ![](http://fairyever.qiniudn.com/20180729110231.png) | -| ![](http://fairyever.qiniudn.com/20180729105822.png) | ![](http://fairyever.qiniudn.com/20180729105839.png) | -| ![](http://fairyever.qiniudn.com/20180729105855.png) | ![](http://fairyever.qiniudn.com/20180729105908.png) | diff --git a/docs/zh/guide/question.md.REMOVED.git-id b/docs/zh/guide/question.md.REMOVED.git-id deleted file mode 100644 index c1c50c28..00000000 --- a/docs/zh/guide/question.md.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -532775ff4f2aa6aa090e14f5d53c5d59bd7d960e \ No newline at end of file diff --git a/docs/zh/guide/README.md b/docs/zh/learn-guide/README.md similarity index 95% rename from docs/zh/guide/README.md rename to docs/zh/learn-guide/README.md index 5260c360..44bfcf70 100644 --- a/docs/zh/guide/README.md +++ b/docs/zh/learn-guide/README.md @@ -23,23 +23,13 @@ D2Admin 是一个开源的管理系统前端集成方案 [码云仓库](https://gitee.com/fairyever/d2-admin-start-kit) | [预览地址](https://fairyever.gitee.io/d2-admin-start-kit-preview/#/index) -![preview](./image/preview@2x.png) - D2Admin 完整版集成了很多的插件和组件,首次加载会占用很多的时间,所以加入了首屏加载动画。 如果您欣赏 D2Admin 的设计风格,希望基于它开发您的管理系统,**建议使用 [d2-admin-start-kit 简化模板](https://github.com/d2-projects/d2-admin-start-kit)**,简化版模板保留了所有的系统功能,包括登陆注销,主题切换,图标,数据持久化等。其它不必要的组件和插件您可以参照 D2Admin 完整版自行加入。 如果您执意在完整版基础上开发,请您在发布之前一定要删除没有用到的代码,比如项目没有用到图表、示例、插件组件。 -D2Admin 是完全开源免费的管理系统集成方案,由 [FairyEver](https://github.com/FairyEver) 工作之余完完成(希望您看到这里,可以移步 [Github](https://github.com/d2-projects/d2-admin) 点个 star 支持我),如果你也一样喜欢前端开发,欢迎加入我们的讨论/学习群,群内可以`提问答疑`,`分享学习资料`。 - -![preview](./image/join@2x.png) - -::: tip Thanks -D2Admin 创建于2018年1月14日零点51分,四个月后在2018年5月26日正式发布,39天时间 star 突破 1k ,在此对所有的 D2Admin 支持者表示感谢,项目将会保持更新,如果你有想法、建议、或者问题欢迎加群讨论 - -—— 2018年7月5日 -::: +D2Admin 是完全开源免费的管理系统集成方案,由 [FairyEver](https://github.com/FairyEver) 工作之余完完成(希望您看到这里,可以移步 [Github](https://github.com/d2-projects/d2-admin) 点个 star 支持我)。 ## 功能 @@ -153,4 +143,14 @@ npm run dev npm run build ``` -> 如果上述步骤出现错误,建议您升级 node 版本 > 8,如果有其它疑问请参考[常见问题](/zh/guide/question.html) \ No newline at end of file +> 如果上述步骤出现错误,建议您升级 node 版本 > 8,如果有其它疑问请参考[常见问题](/zh/guide/question.html) + +## Thanks + +D2Admin 创建于2018年1月14日零点51分,四个月后在2018年5月26日正式发布,39天时间 star 突破 1k ,在此对所有的 D2Admin 支持者表示感谢,项目将会保持更新,如果你有想法、建议、或者问题欢迎加群讨论 + +—— 2018年7月5日 + +star 破 2k + +—— 2018年8月7日 \ No newline at end of file diff --git a/docs/zh/guide/getting-started.md b/docs/zh/learn-guide/getting-started.md similarity index 100% rename from docs/zh/guide/getting-started.md rename to docs/zh/learn-guide/getting-started.md diff --git a/docs/zh/learn-knowledge/README.md b/docs/zh/learn-knowledge/README.md new file mode 100644 index 00000000..6b7d4e47 --- /dev/null +++ b/docs/zh/learn-knowledge/README.md @@ -0,0 +1,15 @@ +--- +sidebar: auto +--- + +# 相关知识 + +介绍开发所需要的知识 + +## CSS + +## SCSS + +## JavaScript + +## webpack \ No newline at end of file diff --git a/docs/zh/others/README.md b/docs/zh/others/README.md deleted file mode 100644 index 7fd6cd21..00000000 --- a/docs/zh/others/README.md +++ /dev/null @@ -1,3 +0,0 @@ -# 其它 - -这里主要是介绍一些其它的信息 \ No newline at end of file diff --git a/docs/zh/others/css.md b/docs/zh/others/css.md deleted file mode 100644 index 1ca48b9a..00000000 --- a/docs/zh/others/css.md +++ /dev/null @@ -1,103 +0,0 @@ -# CSS 工具类 - -## 样式 - -| 类名 | 效果 | -| --- | --- | -| `.d2-card` | 将该 class 添加至 el-card 组件上使其有跟随主题变化的样式 | - -`.d2-card` 示例 - -``` vue - - - body - - -``` - -## 文字 - -| 类名 | 效果 | -| --- | --- | -| `.d2-text-center` | 文字水平居中 | - -## 浮动 - -| 类名 | 效果 | -| --- | --- | -| `.d2-fl` | 左浮动 | -| `.d2-fr` | 右浮动 | -| `.d2-clearfix` | 清除浮动 | - -## 边距 - -| 类名 | 效果 | -| --- | --- | -| `.d2-m-0` | 外边距 0px | -| `.d2-mt-0` | 上外边距 0px | -| `.d2-mr-0` | 右外边距 0px | -| `.d2-mb-0` | 下外边距 0px | -| `.d2-ml-0` | 左外边距 0px | -| `.d2-p-0` | 内边距 0px | -| `.d2-pt-0` | 上内边距 0px | -| `.d2-pr-0` | 右内边距 0px | -| `.d2-pb-0` | 下内边距 0px | -| `.d2-pl-0` | 左内边距 0px | -| `.d2-m-5` | 外边距 5px | -| `.d2-mt-5` | 上外边距 5px | -| `.d2-mr-5` | 右外边距 5px | -| `.d2-mb-5` | 下外边距 5px | -| `.d2-ml-5` | 左外边距 5px | -| `.d2-p-5` | 内边距 5px | -| `.d2-pt-5` | 上内边距 5px | -| `.d2-pr-5` | 右内边距 5px | -| `.d2-pb-5` | 下内边距 5px | -| `.d2-pl-5` | 左内边距 5px | -| `.d2-m-10` | 外边距 10px | -| `.d2-mt-10` | 上外边距 10px | -| `.d2-mr-10` | 右外边距 10px | -| `.d2-mb-10` | 下外边距 10px | -| `.d2-ml-10` | 左外边距 10px | -| `.d2-p-10` | 内边距 10px | -| `.d2-pt-10` | 上内边距 10px | -| `.d2-pr-10` | 右内边距 10px | -| `.d2-pb-10` | 下内边距 10px | -| `.d2-pl-10` | 左内边距 10px | -| `.d2-m-15` | 外边距 15px | -| `.d2-mt-15` | 上外边距 15px | -| `.d2-mr-15` | 右外边距 15px | -| `.d2-mb-15` | 下外边距 15px | -| `.d2-ml-15` | 左外边距 15px | -| `.d2-p-15` | 内边距 15px | -| `.d2-pt-15` | 上内边距 15px | -| `.d2-pr-15` | 右内边距 15px | -| `.d2-pb-15` | 下内边距 15px | -| `.d2-pl-15` | 左内边距 15px | -| `.d2-m-20` | 外边距 20px | -| `.d2-mt-20` | 上外边距 20px | -| `.d2-mr-20` | 右外边距 20px | -| `.d2-mb-20` | 下外边距 20px | -| `.d2-ml-20` | 左外边距 20px | -| `.d2-p-20` | 内边距 20px | -| `.d2-pt-20` | 上内边距 20px | -| `.d2-pr-20` | 右内边距 20px | -| `.d2-pb-20` | 下内边距 20px | -| `.d2-pl-20` | 左内边距 20px | - -## 边距简写 - -20px 设定为通用边距 可以如下简写 - -| 类名 | 效果 | -| --- | --- | -| `.d2-m` | 外边距 20px | -| `.d2-mt` | 上外边距 20px | -| `.d2-mr` | 右外边距 20px | -| `.d2-mb` | 下外边距 20px | -| `.d2-ml` | 左外边距 20px | -| `.d2-p` | 内边距 20px | -| `.d2-pt` | 上内边距 20px | -| `.d2-pr` | 右内边距 20px | -| `.d2-pb` | 下内边距 20px | -| `.d2-pl` | 左内边距 20px | \ No newline at end of file diff --git a/docs/zh/plugins/README.md b/docs/zh/plugins/README.md deleted file mode 100644 index d5688fce..00000000 --- a/docs/zh/plugins/README.md +++ /dev/null @@ -1,7 +0,0 @@ -# 插件概述 - -d2-admin(以下简称 d2admin)封装(或者集成第三方)了一些插件,方便开发者进行开发,具体组件文档请从左侧列表进入 - -::: tip -这里只列出一部分需要特别说明的插件,大部分集成的插件都可以在网络上找到官方文档 -::: \ No newline at end of file diff --git a/docs/zh/plugins/data-export.md b/docs/zh/plugins/data-export.md deleted file mode 100644 index 5ebc9b91..00000000 --- a/docs/zh/plugins/data-export.md +++ /dev/null @@ -1,148 +0,0 @@ -# 表格导出 - -本框架集成了数据导出功能,并包装成插件 - -## 注册插件 - -``` js -import pluginExport from '@/plugin/export' -Vue.use(pluginExport) -``` - -之后就可以在组件中使用 `this.$export` 来调用导出功能 - -::: tip -d2admin 已经帮你注册好,可以直接使用,无需写上面的代码 -::: - -## 导出 csv - -此方法将数据以 `csv` 格式导出,并且返回一个 `Promise` 对象 - -使用 - -``` js -this.$export.csv({ - columns, - data -}) - .then(() => { - // ...可选回调 - }) -``` - -参数 - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| columns | 列 | 非 | Array | | 空数组 | -| data | 行数据 | 非 | Array | | 空数组 | -| title | 文件名 | 非 | String | | table | -| noHeader | 不导出表头 | 非 | Boolean | | false | -| separator | 数据分隔符 | 非 | String | | , | -| quoted | 每项数据是否加引号 | 非 | Boolean | | false | - -示例 - -``` js -const columns = [ - { - label: '姓名', - prop: 'name' - }, - { - label: '年龄', - prop: 'age' - } -] -const data = [ - { - name: 'lucy', - age: 24 - }, - { - name: 'bob', - age: 26 - } -] -this.$export.csv({ - columns, - data -}) -``` - -## 导出 xlsx - -此方法将数据以 `xlsx` 格式导出,并且返回一个 `Promise` 对象 - -使用 - -``` js -this.$export.excel({ - columns, - data -}) - .then(() => { - // ...可选回调 - }) -``` - -参数 - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| columns | 列 | 非 | Array | | 空数组 | -| data | 行数据 | 非 | Array | | 空数组 | -| title | 文件名 | 非 | String | | table | - -示例 - -``` js -const columns = [ - { - label: '姓名', - prop: 'name' - }, - { - label: '年龄', - prop: 'age' - } -] -const data = [ - { - name: 'lucy', - age: 24 - }, - { - name: 'bob', - age: 26 - } -] -this.$export.excel({ - columns, - data -}) -``` - -## 导出 txt - -此方法将数据以 `txt` 格式导出,并且返回一个 `Promise` 对象 - -使用 - -``` js -this.$export.txt({ - text: '文本内容', - title: '文件名' -}) - .then(() => { - // ...可选回调 - }) -``` - -参数 - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| text | 文件内容 | 非 | String | | 空 | -| title | 文件名 | 非 | String | | 文本 | diff --git a/docs/zh/plugins/data-import.md b/docs/zh/plugins/data-import.md deleted file mode 100644 index 817abefe..00000000 --- a/docs/zh/plugins/data-import.md +++ /dev/null @@ -1,64 +0,0 @@ -# 表格导入 - -本框架集成了数据导入功能,并包装成插件 - -## 注册插件 - -``` js -import pluginImport from '@/plugin/import' -Vue.use(pluginImport) -``` - -之后就可以在组件中使用 `this.$import` 来调用导出功能 - -::: tip -d2admin 已经帮你注册好,可以直接使用,无需写上面的代码 -::: - -## 导入 csv - -导入csv文件,并且返回一个 `Promise` 对象 - -``` js -// 在选择文件后调用 -handleUpload (file) { - this.$import.csv(file) - .then(res => { - this.table.columns = Object.keys(res.data[0]).map(e => ({ - label: e, - prop: e - })) - this.table.data = res.data - }) - // 阻止默认的上传 - return false -} -``` - -## 导入 xlsx - -导入xlsx文件,并且返回一个 `Promise` 对象 - -**注意 导入的表格文件第一行应为表头** - -参考下述示例使用 - -``` js -// 在选择文件后调用 -handleUpload (file) { - this.$import.xlsx(file) - .then(({header, results}) => { - // header 为表头 - // results 为内容 - this.table.columns = header.map(e => { - return { - label: e, - prop: e - } - }) - this.table.data = results - }) - // 阻止默认的上传 - return false -} -``` \ No newline at end of file diff --git a/docs/zh/plugins/i18n.md b/docs/zh/plugins/i18n.md deleted file mode 100644 index 12e2522a..00000000 --- a/docs/zh/plugins/i18n.md +++ /dev/null @@ -1,124 +0,0 @@ -# 多国语 - -多国语插件 - -::: tip -此文档仅限于演示如何在 `D2Admin` 中使用多国语言设置 -::: - -公用的语言设置建议放在 `src/i18n` 下 - -i18n 文件夹结构如下所示 - -``` -|__index.js // 主文件 -|__lang // 语言配置文件夹 -| |__cn // 中文 -| | |__index.js // 中文 公用配置 -| |__ja // 日语 -| | |__index.js // 日语 公用配置 -| |__en // 英语 -| | |__index.js // 英语 公用配置 -``` - -在 `src/i18n/index.js` 中导入同级lang文件夹内的语言设置,并导出一个新的 `VueI18n` 实例供 `main.js` 使用 - -``` js -import i18n from './i18n' -new Vue({ - el: '#app', - store, - i18n, // 使用 i18n - router, - template: '', - components: { App } -}) -``` - -## 使用 - -使用 `$t('路径')` - -``` vue - - -``` - -## 局部配置 - -有时候我们只希望在某个文件中配置这个组件的多国语言,如果所有的语言设置都放在 `d2-admin/src/i18n` 中会造成混乱,不易维护 - -`D2Admin` 已经替你安装好了 `vue-i18n-loader`,可以方便地在单文件组件中使用 - -示例 - -``` vue - - - - - -``` - -在同一文件夹下的 `lang.json` - -``` json -{ - "cn": { - "hello": "你好", - "check": { - "title": "请选择", - "label": { - "Beijing": "北京", - "Tokyo": "东京", - "NewYork": "纽约" - } - } - }, - "en": { - "hello": "hello", - "check": { - "title": "Please choose", - "label": { - "Beijing": "Beijing", - "Tokyo": "Tokyo", - "NewYork": "NewYork" - } - } - }, - "ja": { - "hello": "こんにちは", - "check": { - "title": "選択してください", - "label": { - "Beijing": "北京", - "Tokyo": "東京", - "NewYork": "ニューヨーク" - } - } - } -} -``` - -详细教程请查看官方文档,见此页右上角的链接 \ No newline at end of file diff --git a/docs/zh/plugins/mock.md b/docs/zh/plugins/mock.md deleted file mode 100644 index edb33169..00000000 --- a/docs/zh/plugins/mock.md +++ /dev/null @@ -1,221 +0,0 @@ -# 模拟数据 - -在 `src/mock/demo/001.js` 配置拦截返回的数据 - -## 使用 - -``` js -import Mock from 'mockjs' - -Mock.mock('/api/demo/001', { - 'list|4-10': [{ - 'id|+1': 1, - 'name': '@CNAME', - 'star|1-5': '★', - 'delFlag|1': [0, 1], - 'creatDate': '@DATE', - 'address': '@CITY', - 'zip': '@ZIP' - }] -}) -``` - -请求数据 - -``` js -ajax () { - this.$axios.get('/api/demo/001') - .then(res => { - this.table.columns = Object.keys(res.data.list[0]).map(e => ({ - label: e, - prop: e - })) - this.table.data = res.data.list - }) -} -``` - -## mock 语法规范 - -Mock.js 的语法规范包括两部分: - -1. 数据模板定义规范(Data Template Definition,DTD) -2. 数据占位符定义规范(Data Placeholder Definition,DPD) - -### 数据模板定义规范 DTD - -**数据模板中的每个属性由 3 部分构成:属性名、生成规则、属性值:** - -``` js -// 属性名 name -// 生成规则 rule -// 属性值 value -'name|rule': value -``` - -**注意:** - -* _属性名_ 和 _生成规则_ 之间用竖线 `|` 分隔。 -* _生成规则_ 是可选的。 -* _生成规则_ 有 7 种格式: - 1. `'name|min-max': value` - 1. `'name|count': value` - 1. `'name|min-max.dmin-dmax': value` - 1. `'name|min-max.dcount': value` - 1. `'name|count.dmin-dmax': value` - 1. `'name|count.dcount': value` - 1. `'name|+step': value` -* **_生成规则_ 的 含义 需要依赖 _属性值的类型_ 才能确定。** -* _属性值_ 中可以含有 `@占位符`。 -* _属性值_ 还指定了最终值的初始值和类型。 - - - -**生成规则和示例:** - -#### 1. 属性值是字符串 **String** - -1. `'name|min-max': string` - - 通过重复 `string` 生成一个字符串,重复次数大于等于 `min`,小于等于 `max`。 - -2. `'name|count': string` - - 通过重复 `string` 生成一个字符串,重复次数等于 `count`。 - -#### 2. 属性值是数字 **Number** - -1. `'name|+1': number` - - 属性值自动加 1,初始值为 `number`。 - -2. `'name|min-max': number` - - 生成一个大于等于 `min`、小于等于 `max` 的整数,属性值 `number` 只是用来确定类型。 - -3. `'name|min-max.dmin-dmax': number` - - 生成一个浮点数,整数部分大于等于 `min`、小于等于 `max`,小数部分保留 `dmin` 到 `dmax` 位。 - -``` js -Mock.mock({ - 'number1|1-100.1-10': 1, - 'number2|123.1-10': 1, - 'number3|123.3': 1, - 'number4|123.10': 1.123 -}) -// => -{ - "number1": 12.92, - "number2": 123.51, - "number3": 123.777, - "number4": 123.1231091814 -} -``` - -#### 3. 属性值是布尔型 **Boolean** - -1. `'name|1': boolean` - - 随机生成一个布尔值,值为 true 的概率是 1/2,值为 false 的概率同样是 1/2。 - -2. `'name|min-max': value` - - 随机生成一个布尔值,值为 `value` 的概率是 `min / (min + max)`,值为 `!value` 的概率是 `max / (min + max)`。 - -#### 4. 属性值是对象 **Object** - -1. `'name|count': object` - - 从属性值 `object` 中随机选取 `count` 个属性。 - -2. `'name|min-max': object` - - 从属性值 `object` 中随机选取 `min` 到 `max` 个属性。 - -#### 5. 属性值是数组 **Array** - -1. `'name|1': array` - - 从属性值 `array` 中随机选取 1 个元素,作为最终值。 - -2. `'name|+1': array` - - 从属性值 `array` 中顺序选取 1 个元素,作为最终值。 - -3. `'name|min-max': array` - - 通过重复属性值 `array` 生成一个新数组,重复次数大于等于 `min`,小于等于 `max`。 - -4. `'name|count': array` - - 通过重复属性值 `array` 生成一个新数组,重复次数为 `count`。 - -#### 6. 属性值是函数 **Function** - -1. `'name': function` - - 执行函数 `function`,取其返回值作为最终的属性值,函数的上下文为属性 `'name'` 所在的对象。 - -#### 7. 属性值是正则表达式 **RegExp** - -1. `'name': regexp` - - 根据正则表达式 `regexp` 反向生成可以匹配它的字符串。用于生成自定义格式的字符串。 - - ``` js - Mock.mock({ - 'regexp1': /[a-z][A-Z][0-9]/, - 'regexp2': /\w\W\s\S\d\D/, - 'regexp3': /\d{5,10}/ - }) - // => - { - "regexp1": "pJ7", - "regexp2": "F)\fp1G", - "regexp3": "561659409" - } - ``` - -### 数据占位符定义规范 DPD - -_占位符_ 只是在属性值字符串中占个位置,并不出现在最终的属性值中。 - -_占位符_ 的格式为: - -``` -@占位符 -@占位符(参数 [, 参数]) -``` - -**注意:** - -1. 用 `@` 来标识其后的字符串是 _占位符_。 -2. _占位符_ 引用的是 `Mock.Random` 中的方法。 -3. 通过 `Mock.Random.extend()` 来扩展自定义占位符。 -4. _占位符_ 也可以引用 _数据模板_ 中的属性。 -5. _占位符_ 会优先引用 _数据模板_ 中的属性。 -6. _占位符_ 支持 _相对路径_ 和 _绝对路径_。 - -``` js -Mock.mock({ - name: { - first: '@FIRST', - middle: '@FIRST', - last: '@LAST', - full: '@first @middle @last' - } -}) -// => -{ - "name": { - "first": "Charles", - "middle": "Brenda", - "last": "Lopez", - "full": "Charles Brenda Lopez" - } -} -``` - - - diff --git a/docs/zh/plugins/util.md b/docs/zh/plugins/util.md deleted file mode 100644 index ea87b939..00000000 --- a/docs/zh/plugins/util.md +++ /dev/null @@ -1,187 +0,0 @@ -# Util 实用工具 - -::: tip -此文档已经不对应最新版本的代码,文档会在稍后完善 -::: - -D2Admin 的 util 模块位置:`d2-admin/src/libs/util.js` - -下面列举您在开发中很有可能会用到的 util 模块方法。这并不是模块的全部内容,如果您有兴趣可以亲自浏览模块代码。 - -## util.cookies.set - -**介绍:** - -存储 cookie 值 - -**参数** - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| name | 名称 | 必选 | String | | | -| value | 值 | 必选 | String | | | -| setting | 设置 | 必选 | Object | [js-cookie](https://github.com/js-cookie/js-cookie#readme) | `{ expires: 1 }` | - -**使用示例:** - -``` js -util.cookies.set({ - name: 'name', - value: 'value', - setting: { - expires: 365 - } -}) -``` - -**为什么不直接使用 cookie:** - -util.cookies 内部使用 js-cookie 进行操作,并且在 cookie 名称上多做了一层逻辑封装,例如 - -``` js -util.cookies.set({ - name: 'name', - value: 'value', - setting: { - expires: 365 - } -}) -``` - -实际存储的 cookie 是 - -`d2admin-${version}-name` : `value` - -使用 - -``` js -util.cookies.get('name') -``` - -实际取的也是 `d2admin-${version}-name` - -最后你的 cookie 信息实际上可能类似这样(举例): - -* `d2admin-1.1.5-name` : `FairyEver` -* `d2admin-1.1.5-uuid` : `h8dsafy98du9f6yadsyf` -* `d2admin-1.1.5-token` : `dys87f89dsafy89adsh` - -这样做的好处是可以保证如果您的 D2Admin 升级到了新版本,打开时使用的数据一定是重新初始化的,而您在使用 cookie 时无论赋值还是取值,都觉察不出这层包装 - -::: tip -不止 cookie 这样,db 的存储逻辑也会自动根据版本区分 -::: - -## util.cookies.get - -**介绍:** - -拿到 cookie 值 - -**参数** - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| name | 名称 | 必选 | String | | | - -**使用示例:** - -``` js -const data = util.cookies.get('name') -``` - -## util.cookies.getAll - -**介绍:** - -拿到 cookie 全部的值 - -**参数** - -无 - -**使用示例:** - -``` js -const data = util.cookies.getAll() -``` - -## util.cookies.remove - -**介绍:** - -删除 cookie - -**参数** - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| name | 名称 | 必选 | String | | | - -**使用示例:** - -``` js -util.cookies.remove('name') -``` - -## util.title - -**介绍:** - -更新标题 - -**参数** - -| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 | -| --- | --- | --- | --- | --- | --- | -| titleText | title 名称 | 必选 | String | | | - -**使用示例:** - -``` js -util.title('NewTitle') -``` - -结果:**`${process.env.VUE_APP_TITLE}` | NewTitle** - -::: tip -`process.env.VUE_APP_TITLE` 在 `d2-admin/.env` 和 `d2-admin/.env.development` 中设置 -::: - -## util.ua - -**介绍:** - -获取所有的 UA 信息 - -**参数** - -无 - -**使用示例:** - -``` js -const ua = util.ua() -``` - -结果示例 - -``` js -{ - browser: { - name: "Chrome", - version: "67.0.3396.99", - major: "67" - }, - engine: { - name: "WebKit", - version: "537.36" - }, - os: { - name: "Mac OS", - version: "10.13.4" - }, - device: {}, - cpu: {} -} -``` diff --git a/docs/zh/plugins/vuex.md.REMOVED.git-id b/docs/zh/plugins/vuex.md.REMOVED.git-id deleted file mode 100644 index 4c8311c7..00000000 --- a/docs/zh/plugins/vuex.md.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -250e779feddcc8e47751f1920ce3a49e0997740e \ No newline at end of file