### workcenter component ts ###
selector: "workcentersearch",
templateUrl: "workcentersearch.component.html",
export class WorkCenterSearchComponent implements OnInit {
workCenters: WorkCenter[] = [];
@Input() display: boolean = false;
@Output() hideClick = new EventEmitter();
selectedModel: WorkCenter = null;
@Output() chooseClick = new EventEmitter();
{ field: "workstationNumber", header: "Work Center Number" },
{ field: "workstationName", header: "Work Center Name" },
totalRecords: number = 0;
constructor(private workCenterService: WorkCenterService) {}
if (this.mode == "uya") {
this.workCenterService.getUyaWorkCenters().subscribe((x) => {
this.workCenters = x.result;
this.totalRecords = this.workCenters.length;
this.workCenterService.getWorkCenters().subscribe((x) => {
this.workCenters = x.result;
this.totalRecords = this.workCenters.length;
this.chooseClick.emit(this.selectedModel.workstationNumber);
### workcenter component html ###
<div class="card card-w-title">
<p-dialog header="Tezgah Listesi" [(visible)]="display" [modal]="true" [responsive]="true" [style]="{'width': '450px','maxHeight':'600px','overflow-y': 'scroll'}" [minY]="70"
[maximizable]="true" [baseZIndex]="10000" (onHide)="hide()">
<p-table #dt [columns]="cols" [value]="workCenters" selectionMode="single" dataKey="workstationNumber" [paginator]="true"
[rows]="10" [rowsPerPageOptions]="[10]" [totalRecords]="totalRecords"
[style]="{margin:'0',padding:'0'}" [(selection)]="selectedModel">
<ng-template pTemplate="header" let-columns>
<th *ngFor="let col of columns" [pSortableColumn]="col.field">
<p-sortIcon [field]="col.field"></p-sortIcon>
<th *ngFor="let col of columns" [ngSwitch]="col.field">
<input *ngSwitchCase="'workstationNumber'" pInputText type="text" (input)="dt.filter($event.target.value, col.field, col.filterMatchMode)">
<input *ngSwitchCase="'workstationName'" pInputText type="text" (input)="dt.filter($event.target.value, col.field, col.filterMatchMode)">
<ng-template pTemplate="body" let-rec>
<tr [pSelectableRow]="rec">
<td>{{rec.workstationNumber}}</td>
<td>{{rec.workstationName}}</td>
<button type="button" pButton icon="pi pi-check" (click)="choose()" label="Seç"></button>
<button type="button" pButton icon="pi pi-times" (click)="display=false" label="Kapat" class="ui-button-danger"></button>
### operatorrequest component html ###
<div class="ui-toolbar-group-left">
<button pButton type="button" icon="pi pi-shopping-cart" label="Sepeti Görüntüle ( {{this.chart.length}} )"
(mouseenter)="op2.show($event)"></button>
<span style="color: red">* Taleplerin depoya iletilmesi için sepeti görüntüleyip,talebi gönder butonu ile işlem yapılmalıdır. </span>
<p-tabView class="ui-g-12">
<p-tabPanel header="Takım Talebi" [selected]="true">
<!--<div *ngIf="this.tabIndex == 0">-->
<toolrequest (addChart)="addChart($event)" (clearChart)="clearChart($event)"></toolrequest>
<p-tabPanel header="Fikstür ve Gage Talebi">
<!--<div *ngIf="this.tabIndex == 0">-->
<fixtureandgagerequest (addChart)="addChart($event)" (clearChart)="clearChart($event)"></fixtureandgagerequest>
<p-tabPanel header="Sarf Malzeme Talebi">
<!--<div *ngIf="this.tabIndex == 0">-->
<consumablerequest (addChart)="addChart($event)" (clearChart)="clearChart($event)"></consumablerequest>
<p-tabPanel header="Genel Malzeme Talebi">
<!--<div *ngIf="this.tabIndex == 0">-->
<generalrequest (addChart)="addChart($event)" (clearChart)="clearChart($event)"></generalrequest>
<p-tabPanel header="İade Talebi ve Stok Bilgisi">
<!--<div *ngIf="this.tabIndex == 0">-->
<refundrequest></refundrequest>
<p-overlayPanel #op2 [showCloseIcon]="true" [dismissable]="false">
<p-table [value]="chart" [style]="{width: '600px'}" [autoLayout]="true" [responsive]="true">
<ng-template pTemplate="caption">
<div style="height:14px; vertical-align:middle">Talepler</div>
<ng-template pTemplate="header">
<th pSortableColumn="materialNumber">Malzeme <p-sortIcon field="materialNumber"></p-sortIcon>
<th pSortableColumn="requestQuantity">Talep Miktarı <p-sortIcon field="requestQuantity"></p-sortIcon>
<th pSortableColumn="explanation">Açıklama <p-sortIcon field="explanation"></p-sortIcon>
<th style="width:40px"></th>
<ng-template pTemplate="body" let-req>
<td>{{req.materialNumber}}</td>
<td>{{req.requestQuantity}}</td>
<td>{{req.explanation}}</td>
<button pButton type="button" icon="pi pi-trash" class="ui-button-rounded ui-button-danger"
(click)="deleteRecord(req)"></button>
<div style="text-align: right; margin-top: 7px">
<button pButton type="button" label="Temizle" icon="pi pi-trash" class="ui-button-rounded ui-button-warning"
(click)="clearChart(true)" [disabled]="this.chart.length == 0"></button>
<button pButton type="button" label="Talebi Gönder" icon="pi pi-upload" class="ui-button-rounded ui-button-success"
(click)="save()" [disabled]="this.chart.length == 0" *ngIf="!progressVisible"></button>
<div class="ui-g-1" *ngIf="progressVisible">
<p-progressSpinner [style]="{width: '35px', height: '35px'}" strokeWidth="8" fill="#EEEEEE" animationDuration=".5s"></p-progressSpinner>
### operator request component ts file ###
import { Component, OnInit, ViewChild } from '@angular/core';
import { WorkCenterService } from '../../service/workcenter.service';
import { BreadcrumbService } from 'src/app/breadcrumb.service';
import { PartService } from '../../service/part.service';
import { OperatorRequest } from '../../domain/operatorrequest';
import { OperatorRequestService } from '../../service/operatorrequest/operatorrequest.service';
import { ConfirmationService, MessageService } from 'primeng/api';
import { MaterialService } from '../../service/materialListService';
import { ToolRequestComponent } from './toolrequest/toolrequest.component';
import { FixtureAndGageRequestComponent } from './fixtureandgagerequest/fixtureandgagerequest.component';
import { ConsumableRequestComponent } from './consumablerequest/consumablerequest.component';
import { GeneralRequestComponent } from './generalrequest/generalrequest.component';
selector: 'operatorrequest',
templateUrl: 'operatorrequest.component.html'
export class OperatorRequestComponent implements OnInit {
chart: OperatorRequest[] = [];
progressVisible: boolean = false;
@ViewChild(ToolRequestComponent) toolRequestChild: ToolRequestComponent;
@ViewChild(FixtureAndGageRequestComponent) fixtureGageRequestChild: FixtureAndGageRequestComponent;
@ViewChild(ConsumableRequestComponent) consumableRequestChild: ConsumableRequestComponent;
@ViewChild(GeneralRequestComponent) generalRequestChild: GeneralRequestComponent;
constructor(private workCenterService: WorkCenterService, private breadcrumbService: BreadcrumbService,
private partService: PartService, private operatorRequestService: OperatorRequestService,
private messageService: MessageService,
private materialService: MaterialService, private confirmationService: ConfirmationService) {
this.breadcrumbService.setItems([
{ label: 'Request Transactions', routerLink: ['/request'] }
this.materialService.setMaterials();
this.materialService.setFixtureAndGages();
this.materialService.setSupplies();
this.workCenterService.setWorkCenters();
this.partService.setParts();
if (JSON.parse(localStorage.getItem("chart")) != null && JSON.parse(localStorage.getItem("chart")) != undefined) {
this.chart = JSON.parse(localStorage.getItem("chart"));
if (this.chart.find(x => x.materialNumber == request.materialNumber) == null || request.materialNumber == undefined || request.materialNumber == null) {
if (request.materialNumber != undefined && request.materialNumber != null) {
this.messageService.add({ severity: 'success', summary: 'Result', detail: request.materialNumber + " numaralı malzeme sepete eklendi.", life: 10000 });
this.messageService.add({ severity: 'success', summary: 'Result', detail: "Talep sepete eklendi.", life: 10000 });
this.chart.push(request);
this.setChartToLocalStorage();
this.messageService.add({ severity: 'info', summary: 'Result', detail: request.materialNumber + " numaralı malzeme sepette mevcuttur.", life: 10000 });
this.progressVisible = true;
this.operatorRequestService.save(this.chart).subscribe(x => {
let message = "* " + x.result[0].requestNumber + " numaralı talebiniz oluşturulmuştur."
this.messageService.add({ severity: 'success', summary: 'Result', detail: message, life: 10000 });
this.setChartToLocalStorage();
this.progressVisible = false;
this.toolRequestChild.clear();
this.fixtureGageRequestChild.clear();
this.consumableRequestChild.clear();
this.generalRequestChild.clear();
this.messageService.add({ severity: 'error', summary: 'Result', detail: y.error.error.message, life: 10000 });
this.progressVisible = false;
clearChart(checkKontrol) {
if (checkKontrol && this.chart.length > 0) {
this.confirmationService.confirm({
message: 'Sepet içinde yer alan ürünler silinecektir. Devam etmek istiyor musunuz ?',
icon: 'pi pi-exclamation-triangle',
this.setChartToLocalStorage();
this.setChartToLocalStorage();
var index = this.chart.indexOf(item);
this.chart.splice(index, 1);
this.setChartToLocalStorage();
setChartToLocalStorage() {
localStorage.setItem("chart", JSON.stringify(this.chart));
#### fixtureandgagerequest component html ###
<form class="ui-g-8" [formGroup]="searchForm">
<button pButton type="button" label="Yeni Talep" icon="pi pi-trash" (click)="clear()"
class="ui-button-raised ui-button-warning"></button>
<p-fieldset legend="Yeni Talep - ({{this.today}})">
<div class="ui-grid-row">
<span class="redPoint">*</span> Talebin Teslim Saati :
<p-calendar [timeOnly]="true" [readonlyInput]="true" (onSelect)="timeControl()"
formControlName="deliveryTime" [(ngModel)]="model.deliveryTime"></p-calendar>
<div class="ui-grid-row">
<span class="redPoint">*</span> Parça No :
<div class="ui-inputgroup">
<input id="input" style="width: 100%" type="text" pInputText formControlName="partNumber"
[(ngModel)]="model.partNumber" readonly>
<button pButton type="button" icon="pi pi-search" (click)="this.partvisible = true"></button>
<span class="redPoint">*</span> Operasyon No :
<div class="ui-inputgroup">
<input id="input" style="width: 100%" type="text" pInputText formControlName="operationNumber"
[(ngModel)]="model.operationNumber" readonly>
<button pButton type="button" icon="pi pi-search" (click)="partNumberControl()"></button>
<div class="ui-grid-row">
<span class="redPoint">*</span> İşyeri / Tezgah :
<div class="ui-inputgroup">
<input id="input" style="width: 100%" type="text" pInputText readonly formControlName="workStation"
[(ngModel)]="model.workStation">
<button pButton type="button" icon="pi pi-search" (click)="this.visible = true"></button>
<p-checkbox [(ngModel)]="model.isRework" binary="true" [ngModelOptions]="{standalone: true}">
<div class="ui-grid-row">
<input id="input" style="width: 100%" type="text" pInputText readonly
[ngModelOptions]="{standalone: true}" [(ngModel)]="requesterName">
<div class="ui-grid-row">
<button pButton type="button" icon="pi pi-search" label="Bul" (click)="getFixtureAndGages()"
[disabled]="!searchForm.valid" class="ui-button-raised ui-button-info"></button>
<div class="ui-g-1" *ngIf="progressVisible">
<p-progressSpinner [style]="{width: '35px', height: '35px'}" strokeWidth="8" fill="#EEEEEE"
animationDuration=".5s"></p-progressSpinner>
<div class="ui-grid-row">
<span class="redPoint">* Zorunlu alanlar</span>
<div class="ui-grid-row">
<div class="ui-g-12" *ngIf="fixtureGageList.length > 0 || selectedFixtureGageList.length > 0">
<p-fieldset legend="Fixture & Gage">
<p-pickList [source]="fixtureGageList" [target]="selectedFixtureGageList" sourceHeader="Fixture & Gages"
targetHeader="Seçilen Fixture ve Gage" [responsive]="true" filterBy="materialNumber" dragdrop="true"
sourceFilterPlaceholder="Malzeme numarasına göre ara"
targetFilterPlaceholder="Malzeme numarasına göre ara" [sourceStyle]="{'height':'300px'}"
[targetStyle]="{'height':'300px'}" (onMoveToTarget)="enterExplanation($event)">
<ng-template let-item pTemplate="item">
<div class="ui-helper-clearfix">
<span style="font-size:16px; font-weight: bold"> {{item.materialNumber}}</span>
<div style="font-size:14px;float:right;margin:15px 5px 0 0">
{{item.materialType | uppercase}}
<div *ngIf="item.alternativeMaterialNumberList.length > 0">
<span style="font-size:14px; font-style: italic; font-weight: bold">Alternatives</span>
<ul style="list-style-type:square">
<li *ngFor="let i of item.alternativeMaterialNumberList">
<div class="ui-grid-row" *ngIf="fixtureGageList.length > 0 || selectedFixtureGageList.length > 0">
<button pButton type="button" icon="fa fa-shopping-cart" label="Sepete Ekle" (click)="addRequest()"
[disabled]="!(searchForm.valid && this.selectedFixtureGageList.length != 0)"
class="ui-button-raised ui-button-info"></button>
<span style="color: red">* Talep edilecek fixture ya da gage leri sol listeden seçip orta bölümde yer alan ok
işareti ile sağ listeye aktardıktan sonra sepete ekle butonuna basınız.Eğer liste içerisinde gelmeyen bir fikstür veya ölçüm aletine ihtiyaç bulunuyorsa, bir alttaki seçim alanından kodu seçerek sepete ekleme yapabilirsiniz</span>
<div class="ui-grid-row" *ngIf="searchForm.valid && notinListVisible">
<p-fieldset legend="Üst Listede Bulunamayan Fikstür ve Gage Talebi">
<div class="ui-inputgroup ui-g-12" style="width: 100%">
<input id="input" type="text" pInputText readonly [(ngModel)]="fixtureAndGageNotInList" class="ui-g-5">
<button pButton type="button" icon="pi pi-search" (click)="this.fixtureGageVisible = true"
<button pButton type="button" icon="pi pi-upload" label="Sepete Ekle" class="ui-button-success ui-g-5"
(click)="addFixtureAndGage()" pTooltip="Sepete Ekle" tooltipPosition="top"></button>
<workcentersearch [display]="this.visible" (hideClick)="this.visible = false" (chooseClick)="this.choose($event)">
<partsearch [display]="this.partvisible" (hideClick)="this.partvisible = false" (chooseClick)="this.partchoose($event)">
<div *ngIf="this.model.partNumber != null">
<operationsearch [display]="this.opevisible" (hideClick)="this.opevisible = false"
(chooseClick)="this.operationchoose($event)" [partNumber]="this.model.partNumber"></operationsearch>
<materialsearch [display]="this.fixtureGageVisible" (hideClick)="this.fixtureGageVisible = false"
(chooseClick)="this.fixtureGageChoose($event)" [mode]="'fixturegage'"></materialsearch>
<p-dialog header="Explanation" [(visible)]="explanationDialogVisible" [modal]="true" [responsive]="true">
<textarea rows="7" cols="45" pInputTextarea [(ngModel)]="this.explanation"></textarea>
<button type="button" pButton icon="pi pi-check" (click)="saveExplanation()" label="Save"></button>
<button type="button" pButton icon="pi pi-times" (click)="explanationDialogVisible=false" label="Close"
class="ui-button-danger"></button>
#### fixtureandgagerequest component typescript ###
import { Component, OnInit, Output, EventEmitter } from '@angular/core';
import { OperatorRequest } from 'src/app/ui/domain/operatorrequest';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { OperatorRequestService } from 'src/app/ui/service/operatorrequest/operatorrequest.service';
import { T106FixtureGage } from 'src/app/ui/domain/t106fixtureandgage';
import { MessageService } from 'primeng/api';
import { Material } from 'src/app/ui/domain/material';
import { T106Service } from 'src/app/ui/service/t106service.service';
import { ProfileService } from 'src/app/ui/service/profile';
selector: "fixtureandgagerequest",
templateUrl: "fixtureandgagerequest.component.html",
export class FixtureAndGageRequestComponent implements OnInit {
model: OperatorRequest = new OperatorRequest();
visible: boolean = false;
partvisible: boolean = false;
opevisible: boolean = false;
today: string = new Date().toLocaleString();
@Output() addChart = new EventEmitter();
@Output() clearChart = new EventEmitter();
fixtureGageList: T106FixtureGage[] = [];
selectedFixtureGageList: T106FixtureGage[] = [];
fixtureAndGageFromSapList: Material[] = [];
fixtureGageVisible: boolean = false;
fixtureAndGageNotInList: string;
explanationDialogVisible: boolean = false;
explanation: string = null;
selectedFixtureGage: any = new T106FixtureGage();
progressVisible: boolean = false;
notinListVisible: boolean = false;
private t106Service: T106Service,
private messageService: MessageService,
private profileService: ProfileService
this.searchForm = this.fb.group({
deliveryTime: [null, Validators.required],
partNumber: [null, Validators.required],
operationNumber: [null, Validators.required],
this.profileService.userInfo().then((x) => {
let first = x.firstName == undefined ? "" : x.firstName;
let last = x.lastName == undefined ? "" : x.lastName;
this.requesterName = first + " " + last;
choose(workCenterNumber) {
this.model.workStation = workCenterNumber;
if (this.model.partNumber == null || this.model.partNumber == "") {
this.messageService.add({
detail: "Önce parça numarası seçiniz.",
this.model.operationNumber = null;
this.fixtureGageList = [];
this.model.partNumber = partNumber;
operationchoose(operationNumber) {
this.fixtureGageList = [];
this.model.operationNumber = operationNumber;
this.fixtureGageList = [];
this.selectedFixtureGageList = [];
this.model = new OperatorRequest();
let i = this.model.deliveryTime;
this.selectedFixtureGageList.forEach((item) => {
let tempModel = new OperatorRequest();
tempModel.requestQuantity = 1;
tempModel.approvedRequestQuantity = 1;
tempModel.materialNumber = item.materialNumber;
tempModel.deliveryTime = new Date(
tempModel.operationNumber = this.model.operationNumber;
tempModel.partNumber = this.model.partNumber;
tempModel.workStation = this.model.workStation;
tempModel.explanation = item.explanation;
this.addChart.emit(tempModel);
const minimumValidTime = new Date(now.getTime() + 60 * 60 * 1000);
if (this.model.deliveryTime < minimumValidTime) {
this.messageService.add({
detail: "Teslim saati en az 1 saat sonrası olmalıdır.",
this.model.deliveryTime = new Date(minimumValidTime);
this.notinListVisible = true;
this.progressVisible = true;
this.model.operationNumber
this.fixtureGageList = x.result;
this.progressVisible = false;
this.progressVisible = false;
this.messageService.add({
detail: y.error.error.message,
fixtureGageChoose(materialNumber) {
let item = this.fixtureGageList.find(
(x) => x.materialNumber == materialNumber
if (item == undefined || item == null) {
this.fixtureAndGageNotInList = materialNumber;
this.messageService.add({
detail: materialNumber + " malzeme üst listede bulunmaktadır.",
this.fixtureAndGageNotInList == null ||
this.fixtureAndGageNotInList.trim() == ""
this.messageService.add({
detail: "Choose a material !",
let i = this.model.deliveryTime;
let tempModel = new OperatorRequest();
tempModel.requestQuantity = 1;
tempModel.approvedRequestQuantity = 1;
tempModel.materialNumber = this.fixtureAndGageNotInList;
tempModel.deliveryTime = new Date(
tempModel.operationNumber = this.model.operationNumber;
tempModel.partNumber = this.model.partNumber;
tempModel.workStation = this.model.workStation;
this.addChart.emit(tempModel);
enterExplanation($event) {
this.selectedFixtureGage = $event.items[0];
this.explanationDialogVisible = true;
this.selectedFixtureGageList.forEach((x) => {
if (x.materialNumber == this.selectedFixtureGage.materialNumber) {
x.explanation = this.explanation;
this.explanationDialogVisible = false;