自定义logo插件包

1. 需求背景说明

在客户的生产环境中部署 Smartbi 程序时，通常需要需要对其做一些简单的客户化定制，比如替换登录界面、以及主界面顶部的LOGO和图片、或者修改程序名称标识等。

2. 功能说明

该插件包的主要功能有：替换登陆页整页内容；替换登陆页logo；替换导航栏logo；替换导航栏显示的样式；替换关于弹窗logo。

3. 操作说明

3.1 部署开发插件包

部署 ChangeLogoV9.ext，详细说明请参考Wiki链接：部署扩展包

3.2 修改扩展包内容

1、修改插件包中某个文件

（1）首先用 WinRAR 之类的压缩工具，打开 ChangeLogo.ext 文件。

（2）然后将需要修改的文件从 WinRAR 窗口中拖出来，对其进行修改。

（3）接着将修改后的文件，拖放回 WinRAR 窗口中，覆盖以前的旧文件。

（4）关闭 WinRAR 窗口保存修改即可。

3.3 替换整个登录页面

引入替换的页面

将替换的页面引入到插件包的vision文件夹下

修改配置文件

修改插件包/ChangeLogo/src/web/vision/js/ext/路径下的ConfigurationPatch.js文件，配置项说明如下：

loginTitle——修改登陆页的标题

loginJspPath——自定义登录页面相对vision的地址

applicationTitle——登陆后首页标题

configTitle——系统设置标题

extensionPoints——扩展的资源信息，当前插件包可以用来引入样式信息

注意点：

1）若是引入的登陆页仍需要走smartbi原有的验证逻辑，需要在引入的登陆页中加入以下smartbi登陆验证的代码逻辑。

Smartbi登录验证逻辑

var jsloader = new JSLoader({lang:'<%=smartbi.Bootstrap.getLocaleName(request)%>'});
var util = jsloader.resolve("freequery.common.util");
document.onkeydown = keydown;
function init() {
var userName = document.getElementById("user");
if (userName)
userName.focus();
}
function login() {
var userName = document.getElementById("user"); //用户名输入框ID修改为实际HTML中的元素ID
var password = document.getElementById("password"); //密码输入框ID修改为实际HTML中的元素ID
var ret = util.remoteInvokeEx("UserService", "login", [userName.value, password.value]); //调用Smartbi登录方法


if (!ret || !ret.result){
alert("登录失败!");
return;
} else {
var url = window.location + '';
var p = url.indexOf('login_demo.jsp');
if (p > -1) {
window.location = url.substring(0, p);
} else {
window.location.reload();
}
}
}
function keydown(e) {
        var theEvent = e || window.event;
        var code = theEvent.keyCode || theEvent.which || theEvent.charCode;    
        if (code == 13) {
            login();
        }    
}

2）系统统一访问入口仍然为 http://localhost:18080/smartbi/vision/index.jsp；访问 Smartbi 时如果用户未登录，会自动跳转到 login_demo.jsp 页面中，此登录界面的处理逻辑为：点击“登录”按钮时，调用 smartbi 的登录API进行登录，再重新刷新本页面

3.4 替换登陆页logo

将设计好的logo覆盖 /ChangeLogo/src/web/vision/img/login路径下的logo.png文件，即可替换原来的logo样式

3.5 替换导航栏logo

将设计好的logo覆盖 /ChangeLogo/src/web/vision/img/baseframe路径下的logo-mini.png文件，即可替换原来的logo样式

3.6 替换导航栏显示的样式

由于在2.2.2修改配置文件中，引入了css样式的文件的路径为/ChangeLogo/src/web/vision/css/patch.css，因此找到/ChangeLogo/src/web/vision/css下的patch.css文件，修改文件中.mainTopTd的样式。具体修改内容参考css文档的详解http://css.doyoe.com/