External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-18 05:01:19 -03:30
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #894 from jlmitch5/scheduleListUpdate

Browse Source 
update scheduler list styling
This commit is contained in:
jlmitch5 2016-02-10 09:55:44 -05:00
commit 3eeba44137
4 changed files with 82 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
awx/ui/client/legacy-styles/lists.less
View File

@ -292,6 +292,15 @@ table, tbody {
padding-right: 0px!important;
}
.List-staticColumn--toggle {
width: 55px;
padding-right: 0px !important;
}
.List-staticColumn--schedulerTime {
max-width: 164px;
}
.List-staticColumnAdjacent {
padding-left: 10px!important;
}

27
awx/ui/client/src/lists/Schedules.js
View File

@ -18,29 +18,40 @@ export default
hover: true,
fields: {
toggleSchedule: {
label: '',
columnClass: 'List-staticColumn--toggle',
type: "toggle",
ngClick: "toggleSchedule($event, schedule.id)",
awToolTip: "{{ schedule.play_tip }}",
dataTipWatch: "schedule.play_tip",
dataPlacement: "right",
searchable: false,
nosort: true,
},
name: {
key: true,
label: 'Name',
ngClick: "editSchedule(schedule.id)",
columnClass: "col-md-3 col-sm-3 col-xs-3"
columnClass: "col-md-3 col-sm-3 col-xs-6"
},
dtstart: {
label: 'First Run',
filter: "longDate",
searchable: false,
columnClass: "col-md-2 col-sm-3 hidden-xs"
columnClass: "List-staticColumn--schedulerTime hidden-sm hidden-xs"
},
next_run: {
label: 'Next Run',
filter: "longDate",
searchable: false,
columnClass: "col-md-2 col-sm-3 col-xs-3"
columnClass: "List-staticColumn--schedulerTime hidden-xs"
},
dtend: {
label: 'Final Run',
filter: "longDate",
searchable: false,
columnClass: "col-md-2 col-sm-3 hidden-xs"
columnClass: "List-staticColumn--schedulerTime hidden-xs"
}
},
@ -63,14 +74,6 @@ export default
},
fieldActions: {
"play": {
mode: "all",
ngClick: "toggleSchedule($event, schedule.id)",
awToolTip: "{{ schedule.play_tip }}",
dataTipWatch: "schedule.play_tip",
iconClass: "{{ 'fa icon-schedule-enabled-' + schedule.enabled }}",
dataPlacement: "top"
},
edit: {
label: 'Edit',
ngClick: "editSchedule(schedule.id)",

52
awx/ui/client/src/scheduler/scheduleToggle.block.less Normal file
View File

@ -0,0 +1,52 @@
/** @define ScheduleToggle */
.ScheduleToggle {
border-radius: 5px;
border: 1px solid #b7b7b7;
background-color: #b7b7b7;
width: 40px;
margin-top: 2px;
cursor: pointer;
}
.ScheduleToggle-switch {
color: #848992;
background-color: #fff;
margin-left: 4px;
border-left: 1px solid #b7b7b7;
margin-right: 0px;
text-align: center;
text-transform: uppercase;
font-size: 11px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.ScheduleToggle.is-on {
border-color: #1678c4;
background-color: #fff;
}
.ScheduleToggle-switch.is-on {
margin-right: 5px;
margin-left: 0px;
background-color: #1678c4;
color: #fff;
border-left: 0;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.ScheduleToggle-switch:hover {
background-color: #fafafa;
}
.ScheduleToggle.is-on:hover {
border-color: #4498DA;
}
.ScheduleToggle-switch.is-on:hover {
background-color: #4498DA;
}

6
awx/ui/client/src/shared/generator-helpers.js
View File

@ -458,6 +458,12 @@ angular.module('GeneratorHelpers', [systemStatus.name])
html = Badge(field);
} else if (field.type === 'template') {
html = Template(field);
} else if (field.type === 'toggle') {
html += "<td class=\"List-tableCell " + fld + "-column";
html += (field['class']) ? " " + field['class'] : "";
html += " " + field.columnClass;
html += "\"><div class='ScheduleToggle' ng-class='{\"is-on\": " + list.iterator + ".enabled\}' aw-tool-tip='" + field.awToolTip + "' data-placement='" + field.dataPlacement + "' data-tip-watch='" + field.dataTipWatch + "'><div ng-show='" + list.iterator + ".enabled' class='ScheduleToggle-switch is-on' ng-click='" + field.ngClick + "'>ON</div><div ng-show='!" + list.iterator + ".enabled' class='ScheduleToggle-switch' ng-click='" + field.ngClick + "'>OFF</div></div></td>";
console.log(html);
} else {
html += "<td class=\"List-tableCell " + fld + "-column";
html += (field['class']) ? " " + field['class'] : "";