zr-admin-ui

安装

npm install zr-admin-ui

导入

// main.js 中引入 
import zrAdminUI from 'zr-admin-ui'
Vue.use(zrAdminUI)

简介

ZR-AdminUI 是什么？

ZR-AdminUI是基于VUE+ElmentUI框架，为了便于项目高效开发，并保持一致性与标准化进行二次封装形成的前端技术框架；将ZR产品开发资源进行优化与汇总，目的是为了提升代码复用率与稳定性形成ZR自有的前端框架。 特点：

• 代码统一维护与更新，无论是有经验的开发人员或初级前端开发人员，能够快速构建项目
• 代码高度组件化，复用率高，避免重复造轮子，减少冗余及低效代码
• 参考文档及时更新，让开发人员能快速查找与参阅
• 主流前端框架VUE+ElementUI封装，学习成本低、稳定高效
• 多套UI风格可选，满足不同类型项目开发所需
• 组件不断迭代更新，根据项目需求及时迭代优化

前序准备

你需要在本地安装 node 和 git。本项目技术栈基于 ES2015+、vue、vuex、vue-router 、vue-cli 、axios 和 element-ui，提前了解和学习这些知识会对使用本项目有很大的帮助。

本项目的定位是后台集成方案，仅适合PC端管理后台开发。因为本框架包含多种基础框架，请确保使用前对如下框架有所学习与了解:

• 前端框架：Vue.js
• UI框架：Element
• 集成方案：vue-element-admin

说明文档

官方文档地址 ZR-AdminUI。

框架统计

组件名称	说明
ZrButton	按钮组
ZrFormGroup	分组表单
ZrForm	Form表单
ZrFormLine	表单分割线
ZrFormItemGroup	表单分组Group
ZrTips	提示文本
ZrTable	Table表格
ZrSearchBox	综合搜索
ZrButtonBox	操作按钮
ZrInfo	信息展示区
ZrInfoBox	综合信息展示
ZrDrawer	抽屉
ZrTransition	动画
ZrRadio	单选按钮组
ZrCheckbox	多选按钮
ZrCheckboxGroup	多选按钮组
ZrCitySelect	城市选择
ZrMap	地图选择
ZrNearRadio	近期选择器（单选）
ZrNearInput	近期选择器（自定义）
ZrNearSelect	近期选择器（多选）
ZrErrorPages	错误页面
ZrBrowserPages	浏览器版本提示
ZrElInputNumber	数字输入框
ZrCard	卡片
ZrDialog	Dialog对话框
ZrTree	Tree树组件
ZrTabs	Tabs菜单
ZrSelectIcon	字体图标选择组件
ZrLineChart	折线图
ZrBarChart	柱状图
ZrPieChart	饼状图
ZrFunnelChart	数据漏斗
ZrSwiperGroup	商品详情轮播图

过滤器filters

过滤器名称	说明
trim	去除字符串空格
upDigit	数字转换为大写金额
filterDateTime	转化时间格式 年月日 时分秒
filterDate	转化时间格式 年月日
numberToCurrencyNo	数字千分位格式化
Tofixed	数字转化为两位小数

自定义指令directives

指令名称	说明
copy	一键复制
longpress	长按指令
waterMarker	自定义水印

开源协议

ISC