Style for work worker

This commit is contained in:
CHIEFSOFT\ameye
2024-02-11 13:29:22 -05:00
parent c2abc5e7c8
commit eddaa760fd
4 changed files with 157 additions and 137 deletions
@@ -1,53 +1,60 @@
<div style="height: 280px;" *ngIf="BANNER_MODE == 3; ">
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="activeTasks()">
<div class="ext-in bg">
<div class="ban-text">Go to active task(s)</div>
<div class="small-text">You have {{active_job_count}} active task(s)</div>
</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ext-in l past-due">
<div class="ban-text">{{pastdue_job_count}} Past Due Task(s) </div>
</div>
</ion-col>
<ion-col class="ext-col" (click)="reView()">
<div class="ext-in r review">
<div class="ban-text">{{review_job_count}} Task(s) in Review</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
<div style="height: 260px" *ngIf="BANNER_MODE == 3">
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="activeTasks()">
<div class="ext-in bg">
<div class="ban-text">Go to Active Task(s)</div>
<div class="small-text">
You have {{ active_job_count }} active task(s)
</div>
</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ext-in l past-due">
<div class="ban-text">{{ pastdue_job_count }} Past Due Task(s)</div>
</div>
</ion-col>
<ion-col class="ext-col" (click)="reView()">
<div class="ext-in r review">
<div class="ban-text">{{ review_job_count }} Task(s) in Review</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div>
<div style="height: 160px;" *ngIf="BANNER_MODE == 1 && active_job_count > 0 ;" >
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ban-text">You have {{active_job_count}} active task(s)</div>
</ion-col>
</ion-row>
</ion-grid>
<div style="height: 130px" *ngIf="BANNER_MODE == 1 && active_job_count > 0">
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="activeTasks()">
<div class="ext-in bg">
<div class="ban-text">Go to Active Task(s)</div>
<div class="small-text">
You have {{ active_job_count }} active task(s)
</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div>
<div style="height: 160px;" *ngIf="BANNER_MODE == 2 && active_job_count == 0 ;" >
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ext-in l past-due">
<div class="ban-text">{{pastdue_job_count}} Past Due Task(s) </div>
</div>
</ion-col>
<ion-col class="ext-col" (click)="reView()">
<div class="ext-in r review">
<div class="ban-text">{{review_job_count}} Task(s) in Review</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
<div style="height: 130px" *ngIf="BANNER_MODE == 2 && active_job_count == 0">
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ext-in l past-due">
<div class="ban-text">{{ pastdue_job_count }} Past Due Task(s)</div>
</div>
</ion-col>
<ion-col class="ext-col" (click)="reView()">
<div class="ext-in r review">
<div class="ban-text">{{ review_job_count }} Task(s) in Review</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div>
<!--<ion-grid class="extra-grid">-->
@@ -66,31 +73,31 @@
<!--</ion-grid>-->
<div
*ngFor="let item of bannerData; let i = index"
class="bg_white {{item.short_style}} {{item.card_type}} "
(click)="onDetails(item)"
*ngFor="let item of bannerData; let i = index"
class="bg_white {{ item.short_style }} {{ item.card_type }} "
(click)="onDetails(item)"
>
<div class="list">
<div *ngIf="item.banner_location === 'URL' ">
<!-- code to render a large video block-->
<div
class="bg_image back_image banner_image"
[style.backgroundImage]="'url('+item.banner+')'"
></div>
</div>
<div *ngIf="item.banner_location === 'LOCAL' ">
<div
class="bg_image back_image banner_image"
[style.backgroundImage]="'url(assets/images/'+item.banner+')'"
></div>
</div>
<div class="detail">
<ion-label class="name">{{item.short_title}}</ion-label>
<ion-label class="bg_text ovf" style="background-color: white"
>{{item.short_description}}</ion-label
>
</div>
<div class="list">
<div *ngIf="item.banner_location === 'URL'">
<!-- code to render a large video block-->
<div
class="bg_image back_image banner_image"
[style.backgroundImage]="'url(' + item.banner + ')'"
></div>
</div>
<!-- <ion-icon slot="end" name="bookmark-outline" class="save" color="primary"></ion-icon>-->
<div *ngIf="item.banner_location === 'LOCAL'">
<div
class="bg_image back_image banner_image"
[style.backgroundImage]="'url(assets/images/' + item.banner + ')'"
></div>
</div>
<div class="detail">
<ion-label class="name">{{ item.short_title }}</ion-label>
<ion-label class="bg_text ovf" style="background-color: white">{{
item.short_description
}}</ion-label>
</div>
</div>
<!-- <ion-icon slot="end" name="bookmark-outline" class="save" color="primary"></ion-icon>-->
</div>
@@ -1,5 +1,5 @@
.p-w{
height:180px;
height:170px;
background-color: rgba(46, 9, 52, 0.47);
border-radius: 10px;
box-shadow: 1px 1px lightgray;
@@ -8,12 +8,12 @@
.extra-grid{
margin: 10px 0px 10px 0px;
padding: 0px;
height: 140px;
height: 130px;
.ext-col{
padding: 5px;
//background-color: #2dd36f;
height: 140px;
height: 130px;
.ext-in{
&.bg{
background-image: url("https://www.wrenchboard.com/assets/images/apps/xt/task.png");
@@ -26,7 +26,8 @@
color: white;
&.past-due{
background-image: url("https://www.wrenchboard.com/assets/images/apps/xt/pastdue.png");
background-color: darkred;
background-color: #d510106b;
color:black;
}
}
&.r{
@@ -37,18 +38,19 @@
color: white;
&.review{
background-image: url("https://www.wrenchboard.com/assets/images/apps/xt/review.png");
background-color: #866508;
background-color: #08860f8f;
color: black;
}
}
background-color: antiquewhite;
height: 130px;
height: 120px;
border-radius: 10px;
box-shadow: 1px 1px lightgray;
text-align: center;
.ban-text{
font-size: 24px;
font-size: 22px;
font-weight: bolder;
padding-top: 40px;
padding-left: 20px;
@@ -85,12 +85,14 @@ export class WorkersDashComponent implements OnInit {
let item: {
'tab': 'PASTDUE'
};
dispatchEvent(new Event("mytask_tab_pastdue"));
this.router.navigate(['tabs/mytasks'],{state: item});
}
reView(){
let item: {
'tab': 'REVIEW'
};
dispatchEvent(new Event("mytask_tab_review"));
this.router.navigate(['tabs/mytasks'],{state: item});
}
@@ -98,6 +100,7 @@ export class WorkersDashComponent implements OnInit {
let item: {
'tab': 'ACTIVE'
};
dispatchEvent(new Event("mytask_tab_active"));
this.router.navigate(['tabs/mytasks'],{state: item});
}
onDetails(item) {
@@ -149,3 +152,7 @@ export class WorkersDashComponent implements OnInit {
}
}
+63 -59
View File
@@ -1,73 +1,83 @@
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";
import {TasksDataService} from "../../store/tasks-data.service";
import {UsersoffersDataService} from "../../store/usersoffers-data.service";
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";
import { TasksDataService } from "../../store/tasks-data.service";
import { UsersoffersDataService } from "../../store/usersoffers-data.service";
@Component({
selector: 'app-mytasks',
templateUrl: './mytasks.page.html',
styleUrls: ['./mytasks.page.scss'],
selector: "app-mytasks",
templateUrl: "./mytasks.page.html",
styleUrls: ["./mytasks.page.scss"],
})
export class MytasksPage implements OnInit {
tabs: any = 'tasks';
extraData:any;
active_offers_count:number =0;
active_job_count:number =0;
pastdue_job_count:number =0;
review_job_count:number =0;
session_image_server:string='';
curr_session:string='';
tabs: any = "tasks";
extraData: any;
active_offers_count: number = 0;
active_job_count: number = 0;
pastdue_job_count: number = 0;
review_job_count: number = 0;
session_image_server: string = "";
curr_session: string = "";
constructor(
private router: Router,
public sessionDataProviderService: SessionDataProviderService,
private wrenchService: WrenchService,
public tasksDataService:TasksDataService,
public usersoffersDataService:UsersoffersDataService
private router: Router,
public sessionDataProviderService: SessionDataProviderService,
private wrenchService: WrenchService,
public tasksDataService: TasksDataService,
public usersoffersDataService: UsersoffersDataService
) {
// this.extraData = this.router.getCurrentNavigation().extras.state;
// debugger;
addEventListener('mytask_tab_pastdue', () => {
this.tabs="pastdue";
});
addEventListener('mytask_tab_review', () => {
this.tabs="review";
});
addEventListener('mytask_tab_active', () => {
this.tabs="tasks";
});
}
myOffersData :[];
myOffersData: [];
ngOnInit() {
// debugger;
this.refreshJobsData();
this.getJobsData();
}
startOfferPage(){
this.router.navigate(['joboffers']);
startOfferPage() {
this.router.navigate(["joboffers"]);
}
activeSelected(item) {
this.router.navigate(['activetask'],{state: item});
this.router.navigate(["activetask"], { state: item });
}
usrData: {
action:number,
member_id: number,
uid: string, sessionid: string,
limit:20,
page:0,
offset: 0,
job_mode: string,
allstatus: number
action: number;
member_id: number;
uid: string;
sessionid: string;
limit: 20;
page: 0;
offset: 0;
job_mode: string;
allstatus: number;
};
jobsTotalInReviewData:any;
jobsInReviewData: [];
jobsTotalInReviewData: any;
jobsInReviewData: [];
jobsTotalPastDueData:any;
jobsPastDueData: [];
jobsTotalPastDueData: any;
jobsPastDueData: [];
jobsTotalData:any;
jobsData: [];
jobsTotalData: any;
jobsData: [];
async refreshJobsData(){
async refreshJobsData() {
this.jobsData = this.tasksDataService.jobsData;
this.jobsPastDueData = this.tasksDataService.jobsPastDueData;
this.jobsInReviewData = this.tasksDataService.jobsInReviewData;
@@ -77,27 +87,23 @@ export class MytasksPage implements OnInit {
this.pastdue_job_count = this.tasksDataService.pastdue_job_count;
this.review_job_count = this.tasksDataService.review_job_count;
this.myOffersData = this.usersoffersDataService.myOffersData;
this.myOffersData = this.usersoffersDataService.myOffersData;
this.active_offers_count = this.usersoffersDataService.total_offers;
this.active_offers_count = this.usersoffersDataService.total_offers;
console.log("Any OFFERRRR-> :::: ",this.active_offers_count);
console.log("Any OFFERRRR-> :::: ", this.active_offers_count);
}
async getJobsData(){
this.curr_session = this.sessionDataProviderService.session;
var interval = setInterval( ()=> {
this.refreshJobsData();
async getJobsData() {
this.curr_session = this.sessionDataProviderService.session;
var interval = setInterval(() => {
this.refreshJobsData();
}, 5000);
}
activeSeleted(item) {
this.router.navigate(['activetask'],{state: item});
this.router.navigate(["activetask"], { state: item });
}
// getPastDueJobsData(){
//
// this.usrData = {action:11200, member_id: this.sessionDataProviderService.member_id, uid: this.sessionDataProviderService.member_uid,
@@ -115,7 +121,6 @@ export class MytasksPage implements OnInit {
//
// }
// getInReviewJobsData(){
//
// this.usrData = {action:11200,
@@ -135,5 +140,4 @@ export class MytasksPage implements OnInit {
// );
//
// }
}