angularJS+html+Spring+Mybatis

var app = angular.module("dbApi.service", []);
app.service("dbApiService", ['$http' , '$q'  , function($http , $q){

this.queryTables = function(pageNo , pageSize , sreachDbName){
var deferred = $q.defer();
$http.get("api/querytables/" + pageNo + "/" + pageSize + "?sreachDbName=" + sreachDbName)
.success(function(data) {
deferred.resolve(data);
})
.error(function(data) {
deferred.reject(data);
}) ;
return deferred.promise;
} ;

this.queryTableInfo = function(dbname){
var deferred = $q.defer();
$http.get("api/queryTableInfo?dbname=" + dbname)
.success(function(data) {
deferred.resolve(data);
})
.error(function(data) {
deferred.reject(data);
}) ;
return deferred.promise;
} ;

this.queryNeeds = function(pageNo , pageSize , sreachDescName){
var deferred = $q.defer();
$http.get("api/queryNeeds/" + pageNo + "/" + pageSize+"?sreachDescName=" + sreachDescName)
.success(function(data) {
deferred.resolve(data);
})
.error(function(data) {
deferred.reject(data);
}) ;
return deferred.promise;
} ;

this.addNeeds = function(pageNo , pageSize , need_desc, need_people, need_sql){
var deferred = $q.defer();
$http.get("api/queryNeeds/" + pageNo + "/" + pageSize +
"?need_desc=" + need_desc + "?need_people=" + need_people + "?need_sql=" + need_sql)
.success(function(data) {
deferred.resolve(data);
})
.error(function(data) {
deferred.reject(data);
}) ;
return deferred.promise;
} ;

}]);

var app = angular.module("dbHome.controller" , ["ngRoute" , "dbShow.controller" , "dbNeed.controller"]) ;

app.config(function ($routeProvider) {
$routeProvider.
when('/home', {
templateUrl: './page/app/showDb.html',
controller: 'showDbCtrl'
}).
when('/need', {
templateUrl: './page/app/need.html',
controller: 'needCtrl'
}).
otherwise({
redirectTo: '/home'
});
});

var app = angular.module("dbNeed.controller" , ["dbApi.service" , "ngTable" , "ui.bootstrap"]) ;

app.controller("needCtrl" , ["$scope" , "dbApiService" ,  'NgTableParams' ,  function($scope , api , NgTableParams) {
$scope.changeDateFir = true ;
$scope.sreachDescName = "" ;
$scope.queryNeeds = function(){
if($scope.totalNeeds != undefined){
$scope.changeDateFir=!$scope.changeDateFir;
$scope.totalNeeds.page(1) ;
$scope.totalNeeds.count(15) ;
$scope.totalNeeds.sorting({
changeDate: $scope.changeDateFir?'desc':'asc'
});
}else{
$scope.totalNeeds = new NgTableParams({
page: 1 ,
count: 15   ,
},
{  counts: [],
getData: function($defer, params) {
var count = params.count();
var page = params.page();
api.queryNeeds(page , count , $scope.sreachDescName).then(function(data){
if(data.callStatus == 'SUCCEED' && data && data.data.length > 0){
params.total(data.totalNumber) ;
$defer.resolve(data.data) ;
}else{
$defer.resolve([]);
}
}, function(data) {
$defer.resolve([]);
});
}
});
}
};

$scope.queryNeeds() ;

}]) ;

var app = angular.module("dbShow.controller" , ["dbApi.service" , "ngTable" , "ui.bootstrap"]) ;

app.controller("showDbCtrl" , ['$scope' , '$uibModal' , 'NgTableParams' , 'dbApiService' , function($scope , $uibModal ,  NgTableParams , api){
$scope.changeDateFir = true ;
$scope.sreachDbName = "" ;
$scope.dbTables = function(){
if($scope.totalTables != undefined){
$scope.changeDateFir=!$scope.changeDateFir;
$scope.totalTables.page(1) ;
$scope.totalTables.count(15) ;
$scope.totalTables.sorting({
changeDate: $scope.changeDateFir?'desc':'asc'
});
}else{
$scope.totalTables = new NgTableParams({
page: 1 ,
count: 15   ,
},
{  counts: [],
getData: function($defer, params) {
var count = params.count();
var page = params.page();
api.queryTables(page , count , $scope.sreachDbName).then(function(data){
if(data.callStatus == 'SUCCEED' && data && data.data.length > 0){
params.total(data.totalNumber) ;
$defer.resolve(data.data) ;
}else{
$defer.resolve([]);
}
}, function(data) {
$defer.resolve([]);
});
}
});
}
};

$scope.dbTables() ;

$scope.showTableInformation = function(dbname){  //打开模态
var modalInstance = $uibModal.open({
animation:true,
templateUrl : 'newFunctionReminder.html',  //指向上面创建的视图
controller : 'AllModalInstanceCtrl',// 初始化模态范围
size : 'lg', //大小配置
resolve:{
items: function () {//items是一个回调函数
return dbname  ;//这个值会被模态框的控制器获取到
}
}
});

modalInstance.result.then(function(){
},function(){
});
};
}]);

app.controller("AllModalInstanceCtrl", ["$scope" , "$uibModalInstance" , "dbApiService" , "items" , function($scope , $uibModalInstance , api , items){ //依赖于modalInstance
api.queryTableInfo(items).then(function(data){
$scope.tableInfomatin = data  ;
});
$scope.cancel = function(){
$uibModalInstance.dismiss('cancel'); // 退出
};
}]);

<!DOCTYPE html>
<html ng-app="dbHome.controller">
<head>

<meta charset="utf-8">
<title>数据视图</title>

<link href="page/common/css/bootstrap.min.css" rel="stylesheet">
<link href="page/common/css/ng-table.css" rel="stylesheet">

<script src="page/common/js/angular.js"></script>
<script src="page/common/js/ng-table.js"></script>
<script src="page/common/js/ui-bootstrap-tpls.js"></script>
<script src="page/common/js/angular-animate.min.js"></script>
<script src="page/common/js/angular-route.min.js"></script>

<script src="page/app/js/controllers/db-home-controller.js"></script>
<script src="page/app/js/controllers/db-need-controller.js"></script>
<script src="page/app/js/controllers/db-show-controller.js"></script>
<script src="page/app/js/services/db-api-service.js"></script>

</head>

<body>
<div class="navbar navbar-inverse">
<a class="navbar-breand" href="#/home">数据视图</a>
</div>

<div class="panel panel-default row">
<div class="col-xs-2">
<ul class="nav nav-stacked">
<li><a href="#/need">上报需求</a></li>
<li><a href="#/">我要吐槽</a></li>
</ul>
</div>
<div class="col-xs-8">
<div ng-view=""></div>
</div>
</div>
</body>
</html>

<div>
<form class="bs-example bs-example-form" role="form">
<div class="row">
<div class="col-lg">
<div class="input-group">
<input class="form-control" type="text" ng-model="sreachDescName"
placeholder="上报需求描述"> <span class="input-group-btn">
<button class="btn btn-default" ng-click="queryNeeds()">
Submit</button>
</span>
</div>
</div>
</div>
</form>

<br>

<table ng-table="totalNeeds" class="table table-hover">
<tbody>
<tr>
<th>需求描述</th>
<th>上报人</th>
<th>上报时间</th>
</tr>
<tr ng-repeat="need in $data">
<td>{{need.need_desc|limitTo:15}}</td>
<td>{{need.need_people}}</td>
<td>{{need.need_time}}</td>
</tr>
</tbody>
</table>
</div>

<div>

<form class="bs-example bs-example-form" role="form">
<div class="row">
<div class="col-lg">
<div class="input-group">
<input class="form-control" type="text" ng-model="sreachDbName" placeholder="按表名查詢" >
<span class="input-group-btn">
<button class="btn btn-default" ng-click="dbTables()">
Submit
</button>
</span>
</div>
</div>
</div>
</form>

<br>

<table ng-table="totalTables" class="table table-hover">
<tbody>
<tr>
<th>表名</th>
<th>描述</th>
</tr>
<tr ng-repeat="db in $data">
<td ng-click="showTableInformation(db.table_name)"><a href>{{db.table_name}}</a></td>
<td>{{db.description}}</td>
</tr>
</tbody>
</table>

<script type="text/ng-template" id="newFunctionReminder.html">
<div class="modal-header update-modal-title">
</div>
<table class="table table-hover">
<tbody>
<tr>
<th>列名</th>
<th>描述</th>
<th>类型</th>
<th>可空</th>
</tr>
<tr ng-repeat="dbinfo in tableInfomatin">
<td>{{dbinfo.column_name}}</td>
<td>{{dbinfo.description}}</td>
<td>{{dbinfo.data_type}}</td>
<td>{{dbinfo.is_nullable}}</td>
</tr>
</tbody>
</table>
<div class="modal-footer update-modal-footer">
<button class="btn" ng-click="cancel()">关闭</button>
</div>
</script>

</div>

<select id="queryTables" resultType="java.util.HashMap">
select a.table_name , b.description
from(
SELECT table_name
FROM information_schema.tables WHERE table_schema = 'public'
)a
left join
(  select  table_name , des.description
FROM information_schema.tables tab
LEFT JOIN pg_description des
ON tab.table_name::regclass = des.objoid
WHERE table_schema = 'public'
AND  des.objsubid=0
)b
on a.table_name  = b.table_name
order by table_name
</select>

<select id="queryTableInfo" resultType="java.util.HashMap">
select  col.column_name , col.is_nullable , col.data_type , des.description
FROM information_schema.columns col
LEFT JOIN pg_description des ON col.table_name::regclass = des.objoid AND col.ordinal_position = des.objsubid
WHERE table_schema = 'public'
AND table_name =#{dbname,jdbcType=VARCHAR}
</select>

<select id="queryNeeds" resultType="java.util.HashMap">
select   to_char(need_time , 'YYYY-MM-DD HH:MM:SS') as need_time , need_desc ,  need_people , user_sql as need_sql
from ebd_tmp_need
where need_desc like CONCAT('%',#{sreachDescName,jdbcType=VARCHAR},'%')
offset #{offset,jdbcType=INTEGER}  limit #{limit,jdbcType=INTEGER}
</select>

<select id="queryNeedCount" resultType="java.lang.Integer">
select  count(*) from ebd_tmp_need
where need_desc like  CONCAT('%',#{sreachDescName,jdbcType=VARCHAR},'%')
</select>

mybatis.cfg.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>

<!-- 基础设置 -->
<settings>
<!-- changes from the defaults -->
<setting name="lazyLoadingEnabled" value="false" />
<!-- 表名重用预编译的SQL语句 -->
<setting name="defaultExecutorType" value="REUSE" />
<!-- 全局映射器启用缓存 -->
<setting name="cacheEnabled" value="true" />
<!-- 查询时，关闭关联对象即时加载以提高性能 -->
<setting name="lazyLoadingEnabled" value="true" />
<!-- 设置关联对象加载的形态，此处为按需加载字段(加载字段由SQL指 定)，不会加载关联表的所有字段，以提高性能 -->
<setting name="aggressiveLazyLoading" value="false" />
<!-- 对于未知的SQL查询，允许返回不同的结果集以达到通用的效果 -->
<setting name="multipleResultSetsEnabled" value="true" />
<!-- 允许使用列标签代替列名 -->
<setting name="useColumnLabel" value="true" />
<!-- 允许使用自定义的主键值(比如由程序生成的UUID 32位编码作为键值)，数据表的PK生成策略将被覆盖 -->
<!-- <setting name="useGeneratedKeys" value="true" /> -->
<!-- 给予被嵌套的resultMap以字段-属性的映射支持 -->
<setting name="autoMappingBehavior" value="FULL" />
<!-- 对于批量更新操作缓存SQL以提高性能 -->
<setting name="defaultExecutorType" value="SIMPLE" />
<!-- 数据库超过25000秒仍未响应则超时 -->
<setting name="defaultStatementTimeout" value="25000" />

<setting name="callSettersOnNulls" value="true" />
</settings>

<!-- 别名定义 -->
<typeAliases>
</typeAliases>

</configuration>

web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
<display-name>DBView</display-name>

<filter>
<filter-name>encodingFilter</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
<init-param>
<param-name>forceEncoding</param-name>
<param-value>true</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>encodingFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>

<listener>
<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>

<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:applicationContext-*.xml</param-value>
</context-param>

<context-param>
<param-name>log4jConfigLocation</param-name>
<param-value>classpath:log4j.properties</param-value>
</context-param>
<context-param>
<param-name>log4jRefreshInterval</param-name>
<param-value>6000</param-value>
</context-param>

<context-param>
<param-name>kmRootKey</param-name>
<param-value>km.root</param-value>
</context-param>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.js</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.csv</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.json</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.html</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.css</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.jpg</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.png</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.PNG</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.woff</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.woff2</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.ttf</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.eot</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.svg</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.ico</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.gif</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.pdf</url-pattern>
</servlet-mapping>
<servlet>
<servlet-name>mvc-dispatcher</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>mvc-dispatcher</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>

</web-app>

mvc-dispatcher-servlet.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context"
xmlns:mvc="http://www.springframework.org/schema/mvc" xmlns:aop="http://www.springframework.org/schema/aop"
xmlns:task="http://www.springframework.org/schema/task"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc.xsd http://www.springframework.org/schema/websocket http://www.springframework.org/schema/websocket/spring-websocket.xsd http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.0.xsd http://www.springframework.org/schema/task http://www.springframework.org/schema/task/spring-task.xsd"> <mvc:annotation-driven/>
<mvc:default-servlet-handler/>
<context:component-scan base-package="X.X.X.X"/>

<bean
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="/page/app" />
<property name="suffix" value=".html" />
</bean>

<bean
class="org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerAdapter">
<property name="messageConverters">
<list>
<bean
class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter" />
<bean class="org.springframework.http.converter.FormHttpMessageConverter" />
</list>
</property>
</bean>

<bean class="org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerMapping" />

</beans>

applicationContext-jdbc.xml
<?xml version="1.0" encoding="UTF-8"?>
<beans default-autowire="byName"
xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context" xmlns:tx="http://www.springframework.org/schema/tx"
xmlns:task="http://www.springframework.org/schema/task" xmlns:mvc="http://www.springframework.org/schema/mvc"
xmlns:util="http://www.springframework.org/schema/util"
xsi:schemaLocation=" http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/task http://www.springframework.org/schema/task/spring-task.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc.xsd http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util.xsd">

<bean id="transactionManager"
class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
<property name="dataSource" ref="dataSource" />
</bean>

<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
<property name="dataSource" ref="dataSource" />
<property name="configLocation" value="classpath:mybatis.cfg.xml" />
<property name="mapperLocations" value="classpath:X/X/**/*Mapper.xml" />
</bean>

<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<property name="sqlSessionFactoryBeanName" value="sqlSessionFactory" />
<property name="basePackage" value="cn.paic.rep.pare.dao.impl" />
</bean>

<bean id="jdbcTemplate" class="org.springframework.jdbc.core.JdbcTemplate">
<property name="dataSource">
<ref bean="dataSource" />
</property>
</bean>

</beans>

applicationContext-resource.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:mvc="http://www.springframework.org/schema/mvc"
xmlns:p="http://www.springframework.org/schema/websocket"
xmlns:context="http://www.springframework.org/schema/context"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc.xsd http://www.springframework.org/schema/websocket http://www.springframework.org/schema/websocket/spring-websocket.xsd"> 
<bean id="dataSource" class="org.apache.commons.dbcp2.BasicDataSource"
destroy-method="close">
<property name="driverClassName" value="org.postgresql.Driver"></property>
<property name="url" value="jdbc:postgresql://X.X.X.X:7458/X"></property>
<property name="username" value=""></property>
<property name="password" value=""></property>
<property name="maxIdle" value="50"></property>
<property name="minIdle" value="10"></property>
</bean>

</beans>