My task
This commit is contained in:
+2
-1
@@ -6,4 +6,5 @@ ionic generate page familylogin
|
||||
|
||||
ionic generate page blogdetail
|
||||
ionic generate page marketdetail
|
||||
ionic generate page activetask
|
||||
ionic generate page activetask
|
||||
ionic generate page mytask
|
||||
@@ -150,6 +150,10 @@ const routes: Routes = [
|
||||
path: 'family',
|
||||
loadChildren: () => import('./pages/family/family.module').then(m => m.FamilyPageModule)
|
||||
},
|
||||
{
|
||||
path: 'mytasks',
|
||||
loadChildren: () => import('./pages/mytasks/mytasks.module').then(m => m.MytasksPageModule)
|
||||
},
|
||||
|
||||
];
|
||||
@NgModule({
|
||||
|
||||
@@ -10,6 +10,7 @@
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
|
||||
<ion-content class="ion-padding">
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment-button value="tasks">
|
||||
|
||||
@@ -1,11 +1,3 @@
|
||||
/*
|
||||
Authors : initappz (Rahul Jograna)
|
||||
Website : https://initappz.com/
|
||||
App Name : E-Learning App Template
|
||||
This App Template Source code is licensed as per the
|
||||
terms found in the Website https://initappz.com/license
|
||||
Copyright and Good Faith Purchasers © 2021-present initappz.
|
||||
*/
|
||||
ion-header {
|
||||
ion-toolbar {
|
||||
--background: var(--ion-color-primary);
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
|
||||
import { Router } from '@angular/router';
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { WrenchService } from 'src/app/services/wrench.service';
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { MytasksPage } from './mytasks.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: MytasksPage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class MytasksPageRoutingModule {}
|
||||
@@ -0,0 +1,20 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { MytasksPageRoutingModule } from './mytasks-routing.module';
|
||||
|
||||
import { MytasksPage } from './mytasks.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
MytasksPageRoutingModule
|
||||
],
|
||||
declarations: [MytasksPage]
|
||||
})
|
||||
export class MytasksPageModule {}
|
||||
@@ -0,0 +1,138 @@
|
||||
|
||||
<ion-header mode="ios" class="ion-no-border">
|
||||
<ion-toolbar>
|
||||
<ion-buttons slot="end">
|
||||
<ion-button>
|
||||
<ion-icon name="search-outline"></ion-icon>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
<ion-title>My Tasks</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
|
||||
<ion-content class="ion-padding">
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment-button value="tasks">
|
||||
<ion-label>Active</ion-label>
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="pastdue">
|
||||
<ion-label>Past Due</ion-label>
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="review">
|
||||
<ion-label>In Review</ion-label>
|
||||
</ion-segment-button>
|
||||
</ion-segment>
|
||||
|
||||
<div *ngIf="tabs =='tasks'">
|
||||
|
||||
<ion-card>
|
||||
<img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
||||
<ion-card-header>
|
||||
<ion-card-title>Current Tasks</ion-card-title>
|
||||
<ion-card-subtitle>Card Subtitle</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
Here's a small text description for the card content. Nothing more, nothing less.
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
<div class="chat" *ngFor="let item of jobsData;" (click)="activeSeleted(item)">
|
||||
<div class="flex">
|
||||
<div class="bg_image back_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>
|
||||
<div style="margin-left: 10px;">
|
||||
<ion-label class="bold_text"> {{item.title}}</ion-label>
|
||||
<div style="display: flex;">
|
||||
<ion-label class="grey_text"> {{item.job_description}} </ion-label>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<hr />
|
||||
<ion-label> {{item.delivery_date}}</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<ion-icon name="chevron-forward-outline"></ion-icon>
|
||||
<!-- <ion-label class="small_text"> 11:30 PM</ion-label>-->
|
||||
<!-- <ion-label class="color_text"> 10</ion-label>-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='pastdue'">
|
||||
|
||||
<ion-card>
|
||||
<img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
||||
<ion-card-header>
|
||||
<ion-card-title>Past Due</ion-card-title>
|
||||
<ion-card-subtitle>Card Subtitle</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
Here's a small text description for the card content. Nothing more, nothing less.
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
<div class="chat" *ngFor="let item of jobsPastDueData;" (click)="onMessage()">
|
||||
<div class="flex">
|
||||
<div class="bg_image back_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>
|
||||
<div style="margin-left: 10px;">
|
||||
<ion-label class="bold_text"> {{item.title}}</ion-label>
|
||||
<div style="display: flex;">
|
||||
<ion-label class="grey_text"> {{item.job_description}} </ion-label>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<hr />
|
||||
<ion-label> {{item.delivery_date}}</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<ion-icon name="chevron-forward-outline"></ion-icon>
|
||||
<!-- <ion-label class="small_text"> 11:30 PM</ion-label>-->
|
||||
<!-- <ion-label class="color_text"> 10</ion-label>-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='review'">
|
||||
|
||||
<ion-card>
|
||||
<img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
||||
<ion-card-header>
|
||||
<ion-card-title>In Review</ion-card-title>
|
||||
<ion-card-subtitle>Card Subtitle</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
Here's a small text description for the card content. Nothing more, nothing less.
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
<div class="chat" *ngFor="let item of jobsInReviewData;" (click)="onMessage()">
|
||||
<div class="flex">
|
||||
<div class="bg_image back_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>
|
||||
<div style="margin-left: 10px;">
|
||||
<ion-label class="bold_text"> {{item.title}}</ion-label>
|
||||
<div style="display: flex;">
|
||||
<ion-label class="grey_text"> {{item.job_description}} </ion-label>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<hr />
|
||||
<ion-label> {{item.delivery_date}}</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<ion-icon name="chevron-forward-outline"></ion-icon>
|
||||
<!-- <ion-label class="small_text"> 11:30 PM</ion-label>-->
|
||||
<!-- <ion-label class="color_text"> 10</ion-label>-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
@@ -0,0 +1,59 @@
|
||||
ion-header {
|
||||
ion-toolbar {
|
||||
--background: var(--ion-color-primary);
|
||||
|
||||
ion-icon {
|
||||
color: white;
|
||||
}
|
||||
|
||||
ion-title {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ion-content {
|
||||
|
||||
.grey_text {
|
||||
color: grey;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.small_text {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.color_text {
|
||||
color: white;
|
||||
background-color: var(--ion-color-primary);
|
||||
width: 25px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
border-radius: 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.chat {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 1rem;
|
||||
border-bottom: 1px solid lightgray;
|
||||
padding-bottom: 10px;
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.back_image {
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.call {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { MytasksPage } from './mytasks.page';
|
||||
|
||||
describe('MytasksPage', () => {
|
||||
let component: MytasksPage;
|
||||
let fixture: ComponentFixture<MytasksPage>;
|
||||
|
||||
beforeEach(waitForAsync(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ MytasksPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(MytasksPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,104 @@
|
||||
import { Router } from '@angular/router';
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { WrenchService } from 'src/app/services/wrench.service';
|
||||
import {SessionDataProviderService} from "../../store/session-data-provider.service";
|
||||
|
||||
@Component({
|
||||
selector: 'app-mytasks',
|
||||
templateUrl: './mytasks.page.html',
|
||||
styleUrls: ['./mytasks.page.scss'],
|
||||
})
|
||||
export class MytasksPage implements OnInit {
|
||||
|
||||
|
||||
tabs: any = 'tasks';
|
||||
|
||||
constructor(
|
||||
private router: Router,
|
||||
public sessionDataProviderService: SessionDataProviderService,
|
||||
private wrenchService: WrenchService
|
||||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
this.getJobsData();
|
||||
this.getPastDueJobsData();
|
||||
this.getInReviewJobsData();
|
||||
}
|
||||
|
||||
onCall() {
|
||||
this.router.navigate(['call']);
|
||||
}
|
||||
|
||||
onMessage() {
|
||||
this.router.navigate(['message']);
|
||||
}
|
||||
activeSeleted(item) {
|
||||
this.router.navigate(['activetask'],{state: item});
|
||||
}
|
||||
|
||||
usrData: {
|
||||
action:11200, member_id: number, uid: string, sessionid: string, limit:20, page:0, offset: 0, job_mode: string
|
||||
};
|
||||
|
||||
jobsTotalData:any;
|
||||
jobsData: [];
|
||||
getJobsData(){
|
||||
|
||||
this.usrData = {action:11200, member_id: this.sessionDataProviderService.member_id,
|
||||
uid: this.sessionDataProviderService.member_uid, sessionid: this.sessionDataProviderService.session ,
|
||||
limit:20, page:0, offset:0, job_mode: 'ACTIVE'}
|
||||
this.wrenchService.getMyActiveJobsData(this.usrData).subscribe(
|
||||
jobsTotalData => {
|
||||
this.jobsTotalData = jobsTotalData;
|
||||
console.log("PAH HX RETURN->", this.jobsTotalData);
|
||||
this.jobsData = this.jobsTotalData.result_list;
|
||||
// debugger;
|
||||
console.log("JOBS RETURN DATA->", this.jobsData);
|
||||
// this.blogDataService.setBlogData(this.blogResult.blog_data);
|
||||
}
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
jobsTotalPastDueData:any;
|
||||
jobsPastDueData: [];
|
||||
getPastDueJobsData(){
|
||||
|
||||
this.usrData = {action:11200, member_id: this.sessionDataProviderService.member_id, uid: this.sessionDataProviderService.member_uid,
|
||||
sessionid: this.sessionDataProviderService.session , limit:20, page:0, offset:0, job_mode: 'PASTDUE'}
|
||||
this.wrenchService.getMyActiveJobsData(this.usrData).subscribe(
|
||||
jobsTotalPastDueData => {
|
||||
this.jobsTotalPastDueData = jobsTotalPastDueData;
|
||||
console.log("PAST DUE TOTAL RETURN->", this.jobsTotalPastDueData);
|
||||
this.jobsPastDueData = this.jobsTotalPastDueData.result_list;
|
||||
// debugger;
|
||||
console.log("PAST DUE JOBS RETURN DATA->", this.jobsPastDueData);
|
||||
// this.blogDataService.setBlogData(this.blogResult.blog_data);
|
||||
}
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
jobsTotalInReviewData:any;
|
||||
jobsInReviewData: [];
|
||||
getInReviewJobsData(){
|
||||
|
||||
this.usrData = {action:11200,
|
||||
member_id: this.sessionDataProviderService.member_id,
|
||||
uid: this.sessionDataProviderService.member_uid,
|
||||
sessionid: this.sessionDataProviderService.session ,
|
||||
limit:20, page:0, offset:0, job_mode: 'REVIEW'}
|
||||
this.wrenchService.getMyActiveJobsData(this.usrData).subscribe(
|
||||
jobsTotalInReviewData => {
|
||||
this.jobsTotalInReviewData = jobsTotalInReviewData;
|
||||
console.log("JOBS IN REVIEW TOTAL RETURN->", this.jobsTotalInReviewData);
|
||||
this.jobsInReviewData = this.jobsTotalInReviewData.result_list;
|
||||
// debugger;
|
||||
console.log("JOBS IN REVIEW RETURN DATA->", this.jobsInReviewData);
|
||||
// this.blogDataService.setBlogData(this.blogResult.blog_data);
|
||||
}
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@@ -35,6 +35,10 @@ const routes: Routes = [
|
||||
path: 'tab5',
|
||||
loadChildren: () => import('../profile/profile.module').then(m => m.ProfilePageModule)
|
||||
},
|
||||
{
|
||||
path: 'mytasks',
|
||||
loadChildren:() => import('../mytasks/mytasks.module').then(m => m.MytasksPageModule)
|
||||
},
|
||||
{
|
||||
path: '',
|
||||
redirectTo: '/tabs/tab1',
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
<ion-label>Market</ion-label>
|
||||
</ion-tab-button>
|
||||
|
||||
<ion-tab-button tab="tab3" class="task_button">
|
||||
<ion-tab-button tab="mytasks" class="task_button">
|
||||
<ion-icon name="list-outline"></ion-icon>
|
||||
<ion-label>Tasks</ion-label>
|
||||
</ion-tab-button>
|
||||
|
||||
Reference in New Issue
Block a user