From 65bdc4739fd3475acb88b91793ff92ef43b68fb7 Mon Sep 17 00:00:00 2001
From: NithyaSanthanam <nithya.s@matriotsolutions.com>
Date: Tue, 7 Sep 2021 13:26:56 +0530
Subject: [PATCH] TMSS-393: Fixed filter related issues
---
.../tmss_webapp/src/routes/Task/view.js | 105 +++++++++++++++---
.../tmss_webapp/src/services/task.service.js | 22 +++-
2 files changed, 106 insertions(+), 21 deletions(-)
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Task/view.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Task/view.js
index d8ae206374d..e04a0900540 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Task/view.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Task/view.js
@@ -39,15 +39,23 @@ export class TaskView extends Component {
subtaskRowList: [],
defaultcolumns: [{
type: {
- name:"Subtask type",
- filter:"select"
+ name:"Subtask Type",
+ filter:"select",
+ tooltip: 'Select Subtask type'
+ },
+ id: {
+ name: "Subtask ID",
+ tooltip: 'Enter few characters'
+ },
+ status: {
+ name: "Subtask Status",
+ filter:"select",
+ tooltip: 'Select Subtask status'
},
- id:"Subtask ID",
- status:"Status",
start_time: {
name: "Start Time",
filter: "flatpickrDateRange",
- format:UIConstants.CALENDAR_DATETIME_FORMAT
+ format:UIConstants.CALENDAR_DATETIME_FORMAT,
},
stop_time: {
name: "End Time",
@@ -55,19 +63,28 @@ export class TaskView extends Component {
format:UIConstants.CALENDAR_DATETIME_FORMAT
},
duration:{
- name:"Duration (Days HH:mm:ss)",
- format:UIConstants.CALENDAR_TIME_FORMAT
+ name:"Duration (HH:mm:ss)",
+ filter: "durationMinMax",
},
- parset: "Parset"
+ parset: {
+ name: "Link to Parset",
+ tooltip: 'Enter few characters'
+ }
}],
- optionalcolumns: [{
+ optionalcolumns: [{
}],
columnclassname: [{
"Duration (Days HH:mm:ss)":"filter-input-75",
- "Subtask type":"filter-input-100",
+ "Subtask Type":"filter-input-100",
+ "Subtask ID":"filter-input-75",
+ "Link to Parset":"filter-input-150"
}],
defaultSortColumn: [{id: "Start Time", desc: false}],
};
+ this.lsKeySortColumn = "";
+ this.statusList = [];
+ this.subtaskTypeList = [];
+ this.fetchSubtask = true;
this.access_denied_message = "Don't have permission";
this.setEditorFunction = this.setEditorFunction.bind(this);
this.deleteTask = this.deleteTask.bind(this);
@@ -76,7 +93,7 @@ export class TaskView extends Component {
this.getTaskDeleteDialogContent = this.getTaskDeleteDialogContent.bind(this);
this.showCancelConfirmation = this.showCancelConfirmation.bind(this);
this.cancelTask = this.cancelTask.bind(this);
-
+ this.getFilterOptions = this.getFilterOptions.bind(this);
if (this.props.match.params.id) {
this.state.taskId = this.props.match.params.id;
@@ -84,7 +101,6 @@ export class TaskView extends Component {
if (this.props.match.params.type) {
this.state.taskType = this.props.match.params.type;
}
-
}
// static getDerivedStateFromProps(nextProps, prevstate){
@@ -119,6 +135,9 @@ export class TaskView extends Component {
const taskId = this.props.location.state?this.props.location.state.id:this.state.taskId;
let taskType = this.props.location.state && this.props.location.state.type?this.props.location.state.type:this.state.taskType;
taskType = taskType?taskType:'draft';
+ this.lsKeySortColumn = 'subtaskSort'+taskId;
+ this.setToggleBySorting();
+ await this.getStatusList(taskType.toLowerCase());
const moduleName = taskType === 'draft' ? 'task_draft': 'task_blueprint'
const permission = await AuthUtil.getUserRolePermission();
const permissionById = await AuthUtil.getUserPermissionByModuleId(moduleName, taskId)
@@ -145,7 +164,7 @@ export class TaskView extends Component {
getTaskDetails(taskId, taskType) {
if (taskId) {
taskType = taskType?taskType:'draft';
- TaskService.getTaskDetails(taskType, taskId)
+ TaskService.getTaskDetails(taskType, taskId, this.fetchSubtask)
.then((task) => {
if (task) {
taskType === 'blueprint' && this.getSubtaskDetails(task.subtasks);
@@ -184,11 +203,11 @@ export class TaskView extends Component {
subtaskRow['status'] = subtask.state_value;
subtaskRow['start_time']= subtask.start_time;
subtaskRow['stop_time']= subtask.stop_time;
- subtaskRow['duration']= subtask.duration;
+ subtaskRow['duration']= moment.utc((subtask.duration || 0) * 1000).format(UIConstants.CALENDAR_TIME_FORMAT);
subtaskRow['parset']= `https://proxy.lofar.eu/inspect/${subtask.id}/rtcp-${subtask.id}.parset`;
- subtaskRow['links'] = ['Parset'];
+ subtaskRow['links'] = ['Link to Parset'];
subtaskRow['linksURL'] = {
- 'Parset': `https://proxy.lofar.eu/inspect/${subtask.id}/rtcp-${subtask.id}.parset`
+ 'Link to Parset': `https://proxy.lofar.eu/inspect/${subtask.id}/rtcp-${subtask.id}.parset`
};
subtaskList.push(subtaskRow);
}
@@ -196,6 +215,23 @@ export class TaskView extends Component {
subtaskRowList: subtaskList
});
}
+
+ toggleBySorting = (sortData) => {
+ UtilService.localStore({ type: 'set', key: this.lsKeySortColumn, value: sortData });
+ }
+ setToggleBySorting() {
+ let sortData = UtilService.localStore({ type: 'get', key: this.lsKeySortColumn });
+ if (sortData) {
+ if (Object.prototype.toString.call(sortData) === '[object Array]') {
+ this.defaultSortColumn = sortData;
+ }
+ else {
+ this.defaultSortColumn = [{ ...sortData }];
+ }
+ }
+ this.defaultSortColumn = this.defaultSortColumn || [];
+ UtilService.localStore({ type: 'set', key: this.lsKeySortColumn, value: [...this.defaultSortColumn] });
+ }
/**
* Show confirmation dialog
*/
@@ -293,6 +329,30 @@ export class TaskView extends Component {
this.setState({ confirmDialogVisible: false, task: task, actions: actions});
}
}
+
+ async getStatusList(type) {
+ const taskFilters = await TaskService.getTaskFilterDefinition(type);
+ if (taskFilters.data.filters['status']) {
+ taskFilters.data.filters['status'].choices.forEach(choice => {
+ this.statusList.push(choice.value);
+ })
+ }
+ const subtaskTypes = await TaskService.getSubtaskType();
+ subtaskTypes.results.forEach(subtaskType => {
+ this.subtaskTypeList.push(subtaskType.value);
+ })
+ }
+
+ getFilterOptions(id) {
+ let options = null;
+ if(id && id === 'Subtask Status') {
+ options = this.statusList;
+ }
+ if(id && id === 'Subtask Type') {
+ options = this.subtaskTypeList;
+ }
+ return options;
+ }
render() {
if (this.state.redirect) {
@@ -334,7 +394,8 @@ export class TaskView extends Component {
}
actions.push({icon: 'fa fa-trash',title:this.state.hasBlueprint ? 'Cannot delete Draft when Blueprint exists':
this.state.permissionById && this.state.permissionById[this.state.taskId].delete? 'Delete Task': `${this.access_denied_message} to delete`,
- type: 'button', disabled: this.state.hasBlueprint, actOn: 'click', props:{ callback: this.showDeleteConfirmation}});
+ type: 'button', disabled: this.state.hasBlueprint ? false:
+ this.state.permissionById && this.state.permissionById[this.state.taskId].delete? false: true, actOn: 'click', props:{ callback: this.showDeleteConfirmation}});
actions.push({ icon: 'fa-window-close', link: this.props.history.goBack,
title:'Click to Close Task', props : { pathname:'/schedulingunit' }});
@@ -467,13 +528,23 @@ export class TaskView extends Component {
</div>
{this.state.taskType === 'blueprint' &&
<div>
+ <div className="p-fluid">
+ <div className="p-field p-grid">
+ <div className="col-lg-3 col-md-3 col-sm-12">
+ <h5 data-testid="resource_alloc">Subtask Details</h5>
+ </div>
+ </div>
+ </div>
<ViewTable
data={this.state.subtaskRowList}
defaultcolumns={this.state.defaultcolumns}
optionalcolumns={this.state.optionalcolumns}
columnclassname={this.state.columnclassname}
defaultSortColumn={this.defaultSortColumn}
+ showFilterOption={this.getFilterOptions}
paths={this.state.paths}
+ lsKeySortColumn={this.lsKeySortColumn}
+ toggleBySorting={(sortData) => this.toggleBySorting(sortData)}
tablename="subtask_list"
/>
</div>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/services/task.service.js b/SAS/TMSS/frontend/tmss_webapp/src/services/task.service.js
index aaee222e62f..ae003e58651 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/services/task.service.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/services/task.service.js
@@ -1,9 +1,9 @@
const axios = require('axios');
const TaskService = {
- getTaskDetails: async function (taskType, taskId) {
+ getTaskDetails: async function (taskType, taskId, fetchSubtask) {
try {
- const responseData = await this.getTask(taskType, taskId);
+ const responseData = await this.getTask(taskType, taskId, fetchSubtask);
responseData.predecessors = [];
responseData.successors = [];
if (taskType === 'blueprint') {
@@ -27,9 +27,15 @@ const TaskService = {
console.error(error);
}
},
- getTask : async function (taskType, taskId) {
+ getTask : async function (taskType, taskId, fetchSubtask) {
try {
- const url = taskType === 'blueprint'? '/api/task_blueprint/'+taskId+'?expand=subtasks': '/api/task_draft/'+taskId;
+ let url = ''
+ if(fetchSubtask){
+ url = taskType === 'blueprint'? '/api/task_blueprint/'+taskId+'?expand=subtasks': '/api/task_draft/'+taskId;
+ }
+ else {
+ url = taskType === 'blueprint'? '/api/task_blueprint/'+taskId: '/api/task_draft/'+taskId;
+ }
const response = await axios.get(url);// + taskId);
return response.data;
} catch (error) {
@@ -260,6 +266,14 @@ const TaskService = {
}
return taskRelations;
},
+ getSubtaskType: async function() {
+ try {
+ return (await axios.get(`/api/subtask_type`)).data;
+
+ } catch(error) {
+
+ }
+ },
/**
* Delete task based on task type
* @param {*} type
--
GitLab