added stock-form for change minimale quantity
This commit is contained in:
0
src/app/components/stock-form/stock-form.css
Normal file
0
src/app/components/stock-form/stock-form.css
Normal file
12
src/app/components/stock-form/stock-form.html
Normal file
12
src/app/components/stock-form/stock-form.html
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
<form nz-form nzLayout="horizontal" [formGroup]="stockForm" (ngSubmit)="submitForm()">
|
||||||
|
|
||||||
|
<nz-form-item nz-flex>
|
||||||
|
<nz-form-label nzSpan="15" nzRequired>
|
||||||
|
Quantité minimale du produit
|
||||||
|
</nz-form-label>
|
||||||
|
|
||||||
|
<nz-form-control nzSpan="4" nzErrorTip="Ce champ est requis">
|
||||||
|
<input nz-input placeholder="12345" formControlName="minQuantity">
|
||||||
|
</nz-form-control>
|
||||||
|
</nz-form-item>
|
||||||
|
</form>
|
||||||
38
src/app/components/stock-form/stock-form.ts
Normal file
38
src/app/components/stock-form/stock-form.ts
Normal file
@@ -0,0 +1,38 @@
|
|||||||
|
import { Component } from '@angular/core';
|
||||||
|
import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
|
||||||
|
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
|
||||||
|
import {NzInputDirective} from "ng-zorro-antd/input";
|
||||||
|
import {NzColDirective} from "ng-zorro-antd/grid";
|
||||||
|
import {NzFlexDirective} from "ng-zorro-antd/flex";
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-stock-form',
|
||||||
|
imports: [
|
||||||
|
NzFormItemComponent,
|
||||||
|
NzFormLabelComponent,
|
||||||
|
NzFormControlComponent,
|
||||||
|
NzInputDirective,
|
||||||
|
NzColDirective,
|
||||||
|
NzFormDirective,
|
||||||
|
ReactiveFormsModule,
|
||||||
|
NzFlexDirective
|
||||||
|
],
|
||||||
|
templateUrl: './stock-form.html',
|
||||||
|
styleUrl: './stock-form.css',
|
||||||
|
})
|
||||||
|
export class StockForm {
|
||||||
|
stockForm = new FormGroup({
|
||||||
|
minQuantity: new FormControl<number>(null, [Validators.required])
|
||||||
|
})
|
||||||
|
|
||||||
|
submitForm() {
|
||||||
|
// Pour annuler si le formulaire est invalide
|
||||||
|
if (this.stockForm.invalid) return;
|
||||||
|
|
||||||
|
// Pour obtenir la valeur du formulaire
|
||||||
|
console.log(this.stockForm.getRawValue())
|
||||||
|
|
||||||
|
// Pour vider le formulaire
|
||||||
|
this.stockForm.reset()
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -23,7 +23,9 @@
|
|||||||
<td>{{data.minimalQuantity}}</td>
|
<td>{{data.minimalQuantity}}</td>
|
||||||
<td>
|
<td>
|
||||||
<div style="display: flex; gap: 10px;">
|
<div style="display: flex; gap: 10px;">
|
||||||
<app-modalNav nameIcon="edit" name="Modifier"></app-modalNav>
|
<app-modalNav nameIcon="edit" name="Modification de la quantité minimale">
|
||||||
|
<app-stock-form></app-stock-form>
|
||||||
|
</app-modalNav>
|
||||||
<div>
|
<div>
|
||||||
<nz-icon nzType="delete" nzTheme="outline"/>
|
<nz-icon nzType="delete" nzTheme="outline"/>
|
||||||
</div>
|
</div>
|
||||||
@@ -1,15 +1,17 @@
|
|||||||
import { Component } from '@angular/core';
|
import { Component } from '@angular/core';
|
||||||
import {StockInfo} from "../../interfaces/stock.interface";
|
import {StockInfo} from "../../interfaces/stock.interface";
|
||||||
import {NzTableComponent} from "ng-zorro-antd/table";
|
import {NzTableComponent} from "ng-zorro-antd/table";
|
||||||
import {ModalNav} from "../../components/modalNav/modalNav";
|
import {ModalNav} from "../modalNav/modalNav";
|
||||||
import {NzIconDirective} from "ng-zorro-antd/icon";
|
import {NzIconDirective} from "ng-zorro-antd/icon";
|
||||||
|
import {StockForm} from "../stock-form/stock-form";
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-stock-table',
|
selector: 'app-stock-table',
|
||||||
imports: [
|
imports: [
|
||||||
NzTableComponent,
|
NzTableComponent,
|
||||||
ModalNav,
|
ModalNav,
|
||||||
NzIconDirective
|
NzIconDirective,
|
||||||
|
StockForm
|
||||||
],
|
],
|
||||||
templateUrl: './stock-table.html',
|
templateUrl: './stock-table.html',
|
||||||
styleUrl: './stock-table.css',
|
styleUrl: './stock-table.css',
|
||||||
@@ -1,10 +1,10 @@
|
|||||||
import { Component } from '@angular/core';
|
import { Component } from '@angular/core';
|
||||||
import {StockTable} from "../../compontents/stock-table/stock-table";
|
import {StockTable} from "../../components/stock-table/stock-table";
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-stock',
|
selector: 'app-stock',
|
||||||
imports: [
|
imports: [
|
||||||
StockTable
|
StockTable,
|
||||||
],
|
],
|
||||||
templateUrl: './stock.html',
|
templateUrl: './stock.html',
|
||||||
styleUrl: './stock.css',
|
styleUrl: './stock.css',
|
||||||
|
|||||||
Reference in New Issue
Block a user