修改gfs配置界面
This commit is contained in:
parent
669d2c84ab
commit
db2884438d
|
@ -24,11 +24,13 @@ declare module Configs {
|
||||||
name: string;
|
name: string;
|
||||||
path: string;
|
path: string;
|
||||||
brick: Array<Brick>;
|
brick: Array<Brick>;
|
||||||
status: string;
|
status: boolean;
|
||||||
|
editable: boolean;
|
||||||
}
|
}
|
||||||
interface Brick {
|
interface Brick {
|
||||||
ip: Array<string>;
|
ip: Array<string>;
|
||||||
status: boolean;
|
status: boolean;
|
||||||
path: string;
|
path: string;
|
||||||
|
editable: boolean;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,6 +7,7 @@ declare module Configs {
|
||||||
status: boolean;
|
status: boolean;
|
||||||
availableSize?: number;
|
availableSize?: number;
|
||||||
usedSize?: number;
|
usedSize?: number;
|
||||||
|
editable?: boolean;
|
||||||
}
|
}
|
||||||
interface oracleParam {
|
interface oracleParam {
|
||||||
name: string;
|
name: string;
|
||||||
|
@ -25,6 +26,8 @@ declare module Configs {
|
||||||
folder?: Array<any>;
|
folder?: Array<any>;
|
||||||
status: string;
|
status: string;
|
||||||
path: string;
|
path: string;
|
||||||
|
editable?: boolean;
|
||||||
|
alive?: boolean;
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
刪除volume中指定的brock
|
刪除volume中指定的brock
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -248,8 +248,8 @@ gulp.task('connect', ['watch'], function() {
|
||||||
targetPath: '/hawtio/git'
|
targetPath: '/hawtio/git'
|
||||||
}, {
|
}, {
|
||||||
proto: "http",
|
proto: "http",
|
||||||
port: "8080",
|
port: "8088",
|
||||||
hostname: "192.168.0.101",
|
hostname: "192.168.0.110",
|
||||||
path: '/java/console/api',
|
path: '/java/console/api',
|
||||||
targetPath: "/"
|
targetPath: "/"
|
||||||
}];
|
}];
|
||||||
|
|
|
@ -18,7 +18,8 @@
|
||||||
<table class="table sj_content_table sj_table_border" >
|
<table class="table sj_content_table sj_table_border" >
|
||||||
<thead class="no-scope">
|
<thead class="no-scope">
|
||||||
<tr>
|
<tr>
|
||||||
<th class="sj_c_green table-header sj_table_td00" >已启用</th>
|
<th ng-show="row.status == Started ||Created" class="sj_c_green table-header sj_table_td00" >已启用</th>
|
||||||
|
<th ng-show="row.status == Stopped" class="sj_c_green table-header sj_table_td00" >已停止</th>
|
||||||
<th class="no-fade table-header sj_table_td06">
|
<th class="no-fade table-header sj_table_td06">
|
||||||
<span class="">{{volume.name}}</span>
|
<span class="">{{volume.name}}</span>
|
||||||
</th>
|
</th>
|
||||||
|
@ -37,13 +38,17 @@
|
||||||
<button class="btn sj_btn" ng-click="editRow(volume)">
|
<button class="btn sj_btn" ng-click="editRow(volume)">
|
||||||
<span class="glyphicon glyphicon-pencil"></span> 编辑
|
<span class="glyphicon glyphicon-pencil"></span> 编辑
|
||||||
</button>
|
</button>
|
||||||
</th>
|
<button class="btn sj_btn" ng-click="deleteRow(volume)">
|
||||||
|
<span class="glyphicon glyphicon-trash"></span> 刪除
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr ng-repeat="row in volume.brick track by $index" class="row.class">
|
<tr ng-repeat="row in volume.brick track by $index" class="row.class">
|
||||||
<td>
|
<td>
|
||||||
<span class="glyphicon glyphicon-ok sj_c_green " ></span>
|
<span ng-show="row.status" class="glyphicon glyphicon-ok sj_c_green " ></span>
|
||||||
|
<span ng-hide="row.status" class="glyphicon glyphicon-remove sj_c_green " ></span>
|
||||||
</td>
|
</td>
|
||||||
<td >
|
<td >
|
||||||
<span class="">服务器{{$index+1}}</span>
|
<span class="">服务器{{$index+1}}</span>
|
||||||
|
|
|
@ -21,20 +21,22 @@
|
||||||
</script>
|
</script>
|
||||||
<script type="text/ng-template" id="newDialog.html">
|
<script type="text/ng-template" id="newDialog.html">
|
||||||
<div class="sj_new_box">
|
<div class="sj_new_box">
|
||||||
<div class=" mb10">
|
<ng-form name="volumeForm" class=" mb10" novalidate="novalidate">
|
||||||
<table class="sj_new_table clear">
|
<table class="sj_new_table clear">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<th class="new_left sj_c_green">已启用</th>
|
<th ng-show="ngDialogData.status" class="new_left sj_c_green">启用</th>
|
||||||
|
<th ng-hide="ngDialogData.status" class="new_left sj_c_green">停止</th>
|
||||||
<th colspan="10">
|
<th colspan="10">
|
||||||
<input type="text" class="sj_txt_box03 mr10" ng-model="ngDialogData.name " />
|
<input type="text" class="sj_txt_box03 mr10" ng-model="ngDialogData.name " pattern="^\w{4,20}$" ng-disabled="!{{ngDialogData.editable}}"/>
|
||||||
</th>
|
</th>
|
||||||
<th>云目录:</th>
|
<th>云目录:</th>
|
||||||
<th>
|
<th>
|
||||||
<input type="text" class="sj_txt_box02 mr5" ng-model="ngDialogData.path" />
|
<input type="text" class="sj_txt_box02 mr5" ng-model="ngDialogData.path" ng-disabled="!{{ngDialogData.editable}}"/>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<button class="sj_btn_red fl">停止</button>
|
<button ng-show="ngDialogData.status" class="sj_btn_red fl" ng-click="stopVolume(ngDialogData)">停止</button>
|
||||||
|
<button ng-hide="ngDialogData.status" class="sj_btn_red fl" ng-click="startVolume(ngDialogData)">启动</button>
|
||||||
</th>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
<tr ng-repeat = "row in ngDialogData.brick">
|
<tr ng-repeat = "row in ngDialogData.brick">
|
||||||
|
@ -43,29 +45,29 @@
|
||||||
<span ng-hide = "row.status" class="sj_icon_warning">
|
<span ng-hide = "row.status" class="sj_icon_warning">
|
||||||
</th>
|
</th>
|
||||||
<th colspan="3">
|
<th colspan="3">
|
||||||
<input type="text" class="sj_txt_box04 mr5" value="服务器 {{$index + 1}} "/>
|
<input type="text" class="sj_txt_box04 mr5" value="服务器 {{$index + 1}} " ng-disabled="true" />
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<input type="text" class="sj_txt_box05" ng-model="row.ip[0]" />
|
<input type="text" class="sj_txt_box05" ng-model="row.ip[0]" ng-disabled="!{{row.editable}}" />
|
||||||
</th>
|
</th>
|
||||||
<th>.</th>
|
<th>.</th>
|
||||||
<th>
|
<th>
|
||||||
<input type="text" class="sj_txt_box05" ng-model="row.ip[1]" />
|
<input type="text" class="sj_txt_box05" ng-model="row.ip[1]" ng-disabled="!{{row.editable}}" />
|
||||||
</th>
|
</th>
|
||||||
<th>.</th>
|
<th>.</th>
|
||||||
<th>
|
<th>
|
||||||
<input type="text" class="sj_txt_box05" ng-model="row.ip[2]" />
|
<input type="text" class="sj_txt_box05" ng-model="row.ip[2]" ng-disabled="!{{row.editable}}" />
|
||||||
</th>
|
</th>
|
||||||
<th>.</th>
|
<th>.</th>
|
||||||
<th>
|
<th>
|
||||||
<input type="text" class="sj_txt_box05 mr10" ng-model="row.ip[3]"/>
|
<input type="text" class="sj_txt_box05 mr10" ng-model="row.ip[3]" ng-disabled="!{{row.editable}}" />
|
||||||
</th>
|
</th>
|
||||||
<th>存储块:</th>
|
<th>存储块:</th>
|
||||||
<th>
|
<th>
|
||||||
<input type="text" class="sj_txt_box02 mr5" ng-model="row.path" />
|
<input type="text" class="sj_txt_box02 mr5" ng-model="row.path" ng-disabled="!{{row.editable}}"/>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<button class="sj_btn_grey fl">连接</button>
|
<!--<button class="sj_btn_grey fl">连接</button>-->
|
||||||
<a href="#" class="sj_icon_del ml5 fl" ng-click="deleteBrock(ngDialogData, row)"></a>
|
<a href="#" class="sj_icon_del ml5 fl" ng-click="deleteBrock(ngDialogData, row)"></a>
|
||||||
<a href="#" ng-hide ="$index < ngDialogData.brick.length-1" class="sj_icon_add ml5 fl" ng-click="addBrock(ngDialogData)"></a>
|
<a href="#" ng-hide ="$index < ngDialogData.brick.length-1" class="sj_icon_add ml5 fl" ng-click="addBrock(ngDialogData)"></a>
|
||||||
</th>
|
</th>
|
||||||
|
@ -73,12 +75,12 @@
|
||||||
<tr>
|
<tr>
|
||||||
<th> </th>
|
<th> </th>
|
||||||
<th>
|
<th>
|
||||||
<button class="sj_btn_blue mr5" ng-click="save()">保存</button>
|
<button class="sj_btn_blue mr5" ng-click="save(ngDialogData)" ng-disabled="volumeForm.$invalid">保存</button>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<button class="sj_btn_grey mr5" ng-click="cancel()">删除</button>
|
<button class="sj_btn_grey mr5" ng-click="cancel()">取消</button>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<!--<th>
|
||||||
<button class="sj_btn_grey mr5" ng-click="cancel()">取消</button>
|
<button class="sj_btn_grey mr5" ng-click="cancel()">取消</button>
|
||||||
</th>
|
</th>
|
||||||
<!--<th colspan="5"> {{message}}</th>-->
|
<!--<th colspan="5"> {{message}}</th>-->
|
||||||
|
@ -86,7 +88,7 @@
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
<div class="alert alert-warning" role="alert" ng-show="showMessage">"删除存储块失败:集群中至少包含一个存储块!"</div>
|
<div class="alert alert-warning" role="alert" ng-show="showMessage">"删除存储块失败:集群中至少包含一个存储块!"</div>
|
||||||
</div>
|
</ng-form>
|
||||||
</div>
|
</div>
|
||||||
</script>
|
</script>
|
||||||
<div ng-controller="Kubernetes.TopLevel">
|
<div ng-controller="Kubernetes.TopLevel">
|
||||||
|
|
|
@ -130,14 +130,16 @@ module Configs{
|
||||||
brick.push({
|
brick.push({
|
||||||
ip: block.ip.split("."),
|
ip: block.ip.split("."),
|
||||||
status: block.status,
|
status: block.status,
|
||||||
path: block.path
|
path: block.path,
|
||||||
|
editable: block.editable || false
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
return {
|
return {
|
||||||
name: volume.name,
|
name: volume.name,
|
||||||
path: volume.path,
|
path: volume.path,
|
||||||
brick: brick,
|
brick: brick,
|
||||||
status: volume.status
|
status: volume.alive || false,
|
||||||
|
editable: volume.editable || false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -153,13 +155,15 @@ module Configs{
|
||||||
name: string
|
name: string
|
||||||
path: string
|
path: string
|
||||||
brick: Array<Brick>;
|
brick: Array<Brick>;
|
||||||
status: string;
|
status: boolean;
|
||||||
|
editable: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface Brick{
|
export interface Brick{
|
||||||
ip: Array<string>;
|
ip: Array<string>;
|
||||||
status: boolean;
|
status: boolean;
|
||||||
path: string;
|
path: string;
|
||||||
|
editable: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,6 +8,7 @@ module Configs{
|
||||||
status: boolean; //存储块的状态
|
status: boolean; //存储块的状态
|
||||||
availableSize?: number, //存储块的大小
|
availableSize?: number, //存储块的大小
|
||||||
usedSize?: number //存储块已使用空间
|
usedSize?: number //存储块已使用空间
|
||||||
|
editable?: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface oracleParam{
|
export interface oracleParam{
|
||||||
|
@ -27,7 +28,9 @@ module Configs{
|
||||||
brick: Array<Block>; //volume中的存储块
|
brick: Array<Block>; //volume中的存储块
|
||||||
folder?: Array<any>; //volume的文件
|
folder?: Array<any>; //volume的文件
|
||||||
status: string;
|
status: string;
|
||||||
path: string;
|
path: string;
|
||||||
|
editable?: boolean
|
||||||
|
alive?: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
//字节大小转换成字符大小
|
//字节大小转换成字符大小
|
||||||
|
@ -45,9 +48,21 @@ module Configs{
|
||||||
function formatVolume(volume:volume){
|
function formatVolume(volume:volume){
|
||||||
volume["formatTotalSize"] = getStringSize(volume.allSize);
|
volume["formatTotalSize"] = getStringSize(volume.allSize);
|
||||||
volume["formatUsedSize"] = getStringSize(volume.usedSize);
|
volume["formatUsedSize"] = getStringSize(volume.usedSize);
|
||||||
|
volume["editAble"] = false;
|
||||||
|
switch (volume.status) {
|
||||||
|
case "Stopped":
|
||||||
|
volume["alive"] = false;
|
||||||
|
break;
|
||||||
|
|
||||||
|
default:
|
||||||
|
volume["alive"] = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
angular.forEach(volume.brick, (brock) =>{
|
angular.forEach(volume.brick, (brock) =>{
|
||||||
brock["formatUsedSize"] = getStringSize(brock.usedSize);
|
brock["formatUsedSize"] = getStringSize(brock.usedSize);
|
||||||
brock["formatAllSize"] = getStringSize(brock.availableSize);
|
brock["formatAllSize"] = getStringSize(brock.availableSize);
|
||||||
|
brock["editAble"] = false;
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -109,7 +124,7 @@ module Configs{
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
this.cluster = result;
|
this.cluster = result;
|
||||||
formatVolumes(this.cluster);
|
formatVolumes(this.cluster);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -19,21 +19,24 @@ module Configs{
|
||||||
controller:'Configs.VolumeController',
|
controller:'Configs.VolumeController',
|
||||||
width: 1005,
|
width: 1005,
|
||||||
data: {
|
data: {
|
||||||
name: null,
|
name: '',
|
||||||
path: null,
|
path: '',
|
||||||
status: "",
|
status: 'Stopped',
|
||||||
brick: [{
|
brick: [{
|
||||||
ip: ["0", "0", "0", "0"],
|
ip: ["0", "0", "0", "0"],
|
||||||
path: "",
|
path: '',
|
||||||
status: false
|
status: false,
|
||||||
}]
|
editAble: true
|
||||||
|
}],
|
||||||
|
editAble: true
|
||||||
},
|
},
|
||||||
className: 'ngdialog-theme-default'
|
className: 'ngdialog-theme-default'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
$scope.editRow = (volume) => {
|
$scope.editRow = (volume) => {
|
||||||
var fVolume = formatVolume(volume);
|
var fVolume = formatVolume(volume);
|
||||||
|
console.log(fVolume);
|
||||||
ngDialog.open({
|
ngDialog.open({
|
||||||
template: 'newDialog.html',
|
template: 'newDialog.html',
|
||||||
width: 1005,
|
width: 1005,
|
||||||
|
@ -42,5 +45,22 @@ module Configs{
|
||||||
controller: 'Configs.VolumeController'
|
controller: 'Configs.VolumeController'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
$scope.deleteRow = (volume) =>{
|
||||||
|
console.log(volume);
|
||||||
|
$http({
|
||||||
|
url: "/java/console/api/volume/delete",
|
||||||
|
method: 'POST',
|
||||||
|
data: volume
|
||||||
|
}).success(function(data,header,config,status){
|
||||||
|
/*
|
||||||
|
|
||||||
|
更新volume信息
|
||||||
|
|
||||||
|
*/
|
||||||
|
}).error(function(data,header,config,status){
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
}]);
|
}]);
|
||||||
}
|
}
|
|
@ -12,10 +12,12 @@ module Configs{
|
||||||
}
|
}
|
||||||
}]);
|
}]);
|
||||||
|
|
||||||
export var VolumeController = controller('VolumeController', ['$scope', ($scope) => {
|
export var VolumeController = controller('VolumeController', ['$scope', '$http', ($scope, $http) => {
|
||||||
$scope.save = () =>{
|
$scope.save = (entity) =>{
|
||||||
|
changeStatus(entity);
|
||||||
$scope.closeThisDialog();
|
$scope.closeThisDialog();
|
||||||
}
|
}
|
||||||
|
|
||||||
$scope. cancel = () =>{
|
$scope. cancel = () =>{
|
||||||
$scope.closeThisDialog();
|
$scope.closeThisDialog();
|
||||||
}
|
}
|
||||||
|
@ -31,10 +33,49 @@ module Configs{
|
||||||
var block = {
|
var block = {
|
||||||
ip: "", //存储块的机器ip地址
|
ip: "", //存储块的机器ip地址
|
||||||
path: "", //存储块路径
|
path: "", //存储块路径
|
||||||
status: false, //存储块的状态
|
status: false, //存储块的状态
|
||||||
|
editAble:true
|
||||||
};
|
};
|
||||||
addBrock(volume, block);
|
addBrock(volume, block);
|
||||||
$scope.showMessage = false;
|
$scope.showMessage = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
$scope.stopVolume = (volume) =>{
|
||||||
|
volume.status="false";
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.startVolume = (volume) =>{
|
||||||
|
volume.status="true";
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.$watch("ngDialogData.status", (newValue, oldValue) => {
|
||||||
|
if(newValue && newValue != oldValue){
|
||||||
|
$scope.$apply();
|
||||||
|
console.log($scope.volume)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function changeStatus(entity){
|
||||||
|
angular.forEach(entity.brick, (brick) =>{
|
||||||
|
brick["ip"] = brick.ip.join(".");
|
||||||
|
});
|
||||||
|
console.log(entity);
|
||||||
|
|
||||||
|
$http({
|
||||||
|
url: "/java/console/api/volume/update",
|
||||||
|
method: 'POST',
|
||||||
|
data: entity
|
||||||
|
}).success(function(data,header,config,status){
|
||||||
|
/*
|
||||||
|
|
||||||
|
更新volume信息
|
||||||
|
|
||||||
|
*/
|
||||||
|
}).error(function(data,header,config,status){
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
}]);
|
}]);
|
||||||
}
|
}
|
Loading…
Reference in New Issue