Employee Calender

View.xml

<core:View xmlns:core="sap.ui.core" xmlns:l="sap.ui.layout"
xmlns:f="sap.ui.layout.form" xmlns:grid="sap.ui.layout.cssgrid"
xmlns:unified="sap.ui.unified" xmlns="sap.m"
controllerName="NavApp.view.Main" displayBlock="true" height="100%">
<App id="AppId">

<Page title="Mahindra Vehicle  Manufactures"
class="sapUiSizeCompact" showHeader="false">
<content>
<f:Form id="" editable="true" ariaLabelledBy="Title1">
<f:layout>
<f:ResponsiveGridLayout
adjustLabelSpan="false" emptySpanXL="0" emptySpanM="0"
emptySpanS="0" columnsXL="2" columnsL="2" columnsM="2" />
</f:layout>
<f:formContainers>
<f:FormContainer ariaLabelledBy="Title2">
<f:formElements>
<f:FormElement>
<VBox>
<Text text="Manager Leave Register"></Text>
<Label text="Hello Digvijay"></Label>
<Label text="we loading your data"></Label>


<IconTabBar id="idIconTabBar"
select="handleIconTabBarSelect">
<items>

<IconTabFilter icon="sap-icon://group"
iconColor="Negative" text="My Team Leave">
<content>
<IconTabBar select="handleIconTabBarSelect">
<items>

<IconTabFilter iconColor="Negative"
text="Pending leave">
<content>







<f:Form editable="true" ariaLabelledBy="Title1">
<f:layout>
<f:ResponsiveGridLayout
adjustLabelSpan="false" emptySpanXL="0"
emptySpanM="0" emptySpanS="0" columnsXL="2"
columnsL="2" columnsM="2" />
</f:layout>
<f:formContainers>
<f:FormContainer
ariaLabelledBy="Title2">
<f:formElements>
<f:FormElement>



<Panel>
<GenericTile
class="sapUiTinyMarginBegin sapUiTinyMarginTop tileLayout tile"
height="10%" press="OnPress" subheader=""
header="MTD">
<TileContent>

<NumericContent id="amu"
footer="(in %)" valueColor="Good"
animateTextChange="true" indicator="Up" />

</TileContent>

</GenericTile>
<!-- <GenericTile id="container1" tileContent= "{path:
'/people'}"> <tileContent> <TileContent footer="{name}"> </TileContent> </tileContent>
</GenericTile> -->
</Panel>






</f:FormElement>

</f:formElements>
</f:FormContainer>

</f:formContainers>
</f:Form>



</content>
</IconTabFilter>



<IconTabFilter iconColor="Negative"
text="Employee on Leave">
<content>

</content>
</IconTabFilter>
</items>
</IconTabBar>





</content>
</IconTabFilter>

<IconTabSeparator
icon="sap-icon://open-command-field" />

<IconTabFilter icon="sap-icon://customer"
iconColor="Positive" text="My Leave">
<content>

</content>
</IconTabFilter>

<IconTabSeparator
icon="sap-icon://open-command-field" />

<IconTabFilter icon="sap-icon://document"
iconColor="Neutral" text="Leave Policy">
<content>

</content>
</IconTabFilter>

<IconTabSeparator
icon="sap-icon://open-command-field" />

<IconTabFilter icon="sap-icon://overflow"
iconColor="Critical" text="Show More">
<content>

</content>
</IconTabFilter>


</items>
</IconTabBar>
</VBox>

</f:FormElement>

</f:formElements>
</f:FormContainer>
<f:FormContainer>
<f:formElements>
<f:FormElement>
<VBox class="sapUiSmallMargin">
<IconTabBar id="idTopLevelIconTabBar"
class="sapUiResponsiveContentPadding" select="onSelect"
backgroundDesign="Translucent" expandable="false"
expanded="false" headerBackgroundDesign="Translucent">
<items>
<IconTabFilter id="start" text="vacation"
key="vacation" class="tab1">
</IconTabFilter>
<IconTabFilter id="layouts" text="SickLeave"
key="sick"></IconTabFilter>
<IconTabFilter id="Containers"
text="Unpaid Leave" key="unpaid"></IconTabFilter>
<IconTabFilter text="Half Day" key="half"></IconTabFilter>
<IconTabFilter text="Others" key="other">
</IconTabFilter>
</items>
</IconTabBar>

<PlanningCalendar id="PC1"
stickyHeader="true" startDate="{path: '/startDate'}"
rows="{/people}" appointmentsVisualization="Filled"
viewKey="One Month" showEmptyIntervalHeaders="false">
<rows>
<PlanningCalendarRow icon="{pic}"
title="{name}" text="{role}"
appointments="{path : 'appointments', templateShareable: 'false'}">
<appointments>
<unified:CalendarAppointment
startDate="{start}" endDate="{end}" title="{title}"
color="{color}" tooltip="{tooltip}">
</unified:CalendarAppointment>
</appointments>
</PlanningCalendarRow>
</rows>
</PlanningCalendar>
</VBox>
</f:FormElement>
</f:formElements>
</f:FormContainer>
</f:formContainers>
</f:Form>








<!-- <HBox> <core:Icon src="sap-icon://home" class="size1" color="#031E48"/>
<Text text="DASHBOARD" class="size1" /> </HBox> -->




</content>
</Page>
</App>
</core:View>


controller.js :

var data ;


sap.ui
.controller(
"NavApp.view.Main",
{
onInit : function() {
this.data = {
startDate : new Date("2019/10/01"),
people : [
{
name : "Richa Ghodake",
role : "57005032",
vacation : "22",
appointments : [ {
start : new Date("2019/10/16"),
end : new Date("2019/10/17"),
color : "red",
title : "sick",
}, {
start : new Date("2019/10/29"),
end : new Date("2019/11/09"),
title : "vacation",
color : "black",
tooltip : "Planned Leave"
} ]

},
{
name : "Kajal Navle",
role : "",
vacation : "22",
appointments : [ {
start : new Date("2019/10/18"),
end : new Date("2019/11/05"),
title : "other",
color : "cyan",
tooltip : "Planned Leave"
} ]

},
{

name : "Tushar Patil",
role : "",
vacation : "22",
appointments : [ {
start : new Date("2019/11/04"),
end : new Date("2019/11/05"),
title : "unpaid",
color : "yellow",
tooltip : "Unplanned Leave"
}

]

},
{

name : "Digvijay Pawar",
role : "",
vacation : "22",
appointments : [ {
start : new Date("2019/11/08"),
end : new Date("2019/11/09"),
title : "half",
color : "blue",
tooltip : "Sick Leave"
}

]

},
{
name : "Aasavari Puralkar",
role : "57000197",
vacation : "22",
appointments : [ {
start : new Date("2019/10/17"),
end : new Date("2019/10/19"),
title : "sick",
color : "red",
tooltip : "Sick Leave"
}, {
start : new Date("2019/11/26"),
end : new Date("2019/12/03"),
title : "vacation",
color : "black",
tooltip : "Planned Leave"
} ]

},
{
name : "Ganesh Rane",
role : "57005046",
vacation : "22",
appointments : [ {
start : new Date("2019/10/17"),
end : new Date("2019/10/26"),
title : "other",
color : "cyan",
tooltip : "Planned Leave"
} ]

},
{
name : "Rahul Singh",
role : "57005044",
vacation : "22",
appointments : [
{
start : new Date(
"2019/10/21"),
end : new Date("2019/10/26"),
title : "half",
color : "blue",
tooltip : "Planned Leave"
},
{
start : new Date(
"2019/10/29"),
end : new Date("2019/10/31"),
title : "vacation",
color : "black",
tooltip : "Planned Leave"
} ]

},
{
name : "Bhagyashri Jadhav",
role : "57005146",
vacation : "22",
appointments : [
{
start : new Date(
"2019/09/23"),
end : new Date("2019/09/24"),
title : "sick",
color : "red",
tooltip : "Sick Leave"
},
{
start : new Date(
"2019/10/22"),
end : new Date("2019/11/09"),
title : "other",
color : "cyan",
tooltip : "Planned Leave"
} ]

}, {
name : "Suryateja Dharma",
role : "57005146",
vacation : "22",
appointments : [ {
start : new Date("2019/10/29"),
end : new Date("2019/10/31"),
title : "other",
color : "cyan",
tooltip : "Planned Leave"
}, {
start : new Date("2019/10/31"),
end : new Date("2019/11/02"),
title : "unpaid",
color : "yellow",
tooltip : "Unplanned Leave"
} ]

}, {

name : "Pooja Vijan",
role : "57005001",
vacation : "22",
appointments : [ {
start : new Date("2019/10/24"),
end : new Date("2019/10/31"),
title : "vacation",
color : "black",
tooltip : "Planned Leave"

} ]

}, {

name : "Viraj Pansare",
role : "",
vacation : "22",
appointments : [ {
start : new Date("2019/10/29"),
end : new Date("2019/10/30"),
title : "unpaid",
color : "yellow",
tooltip : "Unplanned Leave"

} ]

}, {

name : "Tushar Patil",
role : "",
appointments : [ {
start : new Date("2019/10/29"),
end : new Date("2019/10/31"),
title : "other",
color : "cyan",
tooltip : "Unplanned Leave"

}, {

start : new Date("2019/11/12"),
end : new Date("2019/11/13"),
title : "sick",
color : "red",
tooltip : "Sick Leave"

} ]

}, {

name : "Urvashi Bhadarka",
role : "",
vacation : "22",
appointments : [ {
start : new Date("2019/10/29"),
end : new Date("2019/10/31"),
title : "unpaid",
color : "yellow",
tooltip : "Unplanned Leave"

} ]

}, {
name : "Suraj Bhalerao",
role : "57005123",
vacation : "22",
appointments : [ {
start : new Date("2019/10/18"),
end : new Date("2019/10/19"),
title : "vacation",
color : "black",
tooltip : "Sick Leave"
}, {
start : new Date("2019/10/29"),
end : new Date("2019/10/30"),
title : "sick",
color : "red",
tooltip : "Unplanned Leave"
} ]

}

]
};
 
this.oModel = new sap.ui.model.json.JSONModel();
this.oModel.setData(this.data);
this.getView().setModel(this.oModel);
this.getView().byId("PC1").setVisible(false);
var a=this.getView().byId("container1");
    var b = new sap.ui.model.json.JSONModel();
    b.setData(this.data);
    a.setModel (b);
    
},
onSelect : function(oEvent) {
this.getView().byId("PC1").setVisible(true);
var sickdata = {
startDate : new Date("2019/10/01"),
people : []
}
this.oModel = new sap.ui.model.json.JSONModel();
this.getView().getModel().refresh();
var x = oEvent.mParameters.key
console.log(x);
debugger;
 
for(var i=0; i<this.data.people.length ; i++)
{
for (j=0 ; j<this.data.people[i].appointments.length ; j++)
{
if ( this.data.people[i].appointments[j].title == x )
{
sickdata.people.push({
name : this.data.people[i].name,
role : this.data.people[i].role,
vacation : this.data.people[i].vacation,
appointments : [{
start : this.data.people[i].appointments[j].start,
end : this.data.people[i].appointments[j].end,
//title : this.data.people[i].appointments[j].title,
color : this.data.people[i].appointments[j].color,
tooltip : this.data.people[i].appointments[j].tooltip
}]
})
}
}
}
debugger;
this.oModel.setData(sickdata);
this.getView().setModel(this.oModel);
this.oModel.refresh();
},
handleAppointmentSelect : function(oEvent) {
var oAppointment = oEvent.getParameter("appointment");
if (oAppointment) {
alert(oAppointment.getText());
} else {
var aAppointments = oEvent
.getParameter("appointments");
var sValue = aAppointments.length
+ " Appointments selected";
alert(sValue);
}

},
/*onVacation : function(oEvent) {
// /debugger;
// var
// a=this.getView().getModel().getData().people[0].vacation;
this
.getView()
.byId("PC1")
.setModel(
this.getView().getModel().getData().people[0].vacation);

},*/
/*
* handleOpen: function(oEvent){ debugger; if
* (!this.PlantHelpDialog) { this.PlantHelpDialog = new
* sap.ui.xmlfragment( "LeaveCalender.Fragment.PlantSh", this);
* this.getView().addDependent(this.PlantHelpDialog); }
* this.PlantHelpDialog.open(); oPC = oEvent.oSource; oStartDate =
* oEvent.getParameter("startDate"); oEndDate =
* oEvent.getParameter("endDate"); oRow =
* oEvent.getParameter("row"); oSubInterval =
* oEvent.getParameter("subInterval"); },
*/

/*
* handleIntervalSelect: function (oEvent) { //
* this.getView().byId("idInput").setVisible(true); //
* this.getView().byId("idInput").focus();
* var oStartDate = oEvent.getParameter("startDate"); var
* oEndDate = oEvent.getParameter("endDate"); var oRow =
* oEvent.getParameter("row"); var oSubInterval =
* oEvent.getParameter("subInterval"); // var oModel =
* this.getView().getModel(); var oData = this.oModel.getData();
* var iIndex = -1;
* var a= sap.ui.getCore().byId("idInput1").getValue(); var b=
* sap.ui.getCore().byId("idInput2").getValue(); var c=
* sap.ui.getCore().byId("idInput3").getValue(); var d=
* sap.ui.getCore().byId("idInput4").getValue();
* this.PlantHelpDialog.close(); var oAppointment = {start:
* oStartDate, end: oEndDate, // title: a, title: a, info: b,
* color: "#4cba6b", tooltip: c };
* if (oRow) { iIndex = oPC.indexOfRow(oRow);
* oData.people[iIndex].appointments.push(oAppointment); } else {
* var aSelectedRows = oPC.getSelectedRows(); for (var i = 0; i <
* aSelectedRows.length; i++) { iIndex =
* oPC.indexOfRow(aSelectedRows[i]);
* oData.people[iIndex].appointments.push(oAppointment); } }
*/
// this.oModel.setData(oData);
// this.PlantHelpDialog.destroy();
// }
});

Post a Comment

Previous Post Next Post