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 @@
<v-content class="my-0">
<v-container fluid white>
<v-layout >
<v-flex xs10 offset-xs1>
<v-flex sm10 xs12 offset-sm1>
<v-card flat height="600px">
<router-view></router-view>
</v-card>
......
resources/js/views/Addjob.vue
View file @ 51ab882a
......@@ -4,274 +4,346 @@
<v-flex xs12 sm12 class="pa-3">
<h2 class="font-weight-bold red--text">ข้อมูลบริษัท</h2>
</v-flex>
<form enctype="multipart/form-data" >
<v-flex sm12 xs12>
<v-layout row wrap class="borderbottom pa-3">
<v-flex sm4 xs12 class="px-3">
<v-layout align-center justify-center fill-height>
<input type="file" accept="image/*" class="input-file" ref="inputFile" @change="selectFile">
<v-tooltip right>
<template v-slot:activator="{ on }">
<img v-on="on" class="img" @click="$refs.inputFile.click()" :src="srcImage" alt="" width="200">
</template>
<span>{{ status }}</span>
</v-tooltip>
</v-layout>
</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">ชื่อผู้ติดต่อ <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-form enctype="multipart/form-data" @submit.prevent="createJob()" ref="create">
<v-flex sm12 xs12>
<v-layout row wrap class="borderbottom pa-3">
<v-flex sm4 xs12 class="px-3">
<v-layout align-center justify-center fill-height>
<input type="file" accept="image/*" class="input-file" ref="inputFile" @change="selectFile">
<v-tooltip right>
<template v-slot:activator="{ on }">
<img v-on="on" class="img" @click="$refs.inputFile.click()" :src="srcImage" alt="" width="200">
</template>
<span>{{ status }}</span>
</v-tooltip>
</v-layout>
</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-job"
label="ชื่อบริษัท"
:rules="[rules.required]"
class="my-ip"
></v-text-field>
<label class="font-weight-bold my-2">ประเภทธุรกิจ</label>
<VSelect
<label class="font-weight-bold">ชื่อผู้ติดต่อ <span class="red--text">&nbsp;*</span></label>
<v-text-field
outline
:items="items"
label="เลือก"
class="my-job"
></VSelect>
<label class="font-weight-bold my-2">ตำแหน่งงาน</label>
<VSelect
label="ชื่อผู้ติดต่อ"
:rules="[rules.required]"
class="my-ip"
></v-text-field>
<label class="font-weight-bold">เบอร์ผู้ติดต่อ <span class="red--text">&nbsp;*</span></label>
<v-text-field
outline
:items="items"
label="เลือก"
class="my-job"
></VSelect>
<label class="font-weight-bold my-2">ค่าตอบแทน/เงินเดือน</label>
label="เบอร์ผู้ติดต่อ"
:rules="[rules.required]"
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-job"
label="อีเมล"
:rules="[rules.required, rules.email]"
class="my-ip"
></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
outline
label="จำนวน(อัตรา)"
class="my-job"
type="number"
label="Fax"
class="my-ip"
></v-text-field>
<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>
<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">
<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="หน้าที่รับผิดชอบ"
outline
label="ที่อยู่"
:rules="[rules.required]"
rows
class="my-1"
></v-textarea>
</v-flex>
<h2 class="font-weight-bold"><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>
<VSelect
: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
outline
label="คุณสมบัติ"
outline
label="เกี่ยวกับบริษัท"
rows="6"
class="my-1"
></v-textarea>
</v-flex>
<h2 class="font-weight-bold"><span class="red--text">&nbsp;สวัสดิการ</span></h2>
<v-flex sm12 xs12 class="pa-3">
</v-flex>
<v-flex sm6 xs12 class="px-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
outline
label="สวัสดิการ"
outline
label=""
rows
class="my-2"
></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-btn color="success">บันทึกข้อมูล</v-btn>
</v-layout>
</v-flex>
</form>
</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
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>
</div>
</template>
......@@ -281,7 +353,15 @@ export default {
data () {
return {
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: {
......@@ -308,6 +388,13 @@ export default {
console.log(imgBlob)
}
reader.readAsArrayBuffer(file)
},
createJob () {
if (this.$refs.create.validate()) {
console.log('create job')
} else {
this.$Loading.error()
}
}
}
}
......@@ -315,12 +402,12 @@ export default {
<style lang="scss" scoped>
.my-job{
height: 70px;
}
.my-ip{
height: 65px;
}
// .my-job{
// height: 70px;
// }
// .my-ip{
// height: 65px;
// }
.detail {
color: #276f86;
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