第1章 概述

OEM客户或者行业应用客户有定制DataViz界面的需求。本文档会根据客户所提需求不断扩充。

第2章 定制说明

如果需要引入js文件，统一在dataviz[-web]\src\index.html文件内引用。

2.1 登录页定制

2.1.1 修改Logo图标

文件位置

dataviz[-web]\src\modules\security\signin\signin-xxxxxxx.html

修改img引用的图片资源，图片路径：dataviz[-web]\img 与 dataviz[-web]\src\img

    <div class="navbar-brand block " style="margin: 0px;padding: 0 30px;">
        <img class="signin-logo" src="img/logo_signin.png"/>
    </div>

2.1.2 修改说明文字和版本号

文件位置

dataviz[-web]\src\modules\security\signin\signin-xxxxxxx.html

以下代码用于命名的国际化处理，国际化映射文件路径: dataviz[-web]\src\l10n\可自行添加。当然如果没有国际化需求，可直接用中文。

    <div class="text-center subtitle">
        <span ng-bind="'security.signin.TITLE' | translate"></span>
    </div>

产品版本号

    <div class="text-center subtitle">{{app.version}}</div>

2.1.3 修改背景图

文件位置

dataviz[-web]\src\tpl\access-xxxxxxx.html

修改style中的background引用的图片"background_sigin-xxx.jpg"，图片路径：dataviz[-web]\img 与 dataviz[-web]\src\img

style="width: 100%;height: 100%;position: absolute;top: 0px;background:url('img/background_sigin-xxx.jpg') no-repeat ;background-size:100% 100%;"

2.2 页首定制

2.2.1 文件位置

dataviz[-web]\src\modules\blocks\header-xxxxxxx.html

2.2.2 修改Logo图标

此处包含单点登录集成和默认模式两处img。

<a ng-if="app.isSaaS" ng-href="http://www.sacadataviz.com/" class="navbar-brand text-lt"
   style="position: fixed;z-index: 100;padding: 0;left: 25px;">
    <img src="img/logo.png">
</a>
<a ng-if="!app.isSaaS" ui-sref="app.project" class="navbar-brand text-lt"
   style="position: fixed;z-index: 100;padding: 0;left: 25px;">
    <img src="img/logo.png">
</a>

默认图片文件存放: dataviz[-web]\img 与 dataviz[-web]\src\img

2.2.3 修改用户名下拉列表

在如下位置自由添加选项

<ul class="dropdown-menu animated fadeInRight w">
    <li ng-if="userinfo.id">
        <a ng-click="changePassword()">&#123;&#123;'blocks.header.CHANGEPWD' | translate &#125;&#125;</a>
    </li>
    <li>
        <a ng-click="showProductInfo()">&#123;&#123;'blocks.header.PRODUCTINFO' | translate &#125;&#125;</a>
    </li>
    <li ng-if="userinfo.id">
        <a ng-click="logout()">&#123;&#123;'blocks.header.EXIT' | translate &#125;&#125;</a>
    </li>
</ul>

以下代码用于命名的国际化处理，国际化映射文件路径: dataviz[-web]\src\l10n\可自行添加。当然如果没有国际化需求，可直接用中文。

{{blocks.header.CHANGEPWD' | translate }};

其他代码可依需求处理。

2.2.4 修改界面配色

界面配色内容集中在 dataviz[-web]/src/css/style-xxx.css 文件。由前端人员根据页面调试信息逐一修改。

2.3 菜单定制

2.3.1 文件位置

  dataviz[-web]\src\modules\blocks\nav-xxxxxxx.html

2.3.2 修改项

<a ui-sref="app.showboard">        展示看板
<a ui-sref="app.project">        我的项目
<a ui-sref="app.publicproject">        公共项目
<a ui-sref="app.favorite">        我的收藏
<a ui-sref="app.sample">            展示样例
<li ng-if="app.settings.showSysSetting" style="height: 100%"> 系统设置