【仅供内部供应商使用，不提供对外解答和培训】

页面结构

平台整体布局为"上-左-右"布局,绿色区域为头部,红色区域未左侧导航栏,蓝色区域为内容展示区域,展示目录和管理系统.

主体结构

//  修改header和侧栏menu的高与宽
BI.config("dec.constant.config", function (config) {
    config.config4Frame.north.height=50;
	config.config4Frame.west.width=150;
    return config;
});
 
// 取消目录面板的悬浮状态,始终固定
BI.config("dec.constant.config", function (config) {
	config.config4EntryPane.pinable=false;
});

顶部header

顶部分为左右两个区域,左侧显示logo和标题,右侧显示账户设置和消息管理组件.

可配置内容

//  在顶部左侧加上公司联系方式
BI.config("dec.constant.header.items", function (items) {
    items.unshift({
        type: "bi.label",
        text: "电话:400-811-8890转2"
    });
    return items;
});

 

侧栏menu

menu为决策平台的一级导航,用于在最高级别的页面中切换.(默认的产品设计逻辑是普通用户不显示侧栏,开发者可自主选择是否遵守).

可配置内容

//  像侧栏添加仪表板和数据准备两个一级按钮
BI.config("dec.constant.menu.items", function (items) {
    items.splice(1, 0, {
        value: "analysis",
        text: "仪表板",
        cls: "analysis-menu-font",
        cardType: "bi.design"
    }, {
        value: "config",
        text: "数据准备",
        cls: "config-menu-font",
        cardType: "bi.conf"
    });
    return items;
});

目录

目录结构由左侧目录面板和右侧多tab组件(tabPane)构成,

目录面板主要内容为目录树,收藏列表,搜索构成,由顶部按钮切换显示内容.tabPane承担展示挂载到平台上的报表,BI模板,链接等内容.

可配置内容:

// 向顶部导航添加一个分享给我的按钮和相应页面
BI.config("dec.constant.workbench.panel.tabs", function (items) {
    return items.concat([{
        value: "share",
        title: BI.i18nText("Dec-Share_to_Me"),
        cls: "share-to-me-font",
        cardType: "dec.workbench.share"
    }]);
});

开放方法

BI.extend(Dec.Utils, {

    // 分层加载树结构
    getWorkbenchSubDirectoryById: function (pId, callback) {

    },

    //  搜索目录树
    searchWorkbenchSubDirectory: function (keyword, callback) {

    },

    // 收藏 or 取消收藏
    handlerCollect: function (id, isFavorite, callback) {

    },

    // 取收藏列表
    getFavoritesList: function (callback) {

    }
});

服务

//  调用方式  BI.Services.getService("dec.service.tabs").addItem()
var Service = BI.inherit(BI.OB, {

    addItem: function (entry) {
		//  在tabPane打开新标签页.在结合目录树使用时,直接传入目录节点的bean即可.
    },

    closeTab: function (v) {
		// 关闭某个tab
    },

    openCustomTab: function (cardName, cardValue, cardType) {
		//  参数直白的在tabPane新开标签页方式,适用于平台内部逻辑之外的标签页
    },

    refreshTab: function (cardValue, options) {
		//  刷新某个tab
    },

    closeActiveTab: function () {
		//  关闭当前打开的tab
    },

    getShowingTab: function () {
		//  获取当前激活的tab的组件引用
    }
});
BI.service("dec.service.tabs", Service);

组件

  1. dec.workbench.panel 目录面板容器

  2. dec.workbench.directory 目录树

  3. dec.workbench.favorite 收藏列表

  • No labels

【仅供内部供应商使用，不提供对外解答和培训】