update

app/Http/Controllers/AppController.php

@@ -2,6 +2,7 @@
 
 namespace App\Http\Controllers;
 
+use App\Job;
 use Illuminate\Http\Request;
 
 class AppController extends Controller
@@ -9,4 +10,12 @@ class AppController extends Controller
     public function index() {
         return view('app');
     }
+
+    public function show() {
+        $jobs = Job::select('jobs.id', 'jobs.job_title', 'companies.imageCompany', 'companies.company_name', 'companies.amphoe', 'companies.province','jobs.created_at')
+            ->join('companies', 'jobs.user_id', 'companies.user_id')
+            ->orderBy('jobs.created_at', 'desc')
+            ->get();
+        return response()->json(['jobs' => $jobs]);
+    }
 }

resources/js/route.js

@@ -18,6 +18,7 @@ import ManagejobEmployer from './views/managejob.vue';
 import ConfigCompany from './views/ConfigCompany.vue';
 import CreateJob from './views/CreateJob.vue';
 import EditJob from './views/EditJob.vue';
+import DetailJob from './views/DetailJob.vue';
 import ShowJob from './views/ShowJob.vue';
 
 const router = new VueRouter({
@@ -109,6 +110,11 @@ const router = new VueRouter({
           name: 'showjob',
           component: ShowJob
         },
+        {
+          path: 'detailjob/:id',
+          name: 'detailJob',
+          component: DetailJob
+        },
         {
           path: 'account',
           name: 'account',

resources/js/views/CreateJob.vue

@@ -186,7 +186,9 @@
     data () {
       return {
         degree: [
-            'ระดับ'
+          'ระดับปวช.',
+          'ระดับปวส.',
+          'ระดับปริญญา'
         ],
         gender: [],
         items: [

resources/js/views/DetailJob.vue

+<template>
+  <div>    
+  </div>
+</template>

resources/js/views/EditJob.vue

@@ -175,7 +175,7 @@
                         </v-layout>
                     </v-flex>
                 </v-flex>
-                <v-flex xs12 sm10 offset-sm-1 class="my-1 text-xs-center text-sm-center."><v-btn type="submit" round dark color="blue accent-3" class="px-3 white--text">เพิ่มข้อมูลงาน</v-btn></v-flex>
+                <v-flex xs12 sm10 offset-sm-1 class="my-1 text-xs-center text-sm-center."><v-btn type="submit" round dark color="blue accent-3" class="px-3 white--text">บันทึกข้อมูลงาน</v-btn></v-flex>
         </v-layout>
         </v-form>
     </div>
@@ -186,7 +186,9 @@
     data () {
       return {
         degree: [
-          'ระดับ'
+          'ระดับปวช.',
+          'ระดับปวส.',
+          'ระดับปริญญา'
         ],
         gender: [],
         items: [

resources/js/views/Managejob.vue

@@ -25,8 +25,8 @@
       <td width="10%" class="text-sm-center">{{ props.item.id }}</td>
       <td width="30%" class="text-sm-left">{{ props.item.topic }}</td>
       <td width="15%" class="text-sm-center">{{ props.item.typejob }}</td>
-      <td width="15%" class="text-sm-center">{{ props.item.position }}</td>
-      <td width="10%" class="text-sm-center">{{ props.item.salary }}</td>
+      <td width="20%" class="text-sm-center">{{ props.item.position }}</td>
+      <td width="5%" class="text-sm-center">{{ props.item.salary }}</td>
       <td width="20%" class="text-sm-center">
         <v-layout row wrap justify-center>
           <v-btn depressed class="mx-1" fab outline small color="cyan" @click="$router.push(`/employer/editjob/${props.item.job_id}`)">

resources/js/views/ShowJob.vue

@@ -78,44 +78,46 @@
             <v-flex xs12 sm12 class="">
               <span class="caption grey--text">แสดงผล 1 - 20 ตำแหน่งงาน จากทั้งหมด 89 งาน</span>
             </v-flex>
-            <v-flex xs12 sm12 class="white div-card">
-              <v-layout row wrap class="pa-2">
-                <v-flex xs2 sm2>
-                  <img class="" width="90" height="90" src="https://www.jobbkk.com/upload/employer/04/914/02B914/images/1784522.png" alt="">
-                </v-flex>
-                <v-flex xs10 sm7 class="pa-2">
-                  <v-flex xs12 sm12>
-                    <label class="subheading font-weight-bold indigo--text ">Graphic & Web Designer</label>
-                  </v-flex>
-                  <v-flex xs12 sm12 class="mb-1">
-                    <label class="subheading font-weight-medium black--text ">วินวิน อินเตอร์แอคทีฟ จำกัด</label>
+            <div v-for="job in jobs" :key="job.id" class="mb-3">
+              <v-flex xs12 sm12 class="white div-card">
+                <v-layout row wrap class="pa-2">
+                  <v-flex xs2 sm2>
+                    <img class="" width="90" height="90" :src="job.imageCompany" alt="">
                   </v-flex>
-                  <v-flex xs12 sm12>
-                    <label class="body-2 grey--text ">สาทร, กรุงเทพมหานคร </label>
-                  </v-flex>                   
-                </v-flex>
-                <v-flex xs12 sm3>
-                  <v-layout row wrap justify-end>
-                    <v-btn color="deep-orange " dark small depressed class="body-2">สมัครงานนี้</v-btn>
-                  </v-layout>                  
-                </v-flex>                 
-              </v-layout>
-              <v-flex xs12 sm12 class="detail-bottom">
-                <v-layout row wrap>
-                  <v-flex xs6 sm6 class="px-3 py-1">
-                    <span class="caption">23 เม.ย. 2562</span>
-                  </v-flex>
-                  <v-flex xs6 sm6 class="px-3 py-1 text-sm-right text-xs-right">
-                    <a class="caption">ดูเพิ่มเติม <v-icon small color="indigo ">fas fa-angle-right</v-icon></a>
+                  <v-flex xs10 sm7 class="pa-2">
+                    <v-flex xs12 sm12>
+                      <label class="subheading font-weight-bold indigo--text ">{{ job.job_title }}</label>
+                    </v-flex>
+                    <v-flex xs12 sm12 class="mb-1">
+                      <label class="subheading font-weight-medium black--text ">{{ job.company_name }}</label>
+                    </v-flex>
+                    <v-flex xs12 sm12>
+                      <label class="body-2 grey--text ">{{ job.amphoe }}, {{ job.province }} </label>
+                    </v-flex>                   
                   </v-flex>
+                  <v-flex xs12 sm3>
+                    <v-layout row wrap justify-end>
+                      <v-btn color="deep-orange " dark small depressed class="body-2">สมัครงานนี้</v-btn>
+                    </v-layout>                  
+                  </v-flex>                 
                 </v-layout>
+                <v-flex xs12 sm12 class="detail-bottom">
+                  <v-layout row wrap>
+                    <v-flex xs6 sm6 class="px-3 py-1">
+                      <span class="caption">{{ job.created_at }}</span>
+                    </v-flex>
+                    <v-flex xs6 sm6 class="px-3 py-1 text-sm-right text-xs-right">
+                      <router-link :to="'/detailjob/'+job.id" class="caption">ดูเพิ่มเติม <v-icon small color="indigo ">fas fa-angle-right</v-icon></router-link>
+                    </v-flex>
+                  </v-layout>
+                </v-flex>
               </v-flex>
-            </v-flex>
+            </div>
             <v-flex xs12 sm12 class="mt-3 text-sm-center text-xs-center">
               <v-pagination
                 circle
-                v-model="page"
-                :length="1"
+                v-model="pagination.page"
+                :length="pages"
               ></v-pagination>
             </v-flex>
           </v-flex>
@@ -126,6 +128,34 @@
   </div>
 </template>
 
+<script>
+export default {
+  data () {
+    return {
+      jobs: [],
+      pagination: {
+        page: 0,
+        rowsPerPage: 10
+      }
+    }
+  },
+  computed: {
+    pages () {
+      return this.pagination.rowsPerPage ? Math.ceil(this.jobs.length / this.pagination.rowsPerPage) : 0
+    }
+  },
+  beforeMount() {
+    axios.get('/api/show')
+      .then(res => {
+        console.log(res.data.jobs)
+        this.jobs = res.data.jobs
+      })
+      .catch(err => {console.log(err.response)})
+  }
+}
+</script>
+
+
 <style lang="scss" scoped>
 
   .height-chkbox{

routes/api.php

@@ -23,6 +23,8 @@ Route::resource('/companys', 'CompanyController');
 
 Route::resource('/jobs', 'JobController');
 
+Route::get('/show', 'AppController@show');
+
 Route::get('/province','DistrictController@provinces');
 Route::get('/province/{province_code}/amphoe','DistrictController@amphoes');
 Route::get('/province/{province_code}/amphoe/{amphoe_code}/district','DistrictController@districts');