home format
This commit is contained in:
@@ -1,189 +1,190 @@
|
||||
|
||||
<ion-content>
|
||||
<div class="bg_image back_image" [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/jobs/default.jpg)'">
|
||||
<div class="ion-padding">
|
||||
<ion-icon slot="start" name="arrow-back" class="back" (click)="onBack()"></ion-icon>
|
||||
<div class="boxed_contents">
|
||||
<div class="bg_image back_image" [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/jobs/default.jpg)'">
|
||||
<div class="ion-padding">
|
||||
<ion-icon slot="start" name="arrow-back" class="back" (click)="onBack()"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ion-padding">
|
||||
<div class="flex">
|
||||
<ion-label class="bold_text">{{jobData.title}}</ion-label>
|
||||
<!-- <ion-icon slot="end" name="bookmark-outline" color="primary"></ion-icon>-->
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<ion-label class="bg_text">{{jobData.contract}}</ion-label>
|
||||
<div class="rate">
|
||||
<!-- <ion-icon name="star-half-outline" color="warning"></ion-icon>-->
|
||||
<!-- <ion-label class="review"> ({{jobData.interest_count}} interest)</ion-label>-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ion-label class="color_text">Price: {{jobData.price*0.01}} {{jobData.currency}}</ion-label>
|
||||
|
||||
<div class="items">
|
||||
<div class="stud">
|
||||
<ion-icon slot="start" name="time" color="primary"></ion-icon>
|
||||
<ion-label>Timeline: {{jobData.timeline_days}} days</ion-label>
|
||||
</div>
|
||||
<!-- <div class="stud">-->
|
||||
<!-- <ion-icon slot="start" name="document-text" color="primary"></ion-icon>-->
|
||||
<!-- <ion-label>Certificate</ion-label>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
<div *ngIf="status_description == 'ACTIVE'" >
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment-button value="about">
|
||||
<ion-label>Details</ion-label>
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="lesson">
|
||||
<ion-label>Send Updates</ion-label>
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="review">
|
||||
<ion-label>Actions</ion-label>
|
||||
</ion-segment-button>
|
||||
</ion-segment>
|
||||
|
||||
<div *ngIf="tabs =='about'" class="about">
|
||||
<!-- <ion-label class="head_text">Mentor</ion-label>-->
|
||||
|
||||
<!-- <div class="mentor">-->
|
||||
<!-- <div class="left">-->
|
||||
<!-- <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+jobData.banner+')'"></div>-->
|
||||
<!-- <div style="margin-left: 10px;">-->
|
||||
<!-- <ion-label class="bold">Due Date</ion-label>-->
|
||||
<!-- <ion-label class="grey">{{jobData.delivery_date}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <!– <ion-icon name="chatbubble-ellipses-outline" color="primary"></ion-icon>–>-->
|
||||
<!-- </div>-->
|
||||
<div class="work_area">
|
||||
<ion-label class="head_text">Description</ion-label>
|
||||
<ion-label class="description">{{jobData.job_description}}
|
||||
</ion-label>
|
||||
|
||||
<ion-label class="head_text">Delivery Details</ion-label>
|
||||
<ion-label class="description">{{jobData.description}}
|
||||
</ion-label>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='lesson'" class="lesson">
|
||||
<!-- <div class="flex">-->
|
||||
<!-- <ion-label class="bold">Most Popular Courses</ion-label>-->
|
||||
<!-- <ion-label class="color">See all</ion-label>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="sec">-->
|
||||
<!-- <ion-label class="grey">Due Date:{{jobData.delivery_date}}</ion-label>-->
|
||||
<!-- <ion-label class="color">{{jobData.contract}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<ion-card>
|
||||
<!-- <ion-card-header>-->
|
||||
<!-- <ion-card-subtitle>Send Updates</ion-card-subtitle>-->
|
||||
<!-- </ion-card-header>-->
|
||||
|
||||
<ion-card-content>
|
||||
<ion-textarea label="Your Message to Job Owner" placeholder="Type message here" [(ngModel)]='yourmessage' ></ion-textarea>
|
||||
</ion-card-content>
|
||||
|
||||
<ion-button color="secondary" expand="block" (click)="sendActiveJobMessage()">Send Updates</ion-button>
|
||||
<ion-label class="description">{{interest_msg_status}}
|
||||
</ion-label>
|
||||
</ion-card>
|
||||
|
||||
<!-- <div class="video {{item.who}}" *ngFor="let item of msgListData">-->
|
||||
<!-- <div class="left">-->
|
||||
<!-- <div class="bg_image men_image" [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/msg/TEXT.svg)'"></div>-->
|
||||
|
||||
<!-- <div class="text">-->
|
||||
<!-- <ion-label class="bold_text">{{item.msg_firstname}}-{{item.msg_date}}</ion-label>-->
|
||||
<!-- <ion-label class="grey_text">{{item.message}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <!– <div class="right">–>-->
|
||||
<!-- <!–<!– <ion-icon name="lock-closed-outline"></ion-icon>–>–>-->
|
||||
<!-- <!– </div>–>-->
|
||||
<!-- </div>-->
|
||||
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='review'" class="review_tab">
|
||||
<!-- <div class="total">-->
|
||||
<!-- <div class="star-rate">-->
|
||||
<!-- <!– <ion-icon name="star-half-outline" color="warning"></ion-icon>–>-->
|
||||
<!-- <ion-label class="bold">Task Actions</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- <!– <ion-label class="color">See all</ion-label>–>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<ion-card>
|
||||
<!-- <ion-card-header>-->
|
||||
<!-- <ion-card-subtitle>Completed the task?</ion-card-subtitle>-->
|
||||
<!-- </ion-card-header>-->
|
||||
|
||||
<ion-card-content>
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<div color="warning" class="ion-text-wrap task_button" (click)="taskCancel()">Send cancellation request</div>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<div color="secondary" class="ion-text-wrap task_button cpl" (click)="taskCompleted()">Send completion Message</div>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
<ion-label class="description">{{interest_status}}
|
||||
</ion-label>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
<!-- <ion-card color="warning">-->
|
||||
<!-- <ion-card-header>-->
|
||||
<!-- <ion-card-subtitle>Cancel the task?</ion-card-subtitle>-->
|
||||
<!-- </ion-card-header>-->
|
||||
|
||||
<!-- <ion-card-content>-->
|
||||
<!-- <ion-label class="description">{{interest_status}}-->
|
||||
<!-- </ion-label>-->
|
||||
<!-- </ion-card-content>-->
|
||||
<!-- </ion-card>-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="status_description == 'PASTDUE'" >
|
||||
<ion-card color="danger">
|
||||
<ion-card-header>
|
||||
<ion-card-subtitle>Task is pat due date</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
<ion-button color="secondary" expand="block" >Request Extension</ion-button>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
</div>
|
||||
|
||||
<div *ngIf="status_description == 'REVIEW'" >
|
||||
<ion-card color="success">
|
||||
<ion-card-header>
|
||||
<ion-card-subtitle>Task is in Review</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content> THis task is in review , the owner will give feedback soon. </ion-card-content>
|
||||
</ion-card>
|
||||
</div>
|
||||
|
||||
|
||||
<app-taskactivities [jobData]="jobData"></app-taskactivities>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ion-padding">
|
||||
<div class="flex">
|
||||
<ion-label class="bold_text">{{jobData.title}}</ion-label>
|
||||
<!-- <ion-icon slot="end" name="bookmark-outline" color="primary"></ion-icon>-->
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<ion-label class="bg_text">{{jobData.contract}}</ion-label>
|
||||
<div class="rate">
|
||||
<!-- <ion-icon name="star-half-outline" color="warning"></ion-icon>-->
|
||||
<!-- <ion-label class="review"> ({{jobData.interest_count}} interest)</ion-label>-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ion-label class="color_text">Price: {{jobData.price*0.01}} {{jobData.currency}}</ion-label>
|
||||
|
||||
<div class="items">
|
||||
<div class="stud">
|
||||
<ion-icon slot="start" name="time" color="primary"></ion-icon>
|
||||
<ion-label>Timeline: {{jobData.timeline_days}} days</ion-label>
|
||||
</div>
|
||||
<!-- <div class="stud">-->
|
||||
<!-- <ion-icon slot="start" name="document-text" color="primary"></ion-icon>-->
|
||||
<!-- <ion-label>Certificate</ion-label>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
<div *ngIf="status_description == 'ACTIVE'" >
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment-button value="about">
|
||||
<ion-label>Details</ion-label>
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="lesson">
|
||||
<ion-label>Send Updates</ion-label>
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="review">
|
||||
<ion-label>Actions</ion-label>
|
||||
</ion-segment-button>
|
||||
</ion-segment>
|
||||
|
||||
<div *ngIf="tabs =='about'" class="about">
|
||||
<!-- <ion-label class="head_text">Mentor</ion-label>-->
|
||||
|
||||
<!-- <div class="mentor">-->
|
||||
<!-- <div class="left">-->
|
||||
<!-- <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+jobData.banner+')'"></div>-->
|
||||
<!-- <div style="margin-left: 10px;">-->
|
||||
<!-- <ion-label class="bold">Due Date</ion-label>-->
|
||||
<!-- <ion-label class="grey">{{jobData.delivery_date}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <!– <ion-icon name="chatbubble-ellipses-outline" color="primary"></ion-icon>–>-->
|
||||
<!-- </div>-->
|
||||
<div class="work_area">
|
||||
<ion-label class="head_text">Description</ion-label>
|
||||
<ion-label class="description">{{jobData.job_description}}
|
||||
</ion-label>
|
||||
|
||||
<ion-label class="head_text">Delivery Details</ion-label>
|
||||
<ion-label class="description">{{jobData.description}}
|
||||
</ion-label>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='lesson'" class="lesson">
|
||||
<!-- <div class="flex">-->
|
||||
<!-- <ion-label class="bold">Most Popular Courses</ion-label>-->
|
||||
<!-- <ion-label class="color">See all</ion-label>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="sec">-->
|
||||
<!-- <ion-label class="grey">Due Date:{{jobData.delivery_date}}</ion-label>-->
|
||||
<!-- <ion-label class="color">{{jobData.contract}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<ion-card>
|
||||
<!-- <ion-card-header>-->
|
||||
<!-- <ion-card-subtitle>Send Updates</ion-card-subtitle>-->
|
||||
<!-- </ion-card-header>-->
|
||||
|
||||
<ion-card-content>
|
||||
<ion-textarea label="Your Message to Job Owner" placeholder="Type message here" [(ngModel)]='yourmessage' ></ion-textarea>
|
||||
</ion-card-content>
|
||||
|
||||
<ion-button color="secondary" expand="block" (click)="sendActiveJobMessage()">Send Updates</ion-button>
|
||||
<ion-label class="description">{{interest_msg_status}}
|
||||
</ion-label>
|
||||
</ion-card>
|
||||
|
||||
<!-- <div class="video {{item.who}}" *ngFor="let item of msgListData">-->
|
||||
<!-- <div class="left">-->
|
||||
<!-- <div class="bg_image men_image" [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/msg/TEXT.svg)'"></div>-->
|
||||
|
||||
<!-- <div class="text">-->
|
||||
<!-- <ion-label class="bold_text">{{item.msg_firstname}}-{{item.msg_date}}</ion-label>-->
|
||||
<!-- <ion-label class="grey_text">{{item.message}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <!– <div class="right">–>-->
|
||||
<!-- <!–<!– <ion-icon name="lock-closed-outline"></ion-icon>–>–>-->
|
||||
<!-- <!– </div>–>-->
|
||||
<!-- </div>-->
|
||||
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='review'" class="review_tab">
|
||||
<!-- <div class="total">-->
|
||||
<!-- <div class="star-rate">-->
|
||||
<!-- <!– <ion-icon name="star-half-outline" color="warning"></ion-icon>–>-->
|
||||
<!-- <ion-label class="bold">Task Actions</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- <!– <ion-label class="color">See all</ion-label>–>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<ion-card>
|
||||
<!-- <ion-card-header>-->
|
||||
<!-- <ion-card-subtitle>Completed the task?</ion-card-subtitle>-->
|
||||
<!-- </ion-card-header>-->
|
||||
|
||||
<ion-card-content>
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<div color="warning" class="ion-text-wrap task_button" (click)="taskCancel()">Send cancellation request</div>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<div color="secondary" class="ion-text-wrap task_button cpl" (click)="taskCompleted()">Send completion Message</div>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
<ion-label class="description">{{interest_status}}
|
||||
</ion-label>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
<!-- <ion-card color="warning">-->
|
||||
<!-- <ion-card-header>-->
|
||||
<!-- <ion-card-subtitle>Cancel the task?</ion-card-subtitle>-->
|
||||
<!-- </ion-card-header>-->
|
||||
|
||||
<!-- <ion-card-content>-->
|
||||
<!-- <ion-label class="description">{{interest_status}}-->
|
||||
<!-- </ion-label>-->
|
||||
<!-- </ion-card-content>-->
|
||||
<!-- </ion-card>-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="status_description == 'PASTDUE'" >
|
||||
<ion-card color="danger">
|
||||
<ion-card-header>
|
||||
<ion-card-subtitle>Task is pat due date</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
<ion-button color="secondary" expand="block" >Request Extension</ion-button>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
</div>
|
||||
|
||||
<div *ngIf="status_description == 'REVIEW'" >
|
||||
<ion-card color="success">
|
||||
<ion-card-header>
|
||||
<ion-card-subtitle>Task is in Review</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content> THis task is in review , the owner will give feedback soon. </ion-card-content>
|
||||
</ion-card>
|
||||
</div>
|
||||
|
||||
|
||||
<app-taskactivities [jobData]="jobData"></app-taskactivities>
|
||||
|
||||
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
<ion-footer>
|
||||
|
||||
@@ -107,6 +107,26 @@
|
||||
</div> -->
|
||||
|
||||
<!-- <div class="bg_image back_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>-->
|
||||
<div *ngIf="have_jobs != 0">
|
||||
|
||||
<ion-fab slot="fixed" vertical="top" horizontal="end" [edge]="true">
|
||||
<ion-fab-button>
|
||||
<ion-label>Jobs</ion-label>
|
||||
</ion-fab-button>
|
||||
<ion-fab-list side="bottom">
|
||||
<ion-fab-button>
|
||||
<ion-icon name="document"></ion-icon>
|
||||
</ion-fab-button>
|
||||
<ion-fab-button>
|
||||
<ion-icon name="color-palette"></ion-icon>
|
||||
</ion-fab-button>
|
||||
<ion-fab-button>
|
||||
<ion-icon name="globe"></ion-icon>
|
||||
</ion-fab-button>
|
||||
</ion-fab-list>
|
||||
</ion-fab>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -13,6 +13,7 @@ import { WrenchService } from 'src/app/services/wrench.service';
|
||||
export class HomePage implements OnInit {
|
||||
|
||||
firstname: string = '';
|
||||
have_jobs:number = 0;
|
||||
blogData: [];
|
||||
|
||||
constructor(
|
||||
|
||||
@@ -78,8 +78,9 @@ export class MytasksPage implements OnInit {
|
||||
this.jobsPastDueData =AllResult.filter((item) => item.status_description == 'PASTDUE')
|
||||
this.jobsInReviewData =AllResult.filter((item) => item.status_description == 'REVIEW')
|
||||
this.active_job_count = this.jobsData.length;
|
||||
this.review_job_count = this.jobsPastDueData.length;
|
||||
this.pastdue_job_count = this.jobsInReviewData.length;
|
||||
this.review_job_count = this.jobsInReviewData.length;
|
||||
this.pastdue_job_count = this.jobsPastDueData.length;
|
||||
// debugger;
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user