Skip to content

Commit 9039e43

Browse files
authoredJun 14, 2019
Merge branch 'feature-EV-1154-delivery-areas' into develop
2 parents 273f14a + be2212e commit 9039e43

File tree

7 files changed

+534
-176
lines changed

7 files changed

+534
-176
lines changed
 

‎admin/website-angular/src/app/@shared/warehouse/forms/warehouse-manage-tabs/delivery-areas/warehouse-manage-tabs-delivery-areas.component.html

+93-44
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,48 @@
1-
<div class="map-container">
2-
<div #gmap class="g-map"></div>
1+
<div class="delivery-container">
2+
<div class="map-container">
3+
<div #gmap class="g-map"></div>
4+
</div>
35
<div class="zones">
46
<div class="zones-form">
5-
<div class="col-sm-12" [formGroup]="form" *ngIf="form">
6-
<fieldset>
7-
<div *ngIf="!selectedShape" class="form-group row mb-4">
8-
<div class="col-sm-12 btn-container">
9-
<button
10-
(click)="
11-
selectedShape = 'circle'; startDrawing()
12-
"
13-
nbButton
14-
>
15-
Circle
16-
</button>
17-
<button
18-
(click)="
19-
selectedShape = 'shape'; startDrawing()
20-
"
21-
nbButton
22-
>
23-
Shape
24-
</button>
25-
</div>
7+
<div
8+
class="col-sm-12"
9+
[formGroup]="deliverForm"
10+
*ngIf="deliverForm"
11+
>
12+
<div
13+
*ngIf="!selectedShapeType"
14+
[hidden]="isEditing"
15+
class="form-group row mb-4 centered"
16+
>
17+
<span>Select shape to add a new zone</span>
18+
<div class="col-sm-12 btn-container">
19+
<button
20+
(click)="
21+
selectedShapeType = 'circle'; startDrawing()
22+
"
23+
nbButton
24+
>
25+
Circle
26+
</button>
27+
<button
28+
(click)="
29+
selectedShapeType = 'shape'; startDrawing()
30+
"
31+
nbButton
32+
>
33+
Shape
34+
</button>
2635
</div>
36+
</div>
37+
38+
<span
39+
class="mb-4"
40+
*ngIf="!shapeReady && selectedShapeType"
41+
[hidden]="isEditing"
42+
>Draw a shape on the map</span
43+
>
2744

45+
<fieldset *ngIf="shapeReady || isEditing">
2846
<div class="form-group row">
2947
<label
3048
class="col-sm-4 d-flex align-items-center control-label"
@@ -44,12 +62,13 @@
4462
<div class="form-group row">
4563
<label
4664
class="col-sm-4 d-flex align-items-center control-label"
47-
>*Minimum amount</label
65+
>Minimum amount</label
4866
>
4967

5068
<div class="col-sm-8">
5169
<input
5270
type="number"
71+
step="0.1"
5372
class="form-control"
5473
placeholder="Minimum amount"
5574
formControlName="amount"
@@ -60,57 +79,87 @@
6079
<div class="form-group row">
6180
<label
6281
class="col-sm-4 d-flex align-items-center control-label"
63-
>*Delivery fee</label
82+
>Delivery fee</label
6483
>
6584

6685
<div class="col-sm-8">
6786
<input
6887
type="number"
88+
step="0.1"
6989
class="form-control"
7090
placeholder="Delvery fee"
7191
formControlName="fee"
7292
/>
73-
74-
<!-- <div *ngIf="passwordConfirm.errors && (passwordConfirm.dirty || passwordConfirm.touched)" class="alert alert-danger"> -->
75-
<!-- <div [hidden]="!passwordConfirm.hasError('notMatch')"> -->
76-
<!-- {{ "WAREHOUSE_VIEW.MUTATION.PASSWORDS_DO_NOT_MATCH" | translate }}! -->
77-
<!-- </div> -->
78-
<!-- </div> -->
7993
</div>
8094
</div>
8195

82-
<div *ngIf="selectedShape" class="form-group row">
83-
<div class="col-sm-12 btn-container">
96+
<div class="form-group row">
97+
<div *ngIf="shapeReady" class="col-sm-12 btn-container">
8498
<button
85-
(click)="cancel()"
99+
(click)="cancelAdd()"
86100
nbButton
87-
class="btn btn-warning"
101+
class="btn btn-wa rning"
88102
>
89103
Cancel
90104
</button>
105+
91106
<button
92107
[disabled]="
93-
!shapeReady || form.status === 'INVALID'
108+
!shapeReady ||
109+
deliverForm.status === 'INVALID'
94110
"
95111
nbButton
96112
class="btn btn-primary"
113+
(click)="addZone()"
97114
>
98115
Add
99116
</button>
100117
</div>
118+
119+
<div
120+
*ngIf="isEditing && !shapeReady"
121+
class="col-sm-12 btn-container"
122+
>
123+
<button
124+
(click)="closeEdit()"
125+
nbButton
126+
class="btn btn-warning"
127+
>
128+
Cancel
129+
</button>
130+
<button
131+
[disabled]="deliverForm.status === 'INVALID'"
132+
nbButton
133+
class="btn btn-primary"
134+
(click)="editZone()"
135+
>
136+
Edit
137+
</button>
138+
</div>
101139
</div>
102140
</fieldset>
103141
</div>
104142
</div>
105-
<div class="zones-list">
143+
<div *ngIf="zonesObjects.length > 0" class="zones-list">
106144
<ul>
107-
<li>
108-
<span>
109-
Zone 1
110-
</span>
111-
<div class="btn-container">
112-
<i class="far fa-trash-alt"></i>
113-
<i class="far fa-edit"></i>
145+
<li *ngFor="let zone of zonesObjects; let i = index">
146+
<div
147+
(mouseenter)="highlightZone(zone)"
148+
(mouseleave)="removeHighlight(zone)"
149+
>
150+
<span>
151+
{{ zone.properties.name }}
152+
</span>
153+
<div class="btn-container">
154+
<i
155+
class="far fa-edit"
156+
(click)="setSelection(zone)"
157+
></i>
158+
<i
159+
class="far fa-trash-alt"
160+
(click)="deleteZone(zone)"
161+
></i>
162+
</div>
114163
</div>
115164
</li>
116165
</ul>
Original file line numberDiff line numberDiff line change
@@ -1,68 +1,98 @@
1-
.map-container {
1+
.delivery-container {
22
display: flex;
3-
width: 100%;
4-
height: 60vh;
53

6-
.g-map {
7-
height: 100%;
8-
width: 125%;
4+
.map-container {
5+
width: 70%;
6+
height: 60vh;
7+
margin-left: 14px;
8+
9+
.g-map {
10+
height: 100%;
11+
width: 100%;
12+
}
913
}
1014

1115
.zones {
1216
height: 100%;
13-
}
14-
15-
.btn-container {
16-
display: flex;
17-
justify-content: space-evenly;
18-
width: 60px;
19-
}
20-
21-
.zones-list {
22-
color: white;
17+
width: 30%;
2318

24-
li {
19+
.btn-container {
2520
display: flex;
26-
justify-content: space-between;
27-
width: 80%;
28-
align-items: center;
29-
background-color: #47d26f;
30-
border-radius: 5px;
31-
padding: 6px;
32-
margin-bottom: 5px;
33-
padding-left: 10px;
34-
border: 2px solid transparent;
21+
justify-content: space-evenly;
22+
width: 60px;
23+
}
3524

36-
span {
37-
font-size: 1.2em;
38-
font-family: Exo;
39-
user-select: none;
25+
.zones-form {
26+
.centered {
27+
align-items: center;
28+
flex-direction: column;
4029
}
4130

42-
i {
43-
font-size: 1em;
44-
cursor: pointer;
31+
span {
32+
margin-bottom: 8px;
33+
font-family: Exo;
34+
font-weight: bold;
35+
display: inline-block;
36+
width: 100%;
37+
text-align: center;
38+
font-size: 1.1em;
4539
}
4640
}
4741

48-
li:hover {
49-
opacity: 0.9;
50-
border: 2px solid mediumseagreen;
51-
}
42+
.zones-list {
43+
color: white;
5244

53-
i:hover {
54-
color: dimgrey;
55-
}
45+
ul {
46+
display: flex;
47+
flex-direction: column;
48+
align-items: center;
49+
padding-left: 0 !important;
5650

57-
ul {
58-
display: flex;
59-
flex-direction: column;
60-
align-items: center;
61-
padding-left: 0 !important;
62-
}
51+
li {
52+
display: flex;
53+
justify-content: space-between;
54+
width: 80%;
55+
align-items: center;
56+
background-color: #47d26f;
57+
border-radius: 5px;
58+
padding: 6px;
59+
margin-bottom: 5px;
60+
padding-left: 10px;
61+
border: 2px solid transparent;
6362

64-
.btn-container {
65-
display: flex;
63+
div {
64+
display: flex;
65+
width: 100%;
66+
justify-content: space-between;
67+
align-items: center;
68+
height: 100%;
69+
70+
span {
71+
font-size: 1.2em;
72+
font-family: Exo;
73+
user-select: none;
74+
}
75+
76+
div {
77+
width: 35px;
78+
79+
i {
80+
font-size: 1em;
81+
cursor: pointer;
82+
}
83+
}
84+
}
85+
}
86+
87+
li:hover {
88+
opacity: 0.9;
89+
border: 2px solid mediumseagreen;
90+
}
91+
92+
i:hover {
93+
color: dimgrey;
94+
}
95+
}
6696
}
6797
}
6898
}

‎admin/website-angular/src/app/@shared/warehouse/forms/warehouse-manage-tabs/delivery-areas/warehouse-manage-tabs-delivery-areas.component.ts

+330-80
Large diffs are not rendered by default.

‎admin/website-angular/src/app/@shared/warehouse/forms/warehouse-manage-tabs/warehouse-manage-tabs.component.html

+2
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,9 @@
6161
class="pt-5 pb-3"
6262
>
6363
<ea-warehouse-manage-tabs-delivery-areas
64+
#deliveryAreasForm
6465
[mapCoordEvent]="mapCoordEmitter"
66+
[form]="deliveryAreas"
6567
>
6668
</ea-warehouse-manage-tabs-delivery-areas>
6769
</nb-tab>

‎admin/website-angular/src/app/@shared/warehouse/forms/warehouse-manage-tabs/warehouse-manage-tabs.component.ts

+20-2
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import Warehouse from '@modules/server.common/entities/Warehouse';
88
import ForwardOrdersMethod from '@modules/server.common/enums/ForwardOrdersMethod';
99
import { LocationFormComponent } from '../../../forms/location';
1010
import IGeoLocation from '@modules/server.common/interfaces/IGeoLocation';
11+
import { WarehouseManageTabsDeliveryAreasComponent } from './delivery-areas/warehouse-manage-tabs-delivery-areas.component';
1112

1213
export type WarehouseManageTabs = Pick<
1314
IWarehouseCreateObject,
@@ -32,7 +33,10 @@ export class WarehouseManageTabsComponent {
3233
details: WarehouseManageTabsDetailsComponent.buildForm(formBuilder),
3334
account: WarehouseManageTabsAccountComponent.buildForm(formBuilder),
3435
contactInfo: ContactInfoFormComponent.buildForm(formBuilder),
35-
location: LocationFormComponent.buildForm(formBuilder)
36+
location: LocationFormComponent.buildForm(formBuilder),
37+
deliverAreas: WarehouseManageTabsDeliveryAreasComponent.buildForm(
38+
formBuilder
39+
)
3640
});
3741
}
3842

@@ -51,6 +55,9 @@ export class WarehouseManageTabsComponent {
5155
@ViewChild('locationForm', { static: false })
5256
readonly locationForm: LocationFormComponent;
5357

58+
@ViewChild('deliveryAreasForm', { static: false })
59+
readonly deliveryAreasForm: WarehouseManageTabsDeliveryAreasComponent;
60+
5461
@ViewChild('tabSet', { static: false })
5562
readonly tabSet;
5663

@@ -60,18 +67,25 @@ export class WarehouseManageTabsComponent {
6067
get details() {
6168
return this.form.get('details');
6269
}
70+
6371
get account() {
6472
return this.form.get('account');
6573
}
74+
6675
get contactInfo() {
6776
return this.form.get('contactInfo');
6877
}
78+
6979
get location() {
7080
return this.form.get('location');
7181
}
7282

7383
get validForm() {
7484
return this.form.valid && this.contactInfoForm.validForm;
85+
}
86+
87+
get deliveryAreas() {
88+
return this.form.get('deliverAreas');
7589
}
7690

7791
onCoordinatesChanges(coords: number[]) {
@@ -92,6 +106,7 @@ export class WarehouseManageTabsComponent {
92106
const accountRaw = this.accountComponent.getValue();
93107
const contactRaw = this.contactInfoForm.getValue();
94108
const locationRaw = geoLocationInput;
109+
const deliveryAreasRaw = this.deliveryAreasForm.getValue();
95110

96111
const inputResult: {
97112
basicInfo: WarehouseManageTabs;
@@ -107,11 +122,13 @@ export class WarehouseManageTabsComponent {
107122
ordersPhone: string;
108123
};
109124
location: IGeoLocation;
125+
deliveryAreas: any; // add type
110126
} = {
111127
basicInfo: { ...detailsRaw, username: accountRaw.username },
112128
password: accountRaw.password,
113129
contactInfo: contactRaw,
114-
location: locationRaw as IGeoLocation
130+
location: locationRaw as IGeoLocation,
131+
deliveryAreas: deliveryAreasRaw
115132
};
116133

117134
return inputResult;
@@ -126,6 +143,7 @@ export class WarehouseManageTabsComponent {
126143
this.accountComponent.setValue(warehouse.username);
127144
this.contactInfoForm.setValue(warehouse);
128145
this.locationForm.setValue(geoLocationInput);
146+
this.deliveryAreasForm.setValue(warehouse.deliveryAreas);
129147
}
130148

131149
warehouseUpdateFinish() {

‎admin/website-angular/src/app/pages/+warehouses/+warehouse/+warehouse-manage/warehouse-manage.component.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,8 @@ export class WarehouseManageComponent implements OnInit {
6969
...this._currentWarehouse,
7070
...tabsInfoRaw.basicInfo,
7171
...tabsInfoRaw.contactInfo,
72-
geoLocation: tabsInfoRaw.location
72+
geoLocation: tabsInfoRaw.location,
73+
deliveryAreas: tabsInfoRaw.deliveryAreas
7374
};
7475

7576
const passwordOld = tabsInfoRaw.password.current;
@@ -113,7 +114,6 @@ export class WarehouseManageComponent implements OnInit {
113114
`Warehouse with id ${id} doesn't exist!`
114115
);
115116
}
116-
117117
this._currentWarehouse = warehouse;
118118
this.warehouseManageTabs.setValue(warehouse);
119119
});

‎shared/core/entities/Warehouse.ts

+9
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,15 @@ class Warehouse extends DBObject<IWarehouse, IWarehouseCreateObject>
7878
@Schema(getSchema(GeoLocation))
7979
geoLocation: GeoLocation;
8080

81+
/**
82+
* Warehouse delivery areas in GeoJSON format
83+
*
84+
* @type {Object}
85+
* @memberof Warehouse
86+
*/
87+
@Schema({ type: Object })
88+
deliveryAreas: object;
89+
8190
/**
8291
* Products available at this warehouse for customer to purchase
8392
*

0 commit comments

Comments
 (0)
Please sign in to comment.