便于前端开发以及后期优化维护
方便新进的成员快速上手
输出高质量的代码
本规范文档一经确认，前端开发人员必须按本文档规范进行前台页面开发。
本文档如有不对或者不合适的地方请及时提出，经讨论决定后可以更新此文档。
| 文件名 | 说明 |
|---|---|
| scripts | 存放js脚本文件 |
| scripts_lib | 存放前端公开类库文件 |
| html | 存放html文件 |
| images | 存放图片文件 |
单独前后端分离开发时，编码使用utf-8
使用注释来说明开闭标签
<div>
<!--上部查询区域开始-->
<div class='my-form-body'>
</div>
<!--上部查询区域结束-->
<!--中部区域开始-->
<div class="my-body">
<table>
<tr><td></td></tr>
<tr><td></td></tr>
<tr><td></td></tr>
</table>
</div>
<!--中部区域结束-->
</div>
function escapeHTML(e) {
if ('string'!=typeof e) return e; return e.replace(/</g, "<").replace(/>/g, ">").replace(/ /g, " ").replace(/"/g, """).replace(/'/g, "'");
}
// 转义
var val = escapeHTML(document.getElementById('content'));
// 然后再发送给后台
每个语句必须以分号结尾，不能省略
暂时不使用ES6语法
不推荐代码水平对齐
//bad
{
tiny: 42,
longer:435,
...
};
//good
{
tiny:42,
longer:432,
...
}
常量的命名规范
//// bad
var times = 5;
//good
var TIMES = 5;
// bad
var oldepisodeid = 1;
// good
var oldEpisodeId = 1 ;
// bad
var item = new Object();
var arr = new Array();
// good
var item = {};
var arr = [];
name = 'my name'; // 与window.name冲突,错误命名
title = 'my title'; // 与window.title冲突，错误命名
// bad
function f1(a){
a = 1;
}
function f2(a){
if (!a) { a = 1;}
}
// good
function f3(a){
const b = a || 1;
}
使用 /**…*/注释多行
使用//注释单选，放在代码上面一行
使用FIXME或者TODO帮助开发者明白问题
/**
* 通过tag获得新的对象
* @param {String} tag
* @return {Element} element
*/
function make(tag){
// ...
// TODO: 增加配置解决
let opt = {timeout:3000};
// FIXME: 不应该使用全局变量,后期修复
let ele = document.getElmentById("id"+total);
return ele;
}
如果是无限轮询应判断返回值是否超时/报错/无响应等异常，如果异常应该结束轮询
.datagrid-footer-inner,.datagrid-header,.datagrid-pager,.datagrid-toolbar {
border-color: #ddd
}
.panel-body-noheader .layout-expand-title,.panel-body-noheader .panel-icon {
top: 5px
}
同一系统中只存一份HISUI库，以便统一管理
在HEAD标签中引入
<link rel="stylesheet" type="text/css" href="hisui/dist/css/hisui.css">
<script type="text/javascript" src="hisui/dist/js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="hisui/dist/js/jquery.hisui.js"></script>
<!--中文显示组件，英文引入hisui-lang-en.js-->
<script type="text/javascript" src="../../dist/js/locale/hisui-lang-zh_CN.js"></script>
var init = function(){
// window loaded
// do somthing
}
$(init);
var init = function(context){
// 第一次context为undefined,不为空跳出.
if (!!context) return ;
//$("#Loading").fadeOut("fast");
// do somthing
}
$.parser.onComplete = init;
<csp:method name=OnPreHTTP arguments="" returntype=%Boolean>
i ##Class(websys.SessionEvents).SessionExpired() q 1
quit 1
</csp:method>
统一使用系统的标题头写法，以便统一控制。会显示成：用户名 安全组 科室 医院名 本机IP
<TITLE><EXTHEALTH:TRANSLATE id=title>##(%session.Get("TITLE"))##</EXTHEALTH:TRANSLATE></TITLE>
<EXTHEALTH:HEAD></EXTHEALTH:HEAD>得到统一的js-session对象
得到语音导航功能支持
得到tkMakeServerCall方法支持
得到服务器IP及客户端IP信息
得到客户端操作日志功能
得到websys.js中公共方法
<HISUI></HISUI>得到HISUI开发环境的支持
得到国际化支持
便于统一改变HISUI界面样式
日期格式统一控制
获得统一访问后台的
$cm,$m,$q方法
<ADDINS require="CMgr,CmdShell"></ADDINS>得到访问客户端能力
尽可能少使用此功能（安全性，稳定性，兼容性）
<HEAD>
<EXTHEALTH:HEAD></EXTHEALTH:HEAD>
<HISUI></HISUI>
<ADDINS require="CmdShell"></ADDINS>
<!-- Other Code //-->
</HEAD>
<csp:method name=OnPreHTTP arguments="" returntype=%Boolean>
i ##Class(websys.SessionEvents).SessionExpired() q 1
quit 1
</csp:method>
<HTML>
<HEAD>
<EXTHEALTH:HEAD></EXTHEALTH:HEAD>
<HISUI></HISUI>
<ADDINS require="CmdShell"></ADDINS>
<!-- Other Code //-->
</HEAD>
<BODY>
<!-- Other Code //-->
</BODY>
</HTML>
访问量: 379535