23 
+import { EmailComposer } from '@ionic-native/email-composer/ngx';
24 
+
22 25 
 // library.add(fas,far,fab);
23 26
24 27 
 @NgModule({
@@ -28,6 +31,8 @@ import { NativeGeocoder } from '@ionic-native/native-geocoder/ngx';
28 31 
   providers: [
29 32 
     Geolocation,
30 33 
     NativeGeocoder,
34 
+    CallNumber,
35 
+    EmailComposer,
31 36 
     { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
32 37 
   ],
33 38 
   bootstrap: [AppComponent],

+ 25 - 21
src/app/forgot-password/forgot-password.page.html
查看文件 

@@ -1,31 +1,35 @@
1 1 
 <ion-header>
2 
-  <ion-toolbar>
2 
+  <ion-toolbar class="new-background-color">
3 
+    <ion-buttons slot="start" color="light">
4 
+      <ion-back-button></ion-back-button>
5 
+    </ion-buttons>
3 6 
     <ion-title>Wellness Route</ion-title>
4 7 
   </ion-toolbar>
5 8 
 </ion-header>
6 
-
7 9 
 <ion-content>
8 
-  <ion-row>
9 
-    <ion-col>
10 
-      <div class="ion-text-center">
11 
-        <h1>ลืมรหัสผ่าน</h1>
12 
-      </div>
13 
-    </ion-col>
14 
-  </ion-row>
15 
-  <form>
10 
+  <div><img src="/assets/images/image-006.jpg"></div>
11 
+  <ion-grid>
16 12 
     <ion-row>
17 13 
       <ion-col>
18 
-        <ion-item lines="full">
19 
-          <ion-label position="floating">อีเมล์</ion-label>
20 
-          <ion-input type="email" name="email" [(ngModel)]="email" inputmode="email"></ion-input>
21 
-        </ion-item>
14 
+        <div class="ion-text-center">
15 
+          <h1>ลืมรหัสผ่าน</h1>
16 
+        </div>
22 17 
       </ion-col>
23 18 
     </ion-row>
24 
-    <ion-row>
25 
-      <ion-col>
26 
-        <ion-button type="submit" color="danger" expand="block" (click)="resetPassword()">ส่งรหัสผ่าน</ion-button>
27 
-
28 
-      </ion-col>
29 
-    </ion-row>
30 
-  </form>
19 
+    <form>
20 
+      <ion-row>
21 
+        <ion-col>
22 
+          <ion-item lines="full">
23 
+            <ion-label position="floating">อีเมล์</ion-label>
24 
+            <ion-input type="email" name="email" [(ngModel)]="email" inputmode="email"></ion-input>
25 
+          </ion-item>
26 
+        </ion-col>
27 
+      </ion-row>
28 
+      <ion-row>
29 
+        <ion-col>
30 
+          <ion-button type="submit" color="danger" expand="block" (click)="resetPassword()">ส่งรหัสผ่าน</ion-button>
31 
+        </ion-col>
32 
+      </ion-row>
33 
+    </form>
34 
+  </ion-grid>
31 35 
 </ion-content>

+ 4 - 4
src/app/home/home.page.html
查看文件 

@@ -1,4 +1,4 @@
1 
-<ion-header class="ion-no-border">
1 
+<ion-header>
2 2 
   <ion-toolbar class="new-background-color">
3 3 
     <ion-title>Wellness Route</ion-title>
4 4 
   </ion-toolbar>
 
@@ -64,10 +64,10 @@
64 64 
     <ion-row>
65 65 
       <ion-col>
66 66 
         <ion-card *ngFor="let pldata of placelasted">
67 
-          <div *ngIf="$any(pldata).better_featured_image != null">
68 
-            <img src="{{$any(pldata).better_featured_image.source_url}}" alt="">
67 
+          <div *ngIf="pldata.better_featured_image != null">
68 
+            <img src="{{pldata.better_featured_image.source_url}}" alt="">
69 69 
           </div>
70 
-          <div *ngIf="$any(pldata).better_featured_image == null">
70 
+          <div *ngIf="pldata.better_featured_image == null">
71 71 
             <img src="/assets/images/temp.png" />
72 72 
           </div>
73 73 
           <ion-card-header>

+ 1 - 11
src/app/home/home.page.scss
查看文件 

@@ -4,24 +4,14 @@ ion-card-title {
4 4 
   font-size: 20px;
5 5 
 }
6 6
7 
-ion-searchbar{
8 
-  // --color:#000;
9 
-  // --placeholder-color:#000;
10 
-  // --background:#000;
11 
-}
12 
-
13 7 
 .search{
14 8 
   padding: 0px !important;
15 9 
   // margin-bottom: 30px;
16 10 
   margin-top: 10px;
17 11 
 }
18 12
19 
-// .red {
20 
-//   color: rgb(255, 0, 0);
21 
-// }
22 
-
23 13 
 .catshow {
24 
-  height: 100px;
14 
+  height: 80px;
25 15 
   // background-color: rgb(183, 210, 236);
26 16 
   border: solid 1px;
27 17 
   border-color: cornflowerblue;

+ 71 - 65
src/app/login/login.page.html
查看文件 

@@ -1,78 +1,84 @@
1 1 
 <ion-header>
2 
-  <ion-toolbar>
2 
+  <ion-toolbar class="new-background-color">
3 
+    <ion-buttons slot="start" color="light">
4 
+      <ion-back-button></ion-back-button>
5 
+    </ion-buttons>
3 6 
     <ion-title>Wellness Route</ion-title>
4 7 
   </ion-toolbar>
5 8 
 </ion-header>
6 
-
7 9 
 <ion-content>
8 
-  <ion-row>
9 
-    <ion-col>
10 
-      <div class="ion-text-center">
11 
-        <h1>เข้าสู่ระบบ</h1>
12 
-      </div>
13 
-    </ion-col>
14 
-  </ion-row>
15 
-  <ion-row>
16 
-    <ion-col>
17 
-      <form>
18 
-        <ion-item lines="full">
19 
-          <ion-label position="floating">อีเมล์</ion-label>
20 
-          <ion-input type="text" required="true" [(ngModel)]='registerForm.email' name='email' type='email'></ion-input>
21 
-        </ion-item>
10 
+  <div><img src="/assets/images/image-005.jpg"></div>
11 
+  <ion-grid>
12 
+    <ion-row>
13 
+      <ion-col>
14 
+        <div class="ion-text-center">
15 
+          <h1>เข้าสู่ระบบ</h1>
16 
+        </div>
17 
+      </ion-col>
18 
+    </ion-row>
19 
+    <ion-row>
20 
+      <ion-col>
21 
+        <form>
22 
+          <ion-item lines="full">
23 
+            <ion-label position="floating">อีเมล์</ion-label>
24 
+            <ion-input type="text" required="true" [(ngModel)]='registerForm.email' name='email' type='email'>
25 
+            </ion-input>
26 
+          </ion-item>
22 27
23 
-        <ion-item lines="full">
24 
-          <ion-label position="floating">รหัสผ่าน</ion-label>
25 
-          <ion-input type="password" required [(ngModel)]='registerForm.password' name='password'></ion-input>
26 
-        </ion-item>
27 
-      </form>
28 
-    </ion-col>
29 
-  </ion-row>
30 
-  <ion-row>
28 
+          <ion-item lines="full">
29 
+            <ion-label position="floating">รหัสผ่าน</ion-label>
30 
+            <ion-input type="password" required [(ngModel)]='registerForm.password' name='password'></ion-input>
31 
+          </ion-item>
32 
+        </form>
33 
+      </ion-col>
34 
+    </ion-row>
35 
+    <ion-row>
36 
+      <ion-col>
37 
+        <ion-button type="submit" color="success" expand="block" (click)="userLogin()">Login</ion-button>
38 
+      </ion-col>
39 
+    </ion-row>
40 
+    <ion-row>
41 
+      <ion-col class='ion-text-center'>
42 
+        <a (click)="openForgotPassword()" class="small-text">ลืมรหัส</a>
43 
+      </ion-col>
44 
+      <ion-col class='ion-text-center'>
45 
+        <a (click)="openRegister()" class="small-text">สม้ครใหม่</a>
46 
+      </ion-col>
47 
+    </ion-row>
48 
+    <ion-row>
49 
+      <ion-col>
50 
+        <span class="divider line one-line">หรือ</span>
51 
+      </ion-col>
52 
+    </ion-row>
53 
+    <ion-row>
54 
+      <ion-col>
55 
+        <ion-button class="log-fb-in-button" expand="block" (click)="doFbLogin()">
56 
+          Log in with Facebook
57 
+        </ion-button><br>
58 
+        <button (click)="appleSignIn()" block [hidden]="isAndroid">
59 
+          <img src="assets/images/appleid_button@2x.png">
60 
+        </button>
61 
+      </ion-col>
62 
+    </ion-row>
31 63 
     <ion-col>
32 
-      <ion-button type="submit" color="success" expand="block" (click)="userLogin()">Login</ion-button>
33 
-    </ion-col>
34 
-  </ion-row>
35 
-  <ion-row>
36 
-    <ion-col class='ion-text-center'>
37 
-      <a (click)="openForgotPassword()" class="small-text">ลืมรหัส</a>
64 
+      <a [routerLink]="['/tabs/forgot-password']">
65 
+        page ลืมรหัส
66 
+      </a>
38 67 
     </ion-col>
39 
-    <ion-col class='ion-text-center'>
40 
-      <a (click)="openRegister()" class="small-text">สม้ครใหม่</a>
68 
+    <ion-col>
69 
+      <a [routerLink]="['/tabs/register']">
70 
+        page register or signin
71 
+      </a>
41 72 
     </ion-col>
42 
-  </ion-row>
43 
-  <ion-row>
44 73 
     <ion-col>
45 
-      <span class="divider line one-line">หรือ</span>
74 
+      <a [routerLink]="['/tabs/reset-password']">
75 
+        page reset password
76 
+      </a>
46 77 
     </ion-col>
47 
-  </ion-row>
48 
-  <ion-row>
49 78 
     <ion-col>
50 
-      <ion-button class="log-fb-in-button" expand="block" (click)="doFbLogin()">
51 
-        Log in with Facebook
52 
-      </ion-button><br>
53 
-      <button (click)="appleSignIn()" block [hidden]="isAndroid">
54 
-        <img src="assets/images/appleid_button@2x.png">
55 
-      </button>
79 
+      <a [routerLink]="['/tabs/profile']">
80 
+        page profile
81 
+      </a>
56 82 
     </ion-col>
57 
-  </ion-row>
58 
-  <ion-col>
59 
-    <a [routerLink]="['/tabs/forgot-password']">
60 
-      page ลืมรหัส
61 
-    </a>
62 
-  </ion-col>
63 
-  <ion-col>
64 
-    <a [routerLink]="['/tabs/register']">
65 
-      page register or signin
66 
-    </a>
67 
-  </ion-col>
68 
-  <ion-col>
69 
-    <a [routerLink]="['/tabs/reset-password']">
70 
-      page reset password
71 
-    </a>
72 
-  </ion-col>
73 
-  <ion-col>
74 
-    <a [routerLink]="['/tabs/profile']">
75 
-      page profile
76 
-    </a>
77 
-  </ion-col>
78 
-</ion-content>
83 
+  </ion-grid>
84 
+</ion-content>

+ 22 - 23
src/app/login/login.page.scss
查看文件 

@@ -1,26 +1,25 @@
1 
-
2 1 
 .divider {
3 
-    display: flex;
4 
-
5 
-    &:before,
6 
-    &:after {
7 
-      content: "";
8 
-      flex: 1;
9 
-    }
2 
+  display: flex;
3 
+
4 
+  &:before,
5 
+  &:after {
6 
+    content: "";
7 
+    flex: 1;
8 
+  }
9 
+}
10 
+.line {
11 
+  align-items: center;
12 
+  margin: 1em -1em;
13 
+  color: #5f5e5e;
14 
+  &:before,
15 
+  &:after {
16 
+    height: 1px;
17 
+    margin: 0 1em;
10 18 
   }
11 
-  .line {
12 
-    align-items: center;
13 
-    margin: 1em -1em;
14 
-    color: #5f5e5e;
15 
-    &:before,
16 
-    &:after {
17 
-      height: 1px;
18 
-      margin: 0 1em;
19 
-    }
19 
+}
20 
+.one-line {
21 
+  &:before,
22 
+  &:after {
23 
+    background: #5f5e5e;
20 24 
   }
21 
-  .one-line {
22 
-    &:before,
23 
-    &:after {
24 
-      background: #5f5e5e;
25 
-    }
26 
-  }
25 
+}

+ 1 - 5
src/app/nearme/nearme.page.html
查看文件 

@@ -8,12 +8,8 @@
8 8 
 </ion-header>
9 9
10 10 
 <ion-content>
11 
+  <div #nearmap id="nearmap"></div>
11 12 
   <ion-grid>
12 
-    <ion-row>
13 
-      <ion-col>
14 
-        <div #nearmap id="nearmap"></div>
15 
-      </ion-col>
16 
-    </ion-row>
17 13 
     <ion-row >
18 14 
       <ion-col>
19 15 
         <ion-card *ngFor="let nearm of placenear">

+ 7 - 8
src/app/nearme/nearme.page.scss
查看文件 

@@ -1,9 +1,8 @@
1 1 
 ion-card-title {
2 
-    font-family: "IBM Plex Sans Thai", sans-serif !important;
3 
-    font-weight: 600;
4 
-    font-size: 20px;
5 
-  }
6 
-
7 
-  #nearmap {
8 
-    height: 300px;
9 
-}
2 
+  font-family: "IBM Plex Sans Thai", sans-serif !important;
3 
+  font-weight: 600;
4 
+  font-size: 20px;
5 
+}
6 
+#nearmap {
7 
+  height: 300px;
8 
+}

+ 1 - 3
src/app/place/place.page.html
查看文件 

@@ -8,8 +8,7 @@
8 8 
 </ion-header>
9 9
10 10 
 <ion-content>
11 
-  <img src="/assets/images/golf-bg.jpg">
12 
-  <div class="holidaycard">
11 
+  <img src="/assets/images/image-010.jpg">
13 12 
     <ion-grid>
14 13 
       <ion-row>
15 14 
         <ion-col size="12">
 
@@ -35,5 +34,4 @@
35 34 
         </ion-card-header>
36 35 
       </ion-card>
37 36 
     </ion-grid>
38 
-  </div>
39 37 
 </ion-content>

+ 12 - 12
src/app/place/place.page.scss
查看文件 

@@ -1,15 +1,15 @@
1 
-.holidaycard {
2 
-    position: absolute;
3 
-    left: 0px;
4 
-    // bottom: 0px;
5 
-    top:200px;
6 
-    min-height: 48%;
7 
-    width: 100%;
8 
-    padding: 5px;
9 
-    border-radius: 15px ;
10 
-    background: white;
11 
-    --background: white;
12 
-  }
1 
+// .holidaycard {
2 
+//     position: absolute;
3 
+//     left: 0px;
4 
+//     // bottom: 0px;
5 
+//     top:200px;
6 
+//     min-height: 48%;
7 
+//     width: 100%;
8 
+//     padding: 5px;
9 
+//     border-radius: 15px ;
10 
+//     background: white;
11 
+//     --background: white;
12 
+//   }
13 13
14 14 
   ion-card-title {
15 15 
     font-family: "IBM Plex Sans Thai", sans-serif !important;

+ 43 - 26
src/app/placedetail/placedetail.page.html
查看文件 

@@ -16,7 +16,7 @@
16 16 
   </div>
17 17 
   <!-- <img src="{{placelist?.better_featured_image.source_url}}"> -->
18 18 
   <ion-grid>
19 
-    <ion-row>
19 
+    <ion-row color="light">
20 20 
       <ion-col size="12">
21 21 
         <div class="txt-place-title">{{placelist?.title.rendered}}</div>
22 22 
       </ion-col>
 
@@ -25,16 +25,22 @@
25 25 
         <div>{{ placelist?.acf.openclose }}</div>
26 26 
       </ion-col>
27 27 
       <ion-col size="12">
28 
-        {{ placelist?.acf.gmap.address }}
29 
-        {{ placelist?.acf.gmap.lat }}
30 
-        {{ placelist?.acf.gmap.lng }}
31 
-        <img src="/assets/images/map-temp.jpg" alt="">
28 
+        <!-- {{ placelist?.acf.gmap.address }} -->
29 
+        <!-- {{ placelist?.acf.gmap.lat }}
30 
+        {{ placelist?.acf.gmap.lng }} -->
31 
+        <div class="map-wrapper">
32 
+          <div id="map_center">
33 
+            <img src="/assets/icon/location-marker.png" />
34 
+          </div>
35 
+          <div #map id="map"></div>
36 
+        </div>
32 37 
       </ion-col>
33 38 
       <ion-col size="12">
34 39 
         <ion-row>
35 40 
           <ion-col size="4" class="ion-text-center">
36 
-            <!-- <div [innerHTML]="placelist?.acf.phone"></div>                         -->
37 
-            <fa-icon [icon]="['fas', 'phone-square-alt']" size="2x"></fa-icon>
41 
+            <div (click)="callNow('{{placelist?.acf.phone}}')">
42 
+              <fa-icon [icon]="['fas', 'phone-square-alt']" size="2x"></fa-icon>
43 
+            </div>
38 44 
           </ion-col>
39 45 
           <ion-col size="4" class="ion-text-center">
40 46 
             <!-- <div [innerHTML]="placelist?.acf.phone"></div>                         -->
 
@@ -42,29 +48,40 @@
42 48 
           </ion-col>
43 49 
           <ion-col size="4" class="ion-text-center">
44 50 
             <!-- <div [innerHTML]="placelist?.acf.email"></div>             -->
45 
-            <fa-icon [icon]="['fas', 'envelope']" size="2x"></fa-icon>
51 
+            <div (click)="email2Place('{{placelist?.acf.email}}')">
52 
+              <fa-icon [icon]="['fas', 'envelope']" size="2x"></fa-icon>
53 
+            </div>
46 54 
           </ion-col>
47 55 
         </ion-row>
48 56 
       </ion-col>
57 
+
49 58 
       <ion-col size="12">
50 
-        <div class="txt-lead">ที่อยู่</div>
51 
-        <div [innerHTML]="placelist?.acf.address"></div>
52 
-      </ion-col>
53 
-      <ion-col size="12">
54 
-        <!-- <div class="txt-lead">รายละเอียด</div>
55 
-        <div [innerHTML]="placelist?.content.rendered"></div> -->
56 
-        <!-- <div>{{placelist?.content.rendered}}</div> -->
57 
-        <!-- <ion-button (click)="loadMap()" shape="round" color="dark">
58 
-          <ion-icon slot="start" name="locate"></ion-icon>
59 
-          Where I Am
60 
-        </ion-button> -->
61 
-        <div class="map-wrapper">
62 
-          <div id="map_center">
63 
-            <img src="assets/icon/location-marker.png" />
64 
-          </div>
65 
-          <div #map id="map"></div>
66 
-        </div>
67 
-
59 
+        <ion-segment (ionChange)="segmentChanged($event)" value="list1">
60 
+          <ion-segment-button value="list1">
61 
+            <ion-label>
62 
+              ที่อยู่
63 
+            </ion-label>
64 
+          </ion-segment-button>
65 
+          <ion-segment-button value="list2">
66 
+            <ion-label>
67 
+              รายละเอียด
68 
+            </ion-label>
69 
+          </ion-segment-button>
70 
+        </ion-segment>
71 
+
72 
+        <ion-list *ngIf="segment === 'list1'">
73 
+          <ion-col size="12">
74 
+            <!-- <div class="txt-lead">ที่อยู่</div> -->
75 
+            <div [innerHTML]="placelist?.acf.address"></div>
76 
+          </ion-col>
77 
+        </ion-list>
78 
+
79 
+        <ion-list *ngIf="segment === 'list2'">
80 
+          <ion-col size="12">
81 
+            <!-- <div class="txt-lead">ที่อยู่</div> -->
82 
+            <div [innerHTML]="placelist?.content.rendered"></div>
83 
+          </ion-col>
84 
+        </ion-list>
68 85 
       </ion-col>
69 86 
     </ion-row>
70 87

+ 0 - 17
src/app/placedetail/placedetail.page.scss
查看文件 

@@ -1,16 +1,3 @@
1 
-// ion-toolbar{
2 
-//     --background: transparent;
3 
-//     --border-color: transparent;
4 
-// }
5 
-// ion-toolbar{
6 
-//     --background: transparent;
7 
-//     --border-color: transparent;
8 
-// }
9 
-// ion-content{
10 
-//     --offset-top:0px;
11 
-//     position: absolute;
12 
-// }
13 
-
14 1 
 .bg {
15 2 
   position: absolute;
16 3 
   left: 0px;
 
@@ -29,10 +16,6 @@
29 16 
     --background: white;
30 17 
   }
31 18 
 }
32 
-
33 
-.asd {
34 
-}
35 
-
36 19 
 .asd .country {
37 20 
   position: absolute;
38 21 
   top: 50px;

+ 19 - 19
src/app/placedetail/placedetail.page.ts
查看文件 

@@ -4,6 +4,8 @@ import { WpServiceService } from '../wp-service.service';
4 4
5 5 
 import { Geolocation } from '@ionic-native/geolocation/ngx';
6 6 
 import { NativeGeocoder, NativeGeocoderResult, NativeGeocoderOptions } from '@ionic-native/native-geocoder/ngx';
7 
+import { CallNumber } from '@ionic-native/call-number/ngx';
8 
+import { EmailComposer } from '@ionic-native/email-composer/ngx';
7 9
8 10 
 declare var google;
9 11 
 
@@ -17,6 +19,8 @@ export class PlacedetailPage implements OnInit {
17 19 
   data: any;
18 20 
   placelist: any;
19 21
22 
+  public segment: string = "list1";
23 
+
20 24 
   @ViewChild('map', { static: false }) mapElement: ElementRef;
21 25 
   map: any;
22 26 
   address: string;
 
@@ -24,9 +28,9 @@ export class PlacedetailPage implements OnInit {
24 28 
   longitude: number;
25 29 
   latdynamic: any;
26 30 
   londynamic: any;
27 
-
28 31
29 
-  constructor(private wpservice: WpServiceService, private route: ActivatedRoute, private router: Router, private geolocation: Geolocation, private nativeGeocoder: NativeGeocoder) { }
32 
+
33 
+  constructor(private wpservice: WpServiceService, private route: ActivatedRoute, private router: Router, private geolocation: Geolocation, private nativeGeocoder: NativeGeocoder,private callNumber: CallNumber, private emailComposer: EmailComposer) { }
30 34 
   @Input() id: string;
31 35 
   showDiss = false;
32 36 
 
@@ -121,21 +125,17 @@ export class PlacedetailPage implements OnInit {
121 125
122 126 
   }
123 127
124 
-  // getAddressFromCoords2(lattitude, longitude) {
125 
-  //   console.log("getAddressFromCoords2 " + lattitude + " " + longitude);
126 
-  //   let options: NativeGeocoderOptions = {
127 
-  //     useLocale: true,
128 
-  //     maxResults: 5
129 
-  //   };
130 
-  // }
131 
-
132 
-  // getGeoencoder(latitude, longitude) {
133 
-  //   this.nativeGeocoder.reverseGeocode(latitude, longitude, this.geoencoderOptions)
134 
-  //     .then((result: NativeGeocoderResult[]) => {
135 
-  //       this.address = this.generateAddress(result[0]);
136 
-  //     })
137 
-  //     .catch((error: any) => {
138 
-  //       alert('Error getting location' + JSON.stringify(error));
139 
-  //     });
140 
-  // }
128 
+  segmentChanged(ev: any) {
129 
+    this.segment = ev.detail.value;
130 
+  }
131 
+
132 
+  callNow(number) {
133 
+    this.callNumber.callNumber(number, true)
134 
+      .then(res => console.log('Launched dialer!', res))
135 
+      .catch(err => console.log('Error launching dialer', err));
136 
+  }
137 
+
138 
+  email2Place(mail) {
139 
+    this.emailComposer.open(mail)
140 
+  }
141 141 
 }

+ 18 - 11
src/app/profile/profile.page.html
查看文件 

@@ -1,10 +1,14 @@
1 1 
 <ion-header>
2 
-  <ion-toolbar>
2 
+  <ion-toolbar class="new-background-color">
3 
+    <ion-buttons slot="start" color="light">
4 
+      <ion-back-button></ion-back-button>
5 
+    </ion-buttons>
3 6 
     <ion-title>Wellness Route</ion-title>
4 7 
   </ion-toolbar>
5 8 
 </ion-header>
6 
-<ion-content fullscreen="true">
7 
-  <!-- <div *ngIf="(user2 | async) as user; else loading"> -->
9 
+<ion-content>
10 
+  <ion-grid>
11 
+    <!-- <div *ngIf="(user2 | async) as user; else loading"> -->
8 12 
     <ion-row>
9 13 
       <ion-col>
10 14 
         <div class="ion-text-center">
 
@@ -17,32 +21,35 @@
17 21 
         <div class="card">
18 22 
           <div class="header">
19 23 
             <div class="avatar">
20 
-              <img [src]="$any(user).picture_large.data.url" *ngIf="user['picture_large'] != undefined" />
21 
-              <img src="/assets/images/icon-user.png" *ngIf="user['picture_large'] == undefined" />
24 
+              <!-- <img [src]="$any(user).picture_large.data.url" *ngIf="user['picture_large'] != undefined" /> -->
25 
+              <!-- <img src="/assets/images/icon-user.png" *ngIf="user['picture_large'] == undefined" /> -->
26 
+              <img src="/assets/images/icon-user.png">
22 27 
             </div>
23 28 
           </div>
24 29 
         </div>
25 30 
         <div class="card-body">
26 31 
           <div class="user-meta ion-text-center">
27 
-            <h3 class="playername">{{ $any(user).name }}</h3>
32 
+            <!-- <h3 class="playername">{{ $any(user).name }}</h3> -->
28 33 
           </div>
29 34 
           <form>
30 35 
             <ion-item lines="full">
31 36 
               <ion-label>ชื่อ</ion-label>
32 
-              {{ $any(user).name }}
37 
+              <!-- {{ $any(user).name }} -->
33 38 
             </ion-item>
34 39 
             <ion-item lines="full">
35 
-              <ion-label>Email</ion-label>{{ $any(user).email }}
40 
+              <ion-label>อีเมล์</ion-label>
41 
+              <!-- {{ $any(user).email }} -->
36 42 
             </ion-item>
37 43 
             <div class="ion-padding-vertical">
38 
-              <ion-button type="submit" color="danger" expand="block" (click)="logout()">Log Out</ion-button>
44 
+              <!-- <ion-button type="submit" color="danger" expand="block" (click)="logout()">Log Out</ion-button> -->
39 45 
             </div>
40 46 
           </form>
41 47 
         </div>
42 48 
       </ion-col>
43 49 
     </ion-row>
44 
-  <!-- </div> -->
45 
-  <!-- <ng-template #loading>
50 
+    <!-- </div> -->
51 
+    <!-- <ng-template #loading>
46 52 
     Loading stuff...
47 53 
   </ng-template> -->
54 
+  </ion-grid>
48 55 
 </ion-content>

+ 1 - 0
src/app/profile/profile.page.ts
查看文件 

@@ -8,6 +8,7 @@ import { Component, OnInit } from '@angular/core';
8 8 
 export class ProfilePage implements OnInit {
9 9
10 10 
   user2: any;
11 
+  user: any;
11 12
12 13 
   constructor() { }
13 14

+ 28 - 29
src/app/province/province.page.html
查看文件 

@@ -6,34 +6,33 @@
6 6 
     <ion-title>Wellnewss Route</ion-title>
7 7 
   </ion-toolbar>
8 8 
 </ion-header>
9 
-
10 9 
 <ion-content>
11 
-  <img src="/assets/images/welcome_drone.jpeg" alt="">
12 
-  <div class="holidaycard">
13 
-    <ion-grid>
14 
-      <ion-row>
15 
-        <ion-col size="12">
16 
-          <div class="txt-place-title">Province Name</div>
17 
-        </ion-col>
18 
-      </ion-row>
19 
-      <ion-row>
20 
-        <ion-col>
21 
-          <ion-toolbar class="search">
22 
-            <ion-searchbar placeholder="ค้นหา"></ion-searchbar>
23 
-          </ion-toolbar>
24 
-        </ion-col>
25 
-      </ion-row>
26 
-      <ion-card *ngFor="let provlist of provicelist">
27 
-        <div *ngIf="$any(provlist).better_featured_image != null">
28 
-          <img src="{{$any(provlist).better_featured_image.source_url}}" alt="">
29 
-        </div>
30 
-        <div *ngIf="$any(provlist).better_featured_image == null">
31 
-          <img src="/assets/images/temp.png" />
32 
-        </div>
33 
-        <ion-card-header>
34 
-          <a [routerLink]="['/tabs/place/', provlist.id]"><ion-card-title [innerHTML]="provlist.title.rendered"></ion-card-title></a>
35 
-        </ion-card-header>
36 
-      </ion-card>
37 
-    </ion-grid>
38 
-  </div>
10 
+  <img src="/assets/images/image-004.jpg" alt="">
11 
+  <ion-grid>
12 
+    <ion-row>
13 
+      <ion-col size="12">
14 
+        <div class="txt-place-title">Province Name</div>
15 
+      </ion-col>
16 
+    </ion-row>
17 
+    <ion-row>
18 
+      <ion-col>
19 
+        <ion-toolbar class="search">
20 
+          <ion-searchbar placeholder="ค้นหา"></ion-searchbar>
21 
+        </ion-toolbar>
22 
+      </ion-col>
23 
+    </ion-row>
24 
+    <ion-card *ngFor="let provlist of provicelist">
25 
+      <div *ngIf="$any(provlist).better_featured_image != null">
26 
+        <img src="{{$any(provlist).better_featured_image.source_url}}" alt="">
27 
+      </div>
28 
+      <div *ngIf="$any(provlist).better_featured_image == null">
29 
+        <img src="/assets/images/temp.png" />
30 
+      </div>
31 
+      <ion-card-header>
32 
+        <a [routerLink]="['/tabs/place/', provlist.id]">
33 
+          <ion-card-title [innerHTML]="provlist.title.rendered"></ion-card-title>
34 
+        </a>
35 
+      </ion-card-header>
36 
+    </ion-card>
37 
+  </ion-grid>
39 38 
 </ion-content>

+ 12 - 12
src/app/province/province.page.scss
查看文件 

@@ -1,16 +1,16 @@
1 1
2 
-.holidaycard {
3 
-  position: absolute;
4 
-  left: 0px;
5 
-  // bottom: 0px;
6 
-  top:200px;
7 
-  min-height: 48%;
8 
-  width: 100%;
9 
-  padding: 5px;
10 
-  border-radius: 15px ;
11 
-  background: white;
12 
-  --background: white;
13 
-}
2 
+// .holidaycard {
3 
+//   position: absolute;
4 
+//   left: 0px;
5 
+//   // bottom: 0px;
6 
+//   top:200px;
7 
+//   min-height: 48%;
8 
+//   width: 100%;
9 
+//   padding: 5px;
10 
+//   border-radius: 15px ;
11 
+//   background: white;
12 
+//   --background: white;
13 
+// }
14 14
15 15 
 ion-card-title {
16 16 
   font-family: "IBM Plex Sans Thai", sans-serif !important;

+ 10 - 7
src/app/register-form/register-form.page.html
查看文件 

@@ -1,10 +1,13 @@
1 1 
 <ion-header>
2 
-  <ion-toolbar>
2 
+  <ion-toolbar class="new-background-color">
3 
+    <ion-buttons slot="start" color="light">
4 
+      <ion-back-button></ion-back-button>
5 
+    </ion-buttons>
3 6 
     <ion-title>Wellness Route</ion-title>
4 7 
   </ion-toolbar>
5 8 
 </ion-header>
6 
-
7 9 
 <ion-content>
10 
+  <div><img src="/assets/images/image-001.jpg"></div>
8 11 
   <ion-row>
9 12 
     <ion-col>
10 13 
       <div class="ion-text-center">
 
@@ -13,9 +16,9 @@
13 16 
     </ion-col>
14 17 
   </ion-row>
15 18 
   <ion-row>
16 
-    <ion-col>
19 
+    <ion-col>
17 20 
       <form>
18 
-        <ion-text *ngIf="errorText" color="primary" style='background-color:#fff'>
21 
+        <ion-text *ngIf="errorText" color="primary">
19 22 
           {{ errorText }}
20 23 
         </ion-text>
21 24 
         <ion-item lines="full">
 
@@ -45,9 +48,9 @@
45 48 
         </ion-item>
46 49
47 50 
         <div class="ion-padding-vertical">
48 
-          <ion-button type="submit" color="success" expand="block" (click)="register()">ลงทะเบียน</ion-button>
51 
+          <ion-button type="submit" color="success" expand="block">ลงทะเบียน</ion-button>
49 52 
         </div>
50 53 
       </form>
51 54 
     </ion-col>
52 
-  </ion-row>
53 
-</ion-content>
55 
+  </ion-row>
56 
+</ion-content>

+ 10 - 7
src/app/register/register.page.html
查看文件 

@@ -1,20 +1,23 @@
1 1 
 <ion-header>
2 
-  <ion-toolbar>
3 
-    <ion-title>ลงทะเบียน</ion-title>
2 
+  <ion-toolbar class="new-background-color">
3 
+    <ion-buttons slot="start" color="light">
4 
+      <ion-back-button></ion-back-button>
5 
+    </ion-buttons>
6 
+    <ion-title>Wellness Route</ion-title>
4 7 
   </ion-toolbar>
5 8 
 </ion-header>
6 
-
7 9 
 <ion-content class="auth-form">
10 
+  <div><img src="/assets/images/image-001.jpg"></div>
8 11 
   <ion-grid>
9 12 
     <ion-row>
10 13 
       <ion-col align-self-center>
11 
-        <ion-button [routerLink]="['/registration']" expand="block" color="primary">Register</ion-button>
14 
+        <ion-button [routerLink]="['/register-form']" expand="block" color="primary">ลงทะเบียนผู้ใช้งาน</ion-button>
12 15
13 
-        <span class="divider line one-line">or</span>
16 
+        <span class="divider line one-line">หรือ</span>
14 17
15 
-        <span class="already">Already a user?</span>
18 
+        <span class="already">มีชื่อผู้ใช้งานแล้ว</span>
16 19
17 
-        <ion-button [routerLink]="['/login']" expand="block" color="danger">Sign In</ion-button>
20 
+        <ion-button [routerLink]="['/login']" expand="block" color="danger">เข้าสู่ระบบ</ion-button>
18 21 
       </ion-col>
19 22 
     </ion-row>
20 23 
   </ion-grid>

+ 2 - 2
src/app/register/register.page.scss
查看文件 

@@ -12,7 +12,7 @@
12 12 
   .line {
13 13 
     align-items: center;
14 14 
     margin: 1em -1em;
15 
-    color: #cccccc;
15 
+    color: #5f5e5e;
16 16
17 17 
     &:before,
18 18 
     &:after {
 
@@ -24,7 +24,7 @@
24 24 
   .one-line {
25 25 
     &:before,
26 26 
     &:after {
27 
-       background: #cccccc;
27 
+       background: #5f5e5e;
28 28 
     }
29 29 
   }
30 30

+ 29 - 24
src/app/reset-password/reset-password.page.html
查看文件 

@@ -1,33 +1,38 @@
1 1 
 <ion-header>
2 
-  <ion-toolbar>
2 
+  <ion-toolbar class="new-background-color">
3 
+    <ion-buttons slot="start" color="light">
4 
+      <ion-back-button></ion-back-button>
5 
+    </ion-buttons>
3 6 
     <ion-title>Wellness Route</ion-title>
4 7 
   </ion-toolbar>
5 8 
 </ion-header>
6 
-
7 9 
 <ion-content>
8 
-  <ion-row>
9 
-    <ion-col class="ion-text-center">
10 
-      <h1>กรุณาใส่รหัสผ่านใหม่</h1>
11 
-    </ion-col>
12 
-  </ion-row>
13 
-  <form>
14 
-    <ion-row>
15 
-      <ion-col>
16 
-        <ion-item lines="full">
17 
-          <ion-label position="floating">รหัสผ่าน</ion-label>
18 
-          <ion-input type="password" required></ion-input>
19 
-        </ion-item>
20 
-
21 
-        <ion-item lines="full">
22 
-          <ion-label position="floating">ยืนยัน รหัสผ่าน</ion-label>
23 
-          <ion-input type="password" required></ion-input>
24 
-        </ion-item>
25 
-      </ion-col>
26 
-    </ion-row>
10 
+  <div><img src="/assets/images/image-007.jpg"></div>
11 
+  <ion-grid>
27 12 
     <ion-row>
28 
-      <ion-col>
29 
-        <ion-button type="submit" color="success" expand="block">ส่ง</ion-button>
13 
+      <ion-col class="ion-text-center">
14 
+        <h1>กรุณาใส่รหัสผ่านใหม่</h1>
30 15 
       </ion-col>
31 16 
     </ion-row>
32 
-  </form>
17 
+    <form>
18 
+      <ion-row>
19 
+        <ion-col>
20 
+          <ion-item lines="full">
21 
+            <ion-label position="floating">รหัสผ่าน</ion-label>
22 
+            <ion-input type="password" required></ion-input>
23 
+          </ion-item>
24 
+
25 
+          <ion-item lines="full">
26 
+            <ion-label position="floating">ยืนยัน รหัสผ่าน</ion-label>
27 
+            <ion-input type="password" required></ion-input>
28 
+          </ion-item>
29 
+        </ion-col>
30 
+      </ion-row>
31 
+      <ion-row>
32 
+        <ion-col>
33 
+          <ion-button type="submit" color="success" expand="block">ส่ง</ion-button>
34 
+        </ion-col>
35 
+      </ion-row>
36 
+    </form>
37 
+  </ion-grid>
33 38 
 </ion-content>

+ 2 - 2
src/app/tabs/tabs.page.html
查看文件 

@@ -1,9 +1,9 @@
1 1 
 <ion-tabs>
2 
-  <ion-fab vertical="bottom" horizontal="center" translucent="true">
2 
+  <!-- <ion-fab vertical="bottom" horizontal="center" translucent="true">
3 3 
     <ion-fab-button routerLink="nearme" routerDirection="forward">
4 4 
     <ion-icon name="navigate"></ion-icon>
5 5 
     </ion-fab-button>
6 
-  </ion-fab>
6 
+  </ion-fab> -->
7 7 
   <ion-tab-bar slot="bottom">
8 8 
     <ion-tab-button tab="home">
9 9 
       <ion-icon name="home"></ion-icon>

+ 2 - 1
src/app/wp-service.service.ts
查看文件 

@@ -31,7 +31,8 @@ export class WpServiceService {
31 31
32 32 
   getPlaceDetail(id) {
33 33 
     return this.http.get(
34 
-      "http://tamtime.iamarray.xyz/wp-json/wp/v2/place/"+id+"/?_embed"
34 
+      // "http://tamtime.iamarray.xyz/wp-json/wp/v2/place/"+id+"/?_embed"
35 
+      "/assets/json/place173.json"
35 36 
     );
36 37 
   }
37 38

二進制
src/assets/images/image-001.jpg
查看文件


二進制
src/assets/images/image-002.jpg
查看文件


二進制
src/assets/images/image-003.jpg
查看文件


二進制
src/assets/images/image-004.jpg
查看文件


二進制
src/assets/images/image-005.jpg
查看文件


二進制
src/assets/images/image-006.jpg
查看文件


二進制
src/assets/images/image-007.jpg
查看文件


二進制
src/assets/images/image-008.jpg
查看文件


二進制
src/assets/images/image-009.jpg
查看文件


二進制
src/assets/images/image-010.jpg
查看文件


二進制
src/assets/images/image-011.jpg
查看文件


二進制
src/assets/images/image-012.jpg
查看文件


File diff suppressed because it is too large
+ 1 - 0
src/assets/json/place173.json


+ 18 - 7
src/global.scss
查看文件 

@@ -116,6 +116,17 @@
116 116 
   --color: #ffffff;
117 117 
 }
118 118
119 
+// ion-content {
120 
+//   --background: linear-gradient(
121 
+//     to bottom,
122 
+//     #a7e9ff,
123 
+//     #8fd8fd,
124 
+//     #7ec7fb,
125 
+//     #78b4f6,
126 
+//     #7c9fee
127 
+//   );
128 
+// }
129 
+
119 130 
 ion-title {
120 131 
   font-family: "Kanit", sans-serif !important;
121 132 
   font-weight: 500;
 
@@ -160,12 +171,12 @@ ion-button {
160 171
161 172 
 a {
162 173 
   text-decoration: none;
163 
- }
164 
-
165 
-// ion-content {
166 
-//   --background: url(/assets/images/wnr-bg.jpg) no-repeat center/cover fixed;
167 
-// }
174 
+}
175 
+
176 
+.image-page-cover {
177 
+  height: 200px;
178 
+}
168 179 
 .ios ion-fab-button {
169 
-  position:absolute;
180 
+  position: absolute;
170 181 
   bottom: 25px;
171 
-}
182 
+}

tmt/tiger_frontend - Gogs: Simplico Git Service
Home Explore Help
Sign In
tmt
/
tiger_frontend
Watch 4
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Commits 3 Releases 0 Wiki

No Description

Tree: 0614cb1d05
Branches Tags
tiger_frontend
/
node_modules
/
cssesc
golf 77628cf8bf first comm 3 years ago
..
bin 77628cf8bf first comm 3 years ago
man 77628cf8bf first comm 3 years ago
LICENSE-MIT.txt 77628cf8bf first comm 3 years ago
README.md 77628cf8bf first comm 3 years ago
cssesc.js 77628cf8bf first comm 3 years ago
package.json 77628cf8bf first comm 3 years ago

README.md

cssesc Build status Code coverage status

A JavaScript library for escaping CSS strings and identifiers while generating the shortest possible ASCII-only output.

This is a JavaScript library for escaping text for use in CSS strings or identifiers while generating the shortest possible valid ASCII-only output. Here’s an online demo.

A polyfill for the CSSOM CSS.escape() method is available in a separate repository. (In comparison, cssesc is much more powerful.)

Feel free to fork if you see possible improvements!

Installation

Via npm:

npm install cssesc

In a browser:

<script src="cssesc.js"></script>

In Node.js:

const cssesc = require('cssesc');

In Ruby using the ruby-cssesc wrapper gem:

gem install ruby-cssesc

require 'ruby-cssesc'
CSSEsc.escape('I ♥ Ruby', is_identifier: true)

In Sass using sassy-escape:

gem install sassy-escape

body {
  content: escape('I ♥ Sass', $is-identifier: true);
}

API

cssesc(value, options)

This function takes a value and returns an escaped version of the value where any characters that are not printable ASCII symbols are escaped using the shortest possible (but valid) escape sequences for use in CSS strings or identifiers.

cssesc('Ich ♥ Bücher');
// → 'Ich \\2665  B\\FC cher'

cssesc('foo 𝌆 bar');
// → 'foo \\1D306  bar'

By default, cssesc returns a string that can be used as part of a CSS string. If the target is a CSS identifier rather than a CSS string, use the isIdentifier: true setting (see below).

The optional options argument accepts an object with the following options:

isIdentifier

The default value for the isIdentifier option is false. This means that the input text will be escaped for use in a CSS string literal. If you want to use the result as a CSS identifier instead (in a selector, for example), set this option to true.

cssesc('123a2b');
// → '123a2b'

cssesc('123a2b', {
  'isIdentifier': true
});
// → '\\31 23a2b'

quotes

The default value for the quotes option is 'single'. This means that any occurences of ' in the input text will be escaped as \', so that the output can be used in a CSS string literal wrapped in single quotes.

cssesc('Lorem ipsum "dolor" sit \'amet\' etc.');
// → 'Lorem ipsum "dolor" sit \\\'amet\\\' etc.'
// → "Lorem ipsum \"dolor\" sit \\'amet\\' etc."

cssesc('Lorem ipsum "dolor" sit \'amet\' etc.', {
  'quotes': 'single'
});
// → 'Lorem ipsum "dolor" sit \\\'amet\\\' etc.'
// → "Lorem ipsum \"dolor\" sit \\'amet\\' etc."

If you want to use the output as part of a CSS string literal wrapped in double quotes, set the quotes option to 'double'.

cssesc('Lorem ipsum "dolor" sit \'amet\' etc.', {
  'quotes': 'double'
});
// → 'Lorem ipsum \\"dolor\\" sit \'amet\' etc.'
// → "Lorem ipsum \\\"dolor\\\" sit 'amet' etc."

wrap

The wrap option takes a boolean value (true or false), and defaults to false (disabled). When enabled, the output will be a valid CSS string literal wrapped in quotes. The type of quotes can be specified through the quotes setting.

cssesc('Lorem ipsum "dolor" sit \'amet\' etc.', {
  'quotes': 'single',
  'wrap': true
});
// → '\'Lorem ipsum "dolor" sit \\\'amet\\\' etc.\''
// → "\'Lorem ipsum \"dolor\" sit \\\'amet\\\' etc.\'"

cssesc('Lorem ipsum "dolor" sit \'amet\' etc.', {
  'quotes': 'double',
  'wrap': true
});
// → '"Lorem ipsum \\"dolor\\" sit \'amet\' etc."'
// → "\"Lorem ipsum \\\"dolor\\\" sit \'amet\' etc.\""

escapeEverything

The escapeEverything option takes a boolean value (true or false), and defaults to false (disabled). When enabled, all the symbols in the output will be escaped, even printable ASCII symbols.

cssesc('lolwat"foo\'bar', {
  'escapeEverything': true
});
// → '\\6C\\6F\\6C\\77\\61\\74\\"\\66\\6F\\6F\\\'\\62\\61\\72'
// → "\\6C\\6F\\6C\\77\\61\\74\\\"\\66\\6F\\6F\\'\\62\\61\\72"

Overriding the default options globally

The global default settings can be overridden by modifying the css.options object. This saves you from passing in an options object for every call to encode if you want to use the non-default setting.

// Read the global default setting for `escapeEverything`:
cssesc.options.escapeEverything;
// → `false` by default

// Override the global default setting for `escapeEverything`:
cssesc.options.escapeEverything = true;

// Using the global default setting for `escapeEverything`, which is now `true`:
cssesc('foo © bar ≠ baz 𝌆 qux');
// → '\\66\\6F\\6F\\ \\A9\\ \\62\\61\\72\\ \\2260\\ \\62\\61\\7A\\ \\1D306\\ \\71\\75\\78'

cssesc.version

A string representing the semantic version number.

Using the cssesc binary

To use the cssesc binary in your shell, simply install cssesc globally using npm:

npm install -g cssesc

After that you will be able to escape text for use in CSS strings or identifiers from the command line:

$ cssesc 'föo ♥ bår 𝌆 baz'
f\F6o \2665  b\E5r \1D306  baz

If the output needs to be a CSS identifier rather than part of a string literal, use the -i/--identifier option:

$ cssesc --identifier 'föo ♥ bår 𝌆 baz'
f\F6o\ \2665\ b\E5r\ \1D306\ baz

See cssesc --help for the full list of options.

Support

This library supports the Node.js and browser versions mentioned in .babelrc. For a version that supports a wider variety of legacy browsers and environments out-of-the-box, see v0.1.0.

Author

twitter/mathias
Mathias Bynens

License

This library is available under the MIT license.