<div id="demo-container">
<div class="widget-container">
<dx-scroll-view
id="scroll"
[ngClass]="{'horizontal': itemOrientation === 'horizontal'}"
[direction]="itemOrientation"
showScrollbar="always">
<dx-sortable
id="list"
[dropFeedbackMode]="dropFeedbackMode"
[itemOrientation]="itemOrientation"
[dragDirection]="dragDirection"
[scrollSpeed]="scrollSpeed"
[scrollSensitivity]="scrollSensitivity"
[handle]="handle"
[dragTemplate]="dragTemplate"
[cursorOffset]="cursorOffset"
(onDragStart)="onDragStart($event)"
(onReorder)="onReorder($event)"
>
<div
*dxTemplate="let dragInfo of 'drag'"
class="item dx-card dx-theme-text-color dx-theme-background-color"
style="font-weight: bold; width: 200px; padding: 10px">
{{dragInfo.itemData}}
</div>
<div
class="item dx-card dx-theme-text-color dx-theme-background-color"
[ngClass]="{'item-with-handle': handle}"
*ngFor="let item of items">
<i *ngIf="handle" class="handle dx-icon dx-icon-dragvertical"></i>
{{item}}
</div>
</dx-sortable>
</dx-scroll-view>
</div>
<div class="options">
<div class="caption">Options</div>
<div class="option">
<span>Drop Feedback Mode:</span>
<dx-select-box
[items]="['push', 'indicate']"
[(value)]="dropFeedbackMode"></dx-select-box>
</div>
<div class="option">
<span>Item Orientation:</span>
<dx-select-box
[items]="['vertical', 'horizontal']"
[(value)]="itemOrientation"
(onValueChanged)="onItemOrientationChanged($event)"></dx-select-box>
</div>
<div class="option">
<span>Drag Direction:</span>
<dx-select-box
[items]="dragDirections"
[(value)]="dragDirection"></dx-select-box>
</div>
<div class="option">
<span>Scroll Speed:</span>
<dx-number-box
[(value)]="scrollSpeed"></dx-number-box>
</div>
<div class="option">
<span>Scroll Sensitivity:</span>
<dx-number-box
[(value)]="scrollSensitivity"></dx-number-box>
</div>
<div class="option">
<dx-check-box
text="Use Handle"
(onValueChanged)="onHandleChanged($event)"></dx-check-box>
</div>
<div class="option">
<dx-check-box
text="Use Drag Template"
(onValueChanged)="onDragTemplateChanged($event)"></dx-check-box>
</div>
</div>
</div>
import { NgModule, Component, enableProdMode } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { Service } from './app.service';
import {
DxScrollViewModule,
DxSortableModule,
DxSelectBoxModule,
DxCheckBoxModule,
DxNumberBoxModule
} from 'devextreme-angular';
if(!/localhost/.test(document.location.host)) {
enableProdMode();
}
@Component({
selector: 'demo-app',
templateUrl: 'app/app.component.html',
styleUrls: ['app/app.component.css'],
providers: [Service]
})
export class AppComponent {
items: string[];
dropFeedbackMode: string;
itemOrientation: string;
dragDirection: string;
dragDirections: string[];
scrollSpeed: number;
scrollSensitivity: number;
handle: string;
dragTemplate: string;
cursorOffset: any;
constructor(service: Service) {
this.items = service.getTasks().map(task => task.Task_Subject);
this.dropFeedbackMode = "push";
this.itemOrientation = "vertical";
this.dragDirection = "both";
this.dragDirections = ["both", "vertical"];
this.scrollSpeed = 30;
this.scrollSensitivity = 60;
this.handle = "";
this.dragTemplate = "";
this.cursorOffset = null;
}
onDragStart(e) {
e.itemData = this.items[e.fromIndex];
}
onReorder(e) {
this.items.splice(e.fromIndex, 1);
this.items.splice(e.toIndex, 0, e.itemData);
}
onItemOrientationChanged(e) {
this.dragDirections = ["both", e.value];
this.dragDirection = "both";
}
onHandleChanged(e) {
this.handle = e.value ? ".handle" : "";
}
onDragTemplateChanged(e) {
this.dragTemplate = e.value ? "drag" : "";
this.cursorOffset = e.value ? { x: 10, y: 20 } : null;
}
}
@NgModule({
imports: [
BrowserModule,
DxScrollViewModule,
DxSortableModule,
DxSelectBoxModule,
DxCheckBoxModule,
DxNumberBoxModule
],
declarations: [AppComponent],
bootstrap: [AppComponent]
})
export class AppModule { }
platformBrowserDynamic().bootstrapModule(AppModule);
.widget-container {
margin-right: 320px;
}
#scroll {
height: 500px;
}
#scroll.horizontal {
margin-top: 170px;
display: block;
width: auto;
height: auto;
white-space: nowrap;
}
.handle {
position: absolute;
left: 4px;
top: 10px;
font-size: 18px;
line-height: 19px;
cursor: move;
}
.horizontal .handle {
margin-right: 10px;
}
.item {
box-sizing: border-box;
position: relative;
padding: 10px 20px;
margin-bottom: 10px;
background: white;
cursor: pointer;
}
.item-with-handle {
padding-left: 30px;
cursor: default;
}
.horizontal .item {
display: inline-block;
width: 200px;
height: 100px;
margin-bottom: 0;
margin-right: 10px;
white-space: normal;
}
.options {
padding: 20px;
position: absolute;
bottom: 0;
right: 0;
width: 260px;
top: 0;
background-color: rgba(191, 191, 191, 0.15);
}
.caption {
font-size: 18px;
font-weight: 500;
}
.option {
margin-top: 10px;
}
import { Injectable } from "@angular/core";
const tasks = [{
"Task_ID": 28,
"Task_Assigned_Employee_ID": 7,
"Task_Owner_ID": 1,
"Task_Subject": "Prepare 2015 Financial",
"Task_Start_Date": "2015-01-15T00:00:00",
"Task_Due_Date": "2015-01-31T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 1
}, {
"Task_ID": 29,
"Task_Assigned_Employee_ID": 4,
"Task_Owner_ID": 1,
"Task_Subject": "Prepare 2015 Marketing Plan",
"Task_Start_Date": "2015-01-01T00:00:00",
"Task_Due_Date": "2015-01-31T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 1
}, {
"Task_ID": 30,
"Task_Assigned_Employee_ID": 2,
"Task_Owner_ID": 1,
"Task_Subject": "Review Health Insurance Options Under the Affordable Care Act",
"Task_Start_Date": "2015-02-12T00:00:00",
"Task_Due_Date": "2015-04-25T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 50,
"Task_Parent_ID": 2
}, {
"Task_ID": 31,
"Task_Assigned_Employee_ID": 1,
"Task_Owner_ID": 2,
"Task_Subject": "Choose between PPO and HMO Health Plan",
"Task_Start_Date": "2015-02-15T00:00:00",
"Task_Due_Date": "2015-04-15T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 75,
"Task_Parent_ID": 2
}, {
"Task_ID": 32,
"Task_Assigned_Employee_ID": 1,
"Task_Owner_ID": 4,
"Task_Subject": "Google AdWords Strategy",
"Task_Start_Date": "2015-02-16T00:00:00",
"Task_Due_Date": "2015-02-28T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 29
}, {
"Task_ID": 34,
"Task_Assigned_Employee_ID": 28,
"Task_Owner_ID": 1,
"Task_Subject": "2015 Brochure Designs",
"Task_Start_Date": "2015-02-19T00:00:00",
"Task_Due_Date": "2015-02-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 3
}, {
"Task_ID": 35,
"Task_Assigned_Employee_ID": 29,
"Task_Owner_ID": 28,
"Task_Subject": "Brochure Design Review",
"Task_Start_Date": "2015-02-19T00:00:00",
"Task_Due_Date": "2015-02-22T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 34
}, {
"Task_ID": 36,
"Task_Assigned_Employee_ID": 29,
"Task_Owner_ID": 28,
"Task_Subject": "Website Re-Design Plan",
"Task_Start_Date": "2015-02-19T00:00:00",
"Task_Due_Date": "2015-02-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 34
}, {
"Task_ID": 37,
"Task_Assigned_Employee_ID": 4,
"Task_Owner_ID": 1,
"Task_Subject": "Rollout of New Website and Marketing Brochures",
"Task_Start_Date": "2015-02-20T00:00:00",
"Task_Due_Date": "2015-02-28T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 3
}, {
"Task_ID": 38,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 4,
"Task_Subject": "Update Sales Strategy Documents",
"Task_Start_Date": "2015-02-20T00:00:00",
"Task_Due_Date": "2015-02-22T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 29
}, {
"Task_ID": 39,
"Task_Assigned_Employee_ID": 41,
"Task_Owner_ID": 8,
"Task_Subject": "Create 2012 Sales Report",
"Task_Start_Date": "2015-02-20T00:00:00",
"Task_Due_Date": "2015-02-21T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 29
}, {
"Task_ID": 40,
"Task_Assigned_Employee_ID": 42,
"Task_Owner_ID": 41,
"Task_Subject": "Direct vs Online Sales Comparison Report",
"Task_Start_Date": "2015-02-20T00:00:00",
"Task_Due_Date": "2015-02-22T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 29
}, {
"Task_ID": 41,
"Task_Assigned_Employee_ID": 4,
"Task_Owner_ID": 41,
"Task_Subject": "Review 2012 Sales Report and Approve 2015 Plans",
"Task_Start_Date": "2015-02-23T00:00:00",
"Task_Due_Date": "2015-02-28T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 29
}, {
"Task_ID": 42,
"Task_Assigned_Employee_ID": 3,
"Task_Owner_ID": 1,
"Task_Subject": "Deliver R&D Plans for 2015",
"Task_Start_Date": "2015-03-01T00:00:00",
"Task_Due_Date": "2015-03-10T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 1
}, {
"Task_ID": 43,
"Task_Assigned_Employee_ID": 32,
"Task_Owner_ID": 3,
"Task_Subject": "Create 2015 R&D Plans",
"Task_Start_Date": "2015-03-01T00:00:00",
"Task_Due_Date": "2015-03-07T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 42
}, {
"Task_ID": 44,
"Task_Assigned_Employee_ID": 33,
"Task_Owner_ID": 32,
"Task_Subject": "2015 QA Strategy Report",
"Task_Start_Date": "2015-03-02T00:00:00",
"Task_Due_Date": "2015-03-05T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 42
}, {
"Task_ID": 45,
"Task_Assigned_Employee_ID": 31,
"Task_Owner_ID": 33,
"Task_Subject": "2015 Training Events",
"Task_Start_Date": "2015-03-02T00:00:00",
"Task_Due_Date": "2015-03-04T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 4
}, {
"Task_ID": 46,
"Task_Assigned_Employee_ID": 2,
"Task_Owner_ID": 5,
"Task_Subject": "Non-Compete Agreements",
"Task_Start_Date": "2015-03-12T00:00:00",
"Task_Due_Date": "2015-03-14T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 1,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 47,
"Task_Assigned_Employee_ID": 1,
"Task_Owner_ID": 2,
"Task_Subject": "Update NDA Agreement",
"Task_Start_Date": "2015-03-14T00:00:00",
"Task_Due_Date": "2015-03-16T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 48,
"Task_Assigned_Employee_ID": 5,
"Task_Owner_ID": 2,
"Task_Subject": "Update Employee Files with New NDA",
"Task_Start_Date": "2015-03-16T00:00:00",
"Task_Due_Date": "2015-03-26T00:00:00",
"Task_Status": "Need Assistance",
"Task_Priority": 2,
"Task_Completion": 90,
"Task_Parent_ID": 5
}, {
"Task_ID": 49,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 5,
"Task_Subject": "Sign Updated NDA",
"Task_Start_Date": "2015-03-20T00:00:00",
"Task_Due_Date": "2015-03-25T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 50,
"Task_Assigned_Employee_ID": 7,
"Task_Owner_ID": 5,
"Task_Subject": "Sign Updated NDA",
"Task_Start_Date": "2015-03-20T00:00:00",
"Task_Due_Date": "2015-03-25T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 51,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 5,
"Task_Subject": "Sign Updated NDA",
"Task_Start_Date": "2015-03-20T00:00:00",
"Task_Due_Date": "2015-03-25T00:00:00",
"Task_Status": "Need Assistance",
"Task_Priority": 3,
"Task_Completion": 25,
"Task_Parent_ID": 5
}, {
"Task_ID": 52,
"Task_Assigned_Employee_ID": 9,
"Task_Owner_ID": 5,
"Task_Subject": "Sign Updated NDA",
"Task_Start_Date": "2015-03-20T00:00:00",
"Task_Due_Date": "2015-03-25T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 53,
"Task_Assigned_Employee_ID": 17,
"Task_Owner_ID": 9,
"Task_Subject": "Submit Questions Regarding New NDA",
"Task_Start_Date": "2015-03-21T00:00:00",
"Task_Due_Date": "2015-03-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 54,
"Task_Assigned_Employee_ID": 18,
"Task_Owner_ID": 9,
"Task_Subject": "Submit Questions Regarding New NDA",
"Task_Start_Date": "2015-03-21T00:00:00",
"Task_Due_Date": "2015-03-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 55,
"Task_Assigned_Employee_ID": 19,
"Task_Owner_ID": 9,
"Task_Subject": "Submit Questions Regarding New NDA",
"Task_Start_Date": "2015-03-21T00:00:00",
"Task_Due_Date": "2015-03-24T00:00:00",
"Task_Status": "Need Assistance",
"Task_Priority": 4,
"Task_Completion": 25,
"Task_Parent_ID": 5
}, {
"Task_ID": 56,
"Task_Assigned_Employee_ID": 14,
"Task_Owner_ID": 10,
"Task_Subject": "Submit Signed NDA",
"Task_Start_Date": "2015-03-22T00:00:00",
"Task_Due_Date": "2015-03-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 57,
"Task_Assigned_Employee_ID": 13,
"Task_Owner_ID": 10,
"Task_Subject": "Submit Signed NDA",
"Task_Start_Date": "2015-03-22T00:00:00",
"Task_Due_Date": "2015-03-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 58,
"Task_Assigned_Employee_ID": 15,
"Task_Owner_ID": 10,
"Task_Subject": "Submit Signed NDA",
"Task_Start_Date": "2015-03-22T00:00:00",
"Task_Due_Date": "2015-03-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 59,
"Task_Assigned_Employee_ID": 16,
"Task_Owner_ID": 10,
"Task_Subject": "Submit Signed NDA",
"Task_Start_Date": "2015-03-22T00:00:00",
"Task_Due_Date": "2015-03-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 5
}, {
"Task_ID": 60,
"Task_Assigned_Employee_ID": 7,
"Task_Owner_ID": 1,
"Task_Subject": "Update Revenue Projections",
"Task_Start_Date": "2015-03-24T00:00:00",
"Task_Due_Date": "2015-04-07T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 6
}, {
"Task_ID": 61,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 7,
"Task_Subject": "Review Revenue Projections",
"Task_Start_Date": "2015-03-25T00:00:00",
"Task_Due_Date": "2015-04-06T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 6
}, {
"Task_ID": 62,
"Task_Assigned_Employee_ID": 41,
"Task_Owner_ID": 7,
"Task_Subject": "Comment on Revenue Projections",
"Task_Start_Date": "2015-03-25T00:00:00",
"Task_Due_Date": "2015-04-03T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 6
}, {
"Task_ID": 63,
"Task_Assigned_Employee_ID": 42,
"Task_Owner_ID": 7,
"Task_Subject": "Comment on Revenue Projections",
"Task_Start_Date": "2015-03-25T00:00:00",
"Task_Due_Date": "2015-04-03T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 6
}, {
"Task_ID": 64,
"Task_Assigned_Employee_ID": 45,
"Task_Owner_ID": 7,
"Task_Subject": "Comment on Revenue Projections",
"Task_Start_Date": "2015-03-25T00:00:00",
"Task_Due_Date": "2015-04-03T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 3,
"Task_Completion": 25,
"Task_Parent_ID": 6
}, {
"Task_ID": 65,
"Task_Assigned_Employee_ID": 5,
"Task_Owner_ID": 11,
"Task_Subject": "Provide New Health Insurance Docs",
"Task_Start_Date": "2015-03-28T00:00:00",
"Task_Due_Date": "2015-04-07T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 2
}, {
"Task_ID": 66,
"Task_Assigned_Employee_ID": 10,
"Task_Owner_ID": 11,
"Task_Subject": "Review Changes to Health Insurance Coverage",
"Task_Start_Date": "2015-04-07T00:00:00",
"Task_Due_Date": "2015-04-30T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 2
}, {
"Task_ID": 67,
"Task_Assigned_Employee_ID": 14,
"Task_Owner_ID": 10,
"Task_Subject": "Scan Health Insurance Forms",
"Task_Start_Date": "2015-04-15T00:00:00",
"Task_Due_Date": "2015-04-20T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 2
}, {
"Task_ID": 68,
"Task_Assigned_Employee_ID": 15,
"Task_Owner_ID": 14,
"Task_Subject": "Sign Health Insurance Forms",
"Task_Start_Date": "2015-04-16T00:00:00",
"Task_Due_Date": "2015-04-19T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 2
}, {
"Task_ID": 69,
"Task_Assigned_Employee_ID": 13,
"Task_Owner_ID": 14,
"Task_Subject": "Sign Health Insurance Forms",
"Task_Start_Date": "2015-04-16T00:00:00",
"Task_Due_Date": "2015-04-19T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 2
}, {
"Task_ID": 70,
"Task_Assigned_Employee_ID": 16,
"Task_Owner_ID": 14,
"Task_Subject": "Sign Health Insurance Forms",
"Task_Start_Date": "2015-04-16T00:00:00",
"Task_Due_Date": "2015-04-19T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 2
}, {
"Task_ID": 71,
"Task_Assigned_Employee_ID": 18,
"Task_Owner_ID": 9,
"Task_Subject": "Follow up with West Coast Stores",
"Task_Start_Date": "2015-04-18T00:00:00",
"Task_Due_Date": "2016-02-04T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 3,
"Task_Completion": 95,
"Task_Parent_ID": 7
}, {
"Task_ID": 72,
"Task_Assigned_Employee_ID": 17,
"Task_Owner_ID": 9,
"Task_Subject": "Follow up with East Coast Stores",
"Task_Start_Date": "2015-04-18T00:00:00",
"Task_Due_Date": "2016-01-04T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 3,
"Task_Completion": 85,
"Task_Parent_ID": 7
}, {
"Task_ID": 73,
"Task_Assigned_Employee_ID": 19,
"Task_Owner_ID": 9,
"Task_Subject": "Send Email to Customers about Recall",
"Task_Start_Date": "2015-04-18T00:00:00",
"Task_Due_Date": "2015-04-30T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 7
}, {
"Task_ID": 74,
"Task_Assigned_Employee_ID": 9,
"Task_Owner_ID": 7,
"Task_Subject": "Submit Refund Report for 2015 Recall",
"Task_Start_Date": "2015-04-25T00:00:00",
"Task_Due_Date": "2015-05-05T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 7
}, {
"Task_ID": 75,
"Task_Assigned_Employee_ID": 2,
"Task_Owner_ID": 7,
"Task_Subject": "Give Final Approval for Refunds",
"Task_Start_Date": "2015-05-05T00:00:00",
"Task_Due_Date": "2015-05-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 7
}, {
"Task_ID": 76,
"Task_Assigned_Employee_ID": 32,
"Task_Owner_ID": 3,
"Task_Subject": "Prepare Product Recall Report",
"Task_Start_Date": "2015-05-10T00:00:00",
"Task_Due_Date": "2015-05-16T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 7
}, {
"Task_ID": 77,
"Task_Assigned_Employee_ID": 1,
"Task_Owner_ID": 3,
"Task_Subject": "Review Product Recall Report by Engineering Team",
"Task_Start_Date": "2015-05-17T00:00:00",
"Task_Due_Date": "2015-05-20T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 7
}, {
"Task_ID": 78,
"Task_Assigned_Employee_ID": 31,
"Task_Owner_ID": 32,
"Task_Subject": "Create Training Course for New TVs",
"Task_Start_Date": "2015-05-29T00:00:00",
"Task_Due_Date": "2015-06-29T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 4
}, {
"Task_ID": 79,
"Task_Assigned_Employee_ID": 33,
"Task_Owner_ID": 31,
"Task_Subject": "Review Training Course for any Omissions",
"Task_Start_Date": "2015-06-01T00:00:00",
"Task_Due_Date": "2015-06-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 4
}, {
"Task_ID": 80,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 5,
"Task_Subject": "Review Overtime Report",
"Task_Start_Date": "2015-06-10T00:00:00",
"Task_Due_Date": "2015-06-14T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 8
}, {
"Task_ID": 81,
"Task_Assigned_Employee_ID": 21,
"Task_Owner_ID": 6,
"Task_Subject": "Submit Overtime Request Forms",
"Task_Start_Date": "2015-06-11T00:00:00",
"Task_Due_Date": "2015-06-12T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 8
}, {
"Task_ID": 82,
"Task_Assigned_Employee_ID": 22,
"Task_Owner_ID": 6,
"Task_Subject": "Submit Overtime Request Forms",
"Task_Start_Date": "2015-06-11T00:00:00",
"Task_Due_Date": "2015-06-12T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 8
}, {
"Task_ID": 83,
"Task_Assigned_Employee_ID": 23,
"Task_Owner_ID": 6,
"Task_Subject": "Submit Overtime Request Forms",
"Task_Start_Date": "2015-06-11T00:00:00",
"Task_Due_Date": "2015-06-12T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 8
}, {
"Task_ID": 84,
"Task_Assigned_Employee_ID": 2,
"Task_Owner_ID": 6,
"Task_Subject": "Overtime Approval Guidelines",
"Task_Start_Date": "2015-06-15T00:00:00",
"Task_Due_Date": "2015-06-20T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 8
}, {
"Task_ID": 85,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 12,
"Task_Subject": "Refund Request Template",
"Task_Start_Date": "2015-06-17T00:00:00",
"Task_Due_Date": "2016-04-01T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 9
}, {
"Task_ID": 86,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 12,
"Task_Subject": "Recall Rebate Form",
"Task_Start_Date": "2015-06-17T00:00:00",
"Task_Due_Date": "2016-04-01T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 9
}, {
"Task_ID": 87,
"Task_Assigned_Employee_ID": 12,
"Task_Owner_ID": 30,
"Task_Subject": "Create Report on Customer Feedback",
"Task_Start_Date": "2015-06-20T00:00:00",
"Task_Due_Date": "2015-06-30T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 9
}, {
"Task_ID": 88,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 30,
"Task_Subject": "Review Customer Feedback Report",
"Task_Start_Date": "2015-06-30T00:00:00",
"Task_Due_Date": "2015-07-03T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 9
}, {
"Task_ID": 89,
"Task_Assigned_Employee_ID": 1,
"Task_Owner_ID": 8,
"Task_Subject": "Customer Feedback Report Analysis",
"Task_Start_Date": "2015-07-05T00:00:00",
"Task_Due_Date": "2016-04-09T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 9
}, {
"Task_ID": 90,
"Task_Assigned_Employee_ID": 10,
"Task_Owner_ID": 8,
"Task_Subject": "Prepare Shipping Cost Analysis Report",
"Task_Start_Date": "2015-07-10T00:00:00",
"Task_Due_Date": "2015-07-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 10
}, {
"Task_ID": 91,
"Task_Assigned_Employee_ID": 13,
"Task_Owner_ID": 10,
"Task_Subject": "Provide Feedback on Shippers",
"Task_Start_Date": "2015-07-11T00:00:00",
"Task_Due_Date": "2015-07-14T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 10
}, {
"Task_ID": 92,
"Task_Assigned_Employee_ID": 15,
"Task_Owner_ID": 10,
"Task_Subject": "Provide Feedback on Shippers",
"Task_Start_Date": "2015-07-11T00:00:00",
"Task_Due_Date": "2015-07-14T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 10
}, {
"Task_ID": 93,
"Task_Assigned_Employee_ID": 16,
"Task_Owner_ID": 10,
"Task_Subject": "Provide Feedback on Shippers",
"Task_Start_Date": "2015-07-11T00:00:00",
"Task_Due_Date": "2015-07-14T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 10
}, {
"Task_ID": 94,
"Task_Assigned_Employee_ID": 2,
"Task_Owner_ID": 10,
"Task_Subject": "Select Preferred Shipper",
"Task_Start_Date": "2015-07-16T00:00:00",
"Task_Due_Date": "2015-07-20T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 10
}, {
"Task_ID": 95,
"Task_Assigned_Employee_ID": 1,
"Task_Owner_ID": 2,
"Task_Subject": "Complete Shipper Selection Form",
"Task_Start_Date": "2015-07-21T00:00:00",
"Task_Due_Date": "2016-04-11T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 4,
"Task_Completion": 0,
"Task_Parent_ID": 10
}, {
"Task_ID": 96,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 22,
"Task_Subject": "Upgrade Server Hardware",
"Task_Start_Date": "2015-07-22T00:00:00",
"Task_Due_Date": "2015-07-31T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 11
}, {
"Task_ID": 97,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 21,
"Task_Subject": "Upgrade Personal Computers",
"Task_Start_Date": "2015-07-24T00:00:00",
"Task_Due_Date": "2016-04-30T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 85,
"Task_Parent_ID": 11
}, {
"Task_ID": 98,
"Task_Assigned_Employee_ID": 2,
"Task_Owner_ID": 6,
"Task_Subject": "Approve Personal Computer Upgrade Plan",
"Task_Start_Date": "2015-07-24T00:00:00",
"Task_Due_Date": "2015-07-31T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 11
}, {
"Task_ID": 99,
"Task_Assigned_Employee_ID": 3,
"Task_Owner_ID": 6,
"Task_Subject": "Decide on Mobile Devices to Use in the Field",
"Task_Start_Date": "2015-07-30T00:00:00",
"Task_Due_Date": "2015-08-02T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 11
}, {
"Task_ID": 100,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 24,
"Task_Subject": "Upgrade Apps to Windows RT or stay with WinForms",
"Task_Start_Date": "2015-08-01T00:00:00",
"Task_Due_Date": "2015-08-05T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 12
}, {
"Task_ID": 101,
"Task_Assigned_Employee_ID": 25,
"Task_Owner_ID": 24,
"Task_Subject": "Estimate Time Required to Touch-Enable Apps",
"Task_Start_Date": "2015-08-05T00:00:00",
"Task_Due_Date": "2015-08-07T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 12
}, {
"Task_ID": 102,
"Task_Assigned_Employee_ID": 23,
"Task_Owner_ID": 6,
"Task_Subject": "Report on Tranistion to Touch-Based Apps",
"Task_Start_Date": "2015-08-10T00:00:00",
"Task_Due_Date": "2015-08-11T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 12
}, {
"Task_ID": 103,
"Task_Assigned_Employee_ID": 3,
"Task_Owner_ID": 6,
"Task_Subject": "Try New Touch-Enabled WinForms Apps",
"Task_Start_Date": "2015-08-11T00:00:00",
"Task_Due_Date": "2015-08-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 12
}, {
"Task_ID": 104,
"Task_Assigned_Employee_ID": 24,
"Task_Owner_ID": 6,
"Task_Subject": "Rollout New Touch-Enabled WinForms Apps",
"Task_Start_Date": "2015-08-17T00:00:00",
"Task_Due_Date": "2016-04-30T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 75,
"Task_Parent_ID": 12
}, {
"Task_ID": 105,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 3,
"Task_Subject": "Site Up-Time Report",
"Task_Start_Date": "2015-08-20T00:00:00",
"Task_Due_Date": "2015-08-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 13
}, {
"Task_ID": 106,
"Task_Assigned_Employee_ID": 4,
"Task_Owner_ID": 3,
"Task_Subject": "Review Site Up-Time Report",
"Task_Start_Date": "2015-08-24T00:00:00",
"Task_Due_Date": "2015-08-30T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 13
}, {
"Task_ID": 107,
"Task_Assigned_Employee_ID": 1,
"Task_Owner_ID": 4,
"Task_Subject": "Review Online Sales Report",
"Task_Start_Date": "2015-08-30T00:00:00",
"Task_Due_Date": "2015-09-04T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 13
}, {
"Task_ID": 108,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 4,
"Task_Subject": "Determine New Online Marketing Strategy",
"Task_Start_Date": "2015-09-03T00:00:00",
"Task_Due_Date": "2015-09-10T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 13
}, {
"Task_ID": 109,
"Task_Assigned_Employee_ID": 42,
"Task_Owner_ID": 8,
"Task_Subject": "New Online Marketing Strategy",
"Task_Start_Date": "2015-09-05T00:00:00",
"Task_Due_Date": "2015-09-11T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 13
}, {
"Task_ID": 110,
"Task_Assigned_Employee_ID": 4,
"Task_Owner_ID": 8,
"Task_Subject": "Approve New Online Marketing Strategy",
"Task_Start_Date": "2015-09-15T00:00:00",
"Task_Due_Date": "2015-09-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 13
}, {
"Task_ID": 111,
"Task_Assigned_Employee_ID": 28,
"Task_Owner_ID": 8,
"Task_Subject": "Submit New Website Design",
"Task_Start_Date": "2015-09-17T00:00:00",
"Task_Due_Date": "2015-09-22T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 14
}, {
"Task_ID": 112,
"Task_Assigned_Employee_ID": 29,
"Task_Owner_ID": 28,
"Task_Subject": "Create Icons for Website",
"Task_Start_Date": "2015-09-17T00:00:00",
"Task_Due_Date": "2015-09-21T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 111
}, {
"Task_ID": 113,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 28,
"Task_Subject": "Review PSDs for New Website",
"Task_Start_Date": "2015-09-23T00:00:00",
"Task_Due_Date": "2015-10-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 111
}, {
"Task_ID": 114,
"Task_Assigned_Employee_ID": 24,
"Task_Owner_ID": 6,
"Task_Subject": "Create New Shopping Cart",
"Task_Start_Date": "2015-09-24T00:00:00",
"Task_Due_Date": "2015-10-01T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 113
}, {
"Task_ID": 115,
"Task_Assigned_Employee_ID": 25,
"Task_Owner_ID": 6,
"Task_Subject": "Create New Product Pages",
"Task_Start_Date": "2015-09-24T00:00:00",
"Task_Due_Date": "2015-10-04T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 113
}, {
"Task_ID": 116,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 6,
"Task_Subject": "Review New Product Pages",
"Task_Start_Date": "2015-10-04T00:00:00",
"Task_Due_Date": "2015-10-10T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 113
}, {
"Task_ID": 117,
"Task_Assigned_Employee_ID": 4,
"Task_Owner_ID": 8,
"Task_Subject": "Approve Website Launch",
"Task_Start_Date": "2015-10-10T00:00:00",
"Task_Due_Date": "2015-10-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 113
}, {
"Task_ID": 118,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 8,
"Task_Subject": "Launch New Website",
"Task_Start_Date": "2015-10-15T00:00:00",
"Task_Due_Date": "2015-10-16T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 111
}, {
"Task_ID": 119,
"Task_Assigned_Employee_ID": 14,
"Task_Owner_ID": 10,
"Task_Subject": "Update Customer Shipping Profiles",
"Task_Start_Date": "2015-10-20T00:00:00",
"Task_Due_Date": "2015-10-22T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 14
}, {
"Task_ID": 120,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 10,
"Task_Subject": "Create New Shipping Return Labels",
"Task_Start_Date": "2015-10-21T00:00:00",
"Task_Due_Date": "2015-10-30T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 119
}, {
"Task_ID": 121,
"Task_Assigned_Employee_ID": 23,
"Task_Owner_ID": 6,
"Task_Subject": "Get Design for Shipping Return Labels",
"Task_Start_Date": "2015-10-21T00:00:00",
"Task_Due_Date": "2015-10-30T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 119
}, {
"Task_ID": 122,
"Task_Assigned_Employee_ID": 29,
"Task_Owner_ID": 23,
"Task_Subject": "PSD needed for Shipping Return Labels",
"Task_Start_Date": "2015-10-22T00:00:00",
"Task_Due_Date": "2015-10-27T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 119
}, {
"Task_ID": 123,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 22,
"Task_Subject": "Request Bandwidth Increase from ISP",
"Task_Start_Date": "2015-11-01T00:00:00",
"Task_Due_Date": "2015-11-05T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 15
}, {
"Task_ID": 124,
"Task_Assigned_Employee_ID": 7,
"Task_Owner_ID": 6,
"Task_Subject": "Submit D&B Number to ISP for Credit Approval",
"Task_Start_Date": "2015-11-04T00:00:00",
"Task_Due_Date": "2015-11-07T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 15
}, {
"Task_ID": 125,
"Task_Assigned_Employee_ID": 2,
"Task_Owner_ID": 7,
"Task_Subject": "Contact ISP and Discuss Payment Options",
"Task_Start_Date": "2015-11-05T00:00:00",
"Task_Due_Date": "2015-11-06T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 15
}, {
"Task_ID": 126,
"Task_Assigned_Employee_ID": 18,
"Task_Owner_ID": 9,
"Task_Subject": "Prepare Year-End Support Summary Report",
"Task_Start_Date": "2015-11-10T00:00:00",
"Task_Due_Date": "2015-11-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 16
}, {
"Task_ID": 127,
"Task_Assigned_Employee_ID": 19,
"Task_Owner_ID": 18,
"Task_Subject": "Analyze Support Traffic for 2015",
"Task_Start_Date": "2015-11-11T00:00:00",
"Task_Due_Date": "2015-11-14T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 16
}, {
"Task_ID": 128,
"Task_Assigned_Employee_ID": 33,
"Task_Owner_ID": 31,
"Task_Subject": "Review New Training Material",
"Task_Start_Date": "2015-11-14T00:00:00",
"Task_Due_Date": "2015-11-18T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 17
}, {
"Task_ID": 129,
"Task_Assigned_Employee_ID": 31,
"Task_Owner_ID": 33,
"Task_Subject": "Distribute Training Material to Support Staff",
"Task_Start_Date": "2015-11-18T00:00:00",
"Task_Due_Date": "2015-11-30T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 17
}, {
"Task_ID": 130,
"Task_Assigned_Employee_ID": 9,
"Task_Owner_ID": 31,
"Task_Subject": "Training Material Distribution Schedule",
"Task_Start_Date": "2015-11-30T00:00:00",
"Task_Due_Date": "2015-12-02T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 17
}, {
"Task_ID": 131,
"Task_Assigned_Employee_ID": 28,
"Task_Owner_ID": 9,
"Task_Subject": "Provide New Artwork to Support Team",
"Task_Start_Date": "2015-12-03T00:00:00",
"Task_Due_Date": "2015-12-04T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 17
}, {
"Task_ID": 132,
"Task_Assigned_Employee_ID": 29,
"Task_Owner_ID": 28,
"Task_Subject": "Publish New Art on the Server",
"Task_Start_Date": "2015-12-03T00:00:00",
"Task_Due_Date": "2015-12-04T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 131
}, {
"Task_ID": 133,
"Task_Assigned_Employee_ID": 12,
"Task_Owner_ID": 8,
"Task_Subject": "Replace Old Artwork with New Artwork",
"Task_Start_Date": "2015-12-07T00:00:00",
"Task_Due_Date": "2015-12-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 131
}, {
"Task_ID": 134,
"Task_Assigned_Employee_ID": 20,
"Task_Owner_ID": 8,
"Task_Subject": "Replace Old Artwork with New Artwork",
"Task_Start_Date": "2015-12-07T00:00:00",
"Task_Due_Date": "2015-12-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 131
}, {
"Task_ID": 135,
"Task_Assigned_Employee_ID": 40,
"Task_Owner_ID": 8,
"Task_Subject": "Replace Old Artwork with New Artwork",
"Task_Start_Date": "2015-12-07T00:00:00",
"Task_Due_Date": "2015-12-15T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 131
}, {
"Task_ID": 136,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 45,
"Task_Subject": "Ship New Brochures to Field",
"Task_Start_Date": "2015-12-19T00:00:00",
"Task_Due_Date": "2015-12-31T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 17
}, {
"Task_ID": 137,
"Task_Assigned_Employee_ID": 14,
"Task_Owner_ID": 8,
"Task_Subject": "Ship Brochures to Todd Hoffman",
"Task_Start_Date": "2015-12-23T00:00:00",
"Task_Due_Date": "2015-12-31T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 17
}, {
"Task_ID": 138,
"Task_Assigned_Employee_ID": 22,
"Task_Owner_ID": 3,
"Task_Subject": "Update Server with Service Packs",
"Task_Start_Date": "2015-12-24T00:00:00",
"Task_Due_Date": "2015-12-24T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 3,
"Task_Completion": 100,
"Task_Parent_ID": 18
}, {
"Task_ID": 139,
"Task_Assigned_Employee_ID": 22,
"Task_Owner_ID": 6,
"Task_Subject": "Install New Database",
"Task_Start_Date": "2015-12-27T00:00:00",
"Task_Due_Date": "2015-12-28T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 18
}, {
"Task_ID": 140,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 22,
"Task_Subject": "Approve Overtime for HR",
"Task_Start_Date": "2015-12-29T00:00:00",
"Task_Due_Date": "2015-12-29T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 18
}, {
"Task_ID": 141,
"Task_Assigned_Employee_ID": 32,
"Task_Owner_ID": 3,
"Task_Subject": "Review New HDMI Specification",
"Task_Start_Date": "2016-01-02T00:00:00",
"Task_Due_Date": "2016-01-31T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 2,
"Task_Completion": 50,
"Task_Parent_ID": 19
}, {
"Task_ID": 142,
"Task_Assigned_Employee_ID": 3,
"Task_Owner_ID": 32,
"Task_Subject": "Approval on Converting to New HDMI Specification",
"Task_Start_Date": "2016-01-11T00:00:00",
"Task_Due_Date": "2016-01-31T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 2,
"Task_Completion": 75,
"Task_Parent_ID": 19
}, {
"Task_ID": 143,
"Task_Assigned_Employee_ID": 24,
"Task_Owner_ID": 3,
"Task_Subject": "Create New Spike for Automation Server",
"Task_Start_Date": "2016-01-15T00:00:00",
"Task_Due_Date": "2016-01-27T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 20
}, {
"Task_ID": 144,
"Task_Assigned_Employee_ID": 41,
"Task_Owner_ID": 8,
"Task_Subject": "Report on Retail Sales Strategy for 2016",
"Task_Start_Date": "2016-01-20T00:00:00",
"Task_Due_Date": "2016-01-31T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 21
}, {
"Task_ID": 145,
"Task_Assigned_Employee_ID": 25,
"Task_Owner_ID": 3,
"Task_Subject": "Code Review - New Automation Server",
"Task_Start_Date": "2016-01-27T00:00:00",
"Task_Due_Date": "2016-02-15T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 75,
"Task_Parent_ID": 20
}, {
"Task_ID": 146,
"Task_Assigned_Employee_ID": 17,
"Task_Owner_ID": 31,
"Task_Subject": "Feedback on New Training Course",
"Task_Start_Date": "2016-01-28T00:00:00",
"Task_Due_Date": "2016-02-05T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 17
}, {
"Task_ID": 147,
"Task_Assigned_Employee_ID": 10,
"Task_Owner_ID": 7,
"Task_Subject": "Send Monthly Invoices from Shippers",
"Task_Start_Date": "2016-02-01T00:00:00",
"Task_Due_Date": "2016-02-07T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 10
}, {
"Task_ID": 148,
"Task_Assigned_Employee_ID": 40,
"Task_Owner_ID": 39,
"Task_Subject": "Schedule Meeting with Sales Team",
"Task_Start_Date": "2016-02-07T00:00:00",
"Task_Due_Date": "2016-02-09T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 21
}, {
"Task_ID": 149,
"Task_Assigned_Employee_ID": 42,
"Task_Owner_ID": 40,
"Task_Subject": "Confirm Availability for Sales Meeting",
"Task_Start_Date": "2016-02-09T00:00:00",
"Task_Due_Date": "2016-02-09T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 21
}, {
"Task_ID": 150,
"Task_Assigned_Employee_ID": 39,
"Task_Owner_ID": 40,
"Task_Subject": "Reschedule Sales Team Meeting",
"Task_Start_Date": "2016-02-10T00:00:00",
"Task_Due_Date": "2016-02-10T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 21
}, {
"Task_ID": 151,
"Task_Assigned_Employee_ID": 45,
"Task_Owner_ID": 44,
"Task_Subject": "Update Database with New Leads",
"Task_Start_Date": "2016-03-01T00:00:00",
"Task_Due_Date": "2016-03-10T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 80,
"Task_Parent_ID": 18
}, {
"Task_ID": 152,
"Task_Assigned_Employee_ID": 12,
"Task_Owner_ID": 41,
"Task_Subject": "Send Territory Sales Breakdown",
"Task_Start_Date": "2016-03-13T00:00:00",
"Task_Due_Date": "2016-03-16T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 50,
"Task_Parent_ID": 22
}, {
"Task_ID": 153,
"Task_Assigned_Employee_ID": 41,
"Task_Owner_ID": 1,
"Task_Subject": "Territory Sales Breakdown Report",
"Task_Start_Date": "2016-03-17T00:00:00",
"Task_Due_Date": "2016-03-17T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 3,
"Task_Completion": 50,
"Task_Parent_ID": 22
}, {
"Task_ID": 154,
"Task_Assigned_Employee_ID": 3,
"Task_Owner_ID": 1,
"Task_Subject": "Return Merchandise Report",
"Task_Start_Date": "2016-03-17T00:00:00",
"Task_Due_Date": "2016-03-18T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 25,
"Task_Parent_ID": 22
}, {
"Task_ID": 155,
"Task_Assigned_Employee_ID": 32,
"Task_Owner_ID": 3,
"Task_Subject": "Report on the State of Engineering Dept",
"Task_Start_Date": "2016-03-18T00:00:00",
"Task_Due_Date": "2016-03-19T00:00:00",
"Task_Status": "Not Started",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 22
}, {
"Task_ID": 156,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 5,
"Task_Subject": "Staff Productivity Report",
"Task_Start_Date": "2016-03-20T00:00:00",
"Task_Due_Date": "2016-03-21T00:00:00",
"Task_Status": "Not Started",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 23
}, {
"Task_ID": 157,
"Task_Assigned_Employee_ID": 5,
"Task_Owner_ID": 1,
"Task_Subject": "Review HR Budget Company Wide",
"Task_Start_Date": "2016-03-20T00:00:00",
"Task_Due_Date": "2016-03-25T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 40,
"Task_Parent_ID": 23
}, {
"Task_ID": 158,
"Task_Assigned_Employee_ID": 8,
"Task_Owner_ID": 5,
"Task_Subject": "Sales Dept Budget Request Report",
"Task_Start_Date": "2016-03-23T00:00:00",
"Task_Due_Date": "2016-03-25T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 75,
"Task_Parent_ID": 23
}, {
"Task_ID": 159,
"Task_Assigned_Employee_ID": 9,
"Task_Owner_ID": 5,
"Task_Subject": "Support Dept Budget Report",
"Task_Start_Date": "2016-03-23T00:00:00",
"Task_Due_Date": "2016-03-25T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 60,
"Task_Parent_ID": 23
}, {
"Task_ID": 160,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 5,
"Task_Subject": "IT Dept Budget Request Report",
"Task_Start_Date": "2016-03-23T00:00:00",
"Task_Due_Date": "2016-03-25T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 30,
"Task_Parent_ID": 23
}, {
"Task_ID": 161,
"Task_Assigned_Employee_ID": 32,
"Task_Owner_ID": 5,
"Task_Subject": "Engineering Dept Budget Request Report",
"Task_Start_Date": "2016-03-23T00:00:00",
"Task_Due_Date": "2016-03-25T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 4,
"Task_Completion": 0,
"Task_Parent_ID": 23
}, {
"Task_ID": 162,
"Task_Assigned_Employee_ID": 26,
"Task_Owner_ID": 7,
"Task_Subject": "1Q Travel Spend Report",
"Task_Start_Date": "2016-03-24T00:00:00",
"Task_Due_Date": "2016-03-25T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 30,
"Task_Parent_ID": 23
}, {
"Task_ID": 163,
"Task_Assigned_Employee_ID": 7,
"Task_Owner_ID": 27,
"Task_Subject": "Approve Benefits Upgrade Package",
"Task_Start_Date": "2016-03-26T00:00:00",
"Task_Due_Date": "2016-03-27T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 23
}, {
"Task_ID": 164,
"Task_Assigned_Employee_ID": 5,
"Task_Owner_ID": 7,
"Task_Subject": "Final Budget Review",
"Task_Start_Date": "2016-03-26T00:00:00",
"Task_Due_Date": "2016-03-27T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 25,
"Task_Parent_ID": 23
}, {
"Task_ID": 165,
"Task_Assigned_Employee_ID": 2,
"Task_Owner_ID": 1,
"Task_Subject": "State of Operations Report",
"Task_Start_Date": "2016-03-28T00:00:00",
"Task_Due_Date": "2016-03-31T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 45,
"Task_Parent_ID": 22
}, {
"Task_ID": 166,
"Task_Assigned_Employee_ID": 42,
"Task_Owner_ID": 2,
"Task_Subject": "Online Sales Report",
"Task_Start_Date": "2016-03-29T00:00:00",
"Task_Due_Date": "2016-03-30T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 55,
"Task_Parent_ID": 22
}, {
"Task_ID": 167,
"Task_Assigned_Employee_ID": 13,
"Task_Owner_ID": 10,
"Task_Subject": "Reprint All Shipping Labels",
"Task_Start_Date": "2016-04-01T00:00:00",
"Task_Due_Date": "2016-04-10T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 10,
"Task_Parent_ID": 24
}, {
"Task_ID": 168,
"Task_Assigned_Employee_ID": 28,
"Task_Owner_ID": 13,
"Task_Subject": "Shipping Label Artwork",
"Task_Start_Date": "2016-04-02T00:00:00",
"Task_Due_Date": "2016-04-09T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 40,
"Task_Parent_ID": 24
}, {
"Task_ID": 169,
"Task_Assigned_Employee_ID": 13,
"Task_Owner_ID": 29,
"Task_Subject": "Specs for New Shipping Label",
"Task_Start_Date": "2016-04-04T00:00:00",
"Task_Due_Date": "2016-04-05T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 2,
"Task_Completion": 100,
"Task_Parent_ID": 24
}, {
"Task_ID": 170,
"Task_Assigned_Employee_ID": 15,
"Task_Owner_ID": 10,
"Task_Subject": "Move Packaging Materials to New Warehouse",
"Task_Start_Date": "2016-04-05T00:00:00",
"Task_Due_Date": "2016-04-15T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 60,
"Task_Parent_ID": 25
}, {
"Task_ID": 171,
"Task_Assigned_Employee_ID": 16,
"Task_Owner_ID": 10,
"Task_Subject": "Move Inventory to New Warehouse",
"Task_Start_Date": "2016-04-05T00:00:00",
"Task_Due_Date": "2016-04-15T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 70,
"Task_Parent_ID": 25
}, {
"Task_ID": 172,
"Task_Assigned_Employee_ID": 14,
"Task_Owner_ID": 10,
"Task_Subject": "Take Forklift to Service Center",
"Task_Start_Date": "2016-04-07T00:00:00",
"Task_Due_Date": "2016-04-18T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 60,
"Task_Parent_ID": 26
}, {
"Task_ID": 173,
"Task_Assigned_Employee_ID": 10,
"Task_Owner_ID": 14,
"Task_Subject": "Approve Rental of Forklift",
"Task_Start_Date": "2016-04-08T00:00:00",
"Task_Due_Date": "2016-04-09T00:00:00",
"Task_Status": "Need Assistance",
"Task_Priority": 4,
"Task_Completion": 0,
"Task_Parent_ID": 26
}, {
"Task_ID": 174,
"Task_Assigned_Employee_ID": 7,
"Task_Owner_ID": 10,
"Task_Subject": "Give Final Approval to Rent Forklift",
"Task_Start_Date": "2016-04-08T00:00:00",
"Task_Due_Date": "2016-04-08T00:00:00",
"Task_Status": "Need Assistance",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 26
}, {
"Task_ID": 175,
"Task_Assigned_Employee_ID": 9,
"Task_Owner_ID": 30,
"Task_Subject": "Review Complaint Reports",
"Task_Start_Date": "2016-04-17T00:00:00",
"Task_Due_Date": "2016-04-30T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 4,
"Task_Completion": 40,
"Task_Parent_ID": 22
}, {
"Task_ID": 176,
"Task_Assigned_Employee_ID": 6,
"Task_Owner_ID": 9,
"Task_Subject": "Review Website Complaint Reports",
"Task_Start_Date": "2016-04-18T00:00:00",
"Task_Due_Date": "2016-04-24T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 65,
"Task_Parent_ID": 22
}, {
"Task_ID": 177,
"Task_Assigned_Employee_ID": 33,
"Task_Owner_ID": 37,
"Task_Subject": "Test New Automation App",
"Task_Start_Date": "2016-04-20T00:00:00",
"Task_Due_Date": "2016-04-30T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 80,
"Task_Parent_ID": 20
}, {
"Task_ID": 178,
"Task_Assigned_Employee_ID": 38,
"Task_Owner_ID": 33,
"Task_Subject": "Fix Synchronization Issues",
"Task_Start_Date": "2016-04-21T00:00:00",
"Task_Due_Date": "2016-04-21T00:00:00",
"Task_Status": "Completed",
"Task_Priority": 4,
"Task_Completion": 100,
"Task_Parent_ID": 20
}, {
"Task_ID": 179,
"Task_Assigned_Employee_ID": 22,
"Task_Owner_ID": 24,
"Task_Subject": "Free Up Space for New Application Set",
"Task_Start_Date": "2016-04-19T00:00:00",
"Task_Due_Date": "2016-04-19T00:00:00",
"Task_Status": "Not Started",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 20
}, {
"Task_ID": 180,
"Task_Assigned_Employee_ID": 9,
"Task_Owner_ID": 30,
"Task_Subject": "Support Team Evaluation Report",
"Task_Start_Date": "2016-05-01T00:00:00",
"Task_Due_Date": "2016-05-07T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 22
}, {
"Task_ID": 181,
"Task_Assigned_Employee_ID": 1,
"Task_Owner_ID": 30,
"Task_Subject": "Review New Customer Follow Up Plan",
"Task_Start_Date": "2016-05-05T00:00:00",
"Task_Due_Date": "2016-05-11T00:00:00",
"Task_Status": "In Progress",
"Task_Priority": 2,
"Task_Completion": 75,
"Task_Parent_ID": 27
}, {
"Task_ID": 182,
"Task_Assigned_Employee_ID": 2,
"Task_Owner_ID": 1,
"Task_Subject": "Submit Customer Follow Up Plan Feedback",
"Task_Start_Date": "2016-05-06T00:00:00",
"Task_Due_Date": "2016-05-10T00:00:00",
"Task_Status": "Deferred",
"Task_Priority": 2,
"Task_Completion": 0,
"Task_Parent_ID": 27
}];
@Injectable()
export class Service {
getTasks() {
return tasks;
}
}
// In real applications, you should not transpile code in the browser. You can see how to create your own application with Angular and DevExtreme here:
// https://js.devexpress.com/Documentation/Guide/Angular_Components/Getting_Started/Create_a_DevExtreme_Application/
System.config({
transpiler: 'ts',
typescriptOptions: {
module: "system",
emitDecoratorMetadata: true,
experimentalDecorators: true
},
meta: {
'typescript': {
"exports": "ts"
},
'devextreme/localization.js': {
"esModule": true
}
},
paths: {
'npm:': 'https://unpkg.com/'
},
map: {
'ts': 'npm:plugin-typescript@8.0.0/lib/plugin.js',
'typescript': 'npm:typescript@3.5.3/lib/typescript.js',
'@angular': 'npm:@angular',
'tslib': 'npm:tslib@2.1.0/tslib.js',
'rxjs': 'npm:rxjs@6.4.0',
'rrule': 'npm:rrule@2.6.6/dist/es5/rrule.js',
'luxon': 'npm:luxon@1.26.0/build/global/luxon.min.js',
'es6-object-assign': 'npm:es6-object-assign@1.1.0',
'devextreme': 'npm:devextreme@20.2.6',
'jszip': 'npm:jszip@3.6.0/dist/jszip.min.js',
'devextreme-quill': 'npm:devextreme-quill@0.10.3/dist/dx-quill.min.js',
'devexpress-diagram': 'npm:devexpress-diagram@2.0.18',
'devexpress-gantt': 'npm:devexpress-gantt@2.0.24',
'devextreme-angular': 'npm:devextreme-angular@20.2.6',
'preact': 'npm:preact@10.5.13/dist/preact.js',
'preact/hooks': 'npm:preact@10.5.13/hooks/dist/hooks.js'
},
packages: {
'app': {
main: './app.component.ts',
defaultExtension: 'ts'
},
'devextreme': {
defaultExtension: 'js'
},
'devextreme/events/utils': {
main: 'index'
},
'devextreme/events': {
main: 'index'
},
'es6-object-assign': {
main: './index.js',
defaultExtension: 'js'
}
},
packageConfigPaths: [
"npm:@angular/*/package.json",
"npm:@angular/common/*/package.json",
"npm:rxjs/package.json",
"npm:rxjs/operators/package.json",
"npm:devextreme-angular/*/package.json",
"npm:devextreme-angular/ui/*/package.json",
"npm:devextreme-angular/package.json",
"npm:devexpress-diagram/package.json",
"npm:devexpress-gantt/package.json",
]
});
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DevExtreme Demo</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/20.2.6/css/dx.common.css" />
<link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/20.2.6/css/dx.light.css" />
<script src="https://unpkg.com/core-js@2.4.1/client/shim.min.js"></script>
<script src="https://unpkg.com/zone.js@0.10.2/dist/zone.js"></script>
<script src="https://unpkg.com/reflect-metadata@0.1.3/Reflect.js"></script>
<script src="https://unpkg.com/systemjs@0.21.3/dist/system.js"></script>
<script src="config.js"></script>
<script>
System.import('app').catch(console.error.bind(console));
</script>
</head>
<body class="dx-viewport">
<div class="demo-container">
<demo-app>Loading...</demo-app>
</div>
</body>
</html>