@cennavi-fe/nce-library

0.1.0 • Public • Published

nce-library

更新自:2022-07-27,版本0.1.19

download

npm install nce-library
yarn add nce-library

按需引入

import { NceNav, NceHeader, NcePlantform, NceFooter } from "nce-library";
import "nce-library/dist/index.css";

Vue.use(NceNav);
Vue.use(NceHeader);
Vue.use(NcePlantform);
Vue.use(NceFooter);

全部导入

import NceLibrary from "nce-library";
import "nce-library/dist/index.css";

Vue.use(NceLibrary);

具体文档

Nce-Nav

import { NceNav } from "nce-library";

Vue.use(NceNav);
<nce-nav
    userName="张三"
    :userAvatar="userAvatar"
    :userRoutes="userRoutes"
    @handleClickToPage="handleClickToPage"
    @handleToHomePage="handleToHomePage"
></nce-nav>

Attributes

参数 说明 类型 默认值 是否必传
platformName 平台名 String 工作台 true
userName 右上角用户 String true
userAvatar 右上角用户头像 String false
userRoutes 平台自己定义的路由表 Array [] true
useCustomerRoute 不启用下拉菜单(nce-nav 专用,用于区分其他平台) Boolean false false
rightMenuList 右上角菜单 Array [] true
plantFormMenuList 每个平台自己的菜单(用于单独配置) Array [] true

Methods

方法名 说明 参数
handleClickToPage 点击菜单 菜单信息
handleToHomePage 回到首页

Slot

设置 logo 或者其他文字

<nce-nav
    userName="张三"
    :userAvatar="userAvatar"
    :userRoutes="userRoutes"
    @handleClickToPage="handleClickToPage"
    @handleToHomePage="handleToHomePage"
>
    <img src="图片" /> 或者 文字
</nce-nav>

NceHeader

import { NceHeader } from "nce-library";

Vue.use(NceHeader);
<nce-header
    targetType="_self"
    :logoImg="logoImg"
    @backPortal="backPortal"
    @toWorkbench="toWorkbench"
/>

Attributes

参数 说明 类型 可选参数
type 平台名 String
targetType 跳转页面方式 String _self or _blank
logoImg 左上角 logo String
host 跳转域名(单独部署可用,不传默认是 location.host) String

Methods

方法名 说明
toWorkbench 跳转到工作台
backPortal 回到首页

NceFooter

import { NceFooter } from "nce-library";

Vue.use(NceFooter);
 <nce-footer>
    <template #copyright>世纪高通 | MineData@Earth Enterprise v3.3.1</template>
    <template #description
    >Copyright 2017-2020 Cennavi All Rights Reserved, Beijing Cennavi Technology
    Co.,Ltd.</template
    >
</nce-footer>

插槽

参数 说明 类型
copyright 公司名 String
description 介绍 String

NcePlantform

import { NcePlantform } from "nce-library";

Vue.use(NcePlantform);
<nce-plantform
    :platformName="platformName"
    :show="show"
    @handleToHomePage="handleToHomePage"
/>

Attributes

参数 说明 类型 默认值
platformName 平台名 String 工作台
show 是否显示下级菜单 Boolean

Methods

方法名 说明
handleToHomePage 回到首页

Package Sidebar

Install

npm i @cennavi-fe/nce-library

Weekly Downloads

0

Version

0.1.0

License

MIT

Unpacked Size

2.31 MB

Total Files

12

Last publish

Collaborators

  • wuhaoyuan
  • zhoumingrui
  • hhui90068
  • wb9527
  • ndwgg