diff --git a/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js b/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js
index 2006237abbd5e305f7ee59482de12b59af44c724..a403aadb92f5dc49c8957ae06bc4ca28f420bcbb 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js
@@ -440,6 +440,56 @@ function CalendarColumnFilter({
)
}
+// This is a custom filter UI that uses a
+// calendar range to set the value
+function DateRangeColumnFilter({
+ column: { setFilter, filterValue, Header },
+}) {
+ // Calculate the min and max
+ // using the preFilteredRows
+ const [value, setValue] = useState('');
+ const [filtered, setFiltered] = useState(false);
+ React.useEffect(() => {
+ if (!filterValue && value) {
+ setValue(null);
+ }
+ }, [filterValue, value]);
+ // Function to call the server side filtering
+ const callServerFilter = (event, isCleared) => {
+ hasFilters = true;
+ if (isCleared) {
+ hasFilters = false;
+ if (filtered) {
+ _.remove(tableOptionsState.filters, function(filter) { return filter.id === Header });
+ filterCallback(tableOptionsState, setLoaderFunction);
+ }
+ } else {
+ filterCallback(tableOptionsState, setLoaderFunction);
+ }
+};
+ return (
+ <div className="table-filter" onClick={e => { e.stopPropagation() }}>
+ <Calendar selectionMode="range" value={filterValue} appendTo={document.body}
+ onChange={(e) => {
+ setValue(e.value);
+ setFilter(e.value);
+ if (value !== 'Invalid date' && doServersideFilter) {
+ setFiltered(true);
+ callServerFilter(e);
+ }
+ }}
+ showIcon></Calendar>
+ {value && <i onClick={(e) => { setFilter(undefined); setValue(''); setFiltered(false);
+ if (doServersideFilter) {
+ setFilter(undefined);
+ setValue('');
+ callServerFilter(e, true);
+ } }} className="tb-cal-reset fa fa-times" />}
+ </div>
+ )
+}
+
+
// This is a custom filter UI that uses a
// calendar to set the value
function DateTimeColumnFilter({
@@ -612,6 +662,31 @@ function dateFilterFn(rows, id, filterValue) {
return filteredRows;
}
+/**
+ * Custom function to filter data Range from date field.
+ * @param {Array} rows
+ * @param {String} id
+ * @param {String} filterValue
+ */
+ function dateRangeFilterFn(rows, id, filterValue) {
+ const filteredRows = _.filter(rows, function (row) {
+ // If cell value is null or empty
+ if (!row.values[id]) {
+ return false;
+ }
+ //Remove microsecond if value passed is UTC string in format "YYYY-MM-DDTHH:mm:ss.sssss"
+ let rowValue = moment.utc(row.values[id].split('.')[0]);
+ if (!rowValue.isValid()) {
+ // For cell data in format 'YYYY-MMM-DD'
+ rowValue = moment.utc(moment(row.values[id], 'YYYY-MM-DD').format("YYYY-MM-DDT00:00:00"));
+ }
+ const start = moment.utc(moment(filterValue[0], 'YYYY-MM-DD').format("YYYY-MM-DDT00:00:00"));
+ const end = moment.utc(moment(filterValue[1], 'YYYY-MM-DD').format("YYYY-MM-DDT23:59:59"));
+ return (start.isSameOrBefore(rowValue) && end.isSameOrAfter(rowValue));
+ });
+ return filteredRows;
+}
+
// This is a custom UI for our 'between' or number range
// filter. It uses slider to filter between min and max values.
function RangeColumnFilter({
@@ -740,6 +815,10 @@ const filterTypes = {
fn: CalendarColumnFilter,
type: dateFilterFn
},
+ 'dateRange': {
+ fn: DateRangeColumnFilter,
+ type: dateRangeFilterFn
+ },
'fromdatetime': {
fn: DateTimeColumnFilter,
type: fromDatetimeFilterFn
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Project/list.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Project/list.js
index 1170a437c32fa37dc1d25f287dc2f7e66f4ebb8a..9dad3b25f6b1ab737d6256ee4e84781703c10480 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Project/list.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Project/list.js
@@ -25,7 +25,7 @@ export class ProjectList extends Component {
name: "Category of Project",
filter: "select"
},
- description: "Description",
+ description: "Description",
archive_location_label: {
name: "LTA Storage Location",
filter: "select"
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Scheduling/SchedulingUnitList.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Scheduling/SchedulingUnitList.js
index 19fba0b8fbc153bb3d4985a94d0242e0f29a030b..1bdc6c4a9ab20e09ffa005fe749dd86a1f0f2c62 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Scheduling/SchedulingUnitList.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Scheduling/SchedulingUnitList.js
@@ -408,7 +408,7 @@ class SchedulingUnitList extends Component{
} else {
let scheduleunits = [];
let expand = suType.toLowerCase() === 'draft' ? this.SU_DRAFT_EXPAND: this.SU_BLUEPRINT_EXPAND;
- let response = await ScheduleService.getSchedulingUnitsExpandWithFilter(suType.toLowerCase(), expand, filterQry, orderBy, limit, offset);
+ let response = await ScheduleService.getSchedulingUnitsExpandWithFilter(suType.toLowerCase(), expand, filterQry, orderBy, limit, offset);
if (response && response.data) {
this.totalPage = response.data.count;
scheduleunits = response.data.results;
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 756ebd33297189b9da129c9143a7b9360c48c214..1d91f6a3aa685e765093bc1e6fb4126720aa7084 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
@@ -16,6 +16,8 @@ import UtilService from '../../services/util.service';
class WorkflowList extends Component{
lsKeySortColumn = 'SortDataWorkflowList';
defaultSortColumn = [];
+ SU_BLUEPRINT_EXPAND = 'draft,draft.scheduling_set,draft.scheduling_set.project,draft.observation_strategy_template';
+
constructor(props) {
super(props);
this.setToggleBySorting();
@@ -33,10 +35,14 @@ class WorkflowList extends Component{
format: UIConstants.CALENDAR_TIME_FORMAT
},
assignedTo: "Assigned To",
- lastTaskName:"Current Workflow Stage",
+ lastTaskName: {
+ name:"Current Workflow Stage",
+ filter: "select"
+ },
+ project: "Project",
updated_at: {
name:"Updated At",
- filter:"date",
+ filter:"dateRange",
format:UIConstants.CALENDAR_DATETIME_FORMAT
},
actionpath: "actionpath"
@@ -74,13 +80,16 @@ class WorkflowList extends Component{
this.setToggleBySorting();
const promises = [ WorkflowService.getWorkflowProcesses(),
WorkflowService.getWorkflowTasks(),
- ScheduleService.getSchedulingUnitBlueprint(),];
+ ScheduleService.getSchedulingUnitsExpandWithFilter('blueprint',this.SU_BLUEPRINT_EXPAND, '', 10, 0),
+ ];
Promise.all(promises).then(async responses => {
this.workflowProcessList = responses[0];
this.workflowTasksList = responses[1];
this.schedulingUnitList = responses[2].data.results;
this.prepareWorkflowProcesslist();
});
+
+
}
toggleBySorting = (sortData) => {
UtilService.localStore({ type: 'set', key: this.lsKeySortColumn, value: sortData });
@@ -106,9 +115,11 @@ class WorkflowList extends Component{
let workflowProcessList = [];
if (this.workflowProcessList) {
for(const wfSU of this.workflowProcessList) {
- const schedulingUnit = _.find(this.schedulingUnitList, {'id': wfSU.su});
+ const schedulingUnit = _.find(this.schedulingUnitList, {'id': wfSU.su});
if(schedulingUnit) {
wfSU['suName'] = schedulingUnit.name;
+ wfSU['project'] = schedulingUnit.draft.scheduling_set.project.name;
+
}
const workflowTasks = _.orderBy(this.workflowTasksList.filter(item => item.process === wfSU.id), ['id'], ['desc']);
const workflowTask = workflowTasks[0];
@@ -120,7 +131,7 @@ class WorkflowList extends Component{
//let currenttask = await WorkflowService.getCurrentTask(wfSU.id);
//wfSU['owner'] = (currenttask && currenttask.fields.owner)? currenttask.fields.owner : '';
wfSU['owner'] = workflowTask.owner? workflowTask.owner : '';
- wfSU['assignedTo'] = workflowTask.owner? workflowTask.owner : '';;
+ wfSU['assignedTo'] = workflowTask.owner? workflowTask.owner : '';
}
//TODO: this code commented and can be used to show only current task owner details when filter enabled
@@ -138,6 +149,11 @@ class WorkflowList extends Component{
}
}
this.setState({workflowProcessList: workflowProcessList, filteredWorkflowProcessList:workflowProcessList,isLoading: false});
+ let ftAssignstatus = UtilService.localStore({ type: 'get', key: 'ftAssignstatus' });
+ let activeWorkflow = UtilService.localStore({ type: 'get', key: 'activeWorkflow' });
+ let showActiveStage = UtilService.localStore({ type: 'get', key: 'showActiveStage' });
+ this.setState({ftAssignstatus: ftAssignstatus, activeWorkflow:activeWorkflow, showActiveStage:showActiveStage });
+ this.filterTableData();
}
/**
@@ -147,12 +163,26 @@ class WorkflowList extends Component{
this.props.history.goBack();
}
+ /**
+ * Get Option-list values for Select Dropdown filter in 'Viewtable'
+ * @param {String} id : Column id
+ * @returns
+ */
+ getFilterOptions(id) {
+ let options = null;
+ if(id && id === 'Current Workflow Stage') {
+ options = UIConstants.CURRENT_WORKFLOW_STAGE;
+ }
+ return options;
+ }
+
/**
* Filter the table data with drop down selected
* @param {String} value - Drop Down filter value
*/
async assignStatusChangeEvent(value) {
await this.setState({'ftAssignstatus': value});
+ UtilService.localStore({ type: 'set', key: 'ftAssignstatus', value: value });
//TODO: commented this code. It requires user details, waiting for API changes
//await this.filterTableData();
}
@@ -161,7 +191,7 @@ class WorkflowList extends Component{
* Filter the table data with checkbox value, it will fetch active workflow stagerows if the checkbox selected
* @param {Boolena} value
*/
- async setWorkflowActiveState(value) {
+ async setWorkflowActiveState(value) {
let showActiveStage = '';
if(value === null) {
showActiveStage = 'Show Active Workflow Process';
@@ -171,6 +201,8 @@ class WorkflowList extends Component{
showActiveStage = 'Show All Workflow Process';
}
await this.setState({'activeWorkflow': value, showActiveStage: showActiveStage});
+ UtilService.localStore({ type: 'set', key: 'activeWorkflow', value: value });
+ UtilService.localStore({ type: 'set', key: 'showActiveStage', value: showActiveStage });
await this.filterTableData();
}
@@ -275,6 +307,7 @@ class WorkflowList extends Component{
lsKeySortColumn={this.lsKeySortColumn}
toggleBySorting={(sortData) => this.toggleBySorting(sortData)}
defaultSortColumn= {this.defaultSortColumn}
+ showFilterOption={this.getFilterOptions} //Callback function to provide inputs for option-list in Select Dropdown filter
pageUpdated={this.pageUpdated}
/>
</>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/utils/ui.constants.js b/SAS/TMSS/frontend/tmss_webapp/src/utils/ui.constants.js
index 3aa111d98c1bc8f168c108ebae918791da3563b5..62abd85e40be9fe59869d0fa67f1c16fc7c6761d 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/utils/ui.constants.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/utils/ui.constants.js
@@ -27,6 +27,7 @@ const UIConstants = {
'NumberFilter':'',
'PropertyIsoDateTimeFromToRangeFilter':'',
},
- SU_STATUS:['cancelled', 'error', 'defining', 'defined', 'schedulable', 'scheduled','started', 'observing', 'observed', 'processing', 'processed', 'ingesting','finished', 'unschedulable']
+ SU_STATUS:['cancelled', 'error', 'defining', 'defined', 'schedulable', 'scheduled','started', 'observing', 'observed', 'processing', 'processed', 'ingesting','finished', 'unschedulable'],
+ CURRENT_WORKFLOW_STAGE:['Waiting To Be Scheduled','Scheduled','QA Reporting (TO)', 'QA Reporting (SDCO)', 'PI Verification', 'Decide Acceptance','Ingesting','Unpin Data','Done']
}
export default UIConstants;
\ No newline at end of file