Skip to content

C
CO-OP Search
Commit 51ab882a authored by Kittisak Maneewong's avatar Kittisak Maneewong
Browse files
Options

update page add job

parent 74c09d6a
Hide whitespace changes
Inline Side-by-side
Showing with 345 additions and 258 deletions
public/js/app.js
View file @ 51ab882a
This source diff could not be displayed because it is too large. You can view the blob instead.
resources/js/layouts/EmployerLayout.vue
View file @ 51ab882a
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<v-content class="my-0"> <v-content class="my-0">
<v-container fluid white> <v-container fluid white>
<v-layout > <v-layout >
<v-flex xs10 offset-xs1> <v-flex sm10 xs12 offset-sm1>
<v-card flat height="600px"> <v-card flat height="600px">
<router-view></router-view> <router-view></router-view>
</v-card> </v-card>
......
resources/js/views/Addjob.vue
View file @ 51ab882a
...@@ -4,274 +4,346 @@ ...@@ -4,274 +4,346 @@
<v-flex xs12 sm12 class="pa-3"> <v-flex xs12 sm12 class="pa-3">
<h2 class="font-weight-bold red--text">ข้อมูลบริษัท</h2> <h2 class="font-weight-bold red--text">ข้อมูลบริษัท</h2>
</v-flex> </v-flex>
<form enctype="multipart/form-data" > <v-form enctype="multipart/form-data" @submit.prevent="createJob()" ref="create">
<v-flex sm12 xs12> <v-flex sm12 xs12>
<v-layout row wrap class="borderbottom pa-3"> <v-layout row wrap class="borderbottom pa-3">
<v-flex sm4 xs12 class="px-3"> <v-flex sm4 xs12 class="px-3">
<v-layout align-center justify-center fill-height> <v-layout align-center justify-center fill-height>
<input type="file" accept="image/*" class="input-file" ref="inputFile" @change="selectFile"> <input type="file" accept="image/*" class="input-file" ref="inputFile" @change="selectFile">
<v-tooltip right> <v-tooltip right>
<template v-slot:activator="{ on }"> <template v-slot:activator="{ on }">
<img v-on="on" class="img" @click="$refs.inputFile.click()" :src="srcImage" alt="" width="200"> <img v-on="on" class="img" @click="$refs.inputFile.click()" :src="srcImage" alt="" width="200">
</template> </template>
<span>{{ status }}</span> <span>{{ status }}</span>
</v-tooltip> </v-tooltip>
</v-layout> </v-layout>
</v-flex> </v-flex>
<v-flex sm4 xs12 class="px-3"> <v-flex sm4 xs12 class="px-3">
<label class="font-weight-bold">ชื่อบริษัท <span class="red--text">&nbsp;*</span></label> <label class="font-weight-bold">ชื่อบริษัท <span class="red--text">&nbsp;*</span></label>
<v-text-field
outline
label="ชื่อบริษัท"
class="my-ip"
></v-text-field>
<label class="font-weight-bold">ชื่อผู้ติดต่อ <span class="red--text">&nbsp;*</span></label>
<v-text-field
outline
label="ชื่อผู้ติดต่อ"
class="my-ip"
></v-text-field>
<label class="font-weight-bold">เบอร์ผู้ติดต่อ <span class="red--text">&nbsp;*</span></label>
<v-text-field
outline
label="เบอร์ผู้ติดต่อ"
class="my-ip"
></v-text-field>
</v-flex>
<v-flex sm4 xs12 class="px-3">
<label class="font-weight-bold">อีเมล <span class="red--text">&nbsp;*</span></label>
<v-text-field
outline
label="อีเมล"
class="my-ip"
></v-text-field>
<label class="font-weight-bold">Fax <span class="red--text"></span></label>
<v-text-field
outline
label="Fax"
class="my-ip"
></v-text-field>
<label class="font-weight-bold">เว็บไซต์ <span class="red--text"></span></label>
<v-text-field
outline
label="เว็บไซต์"
class="my-ip"
></v-text-field>
</v-flex>
</v-layout>
</v-flex>
<v-flex sm12>
<v-layout row wrap class="pa-3">
<v-flex sm6 xs12 class="px-3">
<label class="font-weight-bold">ที่อยู่ <span class="red--text">&nbsp;*</span></label>
<v-textarea
outline
label="ที่อยู่"
rows
class="my-1"
></v-textarea>
<label class="font-weight-bold">จังหวัด <span class="red--text">&nbsp;*</span></label>
<VSelect
:items="items"
label="เลือกจังหวัด"
></VSelect>
<label class="font-weight-bold">เขต/อำเภอ <span class="red--text">&nbsp;*</span></label>
<VSelect
:items="items"
label="เลือกเขต/อำเภอ"
></VSelect>
<label class="font-weight-bold">เกี่ยวกับบริษัท <span class="red--text">&nbsp;*</span></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"
label="เลือกแขวง/ตำบล"
></VSelect>
<label class="font-weight-bold">รหัสไปรษณีย์<span class="red--text">&nbsp;*</span></label>
<v-text-field
label="รหัสไปรษณีย์"
class="my-ip"
></v-text-field>
<label class="font-weight-bold">แผนที่บริษัท</label>
<v-layout row wrap class="pa-2">
<v-flex sm12 xs12>
<label>รูปภาพแผนที่</label>
</v-flex>
<v-flex sm12 xs12>
<v-btn color="deep-orange darken-4" class="px-2" small outline><v-icon>file_copy</v-icon>&nbsp;เลือกไฟล์</v-btn>
</v-flex>
<v-flex sm12 xs12>
<v-text-field
label="ค้นหาสถานที่"
style="height:50px;"
></v-text-field>
</v-flex>
<v-flex sm12 xs12>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3851.7461712415493!2d104.9009800139957!3d15.117311868259526!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x311684db0c98987f%3A0x228caf3246f0fd8e!2z4Lih4Lir4Liy4Lin4Li04LiX4Lii4Liy4Lil4Lix4Lii4Lit4Li44Lia4Lil4Lij4Liy4LiK4LiY4Liy4LiZ4Li1!5e0!3m2!1sth!2sth!4v1555418432669!5m2!1sth!2sth" width="400" height="200" frameborder="0" style="border:0" allowfullscreen></iframe>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
<v-layout row wrap class="borderbottom pa-3">
<v-flex sm12>
<h2 class="font-weight-bold"><span class="red--text">&nbsp;การเดินทาง</span></h2>
</v-flex>
<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>
<v-flex sm3 xs12 class="px-3">
<label class="font-weight-bold">สายรถเมล์</label>
<VTextField
label="สายรถเมล์"/>
</v-flex>
<v-flex sm12 class="px-3">
<label class="font-weight-bold">การเดินทางเพิ่มเติม</label>
</v-flex>
<v-flex sm6 xs12 class="px-3">
<v-textarea
outline
label=""
rows
class="my-2"
></v-textarea>
</v-flex>
<v-flex sm6 xs12 class="px-3 py-3 detail">
<span class="red--text">หมายเหตุ : </span>
<span >เพื่อความสะดวกในการเดินทางของผู้สมัครงาน กรุณาระบุสถานีรถไฟฟ้าที่ใกล้กับสถานที่ปฏิบัติงาน (ถ้ามี) หรือระบุสายรถเมล์ที่ผ่านสถานที่ประกอบการ และระบุการเดินทางเพิ่มเติม เพื่อให้เข้าใจในการเดินทางมากยิ่งขึ้น</span>
</v-flex>
</v-layout>
<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>
<v-flex sm12 xs12 class="pa-3">
<label class="font-weight-bold">หัวข้องาน <span class="red--text">&nbsp;*</span></label>
<v-text-field <v-text-field
outline outline
label="หัวข้องาน" label="ชื่อบริษัท"
class="my-job" :rules="[rules.required]"
class="my-ip"
></v-text-field> ></v-text-field>
<label class="font-weight-bold my-2">ประเภทธุรกิจ</label> <label class="font-weight-bold">ชื่อผู้ติดต่อ <span class="red--text">&nbsp;*</span></label>
<VSelect <v-text-field
outline outline
:items="items" label="ชื่อผู้ติดต่อ"
label="เลือก" :rules="[rules.required]"
class="my-job" class="my-ip"
></VSelect> ></v-text-field>
<label class="font-weight-bold my-2">ตำแหน่งงาน</label> <label class="font-weight-bold">เบอร์ผู้ติดต่อ <span class="red--text">&nbsp;*</span></label>
<VSelect <v-text-field
outline outline
:items="items" label="เบอร์ผู้ติดต่อ"
label="เลือก" :rules="[rules.required]"
class="my-job" class="my-ip"
></VSelect> ></v-text-field>
<label class="font-weight-bold my-2">ค่าตอบแทน/เงินเดือน</label> </v-flex>
<v-flex sm4 xs12 class="px-3">
<label class="font-weight-bold">อีเมล <span class="red--text">&nbsp;*</span></label>
<v-text-field <v-text-field
outline outline
label="ค่าตอบแทน/เงินเดือน" label="อีเมล"
class="my-job" :rules="[rules.required, rules.email]"
class="my-ip"
></v-text-field> ></v-text-field>
<label class="font-weight-bold my-2">จำนวน(อัตรา)</label> <label class="font-weight-bold">Fax <span class="red--text"></span></label>
<v-text-field <v-text-field
outline outline
label="จำนวน(อัตรา)" label="Fax"
class="my-job" class="my-ip"
type="number"
></v-text-field> ></v-text-field>
<label class="font-weight-bold my-2">วันทำงาน</label> <label class="font-weight-bold">เว็บไซต์ <span class="red--text"></span></label>
<v-layout align-center justify-center row fill-height wrap> <v-text-field
<v-flex sm6 xs12 class="px-2"> outline
<v-text-field label="เว็บไซต์"
outline class="my-ip"
label="จาก" ></v-text-field>
class="my-job" </v-flex>
></v-text-field> </v-layout>
</v-flex> </v-flex>
<v-flex xs12 sm6 class="px-2"> <v-flex sm12>
<v-text-field <v-layout row wrap class="pa-3">
outline <v-flex sm6 xs12 class="px-3">
label="ถึง" <label class="font-weight-bold">ที่อยู่ <span class="red--text">&nbsp;*</span></label>
class="my-job"
></v-text-field>
</v-flex>
</v-layout>
<label class="font-weight-bold my-2">เวลาทำงาน</label>
<v-layout align-center justify-center row fill-height wrap>
<v-flex sm6 xs12 class="px-2">
<v-text-field
outline
label="จาก"
class="my-job"
></v-text-field>
</v-flex>
<v-flex xs12 sm6 class="px-2">
<v-text-field
outline
label="ถึง"
class="my-job"
></v-text-field>
</v-flex>
</v-layout>
</v-flex>
</v-flex>
<v-flex sm6 xs12 class="pa-3">
<h2 class="font-weight-bold mt-2"><span class="red--text">&nbsp;หน้าที่รับผิดชอบ</span></h2>
<v-flex sm12 xs12 class="pa-3">
<v-textarea <v-textarea
outline outline
label="หน้าที่รับผิดชอบ" label="ที่อยู่"
:rules="[rules.required]"
rows
class="my-1"
></v-textarea> ></v-textarea>
</v-flex> <label class="font-weight-bold">จังหวัด <span class="red--text">&nbsp;*</span></label>
<h2 class="font-weight-bold"><span class="red--text">&nbsp;คุณสมบัติ</span></h2> <VSelect
<v-flex sm12 xs12 class="pa-3"> :items="items"
label="เลือกจังหวัด"
:rules="[rules.required]"
></VSelect>
<label class="font-weight-bold">เขต/อำเภอ <span class="red--text">&nbsp;*</span></label>
<VSelect
:items="items"
label="เลือกเขต/อำเภอ"
:rules="[rules.required]"
></VSelect>
<label class="font-weight-bold">เกี่ยวกับบริษัท</label>
<v-textarea <v-textarea
outline outline
label="คุณสมบัติ" label="เกี่ยวกับบริษัท"
rows="6"
class="my-1"
></v-textarea> ></v-textarea>
</v-flex> </v-flex>
<h2 class="font-weight-bold"><span class="red--text">&nbsp;สวัสดิการ</span></h2> <v-flex sm6 xs12 class="px-3">
<v-flex sm12 xs12 class="pa-3"> <label class="font-weight-bold">แขวง/ตำบล<span class="red--text">&nbsp;*</span></label>
<VSelect
:items="items"
:rules="[rules.required]"
label="เลือกแขวง/ตำบล"
></VSelect>
<label class="font-weight-bold">รหัสไปรษณีย์<span class="red--text">&nbsp;*</span></label>
<v-text-field
label="รหัสไปรษณีย์"
:rules="[rules.required]"
class="my-ip"
></v-text-field>
<label class="font-weight-bold">แผนที่บริษัท</label>
<v-layout row wrap class="pa-2">
<v-flex sm12 xs12>
<label>รูปภาพแผนที่</label>
</v-flex>
<v-flex sm12 xs12>
<v-btn color="deep-orange darken-4" class="px-2" small outline><v-icon>file_copy</v-icon>&nbsp;เลือกไฟล์</v-btn>
</v-flex>
<v-flex sm12 xs12>
<v-text-field
label="ค้นหาสถานที่"
style="height:50px;"
></v-text-field>
</v-flex>
<v-flex sm12 xs12>
<!-- <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3851.7461712415493!2d104.9009800139957!3d15.117311868259526!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x311684db0c98987f%3A0x228caf3246f0fd8e!2z4Lih4Lir4Liy4Lin4Li04LiX4Lii4Liy4Lil4Lix4Lii4Lit4Li44Lia4Lil4Lij4Liy4LiK4LiY4Liy4LiZ4Li1!5e0!3m2!1sth!2sth!4v1555418432669!5m2!1sth!2sth" width="400" height="200" frameborder="0" style="border:0" allowfullscreen></iframe> -->
</v-flex>
</v-layout>
</v-flex>
</v-layout>
<v-layout row wrap class="borderbottom pa-3">
<v-flex sm12>
<h2 class="font-weight-bold"><span class="red--text">&nbsp;การเดินทาง</span></h2>
</v-flex>
<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>
<v-flex sm3 xs12 class="px-3">
<label class="font-weight-bold">สายรถเมล์</label>
<VTextField
label="สายรถเมล์"/>
</v-flex>
<v-flex sm12 class="px-3">
<label class="font-weight-bold">การเดินทางเพิ่มเติม</label>
</v-flex>
<v-flex sm6 xs12 class="px-3">
<v-textarea <v-textarea
outline outline
label="สวัสดิการ" label=""
rows
class="my-2"
></v-textarea> ></v-textarea>
</v-flex> </v-flex>
<v-flex sm6 xs12 class="px-3 py-3 detail">
<span class="red--text">หมายเหตุ : </span>
<span >เพื่อความสะดวกในการเดินทางของผู้สมัครงาน กรุณาระบุสถานีรถไฟฟ้าที่ใกล้กับสถานที่ปฏิบัติงาน (ถ้ามี) หรือระบุสายรถเมล์ที่ผ่านสถานที่ประกอบการ และระบุการเดินทางเพิ่มเติม เพื่อให้เข้าใจในการเดินทางมากยิ่งขึ้น</span>
</v-flex> </v-flex>
<v-btn color="success">บันทึกข้อมูล</v-btn> </v-layout>
</v-layout> <v-layout row wrap class="borderbottom">
<v-flex sm6 xs12 class="pa-3">
</v-flex> <h2 class="font-weight-bold my-2"><span class="red--text">&nbsp;รายละเอียดงาน</span></h2>
<v-flex sm12 xs12 class="pa-3">
</form> <label class="font-weight-bold">หัวข้องาน <span class="red--text">&nbsp;*</span></label>
<v-text-field
outline
label="หัวข้องาน"
:rules="[rules.required]"
class="my-job"
></v-text-field>
<label class="font-weight-bold my-2">ประเภทธุรกิจ <span class="red--text">&nbsp;*</span></label>
<VSelect
outline
:items="items"
:rules="[rules.required]"
label="เลือก"
class="my-job"
></VSelect>
<label class="font-weight-bold my-2">ตำแหน่งงาน <span class="red--text">&nbsp;*</span></label>
<VSelect
outline
:items="items"
:rules="[rules.required]"
label="เลือก"
class="my-job"
></VSelect>
<label class="font-weight-bold my-2">ค่าตอบแทน/เงินเดือน</label>
<v-text-field
outline
label="ค่าตอบแทน/เงินเดือน"
class="my-job"
></v-text-field>
<label class="font-weight-bold my-2">จำนวน(อัตรา) <span class="red--text">&nbsp;*</span></label>
<v-text-field
outline
label="จำนวน(อัตรา)"
class="my-job"
:rules="[rules.required]"
min="0"
type="number"
></v-text-field>
<label class="font-weight-bold my-2">วันทำงาน <span class="red--text">&nbsp;*</span></label>
<v-layout align-center justify-center row fill-height wrap>
<v-flex sm6 xs12 class="px-2">
<v-text-field
outline
label="จาก"
:rules="[rules.required]"
class="my-job"
></v-text-field>
</v-flex>
<v-flex xs12 sm6 class="px-2">
<v-text-field
outline
:rules="[rules.required]"
label="ถึง"
class="my-job"
></v-text-field>
</v-flex>
</v-layout>
<label class="font-weight-bold my-2">เวลาทำงาน <span class="red--text">&nbsp;*</span></label>
<v-layout align-center justify-center row fill-height wrap>
<v-flex sm6 xs12 class="px-2">
<!-- <v-text-field
outline
label="จาก"
type="time"
:rules="[rules.required]"
class="my-job"
></v-text-field> -->
<v-menu
ref="time1"
v-model="showTimeFrom"
:close-on-content-click="false"
:nudge-right="40"
lazy
transition="scale-transition"
offset-y
full-width
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
outline
v-model="timeFrom"
label="จาก"
:rules="[rules.required]"
readonly
v-on="on"
></v-text-field>
</template>
<v-time-picker
v-if="showTimeFrom"
v-model="timeFrom"
full-width
@click:minute="$refs.time1.save(time)"
></v-time-picker>
</v-menu>
</v-flex>
<v-flex xs12 sm6 class="px-2">
<v-menu
ref="time2"
v-model="showTimeTo"
:close-on-content-click="false"
:nudge-right="40"
lazy
transition="scale-transition"
offset-y
full-width
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
outline
v-model="timeTo"
label="ถึง"
:rules="[rules.required]"
readonly
v-on="on"
></v-text-field>
</template>
<v-time-picker
v-if="showTimeTo"
v-model="timeTo"
full-width
@click:minute="$refs.time2.save(time)"
></v-time-picker>
</v-menu>
</v-flex>
</v-layout>
</v-flex>
</v-flex>
<v-flex sm6 xs12 class="pa-3">
<h2 class="font-weight-bold mt-2"><span class="red--text">&nbsp;หน้าที่รับผิดชอบ</span> <span class="red--text">&nbsp;*</span></h2>
<v-flex sm12 xs12 class="pa-3">
<v-textarea
outline
:rules="[rules.required]"
label="หน้าที่รับผิดชอบ"
></v-textarea>
</v-flex>
<h2 class="font-weight-bold"><span class="red--text">&nbsp;คุณสมบัติ</span> <span class="red--text">&nbsp;*</span></h2>
<v-flex sm12 xs12 class="pa-3">
<v-textarea
outline
:rules="[rules.required]"
label="คุณสมบัติ"
></v-textarea>
</v-flex>
<h2 class="font-weight-bold"><span class="red--text">&nbsp;สวัสดิการ</span></h2>
<v-flex sm12 xs12 class="pa-3">
<v-textarea
outline
label="สวัสดิการ"
></v-textarea>
</v-flex>
</v-flex>
<v-layout justify-center>
<v-btn color="success" type="submit">บันทึกข้อมูล</v-btn>
</v-layout>
</v-layout>
</v-flex>
</v-form>
</v-layout> </v-layout>
</div> </div>
</template> </template>
...@@ -281,7 +353,15 @@ export default { ...@@ -281,7 +353,15 @@ export default {
data () { data () {
return { return {
status: 'ยังไม่ได้เลือกไฟล์', status: 'ยังไม่ได้เลือกไฟล์',
srcImage: 'https://asianinteriorservices.com/wp-content/uploads/2018/04/noImg.png' srcImage: 'https://asianinteriorservices.com/wp-content/uploads/2018/04/noImg.png',
rules: {
required: v => !!v || 'จำเป็นต้องกรอก',
email: v => /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(v) || 'รูปแบบอีเมลล์ไม่ถูกต้อง'
},
timeFrom: null,
timeTo: null,
showTimeFrom: false,
showTimeTo: false
} }
}, },
methods: { methods: {
...@@ -308,6 +388,13 @@ export default { ...@@ -308,6 +388,13 @@ export default {
console.log(imgBlob) console.log(imgBlob)
} }
reader.readAsArrayBuffer(file) reader.readAsArrayBuffer(file)
},
createJob () {
if (this.$refs.create.validate()) {
console.log('create job')
} else {
this.$Loading.error()
}
} }
} }
} }
...@@ -315,12 +402,12 @@ export default { ...@@ -315,12 +402,12 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.my-job{ // .my-job{
height: 70px; // height: 70px;
} // }
.my-ip{ // .my-ip{
height: 65px; // height: 65px;
} // }
.detail { .detail {
color: #276f86; color: #276f86;
background-color: #f8ffff; background-color: #f8ffff;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment