ch-vue-portal-layout

Portal

📓 📔 📕 ChuangHui 📗 📘 📙 Vue Components.

Demo

Install

Using NPM

npm install ch-vue-portal-layout --save

Using Yarn

yarn add ch-vue-portal-layout

Usage

main.js

import Vue from 'vue'
import Portal from 'ch-vue-portal-layout'
import 'w-vue-basic-layout/lib/w-basic-layout.css'

Vue.use(Portal)

布局插件

页面中引用

<ch-layout>
  <div>

  </div>
</ch-layout>

layout Attributes

参数	说明	类型	可选值	默认值
sidebar	菜单状态	object	{ opened: false,withoutAnimation: false }	[]
device	设备类型	Strig	'mobile'	'desktop'
routes	菜单列表	Array	-	[]
userInfo	用户信息，包含用户头像，名称等信息	object	-	{headImg: ''}
dropdownItemList	右上角下拉菜单列表	Array	-	[]
portalInfo	项目基本信息	object	{logo: '', portalName: 'df'}	{}
svgArr	项目拥有的svg图	Array	[]	[]
logout	点击退出按钮的回调	function(){}	function(){}	function(){}
toggleSideBar	点击显示或隐藏左侧菜单时触发	function(){}	function(){}	function(){}
systems	首页又上角切换系统的下拉选择框数组，不传默认不显示	Array	[]	[]

layout Events

事件名称	说明	回调参数
handleClickOutside	点击菜单以外区域触发	-
getMenuItem	选中每个菜单时触发	-

登录页（不再维护，若需要，拷贝大数据服务平台的登录页）

页面中引用

<ch-login></ch-login>

login Attributes

参数	说明	类型	可选值	默认值
bgData	轮播图图片	Array	[{ title: '方法 · 路径 · 目标', describe: '数据驱动服务效率提升', src: require('@P/assets/img/bitmap_1.png') }]	[]
loading	按钮loading状态	Boolean	false/true	false
login	登录的回调	function(){}	function(){}	function(){}
sliderInfos	轮播的宣传语	[{ title: '方法 · 路径 · 目标', describe: '数据驱动服务效率提升}]	[{ title: '方法 · 路径 · 目标', describe: '数据驱动服务效率提升}]	[{ title: '方法 · 路径 · 目标', describe: '数据驱动服务效率提升}]
portalInfo	项目基本信息	object	{logo: '', portalName: 'df'}	{}

Contributors

王增彬 📧 [e-mail]