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

王增彬 📧 [email protected]