diff --git a/SAS/TMSS/frontend/tmss_webapp/src/App.css b/SAS/TMSS/frontend/tmss_webapp/src/App.css
index 60f55563b147421fdec0a0ecf3ed242b9d6b0726..350c495cae596a1f2190beaab35d797f618d7f96 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/App.css
+++ b/SAS/TMSS/frontend/tmss_webapp/src/App.css
@@ -254,7 +254,7 @@ div[data-schemapath='root.$schema'] {
.disableContainer {
pointer-events: none;
opacity: 0.7;
-}
+}
.workflow-header a span {
display: block !important;
@@ -279,4 +279,13 @@ body > iframe {
padding-left: 0px;
width: 45%;
margin-left: 10px;
+}
+
+.resource-input-grid {
+ display: flex;
+ flex-wrap: wrap;
+}
+
+.workflow-wrap {
+ flex-wrap: wrap;
}
\ No newline at end of file
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/layout/sass/_timeline.scss b/SAS/TMSS/frontend/tmss_webapp/src/layout/sass/_timeline.scss
index a889c42c8e61f649e5033ee54d686979e36e5275..f23aca3da8134dff1d130b6c48d123c1cb847505 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/layout/sass/_timeline.scss
+++ b/SAS/TMSS/frontend/tmss_webapp/src/layout/sass/_timeline.scss
@@ -109,6 +109,23 @@
}
.multiselect-container {
+ display: flex;
+ flex-direction: column;
+ margin-bottom: 0.5rem;
+ margin-right: 0.25rem;
+
+ &.relative-position {
+ position: relative;
+ bottom: 10px;
+ margin-bottom: 0;
+ }
+
+ .small-label {
+ font-size: 13px;
+ font-weight: 550;
+ color: #004B93;
+ }
+
.disabled {
opacity: 50%;
cursor: not-allowed;
@@ -117,6 +134,10 @@
.p-multiselect-label-container {
height: inherit;
}
+
+ .p-multiselect {
+ width: 6rem;
+ }
}
.radiobutton-container {
@@ -197,6 +218,10 @@
}
.timeline-zoom-and-move {
+ .p-dropdown {
+ width: 7rem !important;
+ }
+
.zoom-selector-container {
margin-right: 1rem;
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/WeekView.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/WeekView.js
index 25ab8edeb7c6d06c89c9f60f793df366c316c2ac..9bc0ea50858ff893372e0a50f34c00f5c0cfd893 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/WeekView.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/WeekView.js
@@ -242,14 +242,6 @@ export default function WeekView() {
}
}, [summaryItem]);
-
- /** For Mac, you can still scroll via the touch bar even though it is disabled in the settings.
- * This constant function should disable it anyway.
- * should be (easier to) fixed with: https://github.com/namespace-ee/react-calendar-timeline/issues/357*/
- const handleTimeChange = (visibleTimeStart, visibleTimeEnd, updateScrollCanvas) => {
- updateScrollCanvas(moment(startTime).valueOf(), moment(endTime).valueOf());
- }
-
return <div>
<div className={(isLoading ? "" : "hide-element")}>
<ProgressBar className={isLoading ? "" : "hide-element"} mode="indeterminate"
@@ -260,7 +252,7 @@ export default function WeekView() {
model={getPageHeaderOptionsMenuItems(permissions)}/>}
<PageHeader location={location} title={'Scheduling Units - Week View'}
actions={getSchedulerActions(schedulerSettings, setShowSchedulerSettingsDialog)
- .concat(getHeaderActions(isLoading, setRefetchToggle, refetchToggle, actionsMenuRef))}/>
+ .concat(getHeaderActions(isLoading, setRefetchToggle, actionsMenuRef))}/>
<div className="p-grid">
<div className={panelClassNames.leftPanelClassName}>
<Legendbar className={showLegendbar ? undefined : "hide-element"}/>
@@ -275,8 +267,10 @@ export default function WeekView() {
<div className="timeline-tools">
<Filters timelineStore={timelineStore}
visibleStartTime={visibleTime.start}
- data={data}
setItems={setItems}
+ data={data}
+ setRefetchToggle={setRefetchToggle}
+
/>
<DateTimeNavigator timelineStore={timelineStore}
startTime={startTime}
@@ -310,7 +304,6 @@ export default function WeekView() {
canMove={false}
canResize={false}
stackItems={true}
- onTimeChange={handleTimeChange}
//render settings
groupRenderer={({group}) => groupRenderer({group})}
itemRenderer={({
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/components/toolbar/Filters.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/components/toolbar/Filters.js
index 3ad00be802cec1f38b70fe86ca98fb4611088074..cf3de2d8135f0cc271d5f2f84893ebe4bb6d3481 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/components/toolbar/Filters.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/components/toolbar/Filters.js
@@ -12,51 +12,33 @@ import moment from "moment";
import {Spinner} from "reactstrap";
import {fetchAllOptionsForMultiSelects} from "../../data/filters.data";
-function getToggle(labelName, tooltipText, checkedValue, onChangeCallback, shouldDisable = false) { //TODO: make functional components and extract to separate class
+function Toggle(props) { //TODO: extract to separate class
+ const {
+ labelName,
+ tooltipText,
+ checkedValue,
+ onChangeCallback,
+ } = props
+
if (checkedValue === undefined || onChangeCallback === undefined) {
return null
}
- return <div className={`toggle-container ${shouldDisable ? "disabled" : ""}`}>
+ return <div className={`toggle-container ${checkedValue ? "" : "disabled"}`}>
<label>{labelName}</label>
- <InputSwitch disabled={shouldDisable}
- checked={checkedValue}
+ <InputSwitch checked={checkedValue}
tooltip={tooltipText}
onChange={(e) => onChangeCallback(e.value)
}/>
</div>
}
-function getMultiSelectForToggle(dependentToggle, currentValue, allOptions, onChangeCallback, tooltip, placeHolder,
- optionLabel = "name", optionValue = "name") {
- if (currentValue === undefined || onChangeCallback === undefined || allOptions === undefined) { //TODO: make functional components and extract to separate class
- return null;
- }
-
- return <div className="multiselect-container">
- <MultiSelect
- className={!dependentToggle ? "disabled" : ""}
- disabled={!dependentToggle}
- optionLabel={optionLabel} optionValue={optionValue}
- tooltip={tooltip}
- tooltipOptions={{position: 'left'}}
- value={currentValue}
- options={allOptions}
- maxSelectedLabels="1"
- filter
- filterBy={optionValue}
- placeholder={dependentToggle ? placeHolder : "Not active"}
- onChange={(e) => onChangeCallback(e.value)}
- />
- </div>
-}
-
-function filterReservations(reservations, visibleStartTime, reservationFilter, projectToggle, projectFilter) {
+function filterReservations(reservations, visibleStartTime, reservationFilter, projectFilter) {
let reservationItems = reservations.flatMap(reservation => splitObjectIfSpanIsMultipleDays(reservation, false))
.map((reservation, index) => getReservationItem(reservation, index, moment(visibleStartTime).format(UIConstants.CALENDAR_DEFAULTDATE_FORMAT)))
.filter(reservationItem => reservationFilter.includes(reservationItem.reason))
- if (projectToggle) {
+ if (projectFilter.length) {
reservationItems = reservationItems.filter(reservationItem => reservationItem.project === null || projectFilter.includes(reservationItem.project))
} else { //only show items that don't have a project
reservationItems = reservationItems.filter(reservationItem => reservationItem.project === null)
@@ -65,13 +47,12 @@ function filterReservations(reservations, visibleStartTime, reservationFilter, p
}
-function filterSchedulingUnits(schedulingUnits, visibleStartTime, onSkyToggle, schedulingUnitFilter, projectToggle, projectFilter) {
+function filterSchedulingUnits(schedulingUnits, visibleStartTime, onSkyToggle, schedulingUnitFilter, projectFilter) {
let schedulingUnitItems = schedulingUnits.flatMap(su => splitObjectIfSpanIsMultipleDays(su, onSkyToggle))
.map(su => getTimelineItem(su, moment(visibleStartTime), onSkyToggle))
.filter(suItem => schedulingUnitFilter.includes(suItem.status))
-
- if (projectToggle) {
+ if (projectFilter?.length) {
schedulingUnitItems = schedulingUnitItems.filter(suItem => suItem.project === null || projectFilter.includes(suItem.project))
} else {//only show items that don't have a project
schedulingUnitItems = schedulingUnitItems.filter(suItem => suItem.project === null)
@@ -84,6 +65,7 @@ export default function Filters(props) {
visibleStartTime,
setItems,
data,
+ setRefetchToggle,
timelineStore,
} = props
@@ -91,19 +73,19 @@ export default function Filters(props) {
isLoading: false,
reservationReasons: [],
schedulingUnitStatuses: [],
- projectNames: []
+ projectStatuses: [],
+ projectNamesWithState: []
})
const [onSkyToggle, setOnSkyToggle] = useState(timelineStore.onSkyToggle ?? true)
const [reservationsToggle, setReservationsToggle] = useState(timelineStore.reservationsToggle ?? false)
- const [reservationFilter, setReservationFilter] = useState(timelineStore.reservationFilter ?? multiSelectAllOptions.reservationReasons)
+ const [reservationFilter, setReservationFilter] = useState(timelineStore.reservationFilter)
- const [schedulingUnitsToggle, setSchedulingUnitsToggle] = useState(timelineStore.schedulingUnitsToggle ?? true)
- const [schedulingUnitFilter, setSchedulingUnitFilter] = useState(timelineStore.schedulingUnitFilter ?? multiSelectAllOptions.schedulingUnitStatuses)
+ const [schedulingUnitFilter, setSchedulingUnitFilter] = useState(timelineStore.schedulingUnitFilter)
- const [projectToggle, setProjectToggle] = useState(timelineStore.projectToggle ?? true)
- const [projectFilter, setProjectFilter] = useState(timelineStore.projectFilter ?? multiSelectAllOptions.projectNames)
+ const [projectFilter, setProjectFilter] = useState(timelineStore.projectFilter)
+ const [projectStatusFilter, setProjectStatusFilter] = useState(timelineStore.projectStatusFilter ?? ["active"])
useEffect(() => { //initializer
@@ -111,71 +93,152 @@ export default function Filters(props) {
.catch(e => console.error("Couldn't retrieve the multi select options for at least one multi select", e))
}, [])
- useEffect(() => {
+ useEffect(() => { //set default filter to all options if none in store
+ if (!schedulingUnitFilter?.length) {
+ setSchedulingUnitFilter(multiSelectAllOptions.schedulingUnitStatuses.map(status => status.name))
+ }
+
+ if (!reservationFilter?.length) {
+ setReservationFilter(multiSelectAllOptions.reservationReasons.map(reason => reason.name))
+ }
+
+ const filteredProjectsOnState = multiSelectAllOptions.projectNamesWithState.filter(project => projectStatusFilter.includes(project.project_state_value))
+ setProjectFilter(filteredProjectsOnState.map(project => project.name))
+ }, [multiSelectAllOptions])
+
+ useEffect(() => { //the status filter is only for the project filter
+ updateStore(UIConstants.STORE_KEY_TIMELINE, timelineStore, {
+ ["projectStatusFilter"]: projectStatusFilter,
+ })
+ const filteredProjectsOnState = multiSelectAllOptions.projectNamesWithState.filter(project => projectStatusFilter.includes(project.project_state_value))
+ setProjectFilter(filteredProjectsOnState.map(project => project.name))
+ }, [projectStatusFilter])
+
+ useEffect(() => { //since reservations loading is slow and often off, only fetch them om toggle
updateStore(UIConstants.STORE_KEY_TIMELINE, timelineStore, {
["reservationsToggle"]: reservationsToggle,
+ })
+
+ setRefetchToggle(prevState => !prevState)
+ }, [reservationsToggle])
+
+ useEffect(() => {
+ updateStore(UIConstants.STORE_KEY_TIMELINE, timelineStore, {
["reservationFilter"]: reservationFilter,
- ["projectToggle"]: projectToggle,
["projectFilter"]: projectFilter,
["onSkyToggle"]: onSkyToggle,
-
})
let reservationsItems = []
if (reservationsToggle) {
- reservationsItems = filterReservations(data.reservations, visibleStartTime, reservationFilter, projectToggle, projectFilter);
+ reservationsItems = filterReservations(data.reservations, visibleStartTime, reservationFilter, projectFilter);
}
setItems(prevState => ({
...prevState,
reservationItems: reservationsItems
}))
- }, [data, reservationsToggle, reservationFilter, projectToggle, projectFilter])
+ }, [data, reservationFilter, projectFilter])
useEffect(() => {
updateStore(UIConstants.STORE_KEY_TIMELINE, timelineStore, {
- ["schedulingUnitsToggle"]: schedulingUnitsToggle,
["schedulingUnitFilter"]: schedulingUnitFilter,
- ["projectToggle"]: projectToggle,
["projectFilter"]: projectFilter,
["onSkyToggle"]: onSkyToggle,
})
- let schedulingUnitItems = []
- if (schedulingUnitsToggle) {
- schedulingUnitItems = filterSchedulingUnits(data.schedulingUnits, visibleStartTime, onSkyToggle, schedulingUnitFilter, projectToggle, projectFilter);
- }
+ const schedulingUnitItems = filterSchedulingUnits(data.schedulingUnits, visibleStartTime, onSkyToggle, schedulingUnitFilter, projectFilter);
setItems(prevState => ({
...prevState,
schedulingUnitItems: schedulingUnitItems
}))
- }, [data, schedulingUnitsToggle, schedulingUnitFilter, projectToggle, projectFilter, onSkyToggle])
+ }, [data, schedulingUnitFilter, projectFilter, onSkyToggle])
return <div className="p-grid timeline-view-toolbar">
{multiSelectAllOptions.isLoading ? <Spinner className="m-5" style={{color: "var(--primary-300)"}}/> :
<div className="section">
<div className="header">Filters</div>
<div className="group">
- {getToggle("On Sky", "Show on-sky system durations", onSkyToggle, setOnSkyToggle)}
+ <Toggle labelName="On Sky" tooltipText="Show on-sky system durations"
+ checkedValue={onSkyToggle} onChangeCallback={setOnSkyToggle}/>
</div>
-
<div className="group">
- {getToggle("Status", "Show scheduling units", schedulingUnitsToggle, setSchedulingUnitsToggle)}
- {getMultiSelectForToggle(schedulingUnitsToggle, schedulingUnitFilter || multiSelectAllOptions.schedulingUnitStatuses, multiSelectAllOptions.schedulingUnitStatuses, setSchedulingUnitFilter,
- "Select Scheduling Unit Status(es)", "Status")}
+ <Toggle labelName={"Reservations"} tooltipText={"Show station reservations"}
+ checkedValue={reservationsToggle} onChangeCallback={setReservationsToggle}/>
+ <div className="multiselect-container relative-position">
+ <span className="small-label">Reason:</span>
+ <MultiSelect
+ className={!reservationsToggle ? "disabled" : ""}
+ disabled={!reservationsToggle}
+ optionLabel="name"
+ optionValue="name"
+ tooltip="Select Reservation Reason(s)"
+ tooltipOptions={{position: 'left'}}
+ value={reservationFilter}
+ options={multiSelectAllOptions.reservationReasons}
+ maxSelectedLabels="1"
+ filter
+ filterBy="name"
+ placeholder="Reason"
+ onChange={(e) => setReservationFilter(e.value)}
+ />
+ </div>
</div>
-
<div className="group">
- {getToggle("Projects", "Show projects", projectToggle, setProjectToggle)}
- {getMultiSelectForToggle(projectToggle, projectFilter || multiSelectAllOptions.projectNames, multiSelectAllOptions.projectNames, setProjectFilter,
- "Select Project Name(s)", "Project")}
+ <label>Scheduling Units</label>
+ <div className="multiselect-container relative-position">
+ <span className="small-label">Status:</span>
+ <MultiSelect
+ optionLabel="name"
+ optionValue="name"
+ tooltip="Select Scheduling Unit Status(es)"
+ tooltipOptions={{position: 'left'}}
+ value={schedulingUnitFilter}
+ options={multiSelectAllOptions.schedulingUnitStatuses}
+ maxSelectedLabels="1"
+ filter
+ filterBy="name"
+ placeholder="Status"
+ onChange={(e) => setSchedulingUnitFilter(e.value)}
+ />
+ </div>
</div>
<div className="group">
- {getToggle("Reservations", "Show station reservations", reservationsToggle, setReservationsToggle)}
- {getMultiSelectForToggle(reservationsToggle, reservationFilter || multiSelectAllOptions.reservationReasons, multiSelectAllOptions.reservationReasons, setReservationFilter,
- "Select Reservation Reason(s)", "Reason")}
+ <label>Projects</label>
+ <div className="multiselect-container relative-position">
+ <span className="small-label">Status:</span>
+ <MultiSelect
+ optionLabel="value"
+ optionValue="value"
+ tooltip="Select Project Status(es)"
+ tooltipOptions={{position: 'left'}}
+ value={projectStatusFilter}
+ options={multiSelectAllOptions.projectStatuses}
+ maxSelectedLabels="1"
+ filter
+ filterBy="value"
+ placeholder="Status"
+ onChange={(e) => setProjectStatusFilter(e.value)}
+ />
+ </div>
+ <div className="multiselect-container relative-position">
+ <span className="small-label">Value:</span>
+ <MultiSelect
+ optionLabel="name"
+ optionValue="name"
+ tooltip="Select Project Name(s)"
+ tooltipOptions={{position: 'left'}}
+ value={projectFilter}
+ options={multiSelectAllOptions.projectNamesWithState}
+ maxSelectedLabels="1"
+ filter
+ filterBy="name"
+ placeholder="Project"
+ onChange={(e) => setProjectFilter(e.value)}
+ />
+ </div>
</div>
</div>
}
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/data/filters.data.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/data/filters.data.js
index a4fd79bb19672672a59b16997c17f38fddff02b6..8599e48625edfd0ec4f802202dbfe76e33e03eba 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/data/filters.data.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/data/filters.data.js
@@ -32,12 +32,14 @@ export async function fetchAllOptionsForMultiSelects(setMultiSelectAllOptions) {
const suStatuses = await fetchSchedulingUnitStatuses()
const reasons = await fetchReservationTemplatesGetReasons();
- const projectNames = await ProjectService.getProjectList(false, "name")
+ const projectNamesWithState = await ProjectService.getProjectList(false, "name,project_state_value")
+ const projectStatuses = await ProjectService.getProjectStates()
setMultiSelectAllOptions({
isLoading: false,
reservationReasons: reasons,
schedulingUnitStatuses: suStatuses,
- projectNames: projectNames
+ projectNamesWithState: projectNamesWithState,
+ projectStatuses: projectStatuses
})
}
\ No newline at end of file
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/data/week.view.data.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/data/week.view.data.js
index 831a11ed59b677017b7ca5c0283ac81e07c7d349..8d78bc2c56a5f6d0e7c8dcea3d359bcef60e25a5 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/data/week.view.data.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/data/week.view.data.js
@@ -7,13 +7,14 @@ import moment from "moment/moment";
import TaskService from "../../../services/task.service";
import {getSunTimingItems} from "../helpers/week.view.helper";
import TimelineCommonUtils from "../common.utils";
+import {getStore} from "../../../services/store.helper";
export async function fetchTimelineData(startTime, endTime, setData) {
const from = startTime.format(UIConstants.CALENDAR_DATETIME_FORMAT);
const until = endTime.format(UIConstants.CALENDAR_DATETIME_FORMAT);
- let schedulingUnits = await ScheduleService.getTimelineSlimBlueprints(from, until);
- let reservations = await ReservationService.getTimelineReservations(from, until);
+ const schedulingUnits = await ScheduleService.getTimelineSlimBlueprints(from, until);
+ const reservations = await fetchReservations(from, until)
setData({
schedulingUnits: schedulingUnits,
@@ -21,6 +22,15 @@ export async function fetchTimelineData(startTime, endTime, setData) {
})
}
+export async function fetchReservations(formattedStartTime, formattedEndTime) {
+ let reservations = []
+ const shouldFetchReservations = getStore(UIConstants.STORE_KEY_TIMELINE).reservationsToggle;
+ if (shouldFetchReservations) {
+ reservations = await ReservationService.getTimelineReservations(formattedStartTime, formattedEndTime);
+ }
+ return reservations
+}
+
export async function fetchUserPermissions(setPermissions) {
const permission = await AuthUtil.getUserRolePermission();
setPermissions({
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/helpers/toolbar/zoomandmove.helper.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/helpers/toolbar/zoomandmove.helper.js
index 42a66b7de9949e9462a5178c05c66073f66f943e..978968765a498866704e14a41a3cebed352d3edc 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/helpers/toolbar/zoomandmove.helper.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/helpers/toolbar/zoomandmove.helper.js
@@ -108,7 +108,8 @@ function getZoomTimesHoursMinutes(selectedZoomLevel, selectedTime) {
* @return {{start: moment, end: moment}}
*/
export function getZoomTimes(selectedZoomLevel, selectedTime, startDate) {
- let newSelectedTime = moment(startDate).format(UIConstants.CALENDAR_DATETIME_FORMAT)
+ const currentTime = moment().utc().format(UIConstants.CALENDAR_TIME_FORMAT).split(":")
+ let newSelectedTime = moment(moment(startDate).set({hour: currentTime[0], minutes: currentTime[1]})).format(UIConstants.CALENDAR_DATETIME_FORMAT)
if (selectedTime !== undefined) {
const selectedMoment = moment(moment(startDate).format(UIConstants.CALENDAR_DEFAULTDATE_FORMAT) + " " + selectedTime, UIConstants.CALENDAR_DATETIME_FORMAT);
newSelectedTime = selectedMoment.isValid() ? selectedMoment : newSelectedTime
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/helpers/week.view.helper.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/helpers/week.view.helper.js
index 0577d2032891e44643638f36f42998bbfe403181..07fa8770e7b0e9fa096b90de632197baa6fbd1c8 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/helpers/week.view.helper.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Timeline/helpers/week.view.helper.js
@@ -84,13 +84,13 @@ const actionTagObject = (title, content, className) => (
actionObject(title, undefined, undefined, className, undefined, content, "tag", "click")
)
-export function getHeaderActions(isLoading, setRefetchToggle, refetchToggle, actionsMenuRef) {
+export function getHeaderActions(isLoading, setRefetchToggle, actionsMenuRef) {
return [
actionButtonObject(
isLoading ? "System is already reloading the timeline data" : "Reload the timeline data",
"fa-" + (isLoading ? "hourglass fa-spin" : "sync-alt"),
`subsystem subsystem--${isLoading ? "on" : "standard"}`,
- {callback: () => setRefetchToggle(!refetchToggle)}
+ {callback: () => setRefetchToggle(prevState => !prevState)}
),
actionButtonObject(
"Options",
@@ -103,7 +103,6 @@ export function getHeaderActions(isLoading, setRefetchToggle, refetchToggle, act
export function getSchedulerActions(schedulerSettings, setShowSchedulerSettingsDialog) {
- console.log("scheduler settings", schedulerSettings)
return [
actionTagObject(
schedulerSettings.isDynamicSchedulerOn ? "Dynamic Scheduling is On" : "Dynamic Scheduling is Off",
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/Scheduled.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/Scheduled.js
index 381bd23916015aba982895db09b41b5554dc167d..6200062f31c1cadf30cfb922393fbb3f44838da3 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/Scheduled.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/Scheduled.js
@@ -23,7 +23,7 @@ class Scheduled extends Component {
<>
<div>
<div className="p-fluid">
- <div className="p-field p-grid">
+ <div className="p-field p-grid workflow-wrap">
<label htmlFor="suStatus" className="col-lg-2 col-md-2 col-sm-12">Start Time</label>
<div className="col-lg-3 col-md-3 col-sm-12">
<span>{this.props.schedulingUnit.start_time && moment(this.props.schedulingUnit.start_time).format("YYYY-MMM-DD HH:mm:SS")}</span>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/decide.acceptance.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/decide.acceptance.js
index 9d4ff7796d0d48b57e869b02e1b7cd3559efc359..f935d8db4fc764eaf3a96f67040573484722918d 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/decide.acceptance.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/decide.acceptance.js
@@ -117,8 +117,8 @@ class DecideAcceptance extends Component {
render() {
return (
<>
- <div className={`p-fluid-grid`}>
- <div className="p-field p-grid" style={{ paddingLeft: '-10px' }}>
+ <div className={`p-fluid-grid workflow-wrap`}>
+ <div className="p-field p-grid workflow-wrap" style={{ paddingLeft: '-10px' }}>
<label htmlFor="assignTo" className="col-lg-2 col-md-2 col-sm-12">Assign To</label>
<div className="col-lg-3 col-md-3 col-sm-12" data-testid="assignTo" >
{/* Display the assigned owner of the task */}
@@ -194,7 +194,7 @@ class DecideAcceptance extends Component {
</div>
}
</div>
- {!this.props.readOnly && <div className="p-grid" style={{ marginTop: '20px' }}>
+ {!this.props.readOnly && <div className="p-grid workflow-wrap" style={{ marginTop: '20px' }}>
<div className="btn-bar">
<Button disabled={this.state.content && this.state.processPermission && this.state.currentWorkflowTask.editPermissions && this.state.currentWorkflowTask.owner_username === this.user.name? false: true }
label="Next" className="p-button-primary" icon="pi pi-check" onClick={ this.Next } />
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/index.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/index.js
index 079c65f3d84d0359f444debe4354d9f4e850a66d..1149e751130edd2b12be843e52f58233ffeb7949 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/index.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/index.js
@@ -393,7 +393,7 @@ const WorkflowView = (props) => {
{!loader && schedulingUnit &&
<>
<div className="p-fluid">
- {currentView && <div className="p-field p-grid">
+ {currentView && <div className="p-field p-grid workflow-wrap">
<label htmlFor="suName" className="col-lg-2 col-md-2 col-sm-12">Scheduling Unit</label>
<div className="col-lg-3 col-md-3 col-sm-12">
<Link to={{ pathname: `/schedulingunit/view/blueprint/${schedulingUnit.id}` }}>{schedulingUnit.name}</Link>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/ingesting.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/ingesting.js
index fc6d4c9e9684045803ee51f15c60ad7944a5c109..8c5b55401067be5c3816319c02fb19a9711718f0 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/ingesting.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/ingesting.js
@@ -17,7 +17,7 @@ class Ingesting extends Component {
<>
<div>
<div className="p-fluid">
- <div className="p-field p-grid">
+ <div className="p-field p-grid workflow-wrap">
<label htmlFor="ingestTaskStatus" className="col-lg-2 col-md-2 col-sm-12">Ingest Task Status</label>
<div className="col-lg-3 col-md-3 col-sm-12 text-capitalize">
<span>{this.props.task.status}</span>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/pi.verification.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/pi.verification.js
index 0f1ef0bd97fd9e62720a8cc162b65baf60a34c44..c66f88a9c10fed5061f9126fb88ca4abb9479964 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/pi.verification.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/pi.verification.js
@@ -121,8 +121,8 @@ class PIverification extends Component {
return (
<>
<div>
- <div className={`p-fluid-grid`}>
- <div className="p-field p-grid" style={{ paddingLeft: '-10px' }}>
+ <div className={`p-fluid-grid workflow-wrap`}>
+ <div className="p-field p-grid workflow-wrap" style={{ paddingLeft: '-10px' }}>
<label htmlFor="assignTo" className="col-lg-2 col-md-2 col-sm-12">Assign To</label>
<div className="col-lg-3 col-md-3 col-sm-12" data-testid="assignTo" >
{/* Display the assigned owner of the task */}
@@ -165,7 +165,7 @@ class PIverification extends Component {
/>}
<div className="operator-report" style={{ padding: '5px' }} dangerouslySetInnerHTML={{ __html: this.state.content }}></div>
</div>
- <div className="p-grid" style={{ padding: '10px' }}>
+ <div className="p-grid workflow-wrap" style={{ padding: '10px' }}>
<label htmlFor="piReport" >PI Report {!this.props.readOnly && <span style={{color:'red'}}>*</span>}</label>
<div className="col-lg-12 col-md-12 col-sm-12"></div>
<SunEditor setDefaultStyle="min-height: 150px; height: auto;" enableToolbar={!this.props.readOnly}
@@ -179,7 +179,7 @@ class PIverification extends Component {
]
}} />
</div>
- <div className="p-field p-grid" style={{marginTop: '1em'}}>
+ <div className="p-field p-grid workflow-wrap" style={{marginTop: '1em'}}>
<label htmlFor="systemissues" >System Events</label>
</div>
<div>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/processing.done.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/processing.done.js
index 453977d0135b8f3688f8797e118c33ead676c627..c855bfa6914678da1a9be3b8396be3fa682652c7 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/processing.done.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/processing.done.js
@@ -21,7 +21,7 @@ class ProcessingDone extends Component {
return(
<>
<div className="p-fluid">
- <div className="p-field p-grid">
+ <div className="p-field p-grid workflow-wrap">
<label htmlFor="startTime" className="col-lg-2 col-md-2 col-sm-12">Start Time</label>
<div className="col-lg-3 col-md-3 col-sm-12">
<span>{this.props.schedulingUnit.start_time && moment(this.props.schedulingUnit.start_time).format("YYYY-MMM-DD HH:mm:SS")}</span>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/qa.reporting.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/qa.reporting.js
index 099ffc13c05251d024f241e2544dab98a85ef8c1..fbaf89d211170c51b1245f9eaee263d22d76b9d7 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/qa.reporting.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/qa.reporting.js
@@ -298,8 +298,8 @@ class QAreporting extends Component{
return (
<>
<div>
- <div className={`p-fluid-grid`}>
- <div className="p-field p-grid" style={{ paddingLeft: '-10px' }}>
+ <div className={`p-fluid-grid workflow-wrap`}>
+ <div className="p-field p-grid workflow-wrap" style={{ paddingLeft: '-10px' }}>
<label htmlFor="assignTo" className="col-lg-2 col-md-2 col-sm-12">Assign To</label>
<div className="col-lg-3 col-md-3 col-sm-12" data-testid="assignTo" >
{/* Display the assigned owner of the task */}
@@ -327,7 +327,7 @@ class QAreporting extends Component{
}
</div>
</div>
- <div className="p-field p-grid" style={{ padding: '12px', position:'relative' }}>
+ <div className="p-field p-grid workflow-wrap " style={{ padding: '12px', position:'relative' }}>
<label htmlFor="comments" >Comments {(!this.state.showEditor && !this.props.readOnly) &&
<>
<span style={{color:'red'}}>*</span>
@@ -354,7 +354,7 @@ class QAreporting extends Component{
{this.props.readOnly &&<div class="comment-editor-content" dangerouslySetInnerHTML={{ __html: this.state.content }}></div>}
</div>
<div style={{ marginLeft: '1em', position:'relative' }}>
- <div className="p-field p-grid">
+ <div className="p-field p-grid workflow-wrap">
<label htmlFor="systemissues" >System Events</label>
<div style={{marginLeft: '1em'}}>
<Button
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/qa.sos.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/qa.sos.js
index 086deb0c0679a7ad51a65f98a9984b0aee44fb75..90791048481835e9b9b1d7f0aed56b0d9170e61d 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/qa.sos.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/qa.sos.js
@@ -102,8 +102,8 @@ class QAreportingSDCO extends Component {
return (
<>
<div>
- <div className={`p-fluid-grid`}>
- <div className="p-field p-grid" style={{ paddingLeft: '-10px' }}>
+ <div className={`p-fluid-grid workflow-wrap`}>
+ <div className="p-field p-grid workflow-wrap" style={{ paddingLeft: '-10px' }}>
<label htmlFor="assignTo" className="col-lg-2 col-md-2 col-sm-12">Assign To</label>
<div className="col-lg-3 col-md-3 col-sm-12" data-testid="assignTo" >
{/* Display the assigned owner of the task */}
@@ -131,7 +131,7 @@ class QAreportingSDCO extends Component {
}
</div>
</div>
- <div className="p-grid" style={{ padding: '10px' }}>
+ <div className="p-grid workflow-wrap" style={{ padding: '10px' }}>
<label htmlFor="operatorReport">Operator Report
{(!this.state.showEditor && !this.props.readOnly) &&
<>
@@ -152,7 +152,7 @@ class QAreportingSDCO extends Component {
/>}
{!this.state.showEditor && <div onClick={() => !this.props.readOnly && this.setState({ showEditor: !this.state.showEditor })} className="operator-report" dangerouslySetInnerHTML={{ __html: this.state.content }}></div>}
</div>
- <div className="p-field p-grid">
+ <div className="p-field p-grid workflow-wrap">
<label htmlFor="systemissues" >System Events</label>
</div>
<div>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/unpin.data.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/unpin.data.js
index f327101a9cb88f688464ac75fe505f42a9f4c771..5031251cae0f23270225135c4e2f750c668e1fda 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/unpin.data.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/unpin.data.js
@@ -75,7 +75,7 @@ export default ({ tasks, schedulingUnit, onCancel, ...props }) => {
}
return (
<div className="p-fluid mt-2">
- <div className="p-field p-grid" style={{ paddingLeft: '-10px' }}>
+ <div className="p-field p-grid workflow-wrap" style={{ paddingLeft: '-10px' }}>
<label htmlFor="assignTo" className="col-lg-2 col-md-2 col-sm-12">Assign To</label>
<div className="col-lg-3 col-md-3 col-sm-12" data-testid="assignTo" >
{/* Display the assigned owner of the task */}
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/workflow.list.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/workflow.list.js
index b7ed62a67bd9be6393ad178b5a18701b8c8220e8..fcf3c19caba5066bf410d99ff85ac9fa39e5ff4d 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/workflow.list.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Workflow/workflow.list.js
@@ -531,7 +531,7 @@ class WorkflowList extends Component{
{this.state.isLoading ? <AppLoader/> :
<>
<div className="p-select " style={{position: 'relative', marginLeft: '27em', marginTop: '-2em'}}>
- <div className="p-field p-grid">
+ <div className="p-field p-grid workflow-wrap">
<div className="col-lg-4 col-md-3 col-sm-12 ms-height">
<span className="p-float-label">
<Dropdown inputId="workflowoverview" id="workflowoverview" optionLabel="name" optionValue="code" filter={true}