How Make TreeData to Array - javascript

I am having a hard time applying the data received from the database to select components.
My database is
id
code
name
parent_name
1
1000
Marvel
2
1100
X-man
Marvel
3
1110
Wolverine
X-man
4
1120
Professor X
X-man
5
1200
Avengers
Marvel
6
1210
Captain America
Avengers
7
1211
Peggy Carter
Captain America
8
1220
Iron Man
Avengers
9
1221
Tony Startk
Iron Man
10
1222
War Machines
Iron Man
11
2000
DC
12
2100
BatMan
DC
13
2200
SuperMan
DC
dbDataArray is here
type TreeSelectType = {
title: string;
value: string;
key: string;
parentName: string | undefined;
children: TreeSelectType[];
};
const dbDataArray: TreeSelectType[] = [];
dbData.forEach(data => {
dbDataArray.push({
"title": data.name,
"value": data.code,
"key": data.code,
"parentName": data.parent_name,
"children": []
});
});
console.log(dbDataArray)
[
{
"title": "Marvel",
"value": "1000",
"key": "1000",
"parentName": null,
"children": []
},
{
"title": "X-man",
"value": "1100",
"key": "1100",
"parentName": "Marvel",
"children": []
},
{
"title": "Wolverine",
"value": "1110",
"key": "1110",
"parentName": "X-man",
"children": []
},
{
"title": "Professor X",
"value": "1120",
"key": "1120",
"parentName": "X-man",
"children": []
},
{
"title": "Avengers",
"value": "1200",
"key": "1200",
"parentName": "Marvel",
"children": []
},
{
"title": "Captain America",
"value": "1210",
"key": "1210,
"parentName": "Avengers",
"children": []
},
{
"title": "Peggy Carter",
"value": "1211",
"key": "1211",
"parentName": "Captain America",
"children": []
},
{
"title": "Iron Man",
"value": "1220",
"key": "1220",
"parentName": "Avengers",
"children": []
},
{
"title": "Tony Startk",
"value": "1221",
"key": "1221",
"parentName": "Iron Man",
"children": []
},
{
"title": "War Machines",
"value": "1222",
"key": "1222",
"parentName": "Iron Man",
"children": []
},
{
"title": "DC",
"value": "2000",
"key": "2000",
"parentName": null,
"children": []
},
{
"title": "BatMan",
"value": "2100",
"key": "2100",
"parentName": "DC",
"children": []
},
{
"title": "SuperMan",
"value": "2200",
"key": "2200",
"parentName": "DC",
"children": []
},
]
I need to treeDataArray. like this.
[
{
"title": "Marvel",
"value": "1000",
"key": "1000",
"parentName": "Marvel",
"children": [
{
"title": "X-man",
"value": "1100",
"key": "1100",
"parentName": "Marvel",
"children": [
{
"title": "Wolverine",
"value": "1110",
"key": "1110",
"parentName": "X-man",
"children": []
},
{
"title": "Professor X",
"value": "1120",
"key": "1120",
"parentName": "X-man",
"children": []
},
],
},
{
"title": "Avengers",
"value": "1200",
"key": "1200",
"parentName": "Marvel",
"children": [
{
"title": "Captain America",
"value": "1210",
"key": "1210,
"parentName": "Avengers",
"children": [
{
"title": "Peggy Carter",
"value": "1211",
"key": "1211",
"parentName": "Captain America",
"children": []
},
]
},
{
"title": "Iron Man",
"value": "1220",
"key": "1220",
"parentName": "Avengers",
"children": [
{
"title": "Tony Startk",
"value": "1221",
"key": "1221",
"parentName": "Iron Man",
"children": []
},
{
"title": "War Machines",
"value": "1222",
"key": "1222",
"parentName": "Iron Man",
"children": []
},
]
},
]
},
]
},
{
"title": "DC",
"value": "2000",
"key": "2000",
"parentName": null,
"children": [
{
"title": "BatMan",
"value": "2100",
"key": "2100",
"parentName": "DC",
"children": []
},
{
"title": "SuperMan",
"value": "2200",
"key": "2200",
"parentName": "DC",
"children": []
},
]
},
]
How Can I... please help me

You could create a Map keyed by title and with the corresponding objects as values. Then use that map to retrieve for each object the parent object, and insert it in the parent's children array.
Here is how that could look:
const dbDataArray = [{"title": "Marvel","value": "1000","key": "1000","parentName": null,"children": []},{"title": "X-man","value": "1100","key": "1100","parentName": "Marvel","children": []},{"title": "Wolverine","value": "1110","key": "1110","parentName": "X-man","children": []},{"title": "Professor X","value": "1120","key": "1120","parentName": "X-man","children": []},{"title": "Avengers","value": "1200","key": "1200","parentName": "Marvel","children": []},{"title": "Captain America","value": "1210","key": "1210","parentName": "Avengers","children": []},{"title": "Peggy Carter","value": "1211","key": "1211","parentName": "Captain America","children": []},{"title": "Iron Man","value": "1220","key": "1220","parentName": "Avengers","children": []},{"title": "Tony Startk","value": "1221","key": "1221","parentName": "Iron Man","children": []},{"title": "War Machines","value": "1222","key": "1222","parentName": "Iron Man","children": []},{"title": "DC","value": "2000","key": "2000","parentName": null,"children": []},{"title": "BatMan","value": "2100","key": "2100","parentName": "DC","children": []},{"title": "SuperMan","value": "2200","key": "2200","parentName": "DC","children": []},]
const result = [];
const map = new Map(dbDataArray.map(o => [o.title, o])).set(null, {children: result});
for (const o of dbDataArray) map.get(o.parentName).children.push(o);
console.log(result);

Related

Merging two array of objects only when array element contains error

So I have two arrays with objects. And also an array indicating where the replacement should take place(It spots if object contains error)
const oldData = [
{
"index": "01",
"skuId": "Sarbb-033",
"name": "Sasko Black",
"barcode": "843331510012",
"description": "Nice black bread",
"brand": "ERROR: No brand matching: Sasko",
"productLine": "ERROR: No product line matching: line",
"inputType": "Weight",
"uom": "ERROR: Invalid UoM type, valid values are: kg,g,mg,kl,l,ml,m,cm,mm",
"value": "700",
"capacity": "1",
"image": ""
},
{
"index": "02",
"skuId": "ERROR: Empty sku_id is not allowed",
"name": "Sasko Black1",
"barcode": "ERROR: Empty barcode is not allowed",
"description": "Nice black bread",
"brand": "ERROR: No brand matching: Future Life",
"productLine": "ERROR: No product line matching: line",
"inputType": "Weight",
"uom": "kg",
"value": "701",
"capacity": "2",
"image": ""
},
{
"index": "03",
"skuId": "Sarbb-099",
"name": "Sasko Black100",
"barcode": "843332555614",
"description": "Nice black bread",
"brand": "fwfwf",
"productLine": "naam",
"inputType": "weight",
"uom": "g",
"value": "702",
"capacity": "3",
"image": ""
},
{
"index": "04",
"skuId": "Sarbb-100",
"name": "Sasko Black101",
"barcode": "ERROR: Empty barcode is not allowed",
"description": "ERROR: Invalid description: [] it should not be blank.",
"brand": "fwfwf",
"productLine": "fwfwf",
"inputType": "Weight",
"uom": "g",
"value": "703",
"capacity": "4",
"image": ""
},
{
"index": "05",
"skuId": "Sarbb-101",
"name": "Sasko Black102",
"barcode": "843332555616",
"description": "Nice black bread",
"brand": "fwfwf",
"productLine": "naam",
"inputType": "weight",
"uom": "g",
"value": "704",
"capacity": "5",
"image": ""
}
]
const newData = [
{
"index": "01",
"skuId": "Sarbb-033",
"name": "Sasko Black",
"barcode": "843331510012",
"description": "Nice black bread",
"brand": "fwfwf",
"productLine": "fwfwf",
"inputType": "Weight",
"uom": "g",
"value": "700",
"capacity": "1",
"image": ""
},
{
"index": "02",
"skuId": "sarb",
"name": "Sasko Black1",
"barcode": "124125125",
"description": "Nice black bread",
"brand": "fwfwf",
"productLine": "fwfwf",
"inputType": "Weight",
"uom": "kg",
"value": "701",
"capacity": "2",
"image": ""
},
{
"index": "03",
"skuId": "Sarbb-100",
"name": "Sasko Black101",
"barcode": "214214214",
"description": "Desc",
"brand": "fwfwf",
"productLine": "fwfwf",
"inputType": "Weight",
"uom": "g",
"value": "703",
"capacity": "4",
"image": ""
}
]
const errorRows = [0,1,3]
const myTerribleAttempt = oldTableData.map((oldData, rowIndex) => {
return errorRows.map(index => {
if(rowIndex === index){
newTableData.map(newData => {
oldData = newData
})
}
})
})
I have tried multiple maps and just can't seem to get the right result. The new data objects should replace old data objects at the object containing the error. Please give me some assistance.
I think you've overcomplicated this - just check if the index is contained in the error array and choose old or new data.
const result = oldData.map( (item, idx) => errorRows.includes(idx)
? newData[errorRows.findIndex(x => x == idx)]
: item);
live example:
const oldData = [{
"index": "01",
"skuId": "Sarbb-033",
"name": "Sasko Black",
"barcode": "843331510012",
"description": "Nice black bread",
"brand": "ERROR: No brand matching: Sasko",
"productLine": "ERROR: No product line matching: line",
"inputType": "Weight",
"uom": "ERROR: Invalid UoM type, valid values are: kg,g,mg,kl,l,ml,m,cm,mm",
"value": "700",
"capacity": "1",
"image": ""
},
{
"index": "02",
"skuId": "ERROR: Empty sku_id is not allowed",
"name": "Sasko Black1",
"barcode": "ERROR: Empty barcode is not allowed",
"description": "Nice black bread",
"brand": "ERROR: No brand matching: Future Life",
"productLine": "ERROR: No product line matching: line",
"inputType": "Weight",
"uom": "kg",
"value": "701",
"capacity": "2",
"image": ""
},
{
"index": "03",
"skuId": "Sarbb-099",
"name": "Sasko Black100",
"barcode": "843332555614",
"description": "Nice black bread",
"brand": "fwfwf",
"productLine": "naam",
"inputType": "weight",
"uom": "g",
"value": "702",
"capacity": "3",
"image": ""
},
{
"index": "04",
"skuId": "Sarbb-100",
"name": "Sasko Black101",
"barcode": "ERROR: Empty barcode is not allowed",
"description": "ERROR: Invalid description: [] it should not be blank.",
"brand": "fwfwf",
"productLine": "fwfwf",
"inputType": "Weight",
"uom": "g",
"value": "703",
"capacity": "4",
"image": ""
},
{
"index": "05",
"skuId": "Sarbb-101",
"name": "Sasko Black102",
"barcode": "843332555616",
"description": "Nice black bread",
"brand": "fwfwf",
"productLine": "naam",
"inputType": "weight",
"uom": "g",
"value": "704",
"capacity": "5",
"image": ""
}
]
const newData = [{
"index": "01",
"skuId": "Sarbb-033",
"name": "Sasko Black",
"barcode": "843331510012",
"description": "Nice black bread",
"brand": "fwfwf",
"productLine": "fwfwf",
"inputType": "Weight",
"uom": "g",
"value": "700",
"capacity": "1",
"image": ""
},
{
"index": "02",
"skuId": "sarb",
"name": "Sasko Black1",
"barcode": "124125125",
"description": "Nice black bread",
"brand": "fwfwf",
"productLine": "fwfwf",
"inputType": "Weight",
"uom": "kg",
"value": "701",
"capacity": "2",
"image": ""
},
{
"index": "03",
"skuId": "Sarbb-100",
"name": "Sasko Black101",
"barcode": "214214214",
"description": "Desc",
"brand": "fwfwf",
"productLine": "fwfwf",
"inputType": "Weight",
"uom": "g",
"value": "703",
"capacity": "4",
"image": ""
}
]
const errorRows = [0, 1, 3];
const result = oldData.map((item, idx) => errorRows.includes(idx) ? newData[idx] : item);
console.log(result);

merge multilevel json object to create stagged object with no loss of data

I want to merge two multi-level object to form a single object with no loss of data.
till the level data is same no extra fields should be added, at level where fields are different new object should get inserted in the array.
we have to group json object of similar fields in one complete json.
multilevel object needs to be merged together to get one aggragated result.
my sample objects are as -
let one={
"name": "Hindi",
"country": "USA",
"region": "EAST COAST",
"enttity": "ENTITY-2",
"operation": [
{
"p_name": "RECONSTRUCTION",
"code": "jhhkj-132",
"class": "medical",
"products": [
{
"main": "electronic",
"area": [
{
"subarea": "electrical",
"use": 0,
"max_use": 0,
"mode_use": "10",
"median": "12",
"things": [
{
"id": "1000514",
"number": "1588TB-1",
"description": "DESCRIPTION1",
"manufacturer": "LG",
"tag": "NOT AVAILABLE",
}
]
}
]
}
]
}
]
};
let two={
"name": "Hindi",
"country": "USA",
"region": "EAST COAST",
"enttity": "ENTITY-2",
"operation": [
{
"p_name": "RECONSTRUCTION",
"code": "jhhkj-132",
"class": "medical",
"products": [
{
"main": "electronic",
"area": [
{
"subarea": "mechanical",
"use": 0,
"max_use": 0,
"mode_use": "10",
"median": "12",
"things": [
{
"id": "1000523314",
"number": "1588T3B-1",
"description": "DES32CRIPTION1",
"manufacturer": "LG",
"tag": "NOT AVAILABLE",
}
]
},
{
"subarea": "electrical",
"use": 0,
"max_use": 0,
"mode_use": "10",
"median": "12",
"things": [
{
"id": "1000514",
"number": "1588TB-1",
"description": "DESCRIPTION1",
"manufacturer": "LG",
"tag": "NOT AVAILABLE",
}
]
}
]
}
]
}
]
};
output json should be something like this->
let outpus={
"name": "Hindi",
"country": "USA",
"region": "EAST COAST",
"enttity": "ENTITY-2",
"operation": [
{
"p_name": "RECONSTRUCTION",
"code": "jhhkj-132",
"class": "medical",
"products": [
{
"main": "electronic",
"area": [
{
"subarea": "mechanical",
"use": 0,
"max_use": 0,
"mode_use": "10",
"median": "12",
"things": [
{
"id": "1000523314",
"number": "1588T3B-1",
"description": "DES32CRIPTION1",
"manufacturer": "LG",
"tag": "NOT AVAILABLE",
}
]
},
{
"subarea": "electrical",
"use": 0,
"max_use": 0,
"mode_use": "10",
"median": "12",
"things": [
{
"id": "1000514",
"number": "1588TB-1",
"description": "DESCRIPTION1",
"manufacturer": "LG",
"tag": "NOT AVAILABLE",
}
]
}
]
}
]
}
]
};

Populate child object in Json

I am trying to populate child object from below json on basis of parent id, but facing some issue, I need your help here. I am new in Json so please suggest me some solution, I wand to show child1, child2 child3 if page id is 2, I am trying to populate child object from below json on basis of parent id, but facing some issue, I need your help here. I am new in Json so please suggest me some solution, I wand to show child1, child2 child3 if page id is 2
[
{
"id": "2",
"slug": "parent",
"title": "Parent",
"subcategories": [
{
"id": "12",
"slug": "child1",
"title": "child1"
},
{
"id": "14",
"slug": "child2",
"title": "child2"
},
{
"id": "15",
"slug": "child3",
"title": "child3"
},
{
"id": "16",
"slug": "child4",
"title": "child4"
}
]
},
{
"id": "11",
"slug": "parent2",
"title": "Parent2",
"subcategories": [
{
"id": "32",
"slug": "child1",
"title": "child1"
},
{
"id": "33",
"slug": "child2",
"title": "child3"
}
]
}
]
[
{
"id": "2",
"slug": "parent",
"title": "Parent",
"subcategories": [
{
"id": "12",
"slug": "child1",
"title": "child1"
},
{
"id": "14",
"slug": "child2",
"title": "child2"
},
{
"id": "15",
"slug": "child3",
"title": "child3"
},
{
"id": "16",
"slug": "child4",
"title": "child4"
}
]
},
{
"id": "11",
"slug": "parent2",
"title": "Parent2",
"subcategories": [
{
"id": "32",
"slug": "child1",
"title": "child1"
},
{
"id": "33",
"slug": "child2",
"title": "child3"
}
]
}
]
$.getJSON("data.json" , function(json) {
$.each(json,function(i, value){
$.each(value.subcategories, function(index, obj){
$('#list-category-slider').append('<div class="item">' + obj.title + '</div>');
})
});
});
First, filter array to get current page based on id. And iterate over the properties to create the list. For test, pageId is set to 2.
$(function(){
var json =
[
{
"id": "2",
"slug": "parent",
"title": "Parent",
"subcategories": [
{
"id": "12",
"slug": "child1",
"title": "child1"
},
{
"id": "14",
"slug": "child2",
"title": "child2"
},
{
"id": "15",
"slug": "child3",
"title": "child3"
},
{
"id": "16",
"slug": "child4",
"title": "child4"
}
]
},
{
"id": "11",
"slug": "parent2",
"title": "Parent2",
"subcategories": [
{
"id": "32",
"slug": "child1",
"title": "child1"
},
{
"id": "33",
"slug": "child2",
"title": "child3"
}
]
}
]
var pageId = 2;
var currentPage = json.filter(function(el){
return el.id == pageId;
})[0];
$.each(currentPage.subcategories, function(index, obj){
$('#list-category-slider').append('<div class="item">' + obj.title + '</div>');
})
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='list-category-slider'>
</div>

JavaScript time comparison with arrays

I'm working on a project where I need to get all the vacant classrooms for the day and basically filter out the ones being in use.
I get all the data from the school's own API with JSON response body that looks like this:
{
"status": "success",
"reservations": [
{
"id": "18935",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:04:51",
"startDate": "2017-04-27T11:00:00",
"endDate": "2017-04-27T13:00:00",
"resources": [
{
"id": "50",
"type": "room",
"code": "A440.5",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A440.5"
},
{
"id": "2995",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "2267",
"type": "student_group",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "20362",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:05:05",
"startDate": "2017-04-27T11:00:00",
"endDate": "2017-04-27T14:00:00",
"resources": [
{
"id": "51",
"type": "room",
"code": "A450.1",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A450.1"
},
{
"id": "2402",
"type": "student_group",
"code": "",
"name": ""
},
{
"id": "3064",
"type": "realization",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "20237",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:05:05",
"startDate": "2017-04-27T11:15:00",
"endDate": "2017-04-27T13:00:00",
"resources": [
{
"id": "45",
"type": "room",
"code": "A420.4",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A420.4"
},
{
"id": "2433",
"type": "student_group",
"code": "",
"name": ""
},
{
"id": "3058",
"type": "realization",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "20888",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:04:57",
"startDate": "2017-04-27T13:15:00",
"endDate": "2017-04-27T16:00:00",
"resources": [
{
"id": "62",
"type": "room",
"code": "A520.5",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A520.5"
},
{
"id": "3092",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "2444",
"type": "student_group",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "22586",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:04:48",
"startDate": "2017-04-27T13:15:00",
"endDate": "2017-04-27T17:00:00",
"resources": [
{
"id": "52",
"type": "room",
"code": "A450.3",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A450.3"
},
{
"id": "3004",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "2294",
"type": "student_group",
"code": "",
"name": ""
},
{
"id": "525",
"type": "student_group",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "18816",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:04:58",
"startDate": "2017-04-27T13:15:00",
"endDate": "2017-04-27T16:00:00",
"resources": [
{
"id": "41",
"type": "room",
"code": "A340.1",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A340.1"
},
{
"id": "2989",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "795",
"type": "student_group",
"code": "",
"name": ""
},
{
"id": "599",
"type": "student_group",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "20431",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:04:56",
"startDate": "2017-04-27T13:15:00",
"endDate": "2017-04-27T16:00:00",
"resources": [
{
"id": "40",
"type": "room",
"code": "A320.7",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A320.7/8"
},
{
"id": "2416",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "2386",
"type": "student_group",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "18588",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:04:49",
"startDate": "2017-04-27T13:15:00",
"endDate": "2017-04-27T16:00:00",
"resources": [
{
"id": "25",
"type": "room",
"code": "A130.1",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A130.1"
},
{
"id": "26",
"type": "room",
"code": "A130.3",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A130.3"
},
{
"id": "2979",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "582",
"type": "student_group",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "18940",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:04:53",
"startDate": "2017-04-27T13:15:00",
"endDate": "2017-04-27T16:00:00",
"resources": [
{
"id": "2996",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "2267",
"type": "student_group",
"code": "",
"name": ""
},
{
"id": "2268",
"type": "student_group",
"code": "",
"name": ""
},
{
"id": "31",
"type": "room",
"code": "A210.2",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A210.2"
}
],
"description": ""
},
{
"id": "12041",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:04:53",
"startDate": "2017-04-27T14:15:00",
"endDate": "2017-04-27T17:00:00",
"resources": [
{
"id": "2510",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "775",
"type": "student_group",
"code": "",
"name": ""
},
{
"id": "23",
"type": "room",
"code": "A520.7",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A520.7"
}
],
"description": ""
},
{
"id": "24630",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:05:05",
"startDate": "2017-04-27T14:15:00",
"endDate": "2017-04-27T17:00:00",
"resources": [
{
"id": "3277",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "42",
"type": "room",
"code": "A340.2",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A340.2"
}
],
"description": ""
},
{
"id": "27205",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:05:07",
"startDate": "2017-04-27T14:15:00",
"endDate": "2017-04-27T17:00:00",
"resources": [
{
"id": "35",
"type": "room",
"code": "A240.2",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A240.2"
},
{
"id": "775",
"type": "student_group",
"code": "",
"name": ""
},
{
"id": "3384",
"type": "realization",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "25917",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:05:00",
"startDate": "2017-04-27T15:15:00",
"endDate": "2017-04-27T16:00:00",
"resources": [
{
"id": "36",
"type": "room",
"code": "A240.4",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A240.4"
},
{
"id": "593",
"type": "realization",
"code": "",
"name": ""
},
{
"id": "595",
"type": "student_group",
"code": "",
"name": ""
}
],
"description": ""
},
{
"id": "21932",
"subject": "subjectName",
"modifiedDate": "2017-04-27T06:05:06",
"startDate": "2017-04-27T16:00:00",
"endDate": "2017-04-27T18:00:00",
"resources": [
{
"id": "43",
"type": "room",
"code": "A350.1",
"parent": {
"id": "2",
"type": "building",
"code": "A",
"name": "buildingA"
},
"name": "A350.1"
},
{
"id": "2464",
"type": "student_group",
"code": "",
"name": ""
},
{
"id": "2747",
"type": "student_group",
"code": "",
"name": ""
}
],
"description": ""
}
]
}
In order to get the JSON response I need to put startDate (the moment user searches the vacant rooms, in this situation it is: 2017-04-27T10:55) and endDate (set to end of the day, 2017-04-27T22:00). The result for this query is the JSON response above.
The problem is that the API I'm using doesn't contain any data for the vacant rooms but only for the ones booked for certain times so I made a list of all the rooms in the building and compared it to the booked ones to filter them out:
var rooms = ['A120.3', 'A130.1', 'A130.3', 'A140.1', 'A140.2', 'A140.4', 'A250.1', 'A240.4', 'A240.2', 'A220.5', 'A220.3',
'A220.1', 'A210.2', 'A320.2', 'A320.6', 'A320.7', 'A320.8', 'A340.1', 'A340.2', 'A350.1', 'A350.3', 'A440.5', 'A450.3','A450.1',
'A440.4', 'A440.2', 'A420.6', 'A420.5', 'A420.4', 'A420.2', 'A510.2', 'A520.5', 'A510.4', 'A520.6', 'A520.7','A540.1', 'A540.2'];
var data = JSON.parse(responseText);
var booking = Object.create(null);
var free;
data.reservations.forEach(function (reservation) {
reservation.resources.some(function (resource) {
if (resource.type === 'room') {
booking[resource.code] = booking[resource.code] || [];
booking[resource.code].push({ startDate: reservation.startDate, endDate: reservation.endDate });
return true;
}
});
});
free = rooms.filter(function (a) {
return !booking[a];
});
console.log(free);
Results:
A210.3
A220.5
A320.2
A520.6
A510.4
This only returns the ones that are not being used at all during the day but I need to get the ones that are vacant for hour or two.
For this booked class for example:
"startDate": "2017-04-27T13:15:00",
"endDate": "2017-04-27T16:00:00",
"type": "room",
"code": "A520.5"
for this I would need to print out:
A520.5 - 2 hours 20 minutes
So I need to get the room / time from the startDate of the search (2017-04-27T10:55) and compare it to the startDate of the booked room (2017-04-27T13:15:00) to get the time remaining for that room to be vacant.
TO CLARIFY:
I have all the data for booked rooms starting from 2017-04-27T10:55
until 2017-04-27T22:00 as you can see from the JSON response above.
I need to somehow compare the startDate of the JSON query when the user
searches for the rooms (2017-04-27T10:55) and compare it to the booked
rooms startDate to get the time how long the room stays vacant.
This is how I'm doing my startDate and endDate for the JSON query:
// Timestamp needs to be formed (YYYY-MM-DDTxx:xx) in order for JSON query to work
var todaysDate = new Date();
function convertDate(date) {
var yyyy = date.getFullYear().toString();
var mm = (date.getMonth() + 1).toString();
var dd = date.getDate().toString();
var mmChars = mm.split('');
var ddChars = dd.split('');
return yyyy + '-' + (mmChars[1] ? mm : "0" + mmChars[0]) + '-' + (ddChars[1] ? dd : "0" + ddChars[0]);
}
// Current time when user searches for vacant rooms
var currentTime = new Date();
var time = "T" + currentTime.getHours() + ":" + currentTime.getMinutes();
// variables for the JSON query
var startDate = convertDate(todaysDate) + time;
var endDate = convertDate(todaysDate) + ("T22:00");
// JSON-query
var getRooms = {
"startDate": startDate,
"endDate": endDate
};

Kendo UI HierarchicalDataSource for Treeview with dynamic schema

I'm trying to display a Kendo treeview thanks to a HierarchicalDataSource.
It's a simple region, country, city hierarchy but the difficulty comes with the fact that we have 3 possible levels of regions and countries can appear at the second or at the third level.
Basically,
- First level of regions contains only other regions
- Second level of regions contains other regions or countries
- Third level of regions contains only countries
Here are my schemas:
var portsSchema = {
schema: {
data: "PortList",
model: {
id: "Code"
}
}
};
var countrySchema = {
schema: {
data: "CountryList",
model: {
id: "Code",
children: portsSchema
}
}
};
var regionCountrySchema = {
schema: {
data: "RegionList",
model: {
id: "id",
children: countrySchema
}
}
};
var regionSchema = {
schema: {
data: "RegionList",
model: {
id: "id",
children: regionCountrySchema
}
}
};
Depending on the fact that the region has countries or not, I would like to specify a specific type of children (regionSchema or regionCountrySchema).
var tvDataSource = new kendo.data.HierarchicalDataSource({
data: regions,
schema: {
model: function (data) {
**how to return the right children schema ?**
}
}
});
Returning { children: regionSchema } or {children: regionCountrySchema } triggers a js kendo error.
Any idea to achieve this ? Thank you.
JSON data sample below.
[
{
"Id": 1,
"Name": "MIDDLE EAST AND RED SEA",
"RegionList": [
{
"Id": 12,
"Name": "MIDDLE EAST",
"RegionList": [
{
"Id": 45,
"Name": "M. EAST",
"RegionList": [
],
"CountryList": [
{
"Id": 12007,
"Code": "AE",
"Name": "UAE",
"PortList": [
{
"Id": 6005,
"Code": "AEJEA",
"Name": "JEBEL ALI"
},
{
"Id": 16014,
"Code": "AEAJM",
"Name": "AJMAN"
},
{
"Id": 16015,
"Code": "AEAUH",
"Name": "ABU DHABI"
},
{
"Id": 15109,
"Code": "AEKLF",
"Name": "KHOR AL FAKKAN"
},
{
"Id": 15001,
"Code": "AERKT",
"Name": "RAS AL KHAIMAH"
},
{
"Id": 16018,
"Code": "AESHJ",
"Name": "SHARJAH"
},
{
"Id": 14863,
"Code": "AEQIW",
"Name": "UMM AL QAIWAIN"
},
{
"Id": 15647,
"Code": "AEFJR",
"Name": "AL - FUJAYRAH"
}
]
},
{
"Id": 12018,
"Code": "OM",
"Name": "OMAN",
"PortList": [
{
"Id": 6011,
"Code": "OMSLL",
"Name": "SALALAH"
},
{
"Id": 16218,
"Code": "OMSOH",
"Name": "SOHAR"
}
]
},
{
"Id": 10069,
"Code": "BH",
"Name": "BAHRAIN",
"PortList": [
{
"Id": 15345,
"Code": "BHKBS",
"Name": "BAHRAIN"
}
]
},
{
"Id": 62292,
"Code": "IQ",
"Name": "IRAQ",
"PortList": [
{
"Id": 15383,
"Code": "IQBSR",
"Name": "BASRA"
},
{
"Id": 14673,
"Code": "IQUQR",
"Name": "UMM QASR PT"
}
]
},
{
"Id": 62291,
"Code": "IR",
"Name": "IRAN, ISLAMIC REPUBLIC OF",
"PortList": [
{
"Id": 15250,
"Code": "IRBKM",
"Name": "BANDAR KHOMEINI"
},
{
"Id": 15249,
"Code": "IRBND",
"Name": "BANDAR ABBAS"
},
{
"Id": 14973,
"Code": "IRBUZ",
"Name": "BUSHEHR"
},
{
"Id": 14671,
"Code": "IRKHO",
"Name": "KHORRAMSHAHR"
}
]
},
{
"Id": 62306,
"Code": "KW",
"Name": "KUWAIT",
"PortList": [
{
"Id": 15810,
"Code": "KWSAA",
"Name": "SHUAIBA"
},
{
"Id": 15811,
"Code": "KWSWK",
"Name": "SHUWAIKH"
}
]
},
{
"Id": 12002,
"Code": "SA",
"Name": "SAUDI ARABIA",
"PortList": [
{
"Id": 15039,
"Code": "SAJUB",
"Name": "JUBAIL"
},
{
"Id": 16147,
"Code": "SADMM",
"Name": "AD DAMMAM"
}
]
},
{
"Id": 62364,
"Code": "QA",
"Name": "QATAR",
"PortList": [
{
"Id": 15739,
"Code": "QADOH",
"Name": "DOHA"
},
{
"Id": 14795,
"Code": "QAMES",
"Name": "MESAIEED"
}
]
}
]
}
],
"CountryList": [
]
},
{
"Id": 30,
"Name": "RED SEA",
"RegionList": [
{
"Id": 65,
"Name": "RED SEA",
"RegionList": [
],
"CountryList": [
]
}
],
"CountryList": [
{
"Id": 12002,
"Code": "SA",
"Name": "SAUDI ARABIA",
"PortList": [
{
"Id": 6003,
"Code": "SAKAC",
"Name": "KING ABDULLAH PORT"
},
{
"Id": 15731,
"Code": "SAJED",
"Name": "JEDDAH"
}
]
},
{
"Id": 10114,
"Code": "DJ",
"Name": "DJIBOUTI",
"PortList": [
{
"Id": 8059,
"Code": "DJJIB",
"Name": "DJIBOUTI"
}
]
},
{
"Id": 10122,
"Code": "ER",
"Name": "ERITREA",
"PortList": [
{
"Id": 15031,
"Code": "ERMSW",
"Name": "MASSAWA"
}
]
},
{
"Id": 62300,
"Code": "JO",
"Name": "JORDAN",
"PortList": [
{
"Id": 14801,
"Code": "JOAQJ",
"Name": "AL \u0027AQABAH"
}
]
},
{
"Id": 50001,
"Code": "SD",
"Name": "sd",
"PortList": [
{
"Id": 15734,
"Code": "SDPZU",
"Name": "PORT SUDAN"
}
]
},
{
"Id": 62425,
"Code": "YE",
"Name": "YEMEN",
"PortList": [
{
"Id": 15302,
"Code": "YEHOD",
"Name": "HODEIDAH"
},
{
"Id": 15304,
"Code": "YEMKX",
"Name": "MUKALLA"
},
{
"Id": 15300,
"Code": "YEADE",
"Name": "ADEN"
}
]
},
{
"Id": 10118,
"Code": "EG",
"Name": "EGYPT",
"PortList": [
{
"Id": 16030,
"Code": "EGSOK",
"Name": "SOKHNA PORT"
}
]
}
]
}
],
"CountryList": [
]
}
]

Categories

Resources