add api addr

app/District.php

+<?php
+
+namespace App;
+
+use Illuminate\Database\Eloquent\Model;
+
+class District extends Model
+{
+    //
+}

app/Http/Controllers/DistrictController.php

+<?php
+
+namespace App\Http\Controllers;
+
+use App\District;
+use Illuminate\Http\Request;
+
+class DistrictController extends Controller
+{
+    public function provinces()
+    {
+        $provinces = District::groupBy('province_code')
+        ->get();
+        return response()->json($provinces);
+    }
+
+    public function amphoes($province_code)
+    {
+        $amphoes = District::where('province_code',$province_code)
+        ->groupBy('amphoe_code')
+        ->get();
+        return response()->json($amphoes);
+    }
+
+    public function districts($province_code,$amphoe_code)
+    {
+        $districts = District::where('province_code',$province_code)
+        ->where('amphoe_code',$amphoe_code)
+        ->groupBy('district_code')
+        ->get();
+        return response()->json($districts);
+    }
+
+    public function detail($province_code,$amphoe_code,$district_code)
+    {
+        $districts = District::where('province_code',$province_code)
+        ->where('amphoe_code',$amphoe_code)        
+        ->where('district_code',$district_code)
+        ->get();
+        return response()->json($districts);
+    }
+}

config/database.php

@@ -52,7 +52,7 @@ return [
             'collation' => 'utf8mb4_unicode_ci',
             'prefix' => '',
             'prefix_indexes' => true,
-            'strict' => true,
+            'strict' => false,
             'engine' => null,
             'options' => extension_loaded('pdo_mysql') ? array_filter([
                 PDO::MYSQL_ATTR_SSL_CA => env('MYSQL_ATTR_SSL_CA'),

resources/js/views/Addjob.vue

@@ -72,40 +72,56 @@
                                 outline
                                 label="ที่อยู่"
                                 :rules="[rules.required]"
-                                rows
                                 class="my-1"
                             ></v-textarea>
                             <label class="font-weight-bold">จังหวัด <span class="red--text">&nbsp;*</span></label>
-                            <VSelect
-                                :items="items"
+                            <v-select
+                                :items="provinces"
+                                item-text="province"
+                                v-model="province"
                                 label="เลือกจังหวัด"
                                 :rules="[rules.required]"
-                            ></VSelect>
+                                return-object
+                                @change="showAmphoes()"
+                            ></v-select>
 
                             <label class="font-weight-bold">เขต/อำเภอ <span class="red--text">&nbsp;*</span></label>
-                            <VSelect
-                                :items="items"
+                            <v-select
+                                :items="amphoes"
+                                item-text="amphoe"
                                 label="เลือกเขต/อำเภอ"
+                                return-object
+                                v-model="amphoe"
+                                no-data-text="กรุณาเลือกจังหวัด"
+                                :disabled="!openAmphoe"
                                 :rules="[rules.required]"
-                            ></VSelect>
+                                @change="showTumbons()"
+                            ></v-select>
                             <label class="font-weight-bold">เกี่ยวกับบริษัท</label>
                             <v-textarea
                                 outline
                                 label="เกี่ยวกับบริษัท"
-                                rows="6"
                                 class="my-1"
                             ></v-textarea>
                         </v-flex>
                         <v-flex sm6 xs12 class="px-3">
                             <label class="font-weight-bold">แขวง/ตำบล<span class="red--text">&nbsp;*</span></label>
-                            <VSelect
-                                :items="items"
+                            <v-select
+                                :items="tumbons"
+                                item-text="tumbon"
+                                return-object
+                                v-model="tumbon"
+                                no-data-text="กรุณาเลือกอำเภอ"
                                 :rules="[rules.required]"
+                                :disabled="!openTumbon"
                                 label="เลือกแขวง/ตำบล"
-                            ></VSelect>
+                                @change = "showDetail()"
+                            ></v-select>
                             <label class="font-weight-bold">รหัสไปรษณีย์<span class="red--text">&nbsp;*</span></label>
                             <v-text-field
+                                :disabled="!openZipCode"
                                 label="รหัสไปรษณีย์"
+                                v-model="zip_code"
                                 :rules="[rules.required]"
                                 class="my-ip"
                             ></v-text-field>
@@ -138,21 +154,18 @@
                         <v-flex sm3 xs12 class="px-3">
                             <label class="font-weight-bold my-2">ใกล้ BTS</label>
                             <VSelect
-                                :items="items"
                                 label="เลือก"
                             ></VSelect>
                         </v-flex>
                         <v-flex sm3 xs12 class="px-3">
                             <label class="font-weight-bold">ใกล้ MRT</label>
                             <VSelect
-                                :items="items"
                                 label="เลือก"
                             ></VSelect>
                         </v-flex>
                         <v-flex sm3 xs12 class="px-3">
                             <label class="font-weight-bold">ใกล้ ARL</label>
                             <VSelect
-                                :items="items"
                                 label="เลือก"
                             ></VSelect>
                         </v-flex>
@@ -168,7 +181,6 @@
                             <v-textarea
                                 outline
                                 label=""
-                                rows
                                 class="my-2"
                             ></v-textarea>
                         </v-flex>
@@ -177,6 +189,7 @@
                             <span >เพื่อความสะดวกในการเดินทางของผู้สมัครงาน กรุณาระบุสถานีรถไฟฟ้าที่ใกล้กับสถานที่ปฏิบัติงาน (ถ้ามี) หรือระบุสายรถเมล์ที่ผ่านสถานที่ประกอบการ และระบุการเดินทางเพิ่มเติม เพื่อให้เข้าใจในการเดินทางมากยิ่งขึ้น</span>
                     </v-flex>
                     </v-layout>
+                    <v-btn color="success" type="submit">text</v-btn>
                     <!-- <v-layout row wrap class="borderbottom"> 
                         <v-flex sm6 xs12 class="pa-3">
                             <h2 class="font-weight-bold my-2"><span class="red--text">&nbsp;รายละเอียดงาน</span></h2>
@@ -354,7 +367,17 @@ export default {
             timeFrom: null,
             timeTo: null,
             showTimeFrom: false,
-            showTimeTo: false
+            showTimeTo: false,
+            provinces: [],
+            amphoes: [],
+            tumbons: [],
+            province: '',
+            amphoe: '',
+            tumbon: '',
+            zip_code: '',
+            openAmphoe: false,
+            openTumbon: false,
+            openZipCode: false
         }
     },
     methods: {
@@ -370,12 +393,77 @@ export default {
             }
         },
         createJob () {
+            if (this.amphoes.findIndex(x => x.amphoe_code === this.amphoe.amphoe_code) === -1) {this.amphoe = ''}
+            if (this.tumbons.findIndex(x => x.tumbon_code === this.tumbon.tumbon_code) === -1) {this.tumbon = ''}
             if (this.$refs.create.validate()) {
                 console.log('create job')
             } else {
                 this.$Loading.error()
             }
+        },
+        showProvinces () {
+            axios.get('/api/province')
+              .then(res => {
+                  res.data.forEach(data => {
+                      this.provinces.push({
+                          province: data.province,
+                          province_code: data.province_code
+                      })
+                  });
+              })
+              .catch(err => {
+                  console.log(err.response)
+              })
+        },
+        showAmphoes () {
+            this.amphoes = []
+            this.zip_code = ''
+            this.openAmphoe = true
+            this.openTumbon = false
+            this.openZipCode = false
+            axios.get(`/api/province/${this.province.province_code}/amphoe`)
+              .then(res => {
+                  res.data.forEach(data => {
+                      this.amphoes.push({
+                          amphoe: data.amphoe,
+                          amphoe_code: data.amphoe_code
+                      })
+                  })
+              })
+              .catch(err => {
+                  console.log(err.response)
+              })
+        },
+        showTumbons () {
+            this.tumbons = []
+            this.openTumbon = true
+            this.openZipCode = false
+            axios.get(`/api/province/${this.province.province_code}/amphoe/${this.amphoe.amphoe_code}/district`)
+              .then(res => {
+                  res.data.forEach(data => {
+                      this.tumbons.push({
+                          tumbon: data.district,
+                          tumbon_code: data.district_code
+                      })
+                  })
+              })
+              .catch(err => {
+                  console.log(err.response)
+              })
+        },
+        showDetail () {
+            this.openZipCode = true
+            axios.get(`/api/province/${this.province.province_code}/amphoe/${this.amphoe.amphoe_code}/district/${this.tumbon.tumbon_code}`)
+              .then(res => {
+                  this.zip_code = res.data[0].zipcode
+              })
+              .catch(err => {
+                  console.log(err.resonse)
+              })
         }
+    },
+    mounted() {
+        this.showProvinces()
     }
 }
 </script>

routes/api.php

@@ -18,3 +18,8 @@ Route::group(['prefix' => 'auth'], function ($router) {
     Route::post('login', 'AuthController@login');
     Route::get('current', 'AuthController@getAuthenticatedUser');
 });
+
+Route::get('/province','DistrictController@provinces');
+Route::get('/province/{province_code}/amphoe','DistrictController@amphoes');
+Route::get('/province/{province_code}/amphoe/{amphoe_code}/district','DistrictController@districts');
+Route::get('/province/{province_code}/amphoe/{amphoe_code}/district/{district_code}','DistrictController@detail');