edit | blame | history | raw

Build Status
Dependency Status
NPM version

ng-alain

Ng-zorro-antd admin panel front-end framework.

更多信息见中文 README

DEMO

Quick start

Make sure you have Node version >= 6.9.0 and NPM >= 3 or higher.

# clone a blank ng-alain repo, just only basic function
#   --depth 1 removes all but one .git commit history
git clone -b blank --depth 1 https://github.com/cipchk/ng-alain.git
# or full master branch
git clone --depth 1 https://github.com/cipchk/ng-alain.git

# change directory
cd ng-alain

# install npm package
npm install
# in china please use cnpm (https://github.com/cnpm/cnpm)
# cnpm install

# start the serve
npm start

# use HMR
npm run serve:hmr

[vscode] recommended install ng-zorro-vscode plugins, that includes nz-alain-* snippets.

Links

Delon

delong is a production-ready solution for admin business components packages, Built on the design principles developed by Ant Design.

Build Status
Dependency Status
DevDependency Status

npm
npm

package name version next version
@delon/theme NPM version NPM version
@delon/abc NPM version NPM version
@delon/acl NPM version NPM version
@delon/auth NPM version NPM version
@delon/mock NPM version NPM version

| @delon/cache | - | NPM version |
| @delon/cli | - | NPM version |

Architecture

Architecture

Features

  • ng-zorro-antd based
  • Responsive Layout
  • I18n
  • ACL
  • Lazy load Assets
  • UI Router States
  • Multiple color options
  • Less preprocessor
  • Well organized & commented code
  • Simple upgrade
  • Hot Module Replacement
  • Support Docker deploy

App Shots

desktop
ipad
iphone

Troubleshooting

Please follow this guidelines when reporting bugs and feature requests:

  1. Use GitHub Issues board to report bugs and feature requests (not our email address)
  2. Please always write steps to reproduce the error. That way we can focus on fixing the bug, not scratching our heads trying to reproduce it.

Thanks for understanding!

License

The MIT License (see the LICENSE file for the full text)

edit | blame | history | raw

update no more, please to release page.


0.1.2-beta.10

  • ng-zorro-antd 0.6.x 由于#504的原因回滚至最低版本,本次只对 ng-zorro-antd 组件国际化产生影响。

0.1.2-beta.9

  • 新增 ng-zorro-antd 组件的国际化,见 translator.service
    • 当前 ng-zorro-antd 为 rc 版本,若遇到构建当中存在 @angular/cdk 问题,请手动安装。

下周末将发布正式版,这段时间将不会再新增任何功能。

0.1.2-beta.8

  • 增加快捷菜单,见 menu.service.ts
  • 修复菜单小三角与菜单文本垂直问题
  • 移除 ng-zorro-antd 已知问题且修复的 bug 链接地址 header.component.ts

0.1.2-beta.7

  • 增加Docker部署
    • 增加 .dockerignoredocker-compose.ymldocker-compose.debug.ymlDockerfile 文件
    • 增加 _nginx 目录

0.1.2-beta.6

  • 增加全屏布局,见用户关系图
  • 侧边栏主菜单链接支持 target 属性
  • 基于Front-End-Checklist优化 index.html

0.1.2-beta.5

  • 新增 [_src] 指令,包括以下特性:
    • 支持微信、qq头像规则缩略图规则
    • 支持移除http&https协议http
    • 支持增加onerror事件
  • 样式相关:
    • 移除 text-truncate!important
    • 调整 .simple-tableimg 边距由 padding-left 改变成 margin-left 更为合理。
  • 修复用户EMAIL无法缩短问题,closes #35
  • 修复注册、找回、屏幕页面密码框类型问题,closes #34
  • 调整 sparkline.directive.ts 目录。
  • 调整tsline规则:curly: false

0.1.2-beta.4

  • 修复分页当前页hover文字颜色问题,closes #31

0.1.2-beta.3

  • 修复 file-upload 按钮由于 span 样式关系导致元素无法触发问题,closes #27

0.1.2-beta.2

  • 新增 TitleService 用于设置页面标题

0.1.2-beta.1

  • 为了更好支持 git-subtree 调整 styles 目录位置至 src/styles/alain/(以及 themes.service.ts 变更)

0.1.1-beta.2

  • 支持 ng-zorro-antd 部分组件换肤
  • 修复若干样式细节

0.1.1-beta.1

为了 ng-alain 更好的发展(主要是 alain 在其他框架中做准备),最后还是决定由 scss 转为 less,虽然 scss 更优雅这也是当初选择的原因:

  • scss 转 less 升级要点
    • .angular-cli.jsonstylesstyleExt 变更为 .less
    • themes.service.ts 修改为 .less
    • 对所有 .scss 文件后缀换成 .less
  • 注: 根据团队反馈,去掉所有业务的 .less 文件,这是因为作为后台管理绝大多数页面中无须编写样式,去掉可以提升编译速度。
  • 新增 down-file 指令。
  • 升级 ng-zorro-antd 至最新版本,并移除已经修复BUG的部分样式代码。

0.1.0-beta.1

0.1.0版本说明:

由于 nz-menu 很难满足 ng-alain 的需求,这包括换肤、收缩等问题,因此重写菜单;并且不兼容 0.0.x 的版本(已将独立另一分支);主要改变:

  • 0.1.0 影响到整个 layout(结构发生改变)、styles 文件夹,因此升级时最好移除并重新添加。
  • 原10套颜色主题,保留5个主要色,且每一色系包括:菜单栏黑、白两色系,新依然保持10个主题色。
  • 菜单默认 14px 字号。
  • 优化框架样式属性参数化,允许通过 _alain-custom-variables.scss 改变主题基本配置;主要是ng-alain,对于 ng-zorro-antd 组件(如:字号、间距等)并不支持,这一点我一直在尝试,但成本太高!
  • 顶部快捷菜单与搜索框由改成左中右布局
  • 实验性功能 支持自定义 ng-zorro-antd 所有组件字号
  • closes #6 #12 #13 #14 #23

其他

  • 支持 ng lint
  • app.component.ts 中移除非必选 nz-root
  • 样式:
    • 新增 badge-dot 小红点。
    • 新增 nz-table 单元格与文本垂直居中
    • 新增 unwrap 样式,使内容区域与header、aside 无缝
    • 优化 width-*modal-*
  • 默认开启支持IE版本(可通过 polyfills.ts 自行关闭)
  • 新 Logo
  • 升级 angularangular-cling-zorro-antd 至最新版本
    • 之前有过一个版本回退,以及 licenses BUG问题都已经修复。
    • close #15

0.1.0-beta.1

  • 增加 .simple-table.search-form.fixed-btns 样式,效果见门店页
  • 增加HTML模板驱动表单视觉反馈,默认未开启,可以在 _alain-custom-variables.scss 增加 $form-state-visual-feedback-enabled: true;
  • 增加门店页
  • 增加 _HttpClientModalHelper
    • _HttpClient 简化请求以及更好的与 [nzLoading] 属性相配合
    • ModalHelper 简化打开与回调处理
  • 增加Modal相关样式,更便于自定义组件,见CSS组件补丁类

0.0.1-beta.3

  • 允许通过 _alain-custom-variables.scss 覆盖 styles 属性值,例如:将内容区域背景色为白色。见 升级目录结构
  • 增加 ynkeys 管道,见 pipe文档
  • 增加 badge 样式
  • 升级 angular-cli@4.4.1ng-zorro-antd@0.5.1

0.0.1-beta.2

  • 增加 treesortablesweetalert 示例

0.0.1-beta.1

  • 增加顶部左右结构布局(替换 header-left-right.component 模板可以体验),新增 .top-nav-wrap 样式
  • 增加自定义样式风格目录结构
  • 增加利用 environments 使开发、生产设置不同参数(例如:后端地址)
  • 修复 TokenService 循环依赖问题
  • 重写模态框示例
  • 重写 StartupService 解决状态码处理BUG
  • 更新 @angular/cli 至最新版本,当前版本可能会存在 licenses BUG,可增加 --extract-licenses=false 解决,抑或不升级
  • 优化样式目录结构

0.0.1-beta

  • 增加 coreshared 别名,允许通过 @shared/shared.module 访问 SharedModule
  • 增加顶部菜单栏 .full 样式,方便去掉搜索框菜单右对齐。
  • 修复首次加载菜单无法选中问题
  • 优化源代码包体大小,去掉 ueditor 示例、清除无效图像资源
  • 优化首次加载速度方法,仪表盘去掉延迟加载
  • 优化 core/services 目录结构

0.0.1-alpha.7

  • 增加TOKEN拦截器示例
  • 修复菜单有时出现重复选择问题,closes #8
  • 升级 angular-cling-zorro-antd 至最新版本
  • 由于新版 angular-cli 对commonjs都必须指定一个名称,因此重写 preloader ( 并在 main.ts 中导入它)。

0.0.1-alpha.6

  • 新增应用启动,基础、菜单、用户数据由远程获取。
  • 新增ACL
  • 修复测试用例
  • 关闭 #6 #7

0.0.1-alpha.5

  • 新增若干小部件
  • 新增 alginimg 相关CSS工具类
  • 新增10*10种颜色CSS工具类
  • 升级 ng-zorro-antd 至最新版本

0.0.1-alpha.4

  • 新增G2图表
  • 移除未发布 nz-avatar antd补丁样式
  • 升级 ng-zorro-antd 至最新版本
  • 修复 #1

0.0.1-alpha.3

  • 新增路由守卫DEMO
  • 新增设置快捷入口
  • 新增 nz-carousel 指示点颜色补丁
  • 新增若干小部件

0.0.1-alpha.2

  • 新增 .list-group CSS组件
  • 新增 _date_currenty Pipe
  • 新增扩展页:帮助中心、个人设置
  • 新增 component-patch.md pipe.md 说明
  • 修复顶部搜索框的 nzFocusnzBlur 问题。

  • 调整 color.servicescroll.service 至 services 目录。
edit | blame | history | raw

Contributing to ng-alain

We would love for you to contribute to ng-alain and help make it even better than it is
today! As a contributor, here are the guidelines we would like you to follow:

Found a Bug?

If you find a bug in the source code, you can help us by
submitting an issue to our GitHub Repository. Even better, you can
submit a Pull Request with a fix.

Missing a Feature?

You can request a new feature by submitting an issue to our GitHub
Repository. If you would like to implement a new feature, please submit an issue with
a for your work first, to be sure that we can use it.
Please consider what kind of change it is:

  • For a Major Feature, first open an issue and outline your proposal so that it can be
    discussed. This will also allow us to better coordinate our efforts, prevent duplication of work,
    and help you to craft the change so that it is successfully accepted into the project.
  • Small Features can be crafted and directly submitted as a Pull Request.

Submission Guidelines

Submitting an Issue

Before you submit an issue, please search the issue tracker, maybe an issue for your problem already exists and the discussion might inform you of workarounds readily available.

We want to fix all the issues as soon as possible, but before fixing a bug we need to reproduce and confirm it. In order to reproduce bugs we will systematically ask you to provide a minimal reproduction scenario using http://plnkr.co. Having a live, reproducible scenario gives us wealth of important information without going back & forth to you with additional questions like:

  • version of ng-alain used
  • 3rd-party libraries and their versions
  • and most importantly - a use-case that fails

A minimal reproduce scenario using http://plnkr.co/ allows us to quickly confirm a bug (or point out coding problem) as well as confirm that we are fixing the right problem. If plunker is not a suitable way to demonstrate the problem (for example for issues related to our npm packaging), please create a standalone git repository demonstrating the problem.

We will be insisting on a minimal reproduce scenario in order to save maintainers time and ultimately be able to fix more bugs. Interestingly, from our experience users often find coding problems themselves while preparing a minimal plunk. We understand that sometimes it might be hard to extract essentials bits of code from a larger code-base but we really need to isolate the problem before we can fix it.

Unfortunately we are not able to investigate / fix bugs without a minimal reproduction, so if we don't hear back from you we are going to close an issue that don't have enough info to be reproduced.

You can file new issues by filling out our new issue form.

Submitting a Pull Request (PR)

Before you submit your Pull Request (PR) consider the following guidelines:

  • Search GitHub for an open or closed PR
    that relates to your submission. You don't want to duplicate effort.
  • Make your changes in a new git branch:

    shell git checkout -b my-fix-branch master

  • Create your patch, including appropriate test cases.

  • Follow our Coding Rules.
  • Run the full ng-alain test suite , and ensure that all tests pass.
  • Commit your changes using a descriptive commit message that follows our
    commit message conventions. Adherence to these conventions
    is necessary because release notes are automatically generated from these messages.

    shell git commit -a
    Note: the optional commit -a command line option will automatically "add" and "rm" edited files.

  • Push your branch to GitHub:

    git push origin my-fix-branch
    
  • In GitHub, send a pull request to ng-alain:master.

  • If we suggest changes then:
  • Make the required updates.
  • Re-run the ng-alain test suites to ensure tests are still passing.
  • Rebase your branch and force push to your GitHub repository (this will update your Pull Request):

    git rebase master -i
    git push -f
    

That's it! Thank you for your contribution!

After your pull request is merged

After your pull request is merged, you can safely delete your branch and pull the changes
from the main (upstream) repository:

  • Delete the remote branch on GitHub either through the GitHub web UI or your local shell as follows:

    git push origin --delete my-fix-branch
    
  • Check out the master branch:

    git checkout master -f
    
  • Delete the local branch:

    git branch -D my-fix-branch
    
  • Update your master with the latest upstream version:

    git pull --ff upstream master
    

Coding Rules

To ensure consistency throughout the source code, keep these rules in mind as you are working:

  • All features or bug fixes must be tested by one or more specs (unit-tests).
  • All public API methods must be documented.

Commit Message Guidelines

We have very precise rules over how our git commit messages can be formatted. This leads to more
readable messages
that are easy to follow when looking through the project history. But also,
we use the git commit messages to generate the ng-alain change log.

Commit Message Format

Each commit message consists of a header, a body and a footer. The header has a special
format that includes a type, a scope and a subject:

<type>(<scope>): <subject>
<BLANK LINE>
<body>
<BLANK LINE>
<footer>

The header is mandatory and the scope of the header is optional.

Any line of the commit message cannot be longer 100 characters! This allows the message to be easier
to read on GitHub as well as in various git tools.

Footer should contain a closing reference to an issue if any.

Samples: (even more samples)

docs(changelog): update change log to beta.5
fix(release): need to depend on latest rxjs and zone.js

The version in our package.json gets copied to the one we publish, and users need the latest of these.

Revert

If the commit reverts a previous commit, it should begin with revert:, followed by the header of the reverted commit. In the body it should say: This reverts commit <hash>., where the hash is the SHA of the commit being reverted.

Type

Must be one of the following:

  • build: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
  • ci: Changes to our CI configuration files and scripts (example scopes: Travis, Circle, BrowserStack, SauceLabs)
  • docs: Documentation only changes
  • feat: A new feature
  • fix: A bug fix
  • perf: A code change that improves performance
  • refactor: A code change that neither fixes a bug nor adds a feature
  • style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
  • test: Adding missing tests or correcting existing tests

Subject

The subject contains succinct description of the change:

  • use the imperative, present tense: "change" not "changed" nor "changes"
  • don't capitalize first letter
  • no dot (.) at the end

Body

Just as in the subject, use the imperative, present tense: "change" not "changed" nor "changes".
The body should include the motivation for the change and contrast this with previous behavior.

Footer

The footer should contain any information about Breaking Changes and is also the place to
reference GitHub issues that this commit Closes.

Breaking Changes should start with the word BREAKING CHANGE: with a space or two newlines. The rest of the commit message is then used for this.

A detailed explanation can be found in this document.

edit | blame | history | raw
MIT License

Copyright (c) 2017 卡色

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
CHANGELOG 8 KB
CONTRIBUTING 8 KB
README-zh_CN 5 KB
README 5 KB
_mock/README 42 b
src/app/core/README 137 b
src/app/layout/default/header/index 471 b
src/app/shared/README 734 b