import * as React from "react";
// import * as moment from "moment";

import {
  ListRecordsCriteria,
  FieldQuery,
  Sorting,
  Pagination,
  Record,
  RecordField
} from "src/Models";
import { CachingService, RecordService } from "src/Services";

import "./index.css";

import { DashboardCard, RecordsListView } from "src/Controls";
import { DateUtils } from "src/Utils";
// import {  LineShadow } from 'src/Controls/Charts';

import ChartComponent from "react-chartjs-2";
import BigCalendar from "react-big-calendar";
import { CalendarToolbar } from "src/Controls/CalendarToolbar/CalendarToolbar";
import "react-big-calendar/lib/css/react-big-calendar.css";
import { FormattedMessage } from "react-intl";
// import IntlMessages from 'src/Utils/IntlMessages';
// import { FormattedMessage } from 'react-intl';
import { ThemeColors } from "src/Utils/ThemeColors";
import { chartTooltip } from "src/Controls/Charts";
import { Panel, PanelType, IconButton, Breadcrumb } from "office-ui-fabric-react";
import { LoadingService } from "src/Services/LoadingService";
// import CountDown from "src/Controls/CountDown";

// import 'moment/local'
let moment = require("moment");

// require('globalize/lib/cultures/globalize.culture.en');

// let moment = require('moment.locale("ar_SA")');

const colors = ThemeColors();

const localizer = BigCalendar.momentLocalizer(moment);

const messagesEn = {
  allDay: "All day",
  previous: "<",
  next: ">",
  today: "Today",
  month: "Month",
  week: "Week",
  day: "Day",
  agenda: "Agenda",
  date: "Date",
  time: "Time",
  event: "Event",
  showMore: (total: any) => `+ Show more (${total})`
};

const messagesAr = {
  allDay: "طول اليوم",
  previous: "<",
  next: ">",
  today: "اليوم",
  month: "شهر",
  week: "اسبوع",
  day: "يوم",
  agenda: "اجندة",
  date: "تاريخ",
  time: "وقت",
  event: "حدث",
  showMore: (total: any) => `+ طول اليوم (${total})`
};
export class Dashboard extends React.Component<any, any> {
  private _recordService: RecordService = new RecordService();
  private _pageSize = 5;
  private _cachingService = new CachingService();
  private _loadingService = new LoadingService();
  private _notAuthenticated = false;
  private _loggedInUser: any = null;
  constructor(props: any) {
    super(props);

    this._notAuthenticated = !this._cachingService.read("Token") || this._cachingService.read("Token") == '';

    if (this._notAuthenticated)
      return;

    this._loggedInUser = this._cachingService.read("LoggedInUser")
    debugger;
    this._loadingService.show();

    let cachingService: CachingService = new CachingService();
    let dateUtil: DateUtils = new DateUtils();

    let criteria: ListRecordsCriteria = new ListRecordsCriteria();
    let chartsCeriteria: ListRecordsCriteria = new ListRecordsCriteria();
    criteria.asLookup = false;
    criteria.entityId = 14;
    criteria.query = new Array<FieldQuery>();
    criteria.sorting = new Sorting();
    criteria.sorting.fieldId = 190;
    criteria.sorting.direction = 1;
    let dashboardFieldQuery = new FieldQuery();
    dashboardFieldQuery.fieldId = 159;
    dashboardFieldQuery.value = dateUtil.formatToServerDateTime(new Date());
    dashboardFieldQuery.queryOperator = 3;

    criteria.query.push(dashboardFieldQuery);
    criteria.pagination = new Pagination();
    criteria.pagination.start = 0;
    criteria.pagination.count = this._pageSize;

    if (cachingService.readPersistant("Language") == 1) {
      require("moment/locale/ar-sa");
    }
    this.state = {
      hideDialog: true,
      entityId: criteria.entityId,
      showModal: false,
      selectedItem: { entityId: criteria.entityId },
      criteria: criteria,
      showPanel: false,
      showHisotyPanel: false,
      showViewPanel: false,
      records: new Array<Record>(),
      totalNumberOfRecords: 0,
      totalPages: 0,
      screenIconClassName: cachingService.read("screenIconClassName"),
      screenTitle: cachingService.read("screenTitle"),
      loadingData: false,
      numberOfOutgoing: 0,
      numberOfIncoming: 0,
      numberOfUpcoming: 0,
      numberOfUrgent: 0,
      numberOfLate: 0,
      chartsData: null,
      calendarItem: null,
      showRecordsViewPanel: false,
      dayRecords: {},
      dayTotalPages: 0
    };
    this.loadCounts();
    this.loadRecords(criteria);

    chartsCeriteria.asLookup = false;
    chartsCeriteria.entityId = 14;

    chartsCeriteria.sorting = new Sorting();
    chartsCeriteria.sorting.fieldId = 190;
    chartsCeriteria.sorting.direction = 1;

    chartsCeriteria.query = new Array<FieldQuery>();

    let chartsFieldQuery = new FieldQuery();
    chartsFieldQuery.fieldId = 159;
    chartsFieldQuery.value = dateUtil.formatToServerDateTime(new Date());
    chartsFieldQuery.queryOperator = 3;
    chartsCeriteria.query.push(chartsFieldQuery);

    this.loadRecordsForCharts(chartsCeriteria);
  }
  loadCounts = () => {
    let incomingCriteria: ListRecordsCriteria = new ListRecordsCriteria();
    incomingCriteria.entityId = 21;
    incomingCriteria.query = new Array<FieldQuery>();
    let incomingFieldQuery = new FieldQuery();
    incomingFieldQuery.fieldId = 216;
    incomingFieldQuery.value = this._loggedInUser.organizationUnit.id;
    incomingCriteria.query.push(incomingFieldQuery);
    this._recordService.listRecords(incomingCriteria).then(result => {
      let uniqueCorrespondences: any[] = [];

      result.records.forEach((record: any) => {
        record.fields.forEach((f: RecordField) => {
          if (f.id == 215 && uniqueCorrespondences.indexOf(f.data) == -1) {
            uniqueCorrespondences.push(f.data);
          }
        })
      });

      this.setState({ numberOfIncoming: uniqueCorrespondences.length });
    });

    let outgoingListCriteria = new ListRecordsCriteria();
    outgoingListCriteria.asLookup = false;
    outgoingListCriteria.entityId = 14;
    outgoingListCriteria.query = new Array<FieldQuery>();
    let outgoingFieldQuery = new FieldQuery();
    outgoingFieldQuery.fieldId = 278;
    outgoingFieldQuery.value = this._loggedInUser ? this._loggedInUser.organizationUnit.id : 0;
    outgoingListCriteria.query.push(outgoingFieldQuery);

    this._recordService.getRecordsCount(outgoingListCriteria).then(result => {
      this.setState({ numberOfOutgoing: result });
      this._loadingService.hide();
    });
    
    let UrgentCriteria: ListRecordsCriteria = new ListRecordsCriteria();
    UrgentCriteria.entityId = 14;
    UrgentCriteria.query = new Array<FieldQuery>();
    let UrgentFieldQuery = new FieldQuery();
    UrgentFieldQuery.fieldId = 163;
    UrgentFieldQuery.value = "17";
    UrgentCriteria.query.push(UrgentFieldQuery);

    this._recordService.getRecordsCount(UrgentCriteria).then(result => {
      this.setState({ numberOfUrgent: result });
      this._loadingService.hide();
    });

    //debugger;

    let dateUtil: DateUtils = new DateUtils();

    // change here  for number of late
    let lateCriteria: ListRecordsCriteria = new ListRecordsCriteria();
    lateCriteria.entityId = 14;
    lateCriteria.query = new Array<FieldQuery>();
    let lateFieldQuery = new FieldQuery();
    lateFieldQuery.fieldId = 159;
    lateFieldQuery.value = dateUtil.formatToServerDateTime(new Date());
    lateFieldQuery.queryOperator = 2;
    lateCriteria.query.push(lateFieldQuery);
    let lateFieldQuery2 = new FieldQuery();
    lateFieldQuery2.fieldId = 176;
    lateFieldQuery2.value = "62";
    lateFieldQuery2.queryOperator = 1;
    lateCriteria.query.push(lateFieldQuery2);

    this._recordService.getRecordsCount(lateCriteria).then(result => {
      //debugger;
      this.setState({ numberOfLate: result });
    });
  };

  loadRecords = (criteria: ListRecordsCriteria) => {
    this._loadingService.show();

    this.setState({ loadingData: true });

    this._recordService.listRecords(criteria).then(
      result => {
        let totalPages = Math.ceil(
          result.totalNumberOfRecords / this._pageSize
        );

        this.setState(
          {
            loadingData: false,
            criteria: criteria,
            totalNumberOfRecords: result.totalNumberOfRecords,
            totalPages: totalPages,
            records: result.records
          },
          () => {
            this.forceUpdate();
          }
        );
        this._loadingService.hide();
      },
      error => {
        alert(error);
        this._loadingService.hide();
      }
    );
  };

  loadRecordsForCharts = (criteria: ListRecordsCriteria) => {
    // this.setState({ loadingData: true });
    this._loadingService.show();

    this._recordService.listRecords(criteria).then(
      result => {
        // let totalPages = Math.ceil(result.totalNumberOfRecords / this._pageSize);
        this.setState(
          {
            chartsRecords: result.records
          },
          () => {
            this.forceUpdate();
          }
        );
        this.preparChartsData(result.records);
        this.preparCalendarData(result.records);
        this._loadingService.hide();
      },
      error => {
        alert(error);
        this._loadingService.hide();
      }
    );
  };

  preparChartsData = (records: any) => {
    let today = new Date();
    let otherday = new Date();
    let daysEn = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
    let daysAr = ["أحد", "إثنين", "ثلاثاء", "أربعاء", "خميس", "جمعة", "سبت"];
    let dataForLineChart = [];

    let setLabels = () => {
      let todayIndex = today.getDay();
      for (let i = 0; i < todayIndex; i++) {
        let dayEn = daysEn.shift();
        let dayAr = daysAr.shift();
        if (dayEn && dayAr) {
          daysEn.push(dayEn);
          daysAr.push(dayAr);
        }
      }
    };
    setLabels();

    for (let i = 0; i < 7; i++) {
      let recordsCount = 0;
      otherday.setDate(today.getDate() + i);
      records.forEach((x: any) => {
        x.fields.forEach((y: any) => {
          if (
            y.type == 4 &&
            y.data &&
            moment(y.data).isSame(moment(otherday).format(), "day")
          ) {
            recordsCount++;
          }
        });
      });
      dataForLineChart[i] = recordsCount;
    }

    let chartsData = {
      legend: {
        display: false
      },
      options: {
        responsive: true,
        maintainAspectRatio: false,
        tooltips: chartTooltip,
        plugins: {
          datalabels: {
            display: false
          }
        },
        scales: {
          yAxes: [
            {
              gridLines: {
                display: true,
                lineWidth: 1,
                color: "rgba(0,0,0,0.1)",
                drawBorder: false
              },
              ticks: {
                beginAtZero: true,
                stepSize: 2,
                min: 0,
                max: 10,
                padding: 20
              }
            }
          ],
          xAxes: [
            {
              gridLines: {
                display: false
              }
            }
          ]
        }
      },
      data: {
        labels:
          this._cachingService.readPersistant("Language") == 0
            ? daysEn
            : daysAr,
        datasets: [
          {
            label: "",
            data: dataForLineChart,
            borderColor: colors.themeColor1,
            pointBackgroundColor: colors.foregroundColor,
            pointBorderColor: colors.themeColor1,
            pointHoverBackgroundColor: colors.themeColor1,
            pointHoverBorderColor: colors.foregroundColor,
            pointRadius: 6,
            pointBorderWidth: 2,
            pointHoverRadius: 8,
            fill: false
          }
        ]
      }
    };

    this.setState({ chartsData: chartsData });
  };
  preparCalendarData = (records: any) => {
    let calendarItem: any = [];
    // {
    //   "key": 0,
    //   "title": "Meeting with Account",
    //   "allDay": true,
    //   "start": "Tue Jul 31 2018 00:00:00 GMT+0300 (GMT+03:00)",
    //   "end": "Thu Aug 02 2018 00:00:00 GMT+0300 (GMT+03:00)"
    // },

    records.forEach((x: any) => {
      x.fields.forEach((y: any) => {
        const fieldDate: any = moment(y.data);
        if (y.type == 4 && y.data) {
          let position: any = null;
          calendarItem.forEach((z: any, i: any) => {
            let itemDate: any = moment(z.start).format();
            if (fieldDate.isSame(itemDate, "day")) {
              z.title++;
              position = i;
            }
          });
          if (!position) {
            calendarItem.push({
              key: calendarItem.length,
              title: 1,
              start: new Date(y.data),
              end: new Date(y.data),
              allDay: true
            });
          }
        }
      });
    });

    this.setState({ calendarItem: calendarItem });

    console.log(calendarItem);
  };
  loadRecordsWithNewCriteria = (
    sorted: number,
    sortedDescending: boolean,
    page: number
  ) => {
    const criteria = this.state.criteria;

    if (sorted > -1) {
      criteria.sorting = new Sorting();
      criteria.sorting.fieldId = sorted;
      criteria.sorting.direction = sortedDescending == true ? 1 : 0;
    } else {
      criteria.sorting = null;
    }

    criteria.pagination = new Pagination();
    criteria.pagination.start = page;
    criteria.pagination.count = this._pageSize;

    this.loadRecords(criteria);
  };

  public render(): JSX.Element {
    return (
      <div>
        {
          !this._notAuthenticated &&

          <div className="ms-Grid">
            {/* <h1><FormattedMessage id="Correspondences" /> </h1> */}
            <div className="breadcrumb-container dashboard-breadcrumb">
              {/* <i className={this.state.screenIconClassName} /> */}
              <Breadcrumb
                items={[
                  { text: "Dashbaord", key: "dashbaord" }
                ]}
                ariaLabel={"Website breadcrumb"}
                onRenderItem={this._onRenderItem}
              />
            </div>
            <div className="ms-Grid-row">
              <div className="ms-Grid-col ms-sm12 ms-md12 ms-lg6">
                <div className="ms-Grid-col ms-sm12 dashboard-cards-sm-container">
                  <DashboardCard
                    className="dashboard-card-sm"
                    title={<FormattedMessage id="Incoming" />}
                    subTitle={this.state.numberOfIncoming}
                    icon="fal fa-inbox-in"
                    onClickHref="#/incoming"
                  />

                  <DashboardCard
                    className="dashboard-card-sm"
                    title={<FormattedMessage id="Outgoing" />}
                    subTitle={this.state.numberOfOutgoing}
                    icon="fal fa-inbox-out"
                    onClickHref="#/outgoing"
                  />
                  {/* <DashboardCard
                className="dashboard-card-sm"
                title={<FormattedMessage id="Upcoming" />}
                subTitle={this.state.numberOfUpcoming}
                icon="fal fa-alarm-clock"
              /> */}
                  <DashboardCard
                    className="dashboard-card-sm"
                    title={<FormattedMessage id="Urgent" />}
                    subTitle={this.state.numberOfUrgent}
                    icon="fal fa-exclamation-square"
                    onClickHref="#/urgent"
                  />
                  <DashboardCard
                    className="dashboard-card-sm"
                    title={<FormattedMessage id="Late" />}
                    subTitle={this.state.numberOfLate}
                    icon="fal fa-stopwatch"
                    onClickHref="#/late"
                  />
                </div>

                <div className="layout-card dashboard-m">
                  <h2 className="layout-card-header">
                    <span className="iconsmind-Line-Chart3" />{" "}
                    <FormattedMessage id="Chart" />
                  </h2>
                  <div>
                    {/* <LineShadow {...lineChartConfig} /> */}
                    {this.state.chartsData && (
                      <ChartComponent
                        rtl={true}
                        type="line"
                        {...this.state.chartsData}
                      />
                    )}
                  </div>
                </div>
              </div>
              <div className="ms-Grid-col ms-sm12 ms-md12 ms-lg6">
                <div className="layout-card chart-top-m">
                  <h2 className="layout-card-header">
                    <span className="iconsmind-Calendar-4" />{" "}
                    <FormattedMessage id="Calendar" />
                  </h2>
                  {this.state.calendarItem && (
                    <BigCalendar
                      className="big-calendar-height"
                      events={this.state.calendarItem}
                      views={["month"]}
                      components={{
                        toolbar: CalendarToolbar
                      }}
                      messages={
                        this._cachingService.readPersistant("Language") == 1
                          ? messagesAr
                          : messagesEn
                      }
                      culture={
                        this._cachingService.readPersistant("Language") == 1
                          ? "ar-sa"
                          : "en"
                      }
                      localizer={localizer}
                      onSelectEvent={this.getRecordsForDay.bind(this)}
                    />
                  )}
                </div>
              </div>
            </div>

            <div className="ms-Grid-row d-none">
              <div className="ms-Grid-col ms-sm12 ms-md12 ms-lg6">
                <div className="layout-card dashboard-m">
                  <h2 className="layout-card-header">
                    <span className="iconsmind-Timer" />{" "}
                    <FormattedMessage id="UpcomingCorrespondences" />
                  </h2>

                  <RecordsListView
                    TotalPages={this.state.totalPages}
                    Records={this.state.records}
                    LoadRecordsWithNewCriteria={this.loadRecordsWithNewCriteria.bind(
                      this
                    )}
                  />
                </div>
              </div>
            </div>

            <Panel
              className="panelStyle"
              isOpen={this.state.showRecordsViewPanel}
              onDismissed={this.closeDayRecords.bind(this)}
              type={PanelType.large}
              isFooterAtBottom={true}
              onRenderBody={this.showViewRecordsrenderPanelBody.bind(this)}
              headerText="RecordsList"
              headerClassName="panelHeaderStyle"
              hasCloseButton={false}
              isLightDismiss={true}
              onRenderHeader={this._onReadnderHader}
            />
          </div>
        }
      </div>
    );
  }

  private getRecordsForDay(event: any, e: any) {
    //debugger;
    this._loadingService.show();
    let dateUtil: DateUtils = new DateUtils();

    let dayCriteria: ListRecordsCriteria = new ListRecordsCriteria();
    dayCriteria.asLookup = false;
    dayCriteria.entityId = 14;
    dayCriteria.query = new Array<FieldQuery>();
    dayCriteria.sorting = new Sorting();
    dayCriteria.sorting.fieldId = 190;
    dayCriteria.sorting.direction = 1;

    let dayFieldQuery = new FieldQuery();
    dayFieldQuery.fieldId = 159;
    dayFieldQuery.value = dateUtil.formatToServerDateTime(
      new Date(event.start)
    );
    dayFieldQuery.queryOperator = 0;

    dayCriteria.query.push(dayFieldQuery);
    dayCriteria.pagination = new Pagination();
    dayCriteria.pagination.start = 0;
    dayCriteria.pagination.count = this._pageSize;
    this.setState({ dayCriteria: dayCriteria });
    this.loadDayRecords(dayCriteria);
  }

  private showViewRecordsrenderPanelBody = (): JSX.Element => {
    //debugger;
    return (
      <div className="day-records">
        <RecordsListView
          TotalPages={this.state.dayTotalPages}
          Records={this.state.dayRecords}
          LoadRecordsWithNewCriteria={this.loadRecordsWithNewCriteria.bind(
            this
          )}
          SelectedRecordChanged={this.loadDayRecordsWithNewCriteria.bind(this)}
        />
      </div>
    );
  };
  private _onReadnderHader = (item: any): JSX.Element | null => {
    return (
      <div className="ms-Panel-commands" data-is-visible="true">
        <div className="ms-Panel-navigation navigation_1033a520">
          <h2 className="panel-header-text ">
            <FormattedMessage id={item.headerText} />
          </h2>
          <IconButton
            className="ms-Panel-closeButton ms-PanelAction-close custom"
            onClick={item.onDismissed.bind(this)}
            iconProps={{ iconName: "ChromeClose", style: { fontSize: 12 } }}
          />
        </div>
      </div>
      // <div className="panel-header-text "><FormattedMessage id={item.headerText} /></div>
    );
  };

  loadDayRecords = (criteria: ListRecordsCriteria) => {
    this.setState({ loadingData: true });

    this._recordService.listRecords(criteria).then(
      result => {
        let totalPages = Math.ceil(
          result.totalNumberOfRecords / this._pageSize
        );
        //debugger;
        this.setState(
          {
            loadingData: false,
            dayCriteria: criteria,
            totalNumberOfDayRecords: result.totalNumberOfRecords,
            dayTotalPages: totalPages,
            dayRecords: result.records,
            showRecordsViewPanel: true
          },
          () => {
            this.forceUpdate();
          }
        );
        this._loadingService.hide();
      },
      error => {
        alert(error);
        this._loadingService.hide();
      }
    );
  };

  loadDayRecordsWithNewCriteria = (
    sorted: number,
    sortedDescending: boolean,
    page: number
  ) => {
    const criteria = this.state.dayCriteria;

    if (sorted > -1) {
      criteria.sorting = new Sorting();
      criteria.sorting.fieldId = sorted;
      criteria.sorting.direction = sortedDescending == true ? 1 : 0;
    } else {
      criteria.sorting = null;
    }

    criteria.pagination = new Pagination();
    criteria.pagination.start = page;
    criteria.pagination.count = this._pageSize;

    this.loadDayRecords(criteria);
  };

  closeDayRecords() {
    this.setState({ showRecordsViewPanel: false });
  }
  private _onRenderItem = (item: any): JSX.Element | null => {
    // debugger;
    return <FormattedMessage id={item.text} />;
  };

  events = [
    {
      key: 0,
      title: "Meeting with Account",
      allDay: true,
      start: "Tue Jul 31 2018 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Thu Aug 02 2018 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 1,
      title: "Delivery",
      start: "Mon Sep 10 2018 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Mon Sep 10 2018 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 2,
      title: "Sale Week",
      start: "Sun Oct 14 2018 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sun Oct 21 2018 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 3,
      title: "Delivery",
      start: "Tue Nov 13 2018 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Tue Nov 13 2018 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 4,
      title: "Tax Days",
      start: "Sun Dec 09 2018 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Fri Dec 14 2018 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 5,
      title: "Marketing Conference",
      start: "Sun Nov 04 2018 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Wed Nov 07 2018 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 6,
      title: "Meeting",
      start: "Sat Dec 08 2018 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sat Dec 08 2018 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 7,
      title: "Sales",
      start: "Tue Dec 25 2018 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Fri Dec 28 2018 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 8,
      title: "Store Repairs",
      start: "Mon Jan 14 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Wed Jan 16 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 9,
      title: "Web Meeting",
      start: "Tue Feb 05 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Fri Feb 08 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 10,
      title: "Delivery",
      start: "Fri Feb 22 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sat Feb 23 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 11,
      title: "Sales Week",
      start: "Sun Mar 10 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sun Mar 17 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 12,
      title: "Tax",
      start: "Wed Mar 27 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Thu Mar 28 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 13,
      title: "Meeting",
      start: "Sun Apr 14 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Mon Apr 15 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 14,
      title: "Delivery",
      start: "Mon Apr 22 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Fri Apr 26 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 15,
      title: "Account",
      start: "Wed May 08 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Thu May 09 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 16,
      title: "Shop Opening",
      start: "Tue May 14 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Thu May 16 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 17,
      title: "Vacation",
      start: "Sun Jun 09 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sun Jun 23 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 18,
      title: "Account Inspection",
      start: "Tue Jul 09 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sun Jul 14 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 19,
      title: "Marketing",
      start: "Wed Jul 17 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Thu Jul 18 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 20,
      title: "Delivery",
      start: "Sat Aug 10 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sun Aug 11 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 21,
      title: "Sales Week",
      start: "Sun Aug 18 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sun Aug 25 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 22,
      title: "Teem Workshop",
      start: "Fri Sep 13 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sun Sep 15 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 23,
      title: "Account Meeting",
      start: "Tue Oct 08 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Wed Oct 09 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 23,
      title: "Vacation",
      start: "Mon Oct 21 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Sat Oct 26 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 24,
      title: "Meeting",
      start: "Thu Nov 14 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Fri Nov 15 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 25,
      title: "Sales Meeting",
      start: "Fri Nov 22 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Tue Nov 26 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 26,
      title: "Account",
      start: "Sun Dec 08 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Mon Dec 09 2019 00:00:00 GMT+0300 (GMT+03:00)"
    },
    {
      key: 26,
      title: "Annual Meeting",
      start: "Tue Dec 24 2019 00:00:00 GMT+0300 (GMT+03:00)",
      end: "Wed Dec 25 2019 00:00:00 GMT+0300 (GMT+03:00)"
    }
  ];
}
export default Dashboard;
