fix
This commit is contained in:
Olu Amey
@@ -1,13 +1,37 @@
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>merms-calendar</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content class="merms-calendar-page">
|
||||
<div class="container">
|
||||
<ion-grid class="top-container">
|
||||
<ion-row>
|
||||
<ion-col size="2" class="navigation">
|
||||
<ion-back-button text="" (click)="goBack()"></ion-back-button>
|
||||
</ion-col>
|
||||
<ion-col size="8" class="page-title">Calendar</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
<button ion-button (click)="openCalendar()">Open Calendar on Current Date</button>
|
||||
{{MyCalendar}}
|
||||
|
||||
<ion-list>
|
||||
<ion-list-header>
|
||||
<hr size="1">
|
||||
</ion-list-header>
|
||||
|
||||
<ion-content>
|
||||
<div class="ion-padding">
|
||||
<ion-item *ngFor="let type of calendarData" (click)="goPatient(type)">
|
||||
<ion-avatar slot="start">
|
||||
<img src="./../../assets/imgs/avatar.svg">
|
||||
</ion-avatar>
|
||||
<ion-label>
|
||||
<h2>{{type.firstname}} {{type.lastname}}</h2>
|
||||
<h3>{{type.reason}}</h3>
|
||||
<p>{{type.appt}} {{type.gender}} , {{type.age}} yrs</p>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
|
||||
{{mycal}}
|
||||
|
||||
</ion-list>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</ion-content>
|
||||
|
||||
|
||||
@@ -0,0 +1,143 @@
|
||||
.merms-calendar-page{
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
--padding-top: 0px;
|
||||
--padding-bottom: 40px;
|
||||
--padding-start: 24px;
|
||||
--padding-end: 24px;
|
||||
.container {
|
||||
padding-top: 7vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
ion-grid.top-container {
|
||||
flex: 0 0 0;
|
||||
width: 100%;
|
||||
}
|
||||
.navigation {
|
||||
text-align: left;
|
||||
padding-left: 2px;
|
||||
ion-back-button {
|
||||
--color: #000;
|
||||
display: inline-block;
|
||||
--icon-font-size: 30px;
|
||||
}
|
||||
}
|
||||
.page-title {
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
font-size: 12px;
|
||||
line-height: 106.4%;
|
||||
letter-spacing: 0.1em;
|
||||
text-transform: uppercase;
|
||||
color: #000;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
h1 {
|
||||
margin-top: 30px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 26px;
|
||||
line-height: 135%;
|
||||
color: #000;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom-container {
|
||||
margin-top: 6vh;
|
||||
display: block;
|
||||
//flex: 1;
|
||||
//flex-direction: column;
|
||||
.google-sign-up,
|
||||
.apple-sign-up {
|
||||
display: block;
|
||||
border: 2px solid #000000;
|
||||
box-sizing: border-box;
|
||||
border-radius: 26.98px;
|
||||
padding: 13px 0;
|
||||
text-align: center;
|
||||
background: none;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
line-height: 14px;
|
||||
color: #000000;
|
||||
margin-bottom: 20px;
|
||||
position: relative;
|
||||
height: 55px !important;
|
||||
width: 100%;
|
||||
|
||||
span {
|
||||
opacity: 1;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
margin: 0;
|
||||
height: 25px;
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
img {
|
||||
height: 24px;
|
||||
margin-right: 13px;
|
||||
}
|
||||
}
|
||||
span {
|
||||
font-size: 12px;
|
||||
line-height: 145%;
|
||||
letter-spacing: -0.2px;
|
||||
color: #000000;
|
||||
opacity: 0.25;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
margin-bottom: 20px;
|
||||
&.forgot-password {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
.form {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
ion-input {
|
||||
border: 2px solid #000000;
|
||||
box-sizing: border-box;
|
||||
border-radius: 26.98px;
|
||||
margin-bottom: 16px;
|
||||
--padding-start: 20px;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 16px;
|
||||
line-height: 145%;
|
||||
letter-spacing: -0.2px;
|
||||
color: #000000;
|
||||
}
|
||||
button {
|
||||
background: #0b7493;
|
||||
border-radius: 30px;
|
||||
vertical-align: bottom;
|
||||
display: flex;
|
||||
margin: auto auto 0 auto;
|
||||
width: 168px;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
color: #fff;
|
||||
justify-content: center;
|
||||
padding: 14px 0;
|
||||
opacity: 0.5;
|
||||
height: 50px;
|
||||
min-height: 50px;
|
||||
&.active-button {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
@@ -7,23 +7,37 @@ import { Calendar } from '@ionic-native/calendar/ngx';
|
||||
styleUrls: ['./merms-calendar.page.scss'],
|
||||
})
|
||||
export class MermsCalendarPage implements OnInit {
|
||||
calendar={
|
||||
mode:'month',
|
||||
currentDate: new DataCue(),
|
||||
};
|
||||
|
||||
|
||||
@ViewChild(Calendar) mycal: Calendar;
|
||||
|
||||
MyCalendar:any;
|
||||
calendarData:any;
|
||||
|
||||
constructor() {
|
||||
|
||||
|
||||
constructor(private calendar: Calendar) {
|
||||
|
||||
// this.MyCalendar=calendar;
|
||||
/*
|
||||
this.calendar.createCalendar('MyCalendar').then(
|
||||
(msg) => { console.log(msg); },
|
||||
(err) => { console.log(err); }
|
||||
);
|
||||
*/
|
||||
|
||||
}
|
||||
goPatient(){
|
||||
|
||||
}
|
||||
openCalendar(){
|
||||
this.calendar.openCalendar(new Date()).then(
|
||||
(msg) => { console.log(msg); },
|
||||
(err) => { console.log(err); }
|
||||
);
|
||||
}
|
||||
|
||||
goBack(){
|
||||
|
||||
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
|
||||
<ion-icon name="card-outline"></ion-icon>
|
||||
<ion-icon name="card-outline" (click)="goWallet()"></ion-icon>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
@@ -90,18 +90,18 @@
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<div>
|
||||
<ion-icon name="calendar" style="color:aquamarine;" (click)="goCalendar()"></ion-icon>
|
||||
<ion-icon name="calendar" style="color:#8e54e9;" (click)="goCalendar()"></ion-icon>
|
||||
</div>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<div>
|
||||
<ion-icon name="wallet" style="color:green;" (click)="goWallet()"></ion-icon>
|
||||
<ion-icon name="wallet" style="color:#8e54e9;" (click)="goWallet()"></ion-icon>
|
||||
</div>
|
||||
</ion-col>
|
||||
|
||||
<ion-col>
|
||||
<div>
|
||||
<ion-icon name="settings" style="color:red;" (click)="goSettings()"></ion-icon>
|
||||
<ion-icon name="settings" style="color:#8e54e9;" (click)="goSettings()"></ion-icon>
|
||||
</div>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
||||
@@ -9,15 +9,38 @@
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- Item Dividers in a List -->
|
||||
<ion-list>
|
||||
|
||||
<ion-item><ion-label>Search patient </ion-label></ion-item>
|
||||
<ion-item><ion-label>Edit Profile</ion-label></ion-item>
|
||||
<ion-item><ion-label>A4</ion-label></ion-item>
|
||||
<ion-item><ion-label>Practice Time</ion-label></ion-item>
|
||||
<ion-item><ion-label>Reason:{{reason}}</ion-label></ion-item>
|
||||
<ion-item><ion-label>{{appt}} - {{gender}} [{{age}}]</ion-label></ion-item>
|
||||
<ion-item>
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
|
||||
<ion-button expand="full" >Call ??</ion-button>
|
||||
|
||||
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<ion-button color="success" expand="full">Video ??</ion-button>
|
||||
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<ion-button expand="full" >Chat ??</ion-button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Notes</ion-label>
|
||||
<ion-textarea rows="6" cols="20" placeholder="Enter any notes here..."></ion-textarea>
|
||||
|
||||
|
||||
</ion-item>
|
||||
|
||||
|
||||
</ion-list>
|
||||
|
||||
@@ -15,18 +15,38 @@ import {
|
||||
export class MermsPatientPage implements OnInit {
|
||||
patient_name: string = "Selected Patient";
|
||||
patientData: any;
|
||||
reason: string;
|
||||
patient_id : number = 0;
|
||||
lastname : string ='';
|
||||
firstname : string ='';
|
||||
appt : string ='';
|
||||
gender : string ='';
|
||||
age : number =0;
|
||||
|
||||
constructor(public navCtrl: NavController, private router: Router, private route: ActivatedRoute) {
|
||||
console.log('-----------------------------xxxx-----------------------------');
|
||||
console.log(this.route.data);
|
||||
console.log(this.router.getCurrentNavigation().extras.queryParams);
|
||||
this.patientData = this.router.getCurrentNavigation().extras.queryParams;
|
||||
|
||||
this.route.queryParams.subscribe(params => {
|
||||
console.log(params);
|
||||
this.patient_name = params.firstname + ' ' + params.lastname;
|
||||
if (params && params.special) {
|
||||
this.patientData = JSON.parse(params.special);
|
||||
console.log(this.patientData);
|
||||
}
|
||||
});
|
||||
console.log(this.patientData.special);
|
||||
var params = JSON.parse(this.patientData.special);
|
||||
this.patient_name = params.firstname + ' ' + params.lastname;
|
||||
this.reason = params.reason;
|
||||
|
||||
this.age = params.age;
|
||||
this.gender = params.gender;
|
||||
this.appt = params.appt;
|
||||
this.patient_id = params.id;
|
||||
this.firstname = params.firstname;
|
||||
|
||||
// this.route.queryParams.subscribe(params => {
|
||||
// console.log(params);
|
||||
|
||||
// if (params && params.special) {
|
||||
// this.patientData = JSON.parse(params.special);
|
||||
// console.log(this.patientData);
|
||||
// }
|
||||
// });
|
||||
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user