最近自己在做的一个项目,名称:TShark V0.6, UI部分主要使用JQuery UI实现。
主要技术:JDK + Spring + Hibernate + JQuery + JQuery UI + JqGrid + FusionCharts
By the way:后台ORM部分使用了SpringSide的部分代码(这里感谢一下)
主要功能:
支持i18:目前只提供 English and Chinese
支持Theme更换:基于JQuery UI
提供多种系统风格:详见下图
提供了部分基础通用管理功能:用户、角色、权限、资源、菜单、工具栏。。。
Demo URL:http://do.jhost.cn/cnnetiger/system/login.html 空间是免费的速度可能有些慢(但还是要感谢一下,毕竟免费的JSP空间太少了),大家将就着看吧。
目前还存在很多问题,所以版本为0.6,待版本升到1.0后,如果有人需要,将会开源,为了保证数据的完整性,目前暂时屏蔽了数据更新操作
目前只在FireFox下做过仔细测试,所以建议使用FireFox,顺便再鄙视一下IE,你不是一般的烂...
部分代码样例
user list
<ts:toolbar />
<!--Table Search-->
<page:applyDecorator name="search">
<page:param name="formId">roleTable_Search</page:param>
<table class="table_search_form"><tr>
<th><fmt:message key="label.role.name"/>:</td>
<td>
<input type="text" name="filter_LIKES_name" id="filter_LIKE_name">
</td>
<td>
<ts:button name="search" onClick="doSearch('roleTable_Search');"/>
<ts:button name="reset" onClick="doReset('roleTable_Search');"/>
</td>
</tr>
</table>
</page:applyDecorator>
<!--Table list-->
<ts:table id="roleTable" url="/system/role/getlistData.html" sortName="name" rowNum="20" title="label.role.list" rowNumbers="true" ondblClickRow="viewRoleDetail">
<ts:row>
<ts:column display="ID" align="center" property="id" sort="string" name="id" width="20" hidden="true"/>
<ts:column display="label.role.name" align="center" property="name" name="name" sort="string" width="20" />
<ts:column display="label.role.description" align="center" property="description" sortable="false" name="description" width="20" />
</ts:row>
</ts:table>
user form
<form id="userModel" method="post" name="userModel" onSubmit="return false;">
<form:hidden path="userModel.id" />
<table class="table_form">
<tr>
<th>*<fmt:message key="label.user.code"/>:</th>
<td><form:input path="userModel.code" size="30"/></td>
<th>*<fmt:message key="label.user.name"/>:</th>
<td><form:input path="userModel.name" size="30"/></td>
</tr>
<tr>
<th><fmt:message key="label.user.phone"/>:</th>
<td><form:input path="userModel.phone" size="30"/></td>
<th><fmt:message key="label.user.mobilePhone"/>:</th>
<td><form:input path="userModel.mobilePhone" size="30"/></td>
</tr>
<tr>
<th><fmt:message key="label.user.email"/>:</th>
<td><form:input path="userModel.email" size="30"/></td>
<th>*<fmt:message key="label.user.group"/>:</th>
<td>
<form:select path="userModel.group.id">
<form:option value=""><fmt:message key="label.group.prompt"/></form:option>
<form:options items="${allGroups}" itemValue="id" itemLabel="name"/>
</form:select>
</td>
</tr>
<tr>
<th><fmt:message key="label.user.memo"/>:</th>
<td colspan="3"><form:textarea path="userModel.memo" rows="3" cols="84"/></td>
</tr>
<tr>
<td colspan="4">
<fieldset class="multi-select-panel" style="margin:0;">
<legend><fmt:message key="label.role.authorization"/></legend>
<ul id="userRoles">
<c:forEach var="item" items="${allRoles}" varStatus="s">
<li class="ts-checkbox">
<INPUT type="checkbox" id="role_${item.id}" value="${item.id}" <c:if test="${item.hasAuth == true}">checked</c:if>><label for="role_${item.id}">${item.name}</label>
</li>
</c:forEach>
</ul>
</fieldset>
</td>
</tr>
</table>
<table class="table_toolbar">
<TR>
<TD><ts:button name="save" onClick="doSave('/system/user/save.html','userModel');"/></TD>
<TD><ts:button name="reset" onClick="doReset('userModel');"/></TD>
<TD><ts:button name="return"/></TD>
</TR>
</table>
</form>
</div>
<v:javascript formName="userModel" staticJavascript="true" />