数据迁移弹框界面修改

This commit is contained in:
Linda 2016-09-08 16:04:35 +08:00
parent 32311b2c73
commit 4ffba40f1f
4 changed files with 377 additions and 359 deletions

View File

@ -207,6 +207,353 @@ legend {
background-color: Red;
}
/* This is for the 'Overview' page with all the rows of boxes */
.service-view-rectangle {
position: relative;
margin-left: 0;
margin-right: 0px;
margin-bottom: 15px;
margin-top: 0;
background-color: #fafafa;
border-width: 1px;
border-style: solid;
border-color: #eeeeee;
}
.service-view-rectangle .service-view-header {
margin-top: 5px;
margin-bottom: 5px;
line-height: 20px;
vertical-align: middle;
}
.service-view-rectangle .service-view-detail-pod-box {
background-color: #eeeeee;
display: inline-block;
font-size: smaller;
}
.service-view-rectangle .service-view-header-delete .red {
opacity: 0.5;
transition: opacity 1s;
font-size: larger;
}
.service-view-rectangle .service-view-header-delete:hover .red {
opacity: 1;
}
.service-view-rectangle .service-view-icon img {
width: 32px;
height: 32px;
margin-right: 6px;
}
.service-view-rectangle .service-view-name {
font-size: larger;
font-weight: bold;
}
.service-view-rectangle .service-view-detail-header {
padding-top: 5px;
padding-bottom: 5px;
line-height: 20px;
}
.service-view-rectangle .service-view-detail-rectangle {
background-color: #eeeeee;
padding-left: 10px;
padding-right: 10px;
}
.service-view-rectangle .service-view-detail-rectangle .value {
font-weight: bold;
}
.service-view-rectangle .service-view-detail-pod-summary,
.service-view-rectangle .service-view-detail-pod-summary-expand {
display: inline-block;
padding-top: 2px;
padding-bottom: 2px;
padding-left: 20px;
padding-right: 20px;
margin-right: 8px;
margin-bottom: 8px;
background-color: #ffffff;
}
.service-view-rectangle .service-view-detail-pod-summary table td,
.service-view-rectangle .service-view-detail-pod-summary-expand table td {
padding-left: 10px;
padding-right: 10px;
}
.service-view-rectangle .service-view-detail-pod-status,
.service-view-rectangle .service-view-detail-pod-connect {
line-height: 36px;
padding-right: 20px;
}
.service-view-rectangle .service-view-detail-pod-status i,
.service-view-rectangle .service-view-detail-pod-connect i {
font-size: 36px;
display: inline-block;
vertical-align: middle;
}
.service-view-rectangle .service-view-detail-pod-expand {
color: #a0a0a0;
font-size: 18px;
padding-right: 0px;
}
.kubernetes-view .filter-header {
margin-bottom: 1em;
}
/* This is all for the diagram, not the 'Overview' page */
.kubernetes-overview {
width: 100%;
height: 100%;
display: table;
table-layout: fixed;
}
.kubernetes-overview-row {
display: table-row;
}
.kubernetes-overview-cell {
display: table-cell;
text-align: center;
vertical-align: middle;
padding: 0;
}
.service-wrapper {
display: block;
vertical-align: middle;
}
.kubernetes-node {
margin-left: auto;
margin-right: auto;
cursor: pointer;
text-align: center;
vertical-align: middle;
border: 1px solid #d4d4d4;
background: white;
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
border-radius: 4px;
transition: background 0.5s;
z-index: 1000;
}
.kubernetes-host-container {
margin-top: 5px;
margin-bottom: 5px;
margin-left: auto;
margin-right: auto;
text-align: center;
max-width: 600px;
min-width: 300px;
padding: 0;
border: 1px solid #d4d4d4;
background: white;
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
border-radius: 4px;
}
.kubernetes-pod-node {
display: block;
margin: 0;
padding: 0;
min-height: 48px;
line-height: 48px;
border-radius: 0;
border: 1px solid transparent;
border-top: 1px solid #d4d4d4;
box-shadow: none;
vertical-align: middle;
}
.css-table {
display: table;
width: 100%;
height: 100%;
}
.css-table-row {
display: table-row;
}
.css-table-row .pod-status-cell {
text-align: left;
padding-left: 5px;
padding-right: 5px;
}
.css-table-row .pod-status-cell i {
margin-left: 3px;
margin-right: 3px;
}
.css-table-row .pod-status-cell .clickable {
width: auto !important;
}
.css-table-cell {
display: table-cell;
vertical-align: middle;
}
.kubernetes-pod-node i {
font-size: 24px;
}
.kubernetes-overview-services {
width: 200px;
}
.kubernetes-service-node {
display: block;
margin-bottom: 10px;
width: 200px;
min-height: 66px;
padding: 0;
line-height: 48px;
}
.kubernetes-service-node .node-body {
display: inline;
padding-left: 10px;
line-height: 64px;
font-size: 20px;
float: left;
}
.kubernetes-service-node .node-header {
display: inline;
float: right;
}
.node-header {
padding-right: 10px;
white-space: nowrap;
line-height: 64px;
overflow: hidden;
text-overflow: ellipsis;
}
.kubernetes-replicationController-node {
border-radius: 64px;
display: block;
width: 64px;
height: 64px;
padding: 7px;
font-weight: bold;
vertical-align: middle;
overflow: hidden;
text-overflow: ellipsis;
}
.kubernetes-overview-cell .app-icon-medium {
width: 48px;
height: 48px;
}
.kubernetes-replicationController-node img {
width: 64px;
}
.kubernetes-node:hover,
.kubernetes-node.hovered {
background: #ddddff;
}
.pod-status-cell {
width: 80px;
line-height: 20px;
}
.pod-label-cell {
float: right;
text-align: right;
min-height: 48px;
}
.pod-label-cell .ngCellText {
white-space: normal;
}
.pod-log-lines * {
padding-left: 5px;
padding-right: 5px;
font-family: monospace;
margin: 0;
line-height: 14px;
}
.pod-log-lines * .black {
color: #222;
}
.pod-log-lines * .red {
color: #f22;
}
.pod-log-lines * .green {
color: #2f2;
}
.pod-log-lines * .yellow {
color: #ff2;
}
.pod-log-lines * .blue {
color: #22f;
}
.pod-log-lines * .purple {
color: #f2f;
}
.pod-log-lines * .cyan {
color: #2dd;
}
.pod-log-lines * .white {
color: #ddd;
}
.top-bottom-middle {
line-height: 34px;
}
.terminal-window {
position: fixed;
bottom: 0;
background: white;
border: 1px solid #d4d4d4;
overflow: hidden;
z-index: 1040;
}
.terminal-window .resize-dot {
width: 16px;
height: 16px;
border: 1px solid #d4d4d4;
background: white;
position: absolute;
bottom: 10px;
right: 10px;
cursor: nwse-resize;
border-radius: 8px;
z-index: 10000;
}
.terminal-window.minimized .resize-dot,
.terminal-window.maximized .resize-dot {
display: none;
}
.terminal-window.minimized .terminal-title,
.terminal-window.maximized .terminal-title {
cursor: inherit;
}
.terminal-window .terminal-body {
overflow: auto;
}
.terminal-window .terminal-body .terminal-wrapper > .terminal * {
font-family: 'DroidSansMonoRegular';
}
.terminal-window .terminal-title {
cursor: move;
border-bottom: 1px solid #d4d4d4;
}
.terminal-window .terminal-title > h5 {
display: inline-block;
margin-left: 5px;
}
.terminal-window .terminal-title > i {
font-size: 16px;
margin-right: 5px;
margin-top: 7px;
}
kubernetes-container-terminal .terminal-wrapper {
display: block !important;
}
kubernetes-container-terminal .terminal-actions {
position: absolute !important;
}
.pod-log-window .scroll-indicator {
position: absolute;
bottom: 0;
line-height: 32px;
left: 20px;
right: 20px;
background-color: #ffffff;
border-top: 1px solid #d4d4d4;
border-left: 1px solid #d4d4d4;
border-right: 1px solid #d4d4d4;
border-radius: 4px 4px 0 0;
cursor: pointer;
z-index: 10000;
opacity: 0.7;
}
.pod-log-window .terminal-body {
overflow-y: auto;
overflow-x: hidden;
}
.environment-row a {
color: black;
}
@ -686,353 +1033,6 @@ a:hover.data_file_btn {
background: url(../img/icons2.gif) -6px 9px no-repeat;
}
/* This is for the 'Overview' page with all the rows of boxes */
.service-view-rectangle {
position: relative;
margin-left: 0;
margin-right: 0px;
margin-bottom: 15px;
margin-top: 0;
background-color: #fafafa;
border-width: 1px;
border-style: solid;
border-color: #eeeeee;
}
.service-view-rectangle .service-view-header {
margin-top: 5px;
margin-bottom: 5px;
line-height: 20px;
vertical-align: middle;
}
.service-view-rectangle .service-view-detail-pod-box {
background-color: #eeeeee;
display: inline-block;
font-size: smaller;
}
.service-view-rectangle .service-view-header-delete .red {
opacity: 0.5;
transition: opacity 1s;
font-size: larger;
}
.service-view-rectangle .service-view-header-delete:hover .red {
opacity: 1;
}
.service-view-rectangle .service-view-icon img {
width: 32px;
height: 32px;
margin-right: 6px;
}
.service-view-rectangle .service-view-name {
font-size: larger;
font-weight: bold;
}
.service-view-rectangle .service-view-detail-header {
padding-top: 5px;
padding-bottom: 5px;
line-height: 20px;
}
.service-view-rectangle .service-view-detail-rectangle {
background-color: #eeeeee;
padding-left: 10px;
padding-right: 10px;
}
.service-view-rectangle .service-view-detail-rectangle .value {
font-weight: bold;
}
.service-view-rectangle .service-view-detail-pod-summary,
.service-view-rectangle .service-view-detail-pod-summary-expand {
display: inline-block;
padding-top: 2px;
padding-bottom: 2px;
padding-left: 20px;
padding-right: 20px;
margin-right: 8px;
margin-bottom: 8px;
background-color: #ffffff;
}
.service-view-rectangle .service-view-detail-pod-summary table td,
.service-view-rectangle .service-view-detail-pod-summary-expand table td {
padding-left: 10px;
padding-right: 10px;
}
.service-view-rectangle .service-view-detail-pod-status,
.service-view-rectangle .service-view-detail-pod-connect {
line-height: 36px;
padding-right: 20px;
}
.service-view-rectangle .service-view-detail-pod-status i,
.service-view-rectangle .service-view-detail-pod-connect i {
font-size: 36px;
display: inline-block;
vertical-align: middle;
}
.service-view-rectangle .service-view-detail-pod-expand {
color: #a0a0a0;
font-size: 18px;
padding-right: 0px;
}
.kubernetes-view .filter-header {
margin-bottom: 1em;
}
/* This is all for the diagram, not the 'Overview' page */
.kubernetes-overview {
width: 100%;
height: 100%;
display: table;
table-layout: fixed;
}
.kubernetes-overview-row {
display: table-row;
}
.kubernetes-overview-cell {
display: table-cell;
text-align: center;
vertical-align: middle;
padding: 0;
}
.service-wrapper {
display: block;
vertical-align: middle;
}
.kubernetes-node {
margin-left: auto;
margin-right: auto;
cursor: pointer;
text-align: center;
vertical-align: middle;
border: 1px solid #d4d4d4;
background: white;
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
border-radius: 4px;
transition: background 0.5s;
z-index: 1000;
}
.kubernetes-host-container {
margin-top: 5px;
margin-bottom: 5px;
margin-left: auto;
margin-right: auto;
text-align: center;
max-width: 600px;
min-width: 300px;
padding: 0;
border: 1px solid #d4d4d4;
background: white;
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
border-radius: 4px;
}
.kubernetes-pod-node {
display: block;
margin: 0;
padding: 0;
min-height: 48px;
line-height: 48px;
border-radius: 0;
border: 1px solid transparent;
border-top: 1px solid #d4d4d4;
box-shadow: none;
vertical-align: middle;
}
.css-table {
display: table;
width: 100%;
height: 100%;
}
.css-table-row {
display: table-row;
}
.css-table-row .pod-status-cell {
text-align: left;
padding-left: 5px;
padding-right: 5px;
}
.css-table-row .pod-status-cell i {
margin-left: 3px;
margin-right: 3px;
}
.css-table-row .pod-status-cell .clickable {
width: auto !important;
}
.css-table-cell {
display: table-cell;
vertical-align: middle;
}
.kubernetes-pod-node i {
font-size: 24px;
}
.kubernetes-overview-services {
width: 200px;
}
.kubernetes-service-node {
display: block;
margin-bottom: 10px;
width: 200px;
min-height: 66px;
padding: 0;
line-height: 48px;
}
.kubernetes-service-node .node-body {
display: inline;
padding-left: 10px;
line-height: 64px;
font-size: 20px;
float: left;
}
.kubernetes-service-node .node-header {
display: inline;
float: right;
}
.node-header {
padding-right: 10px;
white-space: nowrap;
line-height: 64px;
overflow: hidden;
text-overflow: ellipsis;
}
.kubernetes-replicationController-node {
border-radius: 64px;
display: block;
width: 64px;
height: 64px;
padding: 7px;
font-weight: bold;
vertical-align: middle;
overflow: hidden;
text-overflow: ellipsis;
}
.kubernetes-overview-cell .app-icon-medium {
width: 48px;
height: 48px;
}
.kubernetes-replicationController-node img {
width: 64px;
}
.kubernetes-node:hover,
.kubernetes-node.hovered {
background: #ddddff;
}
.pod-status-cell {
width: 80px;
line-height: 20px;
}
.pod-label-cell {
float: right;
text-align: right;
min-height: 48px;
}
.pod-label-cell .ngCellText {
white-space: normal;
}
.pod-log-lines * {
padding-left: 5px;
padding-right: 5px;
font-family: monospace;
margin: 0;
line-height: 14px;
}
.pod-log-lines * .black {
color: #222;
}
.pod-log-lines * .red {
color: #f22;
}
.pod-log-lines * .green {
color: #2f2;
}
.pod-log-lines * .yellow {
color: #ff2;
}
.pod-log-lines * .blue {
color: #22f;
}
.pod-log-lines * .purple {
color: #f2f;
}
.pod-log-lines * .cyan {
color: #2dd;
}
.pod-log-lines * .white {
color: #ddd;
}
.top-bottom-middle {
line-height: 34px;
}
.terminal-window {
position: fixed;
bottom: 0;
background: white;
border: 1px solid #d4d4d4;
overflow: hidden;
z-index: 1040;
}
.terminal-window .resize-dot {
width: 16px;
height: 16px;
border: 1px solid #d4d4d4;
background: white;
position: absolute;
bottom: 10px;
right: 10px;
cursor: nwse-resize;
border-radius: 8px;
z-index: 10000;
}
.terminal-window.minimized .resize-dot,
.terminal-window.maximized .resize-dot {
display: none;
}
.terminal-window.minimized .terminal-title,
.terminal-window.maximized .terminal-title {
cursor: inherit;
}
.terminal-window .terminal-body {
overflow: auto;
}
.terminal-window .terminal-body .terminal-wrapper > .terminal * {
font-family: 'DroidSansMonoRegular';
}
.terminal-window .terminal-title {
cursor: move;
border-bottom: 1px solid #d4d4d4;
}
.terminal-window .terminal-title > h5 {
display: inline-block;
margin-left: 5px;
}
.terminal-window .terminal-title > i {
font-size: 16px;
margin-right: 5px;
margin-top: 7px;
}
kubernetes-container-terminal .terminal-wrapper {
display: block !important;
}
kubernetes-container-terminal .terminal-actions {
position: absolute !important;
}
.pod-log-window .scroll-indicator {
position: absolute;
bottom: 0;
line-height: 32px;
left: 20px;
right: 20px;
background-color: #ffffff;
border-top: 1px solid #d4d4d4;
border-left: 1px solid #d4d4d4;
border-right: 1px solid #d4d4d4;
border-radius: 4px 4px 0 0;
cursor: pointer;
z-index: 10000;
opacity: 0.7;
}
.pod-log-window .terminal-body {
overflow-y: auto;
overflow-x: hidden;
}
.layout-pf.layout-pf-fixed .container-pf-nav-pf-vertical {
margin-left: 170px;
}

File diff suppressed because one or more lines are too long

View File

@ -23,7 +23,9 @@ a:hover,a:active{color:#333;}
a.sj_btn_grey{ display:inline-block; padding:0px 15px; height:30px; line-height:30px; -webkit-border-radius:3px;-moz-border-radius:3px;-o-border-radius:3px;border-radius:3px; background-image:-webkit-linear-gradient(top, #fdfdfd,#e8e8e8);background-image:linear-gradient(top,#fdfdfd,#e8e8e8); border:1px solid #cecece; color:#505050;}
a:hover.sj_btn_grey{ background-image:-webkit-linear-gradient(top, #eeeeee,#d3d3d3);background-image:linear-gradient(top,#eeeeee,#d3d3d3);}
.sj_btn_grey{ display:inline-block; padding:0px 15px; height:30px; line-height:30px; -webkit-border-radius:3px;-moz-border-radius:3px;-o-border-radius:3px;border-radius:3px; background-image:-webkit-linear-gradient(top, #fdfdfd,#e8e8e8);background-image:linear-gradient(top,#fdfdfd,#e8e8e8); border:1px solid #cecece; color:#505050;}
.sj_btn_grey:hover{ background-image:-webkit-linear-gradient(top, #eeeeee,#d3d3d3);background-image:linear-gradient(top,#eeeeee,#d3d3d3);}
.sj_btn_grey:hover{ background-image:-webkit-linear-gradient(top, #eeeeee,#d3d3d3);background-image:linear-gradient(top,#eeeeee,#d3d3d3);border:1px solid #cecece; color:#505050;}
.sj_btn_blue{ display:inline-block; padding:0px 15px; height:30px; line-height:30px; -webkit-border-radius:3px;-moz-border-radius:3px;-o-border-radius:3px;border-radius:3px; background-image:-webkit-linear-gradient(top, #2a84e9,#0d62c1);background-image:linear-gradient(top,#2a84e9,#0d62c1);border:1px solid #1362b4; color:#fff;}
.sj_btn_blue:hover{ background-image:-webkit-linear-gradient(top, #4894ea,#3a83d6);background-image:linear-gradient(top,#4894ea,#3a83d6);}
/* sj_header */
.sj_header{ height:70px; width:100%; background:#1d1d1d;}
.sj_header a.sj_logo{ display:block; height:41px; width:146px; padding:14px 20px 0 12px;}
@ -85,4 +87,20 @@ a:hover.sj_btn_grey{ background-image:-webkit-linear-gradient(top, #eeeeee,#d3d3
.sj_nav_taps li a{ display: inline-block; font-size: 12px; border:1px solid #cecece;background-image:-webkit-linear-gradient(top, #fcfcfc,#e9e9e9);background-image:linear-gradient(top, #fcfcfc,#e9e9e9); padding:5px 15px; color:#505050; margin-right:5px;}
.sj_nav_taps li a:hover,.sj_nav_taps li a.active{ background:#cdcdcd; border:1px solid #9e9e9e;}
.sj_nav_taps > li.active > a, .sj_nav_taps > li.active > a:hover, .sj_nav_taps > li.active > a:focus { background:#cdcdcd; border:1px solid #9e9e9e; color:#505050;}
.sj_fluid{ padding:0;}
.sj_fluid{ padding:0;}
.treecontrol{ font-size: 14px; height: 32px; line-height: 32px; padding-left: 15px;}
treecontrol.tree-classic li.tree-expanded i.tree-branch-head { padding: 1px 15px; padding-right:25px;background: url(../new/images/sj_tree_files.png) 0 -23px no-repeat;}
treecontrol.tree-classic li.tree-collapsed i.tree-branch-head{ padding: 1px 15px;padding-right:25px;background: url(../new/images/sj_tree_files.png) 0 0px no-repeat;}
treecontrol.tree-classic li.tree-leaf i.tree-leaf-head { padding: 1px 15px; padding-right:10px;background: url(../new/images/sj_tree_files.png) 0 -48px no-repeat;}
treecontrol.tree-classic li .tree-selected{background-color: #e5f0fb; color: #333; }
treecontrol li{ line-height: 30px; padding-left: 25px;}
treecontrol li:hover{}
.sj_modal_body{ height: 210px; overflow: auto;padding-left: 0; padding-right: 0;}
.modal{ width: 500px;}
.sj_modal-header{ height:42px; line-height: 42px; border-bottom: 1px solid #ddd; }
.sj_modal-header h4{ margin-top: 5px; font-weight: bold;}
.sj_modal_select{ width: 350px; height: 30px; line-height: 30px; border: 1px solid #ccc; }
.sj_contro_label{ height: 30px; line-height: 30px;}
.sj_contro_label{ padding-right:10px; }
.sj_fluid{ padding-right: 0px; padding-left: 0px;}

View File

@ -56,16 +56,16 @@
</div>
</div>
</div>
<div modal="migrationClick.dialog.show ">
<div modal="migrationClick.dialog.show " >
<form name="selectFolder " class=" " ng-submit="migrationClick.onOk() ">
<div class="modal-header ">
<h4>数据迁移</h4></div>
<div class="modal-body">
<div class="row">
<label class="col-sm-3 control-label" for="selectedItem ">
<div class="modal-header sj_modal-header" >
<h4 >数据迁移</h4></div>
<div class="modal-body sj_modal_body">
<div class="row sj_model_row">
<label class="col-sm-3 control-label sj_contro_label" for="selectedItem ">
请选择迁移集群
</label>
<select ng-model="migrationClick.selectedItem " class="col-sm-3" title="name of the new namespace " id="selectedItem " ng-options="x.$oracleName for x in filterReplicationControllers " />
<select ng-model="migrationClick.selectedItem " class="col-sm-3 sj_modal_select" title="name of the new namespace " id="selectedItem " ng-options="x.$oracleName for x in filterReplicationControllers " />
</div>
<div>
<treecontrol class="tree-classic" tree-model="dataForTheTree" options="treeOptions" on-selection="showSelected(node)" selected-node="selectNode">
@ -74,8 +74,8 @@
</div>
</div>
<div class="modal-footer ">
<input class="btn btn-primary " type="submit" ng-disabled="!selectNode || selectNode.children.length <= 0" value="确定">
<button class="btn btn-warning cancel " type="button" ng-click="migrationClick.close()">取消</button>
<input class="btn btn-primary sj_btn_blue" type="submit" ng-disabled="!selectNode || selectNode.children.length <= 0" value="确定">
<button class="btn btn-warning cancel sj_btn_grey" type="button" ng-click="migrationClick.close()">取消</button>
</div>
</form>
</div>