feat: option from json
This commit is contained in:
puriphatt
parent
12a5f618bb
commit
cb01378114
9 changed files with 1271 additions and 626 deletions
537
public/option/option.json
Normal file
537
public/option/option.json
Normal file
|
|
@ -0,0 +1,537 @@
|
||||||
|
{
|
||||||
|
"eng": {
|
||||||
|
"gender": [
|
||||||
|
{
|
||||||
|
"label": "male",
|
||||||
|
"value": "male"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "female",
|
||||||
|
"value": "female"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"training": [
|
||||||
|
{
|
||||||
|
"label": "",
|
||||||
|
"value": ""
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สถานที่อบรมแรงงานเมียนมา-แม่สอด จ.ตาก",
|
||||||
|
"value": ""
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สถานที่อบรมแรงงานเมียนมา-แม่สอด จ.ตาก",
|
||||||
|
"value": ""
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สถานที่อบรมแรงงานเมียนมา-แม่สอด จ.ตาก",
|
||||||
|
"value": ""
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สถานที่อบรมแรงงานเมียนมา-แม่สอด จ.ตาก",
|
||||||
|
"value": ""
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
|
||||||
|
"tha": {
|
||||||
|
"gender": [
|
||||||
|
{
|
||||||
|
"label": "ชาย",
|
||||||
|
"value": "male"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "หญิง",
|
||||||
|
"value": "female"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"training": [
|
||||||
|
{
|
||||||
|
"label": "สถานที่อบรมแรงงานเมียนมา-แม่สอด จ.ตาก",
|
||||||
|
"value": "trainingTak"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สถานที่อบรมแรงงานเมียนมา-เกาะสอง จ.ระนอง",
|
||||||
|
"value": "trainingRanong"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": " สถานที่อบรมแรงงานลาว-หนองคาย จ.หนองคาย",
|
||||||
|
"value": "trainingNongKhai"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สถานที่อบรมแรงงานกัมพูชา-อรัญประเทศ จ.สระแก้ว",
|
||||||
|
"value": "trainingSaKaeo"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สถานที่อบรมแรงงานกัมพูชา-บ้านแหลม จ.จันทบุรี",
|
||||||
|
"value": "trainingChanthaburi"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"nationality": [
|
||||||
|
{
|
||||||
|
"label": "ไทย",
|
||||||
|
"value": "th"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เมียนมา",
|
||||||
|
"value": "mm"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ลาว",
|
||||||
|
"value": "lo"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "กัมพูชา",
|
||||||
|
"value": "kh"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เวียดนาม",
|
||||||
|
"value": "vn"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"businessType": [
|
||||||
|
{
|
||||||
|
"label": "ประมง",
|
||||||
|
"value": "fisheries"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ต่อเนื่องประมงทะเล",
|
||||||
|
"value": "continuous-fisheries"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เกษตรและปศุสัตว์",
|
||||||
|
"value": "agriculture "
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "กิจการก่อสร้าง",
|
||||||
|
"value": "construction "
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ผู้รับใช้ในบ้าน",
|
||||||
|
"value": "maid"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "กิจการต่อเนื่องการเกษตร",
|
||||||
|
"value": "continuousAgriculture"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ต่อเนื่องปศุสัตว์โรงฆ่าสัตว์ ชำแหละ",
|
||||||
|
"value": "continuousButchery"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "กิจการรีไซเคิล",
|
||||||
|
"value": "recycling"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เหมืองแร่/เหมืองหิน",
|
||||||
|
"value": "mining"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "จำหน่ายผลิตภัณฑ์โลหะ",
|
||||||
|
"value": "metal"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "จำหน่ายอาหารและเครื่องดื่ม",
|
||||||
|
"value": "food"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ผลิตหรือจำหน่ายผลิตภัณฑ์จากดิน",
|
||||||
|
"value": "soilBasedProducts"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ผลิตหรือจำหน่ายวัสดุก่อสร้าง",
|
||||||
|
"value": "constructionMaterials"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "แปรรูปหิน",
|
||||||
|
"value": "stone"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ผลิตหรือจำหน่ายเสื้อผ้าสำเร็จรูป",
|
||||||
|
"value": "cloth"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ผลิตหรือจำหน่ายผลิตภัณฑ์พลาสติก",
|
||||||
|
"value": "plastic"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ผลิตหรือจำหน่ายผลิตภัณฑ์กระดาษ",
|
||||||
|
"value": "paper"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ผลิตหรือจำหน่ายผลิตภัณฑ์อิเล็กทรอนิกส์",
|
||||||
|
"value": "electronics"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ขนถ่ายสินค้าทางบก น้ำ คลังสินค้า",
|
||||||
|
"value": "transport"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ค้าส่ง ค้าปลีก แผงลอย",
|
||||||
|
"value": "market"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "อู่ซ่อมรถ ล้าง อัดฉีด",
|
||||||
|
"value": "car"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สถานีบริการน้ำมัน แก้ส เชื้อเพลิง",
|
||||||
|
"value": "fuel"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สถานศึกษา มูลนิธิ สมาคม สถานพยาบาล",
|
||||||
|
"value": "institution"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "การให้บริการต่างๆ",
|
||||||
|
"value": "service"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "งานผู้ประสานงานด้านภาษากัมพูชา ลาว หรือเมียนมา",
|
||||||
|
"value": "coordinator"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "แปรรูปสัตว์น้ำ",
|
||||||
|
"value": "seafood"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"position": [
|
||||||
|
{
|
||||||
|
"label": "กรรมกร",
|
||||||
|
"value": "worker"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ช่างเครื่องยนต์ในเรือประมงทะเล",
|
||||||
|
"value": "boatsMechanic"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ผู้รับใช้ในบ้าน",
|
||||||
|
"value": "maid"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "งานผู้ประสานงานด้านภาษากัมพูชา ลาว หรือเมียนมา",
|
||||||
|
"value": "coordinator"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"area": [
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 1 บางรัก ปทุมวัน ยานนาวสาทร และบางคอแหลม",
|
||||||
|
"value": "area1"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 2 จอมทอง ทุ่งครุ บางขุนเทียน บางบอน และราษฎร์บูรณะ",
|
||||||
|
"value": "area2"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 3 คลองเตย บางนา ประเวศ พระโขนง วัฒนา และสวนหลวง",
|
||||||
|
"value": "area3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 4 คันนายาว บางกะปิ ลาดพร้าว บึงกุ่ม และวังทางหลาง",
|
||||||
|
"value": "area4"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 5 คลองสามวา มีนบุรี ลาดกระบัง สะพานสูง หนองจอก และสายไหม",
|
||||||
|
"value": "area5"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 6 คลองสาน ธนบุรี บางกอกน้อย บางกอกใหญ่ และบางพลัด",
|
||||||
|
"value": "area6"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 7 ตลิ่งชัน ทวีวัฒนา บางแค ภาษีเจริญ และหนองแขม",
|
||||||
|
"value": "area7"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 8 ดุสิต พระนครป้อมปราบศัตรูพ่าย และสัมพันธวงศ์",
|
||||||
|
"value": "area8"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 9 จตุจักร ดอนเมือง บางชื่อ บางเขน และหลักสี่",
|
||||||
|
"value": "area9"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เขตพื้นที่ 10 ดินแดง พญาไท ราชเทวี และห้วยขวาง",
|
||||||
|
"value": "area10"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"typeImport": [
|
||||||
|
{
|
||||||
|
"label": "ยื่นขอบัญชีรายชื่อ (Name list) สัญชาติ เมียนมา",
|
||||||
|
"value": "nameListMM"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ยื่นขอบัญชีรายชื่อ (Name list) สัญชาติ ลาว",
|
||||||
|
"value": "nameListLO"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ยื่นขอบัญชีรายชื่อ (Name list) สัญชาติ กัมพูชา",
|
||||||
|
"value": "nameListKH"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"status": [
|
||||||
|
{
|
||||||
|
"label": "ไม่พบข้อมูลเสนอขาย",
|
||||||
|
"value": "notFound"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "อยู่ระหว่างดำเนินการ",
|
||||||
|
"value": "inProgress"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ติดตาม / เอกสารเพิ่มเติม",
|
||||||
|
"value": "follow"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "รอพิจารณา / นัดรับเอกสาร",
|
||||||
|
"value": "consider"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ดำเนินการเรียบร้อย",
|
||||||
|
"value": "complete"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ยกเลิกบริการ",
|
||||||
|
"value": "cancel"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"delivery": [
|
||||||
|
{
|
||||||
|
"label": "ช่องทาง E-Mail",
|
||||||
|
"value": "email"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ช่องทาง Line",
|
||||||
|
"value": "line"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ช่องทาง DHL",
|
||||||
|
"value": "dhl"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ช่องทาง รถตู้/รถโดยสาร",
|
||||||
|
"value": "bus"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "พร้อมคนเซ็นสัญญา",
|
||||||
|
"value": "person"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"typeInsurance": [
|
||||||
|
{
|
||||||
|
"label": "ประกันสุขภาพภาพเอกชน 6 เดือน",
|
||||||
|
"value": "6m"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ประกันสุขภาพ รพ.รัฐ 3 เดือน",
|
||||||
|
"value": "3m"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ประกันสุขภาพ รพ.รัฐ 1 ปี",
|
||||||
|
"value": "1y"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ประกันสุขภาพ รพ.รัฐ 2 ปี",
|
||||||
|
"value": "2y"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"insurancePlace": [
|
||||||
|
{
|
||||||
|
"label": "แปซิฟิคครอส",
|
||||||
|
"value": "pacificcross"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ทิพยประกันภัย",
|
||||||
|
"value": "dhipaya"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "รพ.เลิดสิน 4.รพ.ตากสิน",
|
||||||
|
"value": "lerdsin"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "รพ.ราชพิพัฒน์",
|
||||||
|
"value": "ratchapipat"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "รพ.เจริญกรุงประชารักษ์",
|
||||||
|
"value": "krungPracharak"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"typeReplace": [
|
||||||
|
{
|
||||||
|
"label": "ใบอนุญาตทำงาน 3 เดือน (325)",
|
||||||
|
"value": "3m"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ใบอนุญาตทำงาน 6 เดือน (550)",
|
||||||
|
"value": "6m"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ใบอนุญาตทำงาน 1 ปี (1000)",
|
||||||
|
"value": "1y"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ใบอนุญาตทำงาน 1 ปี 3 เดือน (1225)",
|
||||||
|
"value": "1y3m"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ใบอนุญาตทำงาน 1 ปี 6 เดือน (1450)",
|
||||||
|
"value": "1y6m"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ใบอนุญาตทำงาน 2 ปี (1900)",
|
||||||
|
"value": "2y"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"checkPoint": [
|
||||||
|
{
|
||||||
|
"label": "เมียนมา-แม่สอด จ.ตาก",
|
||||||
|
"value": "tak"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "เมียนมา- เกาะสอง จ.ระนอง",
|
||||||
|
"value": "ranong"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ลาว-หนองคาย จ.หนองคาย",
|
||||||
|
"value": "nongKhai"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "กัมพูชา-อรัญประเทศ จ.สระแก้ว",
|
||||||
|
"value": "saKaeo"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "กัมพูชา-บ้านแหลม จ.จันทบุรี",
|
||||||
|
"value": "chanthaburi"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"residence": [
|
||||||
|
{
|
||||||
|
"label": "ตม.แจ้งวัฒนะ",
|
||||||
|
"value": "chaengwattana"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ตม.สมุทรปราการ",
|
||||||
|
"value": "samutPrakan"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ตม.สมุทรสาคร",
|
||||||
|
"value": "samutSakhon"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ตม.นนทบุรี",
|
||||||
|
"value": "nonthaburi"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ตม.ปทุมธานี",
|
||||||
|
"value": "pathumThani"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ตม.นครปฐม",
|
||||||
|
"value": "nakhonPathom"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"customerStep": [
|
||||||
|
{
|
||||||
|
"label": "ช่องทางในการจัดส่งเอกสาร",
|
||||||
|
"value": "channel"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ลูกค้ามารับด้วยตัวเอง",
|
||||||
|
"value": "pickup"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ส่งทางไปรษณีย์",
|
||||||
|
"value": "post"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ส่งทางไลน์แมน",
|
||||||
|
"value": "lineMan"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "JOB ส่งเอกสาร",
|
||||||
|
"value": "job"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ตม.นครปฐม",
|
||||||
|
"value": "nakhonPathom"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"statusDeliver": [
|
||||||
|
{
|
||||||
|
"label": "โทรแจ้งลูกค้าเรียบร้อย",
|
||||||
|
"value": "reached"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ติดต่อไม่ได้/ไม่รับสาย",
|
||||||
|
"value": "cantReached"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ลูกค้ารับเอกสารคืนเรียบร้อย",
|
||||||
|
"value": "received"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ติดตาม/แก้ไขเอกสาร",
|
||||||
|
"value": "follow"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"type90days": [
|
||||||
|
{
|
||||||
|
"label": "รายงานตัว 90 วัน_กทม.(ปกติ)",
|
||||||
|
"value": "normalBkk"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "รายงานตัว 90 วัน_กทม.(เกินกำหนด)",
|
||||||
|
"value": "overdueBkk"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "รายงานตัว 90 วัน_ตจว.(ปกติ)",
|
||||||
|
"value": "nomal"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "รายงานตัว 90 วัน_ตจว.(เกินกำหนด)",
|
||||||
|
"value": "overdue"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
"typeInsurance2": [
|
||||||
|
{
|
||||||
|
"label": "ประกันสุขภาพภาพเอกชน 6 เดือน (990)",
|
||||||
|
"value": "6m"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ประกันสุขภาพ รพ.รัฐ 3 เดือน (500)",
|
||||||
|
"value": "3m"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ประกันสุขภาพ รพ.รัฐ 1 ปี (2100)",
|
||||||
|
"value": "1y"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "ประกันสุขภาพ รพ.รัฐ 2 ปี (4200)",
|
||||||
|
"value": "2y"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"label": "สิทธิ์ประกันสังคม",
|
||||||
|
"value": "socialSecurity"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue';
|
import { onMounted, ref } from 'vue';
|
||||||
|
|
||||||
const customerName = defineModel<string>('customerName');
|
const customerName = defineModel<string>('customerName');
|
||||||
const customerNameEn = defineModel<string>('customerNameEn');
|
const customerNameEn = defineModel<string>('customerNameEn');
|
||||||
|
|
@ -12,13 +12,6 @@ const customerBranchId = defineModel<string>('customerBranchId');
|
||||||
const employeeID = defineModel<string>('employeeID');
|
const employeeID = defineModel<string>('employeeID');
|
||||||
const nrcNo = defineModel<string>('nrcNo');
|
const nrcNo = defineModel<string>('nrcNo');
|
||||||
|
|
||||||
const branchOption = ref([
|
|
||||||
{
|
|
||||||
label: 'uuu',
|
|
||||||
value: 'ad87961c-c44f-47ca-8c1e-0ef30c2b16ba',
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
defineProps<{
|
defineProps<{
|
||||||
dense?: boolean;
|
dense?: boolean;
|
||||||
outlined?: boolean;
|
outlined?: boolean;
|
||||||
|
|
@ -26,7 +19,15 @@ defineProps<{
|
||||||
separator?: boolean;
|
separator?: boolean;
|
||||||
typeCustomer?: string;
|
typeCustomer?: string;
|
||||||
employee?: boolean;
|
employee?: boolean;
|
||||||
|
|
||||||
|
employeeOwnerOption?: { label: string; value: string }[];
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
|
defineEmits<{
|
||||||
|
(e: 'filterOwnerBranch', val: string, update: void): void;
|
||||||
|
}>();
|
||||||
|
|
||||||
|
onMounted(async () => {});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -82,6 +83,8 @@ defineProps<{
|
||||||
<div v-if="employee" class="col-9 row q-col-gutter-md">
|
<div v-if="employee" class="col-9 row q-col-gutter-md">
|
||||||
<q-select
|
<q-select
|
||||||
id="select-employer-branch"
|
id="select-employer-branch"
|
||||||
|
use-input
|
||||||
|
input-debounce="0"
|
||||||
:dense="dense"
|
:dense="dense"
|
||||||
:outlined="!readonly"
|
:outlined="!readonly"
|
||||||
:readonly="readonly"
|
:readonly="readonly"
|
||||||
|
|
@ -94,7 +97,8 @@ defineProps<{
|
||||||
option-value="value"
|
option-value="value"
|
||||||
emit-value
|
emit-value
|
||||||
map-options
|
map-options
|
||||||
:options="branchOption"
|
:options="employeeOwnerOption"
|
||||||
|
@filter="(val, update) => $emit('filterOwnerBranch', val, update)"
|
||||||
:rules="[
|
:rules="[
|
||||||
(val: string) =>
|
(val: string) =>
|
||||||
!!val || $t('selectValidate') + $t('formDialogEmployerBranchCode'),
|
!!val || $t('selectValidate') + $t('formDialogEmployerBranchCode'),
|
||||||
|
|
@ -112,6 +116,7 @@ defineProps<{
|
||||||
v-model="employeeID"
|
v-model="employeeID"
|
||||||
/>
|
/>
|
||||||
<q-input
|
<q-input
|
||||||
|
mask="## #### ###### #"
|
||||||
for="input-nrcNo"
|
for="input-nrcNo"
|
||||||
:dense="dense"
|
:dense="dense"
|
||||||
:outlined="!readonly"
|
:outlined="!readonly"
|
||||||
|
|
|
||||||
|
|
@ -21,6 +21,14 @@ const addrOptions = reactive<{
|
||||||
});
|
});
|
||||||
|
|
||||||
const employeeCheckup = defineModel<EmployeeCheckupCreate[]>('employeeCheckup');
|
const employeeCheckup = defineModel<EmployeeCheckupCreate[]>('employeeCheckup');
|
||||||
|
const checkupTypeOption =
|
||||||
|
defineModel<{ label: string; value: string }[]>('checkupTypeOption');
|
||||||
|
const medicalBenefitOption = defineModel<{ label: string; value: string }[]>(
|
||||||
|
'medicalBenefitOption',
|
||||||
|
);
|
||||||
|
const insuranceCompanyOption = defineModel<{ label: string; value: string }[]>(
|
||||||
|
'insuranceCompanyOption',
|
||||||
|
);
|
||||||
|
|
||||||
const tab = ref();
|
const tab = ref();
|
||||||
|
|
||||||
|
|
@ -73,271 +81,273 @@ onMounted(async () => {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="bordered-b full-width">
|
<div>
|
||||||
<q-tabs
|
<div class="bordered-b full-width">
|
||||||
v-model="tab"
|
<q-tabs
|
||||||
dense
|
v-model="tab"
|
||||||
class="text-grey"
|
dense
|
||||||
active-class="active-tab"
|
class="text-grey"
|
||||||
indicator-color="transparent"
|
active-class="active-tab"
|
||||||
align="left"
|
indicator-color="transparent"
|
||||||
:breakpoint="0"
|
align="left"
|
||||||
>
|
:breakpoint="0"
|
||||||
<q-btn
|
>
|
||||||
@click="addData"
|
<q-btn
|
||||||
flat
|
@click="addData"
|
||||||
class="app-text-muted"
|
flat
|
||||||
style="background-color: var(--_body-bg)"
|
class="app-text-muted"
|
||||||
icon="mdi-plus"
|
style="background-color: var(--_body-bg)"
|
||||||
padding="8px 8px"
|
icon="mdi-plus"
|
||||||
:disable="readonly"
|
padding="8px 8px"
|
||||||
:color="$q.dark.isActive ? 'primary' : ''"
|
:disable="readonly"
|
||||||
:class="tab !== 'tab0' ? 'bordered-r' : ''"
|
:color="$q.dark.isActive ? 'primary' : ''"
|
||||||
/>
|
:class="tab !== 'tab0' ? 'bordered-r' : ''"
|
||||||
<q-tab
|
/>
|
||||||
v-for="(tab, index) in employeeCheckup"
|
<q-tab
|
||||||
|
v-for="(tab, index) in employeeCheckup"
|
||||||
|
v-bind:key="index"
|
||||||
|
:name="`tab${index}`"
|
||||||
|
class="content-tab text-capitalize"
|
||||||
|
style="z-index: 999"
|
||||||
|
>
|
||||||
|
<div class="text-weight-medium row items-center">
|
||||||
|
{{ $t('formDialogTabCheckup') + (index + 1) }}
|
||||||
|
<q-btn
|
||||||
|
v-if="!readonly && employeeCheckup?.length !== 1"
|
||||||
|
round
|
||||||
|
flat
|
||||||
|
id="closeDialog"
|
||||||
|
size="sm"
|
||||||
|
icon="mdi-close"
|
||||||
|
padding="xs"
|
||||||
|
color="red"
|
||||||
|
:class="{ dark: $q.dark.isActive }"
|
||||||
|
@click.stop="removeData(index)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</q-tab>
|
||||||
|
</q-tabs>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<q-tab-panels v-model="tab" style="padding-top: 0px">
|
||||||
|
<q-tab-panel
|
||||||
|
v-for="(checkup, index) in employeeCheckup"
|
||||||
v-bind:key="index"
|
v-bind:key="index"
|
||||||
:name="`tab${index}`"
|
:name="`tab${index}`"
|
||||||
class="content-tab text-capitalize"
|
class="row col-12 items-start"
|
||||||
style="z-index: 999"
|
style="overflow: auto; height: 50vh"
|
||||||
>
|
>
|
||||||
<div class="text-weight-medium row items-center">
|
<div class="col-3 app-text-muted">
|
||||||
{{ $t('formDialogTabCheckup') + (index + 1) }}
|
• {{ $t(`formDialogTitleHealthCheck`) }}
|
||||||
<q-btn
|
|
||||||
v-if="!readonly && employeeCheckup?.length !== 1"
|
|
||||||
round
|
|
||||||
flat
|
|
||||||
id="closeDialog"
|
|
||||||
size="sm"
|
|
||||||
icon="mdi-close"
|
|
||||||
padding="xs"
|
|
||||||
color="red"
|
|
||||||
:class="{ dark: $q.dark.isActive }"
|
|
||||||
@click.stop="removeData(index)"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</q-tab>
|
<div class="col-9 row q-col-gutter-md">
|
||||||
</q-tabs>
|
<q-input
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="!readonly"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
class="col-6"
|
||||||
|
:label="$t('formDialogInputCheckupRes')"
|
||||||
|
v-model="checkup.checkupResult"
|
||||||
|
/>
|
||||||
|
<q-select
|
||||||
|
id="select-province"
|
||||||
|
:dense="dense"
|
||||||
|
:readonly="readonly"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:hide-dropdown-icon="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
v-model="checkup.checkupType"
|
||||||
|
option-value="value"
|
||||||
|
option-label="label"
|
||||||
|
:label="$t('formDialogInputCheckupType')"
|
||||||
|
class="col-6"
|
||||||
|
:options="checkupTypeOption"
|
||||||
|
lazy-rules
|
||||||
|
/>
|
||||||
|
<q-select
|
||||||
|
id="select-province"
|
||||||
|
:dense="dense"
|
||||||
|
:readonly="readonly"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:hide-dropdown-icon="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
v-model="checkup.provinceId"
|
||||||
|
option-value="id"
|
||||||
|
option-label="name"
|
||||||
|
:label="$t('province')"
|
||||||
|
class="col-3"
|
||||||
|
:options="addrOptions.provinceOps"
|
||||||
|
lazy-rules
|
||||||
|
/>
|
||||||
|
<q-input
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="!readonly"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
class="col-9"
|
||||||
|
:label="$t('formDialogInputHospital')"
|
||||||
|
v-model="checkup.hospitalName"
|
||||||
|
/>
|
||||||
|
<q-input
|
||||||
|
:label="$t('formDialogInputRemark')"
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="!readonly"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
class="col-12"
|
||||||
|
v-model="checkup.remark"
|
||||||
|
type="textarea"
|
||||||
|
/>
|
||||||
|
<q-select
|
||||||
|
id="select-province"
|
||||||
|
:dense="dense"
|
||||||
|
:readonly="readonly"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:hide-dropdown-icon="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
v-model="checkup.medicalBenefitScheme"
|
||||||
|
option-value="value"
|
||||||
|
option-label="label"
|
||||||
|
:label="$t('formDialogInputMedicalBenefit')"
|
||||||
|
class="col-6"
|
||||||
|
:options="medicalBenefitOption"
|
||||||
|
lazy-rules
|
||||||
|
/>
|
||||||
|
<q-select
|
||||||
|
id="select-province"
|
||||||
|
:dense="dense"
|
||||||
|
:readonly="readonly"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:hide-dropdown-icon="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
v-model="checkup.insuranceCompany"
|
||||||
|
option-value="value"
|
||||||
|
option-label="label"
|
||||||
|
:label="$t('formDialogInputInsuranceCompany')"
|
||||||
|
class="col-6"
|
||||||
|
:options="insuranceCompanyOption"
|
||||||
|
lazy-rules
|
||||||
|
/>
|
||||||
|
<VueDatePicker
|
||||||
|
utc
|
||||||
|
autoApply
|
||||||
|
:teleport="true"
|
||||||
|
v-model="checkup.coverageStartDate"
|
||||||
|
:locale="'th'"
|
||||||
|
:enableTimePicker="false"
|
||||||
|
:disabled="readonly"
|
||||||
|
class="col-3"
|
||||||
|
>
|
||||||
|
<template #year="{ value }">
|
||||||
|
{{ value + 543 }}
|
||||||
|
</template>
|
||||||
|
<template #trigger>
|
||||||
|
<q-input
|
||||||
|
id="input-birth-date"
|
||||||
|
:label="$t('formDialogInputCoverageStartDate')"
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
:model-value="
|
||||||
|
checkup.coverageStartDate
|
||||||
|
? dateFormat(checkup.coverageStartDate)
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon
|
||||||
|
size="xs"
|
||||||
|
name="mdi-calendar-blank-outline"
|
||||||
|
class="cursor-pointer"
|
||||||
|
color="positive"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template v-slot:append>
|
||||||
|
<q-icon
|
||||||
|
v-if="checkup.coverageStartDate && !readonly"
|
||||||
|
name="mdi-close"
|
||||||
|
class="cursor-pointer"
|
||||||
|
size="xs"
|
||||||
|
@click="checkup.coverageStartDate = undefined"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</template>
|
||||||
|
</VueDatePicker>
|
||||||
|
<VueDatePicker
|
||||||
|
utc
|
||||||
|
autoApply
|
||||||
|
:teleport="true"
|
||||||
|
v-model="checkup.coverageExpireDate"
|
||||||
|
:locale="'th'"
|
||||||
|
:enableTimePicker="false"
|
||||||
|
:disabled="readonly"
|
||||||
|
class="col-3"
|
||||||
|
>
|
||||||
|
<template #year="{ value }">
|
||||||
|
{{ value + 543 }}
|
||||||
|
</template>
|
||||||
|
<template #trigger>
|
||||||
|
<q-input
|
||||||
|
id="input-birth-date"
|
||||||
|
:label="$t('formDialogInputCoverageExpiretDate')"
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
:model-value="
|
||||||
|
checkup.coverageExpireDate
|
||||||
|
? dateFormat(checkup.coverageExpireDate)
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon
|
||||||
|
size="xs"
|
||||||
|
name="mdi-calendar-blank-outline"
|
||||||
|
class="cursor-pointer"
|
||||||
|
color="positive"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template v-slot:append>
|
||||||
|
<q-icon
|
||||||
|
v-if="checkup.coverageExpireDate && !readonly"
|
||||||
|
name="mdi-close"
|
||||||
|
class="cursor-pointer"
|
||||||
|
size="xs"
|
||||||
|
@click="checkup.coverageExpireDate = undefined"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</template>
|
||||||
|
</VueDatePicker>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<q-separator
|
||||||
|
v-if="separator"
|
||||||
|
class="col-12 q-mt-xl q-mb-md"
|
||||||
|
style="padding-block: 0.5px"
|
||||||
|
/>
|
||||||
|
</q-tab-panel>
|
||||||
|
</q-tab-panels>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<q-tab-panels v-model="tab" style="padding-top: 0px">
|
|
||||||
<q-tab-panel
|
|
||||||
v-for="(checkup, index) in employeeCheckup"
|
|
||||||
v-bind:key="index"
|
|
||||||
:name="`tab${index}`"
|
|
||||||
class="row col-12 items-start"
|
|
||||||
style="overflow: auto; height: 50vh"
|
|
||||||
>
|
|
||||||
<div class="col-3 app-text-muted">
|
|
||||||
• {{ $t(`formDialogTitleHealthCheck`) }}
|
|
||||||
</div>
|
|
||||||
<div class="col-9 row q-col-gutter-md">
|
|
||||||
<q-input
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="!readonly"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
class="col-6"
|
|
||||||
:label="$t('formDialogInputCheckupRes')"
|
|
||||||
v-model="checkup.checkupResult"
|
|
||||||
/>
|
|
||||||
<q-select
|
|
||||||
id="select-province"
|
|
||||||
:dense="dense"
|
|
||||||
:readonly="readonly"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:hide-dropdown-icon="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
v-model="checkup.checkupType"
|
|
||||||
option-value="id"
|
|
||||||
option-label="name"
|
|
||||||
:label="$t('formDialogInputCheckupType')"
|
|
||||||
class="col-6"
|
|
||||||
:options="addrOptions.provinceOps"
|
|
||||||
lazy-rules
|
|
||||||
/>
|
|
||||||
<q-select
|
|
||||||
id="select-province"
|
|
||||||
:dense="dense"
|
|
||||||
:readonly="readonly"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:hide-dropdown-icon="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
v-model="checkup.provinceId"
|
|
||||||
option-value="id"
|
|
||||||
option-label="nameEN"
|
|
||||||
:label="$t('province')"
|
|
||||||
class="col-3"
|
|
||||||
:options="addrOptions.provinceOps"
|
|
||||||
lazy-rules
|
|
||||||
/>
|
|
||||||
<q-input
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="!readonly"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
class="col-9"
|
|
||||||
:label="$t('formDialogInputHospital')"
|
|
||||||
v-model="checkup.hospitalName"
|
|
||||||
/>
|
|
||||||
<q-input
|
|
||||||
:label="$t('formDialogInputRemark')"
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="!readonly"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
class="col-12"
|
|
||||||
v-model="checkup.remark"
|
|
||||||
type="textarea"
|
|
||||||
/>
|
|
||||||
<q-select
|
|
||||||
id="select-province"
|
|
||||||
:dense="dense"
|
|
||||||
:readonly="readonly"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:hide-dropdown-icon="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
v-model="checkup.medicalBenefitScheme"
|
|
||||||
option-value="id"
|
|
||||||
option-label="name"
|
|
||||||
:label="$t('formDialogInputMedicalBenefit')"
|
|
||||||
class="col-6"
|
|
||||||
:options="addrOptions.provinceOps"
|
|
||||||
lazy-rules
|
|
||||||
/>
|
|
||||||
<q-select
|
|
||||||
id="select-province"
|
|
||||||
:dense="dense"
|
|
||||||
:readonly="readonly"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:hide-dropdown-icon="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
v-model="checkup.insuranceCompany"
|
|
||||||
option-value="id"
|
|
||||||
option-label="name"
|
|
||||||
:label="$t('formDialogInputInsuranceCompany')"
|
|
||||||
class="col-6"
|
|
||||||
:options="addrOptions.provinceOps"
|
|
||||||
lazy-rules
|
|
||||||
/>
|
|
||||||
<VueDatePicker
|
|
||||||
utc
|
|
||||||
autoApply
|
|
||||||
:teleport="true"
|
|
||||||
v-model="checkup.coverageStartDate"
|
|
||||||
:locale="'th'"
|
|
||||||
:enableTimePicker="false"
|
|
||||||
:disabled="readonly"
|
|
||||||
class="col-3"
|
|
||||||
>
|
|
||||||
<template #year="{ value }">
|
|
||||||
{{ value + 543 }}
|
|
||||||
</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
id="input-birth-date"
|
|
||||||
:label="$t('formDialogInputCoverageStartDate')"
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
:model-value="
|
|
||||||
checkup.coverageStartDate
|
|
||||||
? dateFormat(checkup.coverageStartDate)
|
|
||||||
: ''
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
size="xs"
|
|
||||||
name="mdi-calendar-blank-outline"
|
|
||||||
class="cursor-pointer"
|
|
||||||
color="positive"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon
|
|
||||||
v-if="checkup.coverageStartDate && !readonly"
|
|
||||||
name="mdi-close"
|
|
||||||
class="cursor-pointer"
|
|
||||||
size="xs"
|
|
||||||
@click="checkup.coverageStartDate = undefined"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</VueDatePicker>
|
|
||||||
<VueDatePicker
|
|
||||||
utc
|
|
||||||
autoApply
|
|
||||||
:teleport="true"
|
|
||||||
v-model="checkup.coverageExpireDate"
|
|
||||||
:locale="'th'"
|
|
||||||
:enableTimePicker="false"
|
|
||||||
:disabled="readonly"
|
|
||||||
class="col-3"
|
|
||||||
>
|
|
||||||
<template #year="{ value }">
|
|
||||||
{{ value + 543 }}
|
|
||||||
</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
id="input-birth-date"
|
|
||||||
:label="$t('formDialogInputCoverageExpiretDate')"
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
:model-value="
|
|
||||||
checkup.coverageExpireDate
|
|
||||||
? dateFormat(checkup.coverageExpireDate)
|
|
||||||
: ''
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
size="xs"
|
|
||||||
name="mdi-calendar-blank-outline"
|
|
||||||
class="cursor-pointer"
|
|
||||||
color="positive"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon
|
|
||||||
v-if="checkup.coverageExpireDate && !readonly"
|
|
||||||
name="mdi-close"
|
|
||||||
class="cursor-pointer"
|
|
||||||
size="xs"
|
|
||||||
@click="checkup.coverageExpireDate = undefined"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</VueDatePicker>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<q-separator
|
|
||||||
v-if="separator"
|
|
||||||
class="col-12 q-mt-xl q-mb-md"
|
|
||||||
style="padding-block: 0.5px"
|
|
||||||
/>
|
|
||||||
</q-tab-panel>
|
|
||||||
</q-tab-panels>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
|
||||||
|
|
@ -89,7 +89,7 @@ const employeeOther = defineModel<EmployeeOtherCreate>('employeeOther');
|
||||||
hide-bottom-space
|
hide-bottom-space
|
||||||
class="col-6"
|
class="col-6"
|
||||||
:label="$t('formDialogInputFamilyBirthPlace')"
|
:label="$t('formDialogInputFamilyBirthPlace')"
|
||||||
v-model="employeeOther.birthPlace"
|
v-model="employeeOther.fatherBirthPlace"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12" />
|
<div class="col-12" />
|
||||||
|
|
@ -150,7 +150,7 @@ const employeeOther = defineModel<EmployeeOtherCreate>('employeeOther');
|
||||||
hide-bottom-space
|
hide-bottom-space
|
||||||
class="col-6"
|
class="col-6"
|
||||||
:label="$t('formDialogInputFamilyBirthPlace')"
|
:label="$t('formDialogInputFamilyBirthPlace')"
|
||||||
v-model="employeeOther.birthPlace"
|
v-model="employeeOther.motherBirthPlace"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,23 +1,6 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, reactive } from 'vue';
|
import { onMounted } from 'vue';
|
||||||
import { dateFormat } from 'src/utils/datetime';
|
import { dateFormat } from 'src/utils/datetime';
|
||||||
import useAddressStore, {
|
|
||||||
District,
|
|
||||||
Province,
|
|
||||||
SubDistrict,
|
|
||||||
} from 'src/stores/address';
|
|
||||||
|
|
||||||
const adrressStore = useAddressStore();
|
|
||||||
|
|
||||||
const addrOptions = reactive<{
|
|
||||||
provinceOps: Province[];
|
|
||||||
districtOps: District[];
|
|
||||||
subDistrictOps: SubDistrict[];
|
|
||||||
}>({
|
|
||||||
provinceOps: [],
|
|
||||||
districtOps: [],
|
|
||||||
subDistrictOps: [],
|
|
||||||
});
|
|
||||||
|
|
||||||
const passportType = defineModel<string>('passportType');
|
const passportType = defineModel<string>('passportType');
|
||||||
const passportNumber = defineModel<string>('passportNumber');
|
const passportNumber = defineModel<string>('passportNumber');
|
||||||
|
|
@ -28,6 +11,11 @@ const passportIssuingPlace = defineModel<string>('passportIssuingPlace');
|
||||||
const previousPassportReference = defineModel<string>(
|
const previousPassportReference = defineModel<string>(
|
||||||
'previousPassportReference',
|
'previousPassportReference',
|
||||||
);
|
);
|
||||||
|
const passportTypeOption =
|
||||||
|
defineModel<{ label: string; value: string }[]>('passportTypeOption');
|
||||||
|
const passportIssuingCountryOption = defineModel<
|
||||||
|
{ label: string; value: string }[]
|
||||||
|
>('passportIssuingCountryOption');
|
||||||
|
|
||||||
defineProps<{
|
defineProps<{
|
||||||
title?: string;
|
title?: string;
|
||||||
|
|
@ -35,18 +23,7 @@ defineProps<{
|
||||||
outlined?: boolean;
|
outlined?: boolean;
|
||||||
readonly?: boolean;
|
readonly?: boolean;
|
||||||
separator?: boolean;
|
separator?: boolean;
|
||||||
typeCustomer?: string;
|
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
async function fetchProvince() {
|
|
||||||
const result = await adrressStore.fetchProvince();
|
|
||||||
|
|
||||||
if (result) addrOptions.provinceOps = result;
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
await fetchProvince();
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -63,11 +40,11 @@ onMounted(async () => {
|
||||||
emit-value
|
emit-value
|
||||||
map-options
|
map-options
|
||||||
v-model="passportType"
|
v-model="passportType"
|
||||||
option-value="id"
|
option-value="value"
|
||||||
option-label="name"
|
option-label="label"
|
||||||
:label="$t('formDialogInputPassportType')"
|
:label="$t('formDialogInputPassportType')"
|
||||||
class="col-3"
|
class="col-3"
|
||||||
:options="addrOptions.provinceOps"
|
:options="passportTypeOption"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:rules="[
|
:rules="[
|
||||||
(val: string) =>
|
(val: string) =>
|
||||||
|
|
@ -130,11 +107,11 @@ onMounted(async () => {
|
||||||
emit-value
|
emit-value
|
||||||
map-options
|
map-options
|
||||||
v-model="passportIssuingCountry"
|
v-model="passportIssuingCountry"
|
||||||
option-value="id"
|
option-value="value"
|
||||||
option-label="nameEN"
|
option-label="label"
|
||||||
:label="$t('formDialogInputPassportCountry')"
|
:label="$t('formDialogInputPassportCountry')"
|
||||||
class="col-3"
|
class="col-3"
|
||||||
:options="addrOptions.provinceOps"
|
:options="passportIssuingCountryOption"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:rules="[
|
:rules="[
|
||||||
(val: string) =>
|
(val: string) =>
|
||||||
|
|
|
||||||
|
|
@ -28,6 +28,9 @@ const visaStayUntilDate = defineModel<Date | null>('visaStayUntilDate');
|
||||||
const tm6Number = defineModel<string>('tm6Number');
|
const tm6Number = defineModel<string>('tm6Number');
|
||||||
const entryDate = defineModel<Date | null>('entryDate');
|
const entryDate = defineModel<Date | null>('entryDate');
|
||||||
|
|
||||||
|
const visaTypeOption =
|
||||||
|
defineModel<{ label: string; value: string }[]>('visaTypeOption');
|
||||||
|
|
||||||
defineProps<{
|
defineProps<{
|
||||||
title?: string;
|
title?: string;
|
||||||
dense?: boolean;
|
dense?: boolean;
|
||||||
|
|
@ -62,11 +65,11 @@ onMounted(async () => {
|
||||||
emit-value
|
emit-value
|
||||||
map-options
|
map-options
|
||||||
v-model="visaType"
|
v-model="visaType"
|
||||||
option-value="id"
|
option-value="value"
|
||||||
option-label="name"
|
option-label="label"
|
||||||
:label="$t('formDialogInputVisaType')"
|
:label="$t('formDialogInputVisaType')"
|
||||||
class="col-3"
|
class="col-3"
|
||||||
:options="addrOptions.provinceOps"
|
:options="visaTypeOption"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:rules="[
|
:rules="[
|
||||||
(val: string) =>
|
(val: string) =>
|
||||||
|
|
|
||||||
|
|
@ -1,26 +1,15 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, reactive, ref } from 'vue';
|
import { onMounted, reactive, ref } from 'vue';
|
||||||
import { dateFormat } from 'src/utils/datetime';
|
import { dateFormat } from 'src/utils/datetime';
|
||||||
import useAddressStore, {
|
|
||||||
District,
|
|
||||||
Province,
|
|
||||||
SubDistrict,
|
|
||||||
} from 'src/stores/address';
|
|
||||||
import { EmployeeWorkCreate } from 'src/stores/employee/types';
|
import { EmployeeWorkCreate } from 'src/stores/employee/types';
|
||||||
|
|
||||||
const adrressStore = useAddressStore();
|
|
||||||
|
|
||||||
const addrOptions = reactive<{
|
|
||||||
provinceOps: Province[];
|
|
||||||
districtOps: District[];
|
|
||||||
subDistrictOps: SubDistrict[];
|
|
||||||
}>({
|
|
||||||
provinceOps: [],
|
|
||||||
districtOps: [],
|
|
||||||
subDistrictOps: [],
|
|
||||||
});
|
|
||||||
|
|
||||||
const employeeWork = defineModel<EmployeeWorkCreate[]>('employeeWork');
|
const employeeWork = defineModel<EmployeeWorkCreate[]>('employeeWork');
|
||||||
|
const positionNameOption =
|
||||||
|
defineModel<{ label: string; value: string }[]>('positionNameOption');
|
||||||
|
const jobTypeOption =
|
||||||
|
defineModel<{ label: string; value: string }[]>('jobTypeOption');
|
||||||
|
const workplaceOption =
|
||||||
|
defineModel<{ label: string; value: string }[]>('workplaceOption');
|
||||||
|
|
||||||
const tab = ref();
|
const tab = ref();
|
||||||
|
|
||||||
|
|
@ -30,15 +19,8 @@ defineProps<{
|
||||||
outlined?: boolean;
|
outlined?: boolean;
|
||||||
readonly?: boolean;
|
readonly?: boolean;
|
||||||
separator?: boolean;
|
separator?: boolean;
|
||||||
typeCustomer?: string;
|
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
async function fetchProvince() {
|
|
||||||
const result = await adrressStore.fetchProvince();
|
|
||||||
|
|
||||||
if (result) addrOptions.provinceOps = result;
|
|
||||||
}
|
|
||||||
|
|
||||||
function addData() {
|
function addData() {
|
||||||
employeeWork.value?.push({
|
employeeWork.value?.push({
|
||||||
workEndDate: null,
|
workEndDate: null,
|
||||||
|
|
@ -66,308 +48,309 @@ function removeData(index: number) {
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await fetchProvince();
|
|
||||||
tab.value = 'tab0';
|
tab.value = 'tab0';
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="bordered-b full-width">
|
<div>
|
||||||
<q-tabs
|
<div class="bordered-b full-width">
|
||||||
v-model="tab"
|
<q-tabs
|
||||||
dense
|
v-model="tab"
|
||||||
class="text-grey"
|
dense
|
||||||
active-class="active-tab"
|
class="text-grey"
|
||||||
indicator-color="transparent"
|
active-class="active-tab"
|
||||||
align="left"
|
indicator-color="transparent"
|
||||||
:breakpoint="0"
|
align="left"
|
||||||
>
|
:breakpoint="0"
|
||||||
<q-btn
|
>
|
||||||
@click="addData"
|
<q-btn
|
||||||
flat
|
@click="addData"
|
||||||
class="app-text-muted"
|
flat
|
||||||
style="background-color: var(--_body-bg)"
|
class="app-text-muted"
|
||||||
icon="mdi-plus"
|
style="background-color: var(--_body-bg)"
|
||||||
padding="8px 8px"
|
icon="mdi-plus"
|
||||||
:disable="readonly"
|
padding="8px 8px"
|
||||||
:color="$q.dark.isActive ? 'primary' : ''"
|
:disable="readonly"
|
||||||
:class="tab !== 'tab0' ? 'bordered-r' : ''"
|
:color="$q.dark.isActive ? 'primary' : ''"
|
||||||
/>
|
:class="tab !== 'tab0' ? 'bordered-r' : ''"
|
||||||
<q-tab
|
/>
|
||||||
v-for="(tab, index) in employeeWork"
|
<q-tab
|
||||||
|
v-for="(tab, index) in employeeWork"
|
||||||
|
v-bind:key="index"
|
||||||
|
:name="`tab${index}`"
|
||||||
|
class="content-tab text-capitalize"
|
||||||
|
style="z-index: 999"
|
||||||
|
>
|
||||||
|
<div class="text-weight-medium row items-center">
|
||||||
|
{{ $t('formDialogTabWork') + (index + 1) }}
|
||||||
|
<q-btn
|
||||||
|
v-if="!readonly && employeeWork?.length !== 1"
|
||||||
|
round
|
||||||
|
flat
|
||||||
|
id="closeDialog"
|
||||||
|
size="sm"
|
||||||
|
icon="mdi-close"
|
||||||
|
padding="xs"
|
||||||
|
color="red"
|
||||||
|
:class="{ dark: $q.dark.isActive }"
|
||||||
|
@click.stop="removeData(index)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</q-tab>
|
||||||
|
</q-tabs>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<q-tab-panels v-model="tab" style="padding-top: 0px">
|
||||||
|
<q-tab-panel
|
||||||
|
v-for="(work, index) in employeeWork"
|
||||||
v-bind:key="index"
|
v-bind:key="index"
|
||||||
:name="`tab${index}`"
|
:name="`tab${index}`"
|
||||||
class="content-tab text-capitalize"
|
class="row col-12 items-start"
|
||||||
style="z-index: 999"
|
style="overflow: auto; height: 50vh"
|
||||||
>
|
>
|
||||||
<div class="text-weight-medium row items-center">
|
<div class="col-3 app-text-muted">• {{ $t(`workHistory`) }}</div>
|
||||||
{{ $t('formDialogTabWork') + (index + 1) }}
|
<div class="col-9 row q-col-gutter-md">
|
||||||
<q-btn
|
<q-input
|
||||||
v-if="!readonly && employeeWork?.length !== 1"
|
for="input-ownerName"
|
||||||
round
|
:dense="dense"
|
||||||
flat
|
:outlined="!readonly"
|
||||||
id="closeDialog"
|
:readonly="readonly"
|
||||||
size="sm"
|
:borderless="readonly"
|
||||||
icon="mdi-close"
|
hide-bottom-space
|
||||||
padding="xs"
|
class="col-6"
|
||||||
color="red"
|
:label="$t('formDialogInputOwnerName')"
|
||||||
:class="{ dark: $q.dark.isActive }"
|
v-model="work.ownerName"
|
||||||
@click.stop="removeData(index)"
|
|
||||||
/>
|
/>
|
||||||
|
<q-select
|
||||||
|
id="select-positionName"
|
||||||
|
:dense="dense"
|
||||||
|
:readonly="readonly"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:hide-dropdown-icon="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
v-model="work.positionName"
|
||||||
|
option-value="value"
|
||||||
|
option-label="label"
|
||||||
|
:label="$t('formDialogInputJobPosition')"
|
||||||
|
class="col-6"
|
||||||
|
:options="positionNameOption"
|
||||||
|
lazy-rules
|
||||||
|
/>
|
||||||
|
<q-select
|
||||||
|
id="select-jobType"
|
||||||
|
:dense="dense"
|
||||||
|
:readonly="readonly"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:hide-dropdown-icon="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
v-model="work.jobType"
|
||||||
|
option-value="value"
|
||||||
|
option-label="label"
|
||||||
|
:label="$t('formDialogInputJobType')"
|
||||||
|
class="col-6"
|
||||||
|
:options="jobTypeOption"
|
||||||
|
lazy-rules
|
||||||
|
/>
|
||||||
|
<q-select
|
||||||
|
id="select-province"
|
||||||
|
:dense="dense"
|
||||||
|
:readonly="readonly"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:hide-dropdown-icon="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
v-model="work.workplace"
|
||||||
|
option-value="value"
|
||||||
|
option-label="label"
|
||||||
|
:label="$t('formDialogInputWorkPlace')"
|
||||||
|
class="col-6"
|
||||||
|
:options="workplaceOption"
|
||||||
|
lazy-rules
|
||||||
|
/>
|
||||||
|
<q-input
|
||||||
|
for="input-workEndDate"
|
||||||
|
:label="$t('formDialogInputRemark')"
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="!readonly"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
class="col-12"
|
||||||
|
v-model="work.remark"
|
||||||
|
type="textarea"
|
||||||
|
/>
|
||||||
|
<VueDatePicker
|
||||||
|
id="date-picker-workEndDate"
|
||||||
|
utc
|
||||||
|
autoApply
|
||||||
|
:teleport="true"
|
||||||
|
v-model="work.workEndDate"
|
||||||
|
:locale="'th'"
|
||||||
|
:enableTimePicker="false"
|
||||||
|
:disabled="readonly"
|
||||||
|
class="col-6"
|
||||||
|
>
|
||||||
|
<template #year="{ value }">
|
||||||
|
{{ value + 543 }}
|
||||||
|
</template>
|
||||||
|
<template #trigger>
|
||||||
|
<q-input
|
||||||
|
id="input-birth-date"
|
||||||
|
:label="$t('formDialogInputWorkUntil')"
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
:model-value="
|
||||||
|
work.workEndDate ? dateFormat(work.workEndDate) : ''
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon
|
||||||
|
size="xs"
|
||||||
|
name="mdi-calendar-blank-outline"
|
||||||
|
class="cursor-pointer"
|
||||||
|
color="positive"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template v-slot:append>
|
||||||
|
<q-icon
|
||||||
|
v-if="work.workEndDate && !readonly"
|
||||||
|
name="mdi-close"
|
||||||
|
class="cursor-pointer"
|
||||||
|
size="xs"
|
||||||
|
@click="work.workEndDate = undefined"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</template>
|
||||||
|
</VueDatePicker>
|
||||||
|
<q-input
|
||||||
|
for="input-workPermitNo"
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="!readonly"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
hide-bottom-space
|
||||||
|
class="col-6"
|
||||||
|
:label="$t('formDialogInputWorkPermitNo')"
|
||||||
|
v-model="work.workPermitNo"
|
||||||
|
/>
|
||||||
|
<VueDatePicker
|
||||||
|
id="date-picker-workPermitIssuDate"
|
||||||
|
utc
|
||||||
|
autoApply
|
||||||
|
:teleport="true"
|
||||||
|
v-model="work.workPermitIssuDate"
|
||||||
|
:locale="'th'"
|
||||||
|
:enableTimePicker="false"
|
||||||
|
:disabled="readonly"
|
||||||
|
class="col-6"
|
||||||
|
>
|
||||||
|
<template #year="{ value }">
|
||||||
|
{{ value + 543 }}
|
||||||
|
</template>
|
||||||
|
<template #trigger>
|
||||||
|
<q-input
|
||||||
|
id="input-birth-date"
|
||||||
|
:label="$t('formDialogInputWorkPermitIssueDate')"
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
:model-value="
|
||||||
|
work.workPermitIssuDate
|
||||||
|
? dateFormat(work.workPermitIssuDate)
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon
|
||||||
|
size="xs"
|
||||||
|
name="mdi-calendar-blank-outline"
|
||||||
|
class="cursor-pointer"
|
||||||
|
color="positive"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template v-slot:append>
|
||||||
|
<q-icon
|
||||||
|
v-if="work.workPermitIssuDate && !readonly"
|
||||||
|
name="mdi-close"
|
||||||
|
class="cursor-pointer"
|
||||||
|
size="xs"
|
||||||
|
@click="work.workPermitIssuDate = undefined"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</template>
|
||||||
|
</VueDatePicker>
|
||||||
|
<VueDatePicker
|
||||||
|
id="date-picker-workPermitExpireDate"
|
||||||
|
utc
|
||||||
|
autoApply
|
||||||
|
:teleport="true"
|
||||||
|
v-model="work.workPermitExpireDate"
|
||||||
|
:locale="'th'"
|
||||||
|
:enableTimePicker="false"
|
||||||
|
:disabled="readonly"
|
||||||
|
class="col-6"
|
||||||
|
>
|
||||||
|
<template #year="{ value }">
|
||||||
|
{{ value + 543 }}
|
||||||
|
</template>
|
||||||
|
<template #trigger>
|
||||||
|
<q-input
|
||||||
|
id="input-birth-date"
|
||||||
|
:label="$t('formDialogInputWorkPermitExpireDate')"
|
||||||
|
:dense="dense"
|
||||||
|
:outlined="readonly ? false : outlined"
|
||||||
|
:readonly="readonly"
|
||||||
|
:borderless="readonly"
|
||||||
|
:model-value="
|
||||||
|
work.workPermitExpireDate
|
||||||
|
? dateFormat(work.workPermitExpireDate)
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon
|
||||||
|
size="xs"
|
||||||
|
name="mdi-calendar-blank-outline"
|
||||||
|
class="cursor-pointer"
|
||||||
|
color="positive"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template v-slot:append>
|
||||||
|
<q-icon
|
||||||
|
v-if="work.workPermitExpireDate && !readonly"
|
||||||
|
name="mdi-close"
|
||||||
|
class="cursor-pointer"
|
||||||
|
size="xs"
|
||||||
|
@click="work.workPermitExpireDate = undefined"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</template>
|
||||||
|
</VueDatePicker>
|
||||||
</div>
|
</div>
|
||||||
</q-tab>
|
|
||||||
</q-tabs>
|
<q-separator
|
||||||
|
v-if="separator"
|
||||||
|
class="col-12 q-mt-xl q-mb-md"
|
||||||
|
style="padding-block: 0.5px"
|
||||||
|
/>
|
||||||
|
</q-tab-panel>
|
||||||
|
</q-tab-panels>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<q-tab-panels v-model="tab" style="padding-top: 0px">
|
|
||||||
<q-tab-panel
|
|
||||||
v-for="(work, index) in employeeWork"
|
|
||||||
v-bind:key="index"
|
|
||||||
:name="`tab${index}`"
|
|
||||||
class="row col-12 items-start"
|
|
||||||
style="overflow: auto; height: 50vh"
|
|
||||||
>
|
|
||||||
<div class="col-3 app-text-muted">• {{ $t(`workHistory`) }}</div>
|
|
||||||
<div class="col-9 row q-col-gutter-md">
|
|
||||||
<q-input
|
|
||||||
for="input-ownerName"
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="!readonly"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
class="col-6"
|
|
||||||
:label="$t('formDialogInputOwnerName')"
|
|
||||||
v-model="work.ownerName"
|
|
||||||
/>
|
|
||||||
<q-select
|
|
||||||
id="select-positionName"
|
|
||||||
:dense="dense"
|
|
||||||
:readonly="readonly"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:hide-dropdown-icon="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
v-model="work.positionName"
|
|
||||||
option-value="id"
|
|
||||||
option-label="name"
|
|
||||||
:label="$t('formDialogInputJobPosition')"
|
|
||||||
class="col-6"
|
|
||||||
:options="addrOptions.provinceOps"
|
|
||||||
lazy-rules
|
|
||||||
/>
|
|
||||||
<q-select
|
|
||||||
id="select-jobType"
|
|
||||||
:dense="dense"
|
|
||||||
:readonly="readonly"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:hide-dropdown-icon="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
v-model="work.jobType"
|
|
||||||
option-value="id"
|
|
||||||
option-label="nameEN"
|
|
||||||
:label="$t('formDialogInputJobType')"
|
|
||||||
class="col-6"
|
|
||||||
:options="addrOptions.provinceOps"
|
|
||||||
lazy-rules
|
|
||||||
/>
|
|
||||||
<q-select
|
|
||||||
id="select-province"
|
|
||||||
:dense="dense"
|
|
||||||
:readonly="readonly"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:hide-dropdown-icon="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
v-model="work.workplace"
|
|
||||||
option-value="id"
|
|
||||||
option-label="nameEN"
|
|
||||||
:label="$t('formDialogInputWorkPlace')"
|
|
||||||
class="col-6"
|
|
||||||
:options="addrOptions.provinceOps"
|
|
||||||
lazy-rules
|
|
||||||
/>
|
|
||||||
<q-input
|
|
||||||
for="input-workEndDate"
|
|
||||||
:label="$t('formDialogInputRemark')"
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="!readonly"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
class="col-12"
|
|
||||||
v-model="work.remark"
|
|
||||||
type="textarea"
|
|
||||||
/>
|
|
||||||
<VueDatePicker
|
|
||||||
id="date-picker-workEndDate"
|
|
||||||
utc
|
|
||||||
autoApply
|
|
||||||
:teleport="true"
|
|
||||||
v-model="work.workEndDate"
|
|
||||||
:locale="'th'"
|
|
||||||
:enableTimePicker="false"
|
|
||||||
:disabled="readonly"
|
|
||||||
class="col-6"
|
|
||||||
>
|
|
||||||
<template #year="{ value }">
|
|
||||||
{{ value + 543 }}
|
|
||||||
</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
id="input-birth-date"
|
|
||||||
:label="$t('formDialogInputWorkUntil')"
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
:model-value="
|
|
||||||
work.workEndDate ? dateFormat(work.workEndDate) : ''
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
size="xs"
|
|
||||||
name="mdi-calendar-blank-outline"
|
|
||||||
class="cursor-pointer"
|
|
||||||
color="positive"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon
|
|
||||||
v-if="work.workEndDate && !readonly"
|
|
||||||
name="mdi-close"
|
|
||||||
class="cursor-pointer"
|
|
||||||
size="xs"
|
|
||||||
@click="work.workEndDate = undefined"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</VueDatePicker>
|
|
||||||
<q-input
|
|
||||||
for="input-workPermitNo"
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="!readonly"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
hide-bottom-space
|
|
||||||
class="col-6"
|
|
||||||
:label="$t('formDialogInputWorkPermitNo')"
|
|
||||||
v-model="work.workPermitNo"
|
|
||||||
/>
|
|
||||||
<VueDatePicker
|
|
||||||
id="date-picker-workPermitIssuDate"
|
|
||||||
utc
|
|
||||||
autoApply
|
|
||||||
:teleport="true"
|
|
||||||
v-model="work.workPermitIssuDate"
|
|
||||||
:locale="'th'"
|
|
||||||
:enableTimePicker="false"
|
|
||||||
:disabled="readonly"
|
|
||||||
class="col-6"
|
|
||||||
>
|
|
||||||
<template #year="{ value }">
|
|
||||||
{{ value + 543 }}
|
|
||||||
</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
id="input-birth-date"
|
|
||||||
:label="$t('formDialogInputWorkPermitIssueDate')"
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
:model-value="
|
|
||||||
work.workPermitIssuDate
|
|
||||||
? dateFormat(work.workPermitIssuDate)
|
|
||||||
: ''
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
size="xs"
|
|
||||||
name="mdi-calendar-blank-outline"
|
|
||||||
class="cursor-pointer"
|
|
||||||
color="positive"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon
|
|
||||||
v-if="work.workPermitIssuDate && !readonly"
|
|
||||||
name="mdi-close"
|
|
||||||
class="cursor-pointer"
|
|
||||||
size="xs"
|
|
||||||
@click="work.workPermitIssuDate = undefined"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</VueDatePicker>
|
|
||||||
<VueDatePicker
|
|
||||||
id="date-picker-workPermitExpireDate"
|
|
||||||
utc
|
|
||||||
autoApply
|
|
||||||
:teleport="true"
|
|
||||||
v-model="work.workPermitExpireDate"
|
|
||||||
:locale="'th'"
|
|
||||||
:enableTimePicker="false"
|
|
||||||
:disabled="readonly"
|
|
||||||
class="col-6"
|
|
||||||
>
|
|
||||||
<template #year="{ value }">
|
|
||||||
{{ value + 543 }}
|
|
||||||
</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
id="input-birth-date"
|
|
||||||
:label="$t('formDialogInputWorkPermitExpireDate')"
|
|
||||||
:dense="dense"
|
|
||||||
:outlined="readonly ? false : outlined"
|
|
||||||
:readonly="readonly"
|
|
||||||
:borderless="readonly"
|
|
||||||
:model-value="
|
|
||||||
work.workPermitExpireDate
|
|
||||||
? dateFormat(work.workPermitExpireDate)
|
|
||||||
: ''
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
size="xs"
|
|
||||||
name="mdi-calendar-blank-outline"
|
|
||||||
class="cursor-pointer"
|
|
||||||
color="positive"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon
|
|
||||||
v-if="work.workPermitExpireDate && !readonly"
|
|
||||||
name="mdi-close"
|
|
||||||
class="cursor-pointer"
|
|
||||||
size="xs"
|
|
||||||
@click="work.workPermitExpireDate = undefined"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</VueDatePicker>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<q-separator
|
|
||||||
v-if="separator"
|
|
||||||
class="col-12 q-mt-xl q-mb-md"
|
|
||||||
style="padding-block: 0.5px"
|
|
||||||
/>
|
|
||||||
</q-tab-panel>
|
|
||||||
</q-tab-panels>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
|
||||||
|
|
@ -59,6 +59,7 @@ const {
|
||||||
createBranch,
|
createBranch,
|
||||||
deleteBranchById,
|
deleteBranchById,
|
||||||
editBranchById,
|
editBranchById,
|
||||||
|
fetchListBranch,
|
||||||
} = userCustomer;
|
} = userCustomer;
|
||||||
const employeeStore = useEmployeeStore();
|
const employeeStore = useEmployeeStore();
|
||||||
const formData = ref<CustomerCreate>({
|
const formData = ref<CustomerCreate>({
|
||||||
|
|
@ -107,6 +108,7 @@ const fieldSelectedCustomer = ref<{ label: string; value: string }>({
|
||||||
|
|
||||||
const formDataEmployeeSameAddr = ref(false);
|
const formDataEmployeeSameAddr = ref(false);
|
||||||
const formDataEmployeeTab = ref('personalInfo');
|
const formDataEmployeeTab = ref('personalInfo');
|
||||||
|
const employeeOwnerBranchOption = ref();
|
||||||
const formDataEmployee = ref<EmployeeCreate>({
|
const formDataEmployee = ref<EmployeeCreate>({
|
||||||
image: null,
|
image: null,
|
||||||
customerBranchId: '',
|
customerBranchId: '',
|
||||||
|
|
@ -173,17 +175,18 @@ const formDataEmployee = ref<EmployeeCreate>({
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
employeeOtherInfo: {
|
employeeOtherInfo: {
|
||||||
birthPlace: '',
|
|
||||||
citizenId: '',
|
citizenId: '',
|
||||||
fatherFirstName: '',
|
fatherFirstName: '',
|
||||||
fatherLastName: '',
|
fatherLastName: '',
|
||||||
fatherFirstNameEN: '',
|
fatherFirstNameEN: '',
|
||||||
fatherLastNameEN: '',
|
fatherLastNameEN: '',
|
||||||
|
fatherBirthPlace: '',
|
||||||
|
|
||||||
motherFirstName: '',
|
motherFirstName: '',
|
||||||
motherLastName: '',
|
motherLastName: '',
|
||||||
motherFirstNameEN: '',
|
motherFirstNameEN: '',
|
||||||
motherLastNameEN: '',
|
motherLastNameEN: '',
|
||||||
|
motherBirthPlace: '',
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -386,6 +389,83 @@ function clearForm() {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function clearFormEmployee() {
|
||||||
|
formDataEmployee.value = {
|
||||||
|
image: null,
|
||||||
|
customerBranchId: '',
|
||||||
|
nrcNo: '',
|
||||||
|
dateOfBirth: null,
|
||||||
|
gender: '',
|
||||||
|
nationality: '',
|
||||||
|
firstName: '',
|
||||||
|
firstNameEN: '',
|
||||||
|
lastName: '',
|
||||||
|
lastNameEN: '',
|
||||||
|
addressEN: '',
|
||||||
|
address: '',
|
||||||
|
zipCode: '',
|
||||||
|
passportType: '',
|
||||||
|
passportNumber: '',
|
||||||
|
passportIssueDate: null,
|
||||||
|
passportExpiryDate: null,
|
||||||
|
passportIssuingCountry: '',
|
||||||
|
passportIssuingPlace: '',
|
||||||
|
previousPassportReference: '',
|
||||||
|
visaType: '',
|
||||||
|
visaNumber: '',
|
||||||
|
visaIssueDate: null,
|
||||||
|
visaExpiryDate: null,
|
||||||
|
visaIssuingPlace: '',
|
||||||
|
visaStayUntilDate: null,
|
||||||
|
tm6Number: '',
|
||||||
|
entryDate: null,
|
||||||
|
workerStatus: '',
|
||||||
|
subDistrictId: '',
|
||||||
|
districtId: '',
|
||||||
|
provinceId: '',
|
||||||
|
employeeWork: [
|
||||||
|
{
|
||||||
|
workEndDate: null,
|
||||||
|
workPermitExpireDate: null,
|
||||||
|
workPermitIssuDate: null,
|
||||||
|
workPermitNo: '',
|
||||||
|
workplace: '',
|
||||||
|
jobType: '',
|
||||||
|
positionName: '',
|
||||||
|
ownerName: '',
|
||||||
|
remark: '',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
employeeCheckup: [
|
||||||
|
{
|
||||||
|
coverageExpireDate: null,
|
||||||
|
coverageStartDate: null,
|
||||||
|
insuranceCompany: '',
|
||||||
|
medicalBenefitScheme: '',
|
||||||
|
remark: '',
|
||||||
|
hospitalName: '',
|
||||||
|
provinceId: '',
|
||||||
|
checkupResult: '',
|
||||||
|
checkupType: '',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
employeeOtherInfo: {
|
||||||
|
citizenId: '',
|
||||||
|
fatherFirstName: '',
|
||||||
|
fatherLastName: '',
|
||||||
|
fatherFirstNameEN: '',
|
||||||
|
fatherLastNameEN: '',
|
||||||
|
fatherBirthPlace: '',
|
||||||
|
|
||||||
|
motherFirstName: '',
|
||||||
|
motherLastName: '',
|
||||||
|
motherFirstNameEN: '',
|
||||||
|
motherLastNameEN: '',
|
||||||
|
motherBirthPlace: '',
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
function deleteCustomerById(id: string) {
|
function deleteCustomerById(id: string) {
|
||||||
dialog({
|
dialog({
|
||||||
color: 'negative',
|
color: 'negative',
|
||||||
|
|
@ -447,6 +527,8 @@ async function onSubmit() {
|
||||||
});
|
});
|
||||||
const resultList = await employeeStore.fetchList();
|
const resultList = await employeeStore.fetchList();
|
||||||
if (resultList) listEmployee.value = resultList.result;
|
if (resultList) listEmployee.value = resultList.result;
|
||||||
|
clearFormEmployee();
|
||||||
|
dialogEmployee.value = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -557,6 +639,25 @@ function undo() {
|
||||||
infoDrawerEdit.value = false;
|
infoDrawerEdit.value = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function employeeFilterOwnerBranch(
|
||||||
|
val: string,
|
||||||
|
update: (...args: unknown[]) => void,
|
||||||
|
) {
|
||||||
|
update(async () => {
|
||||||
|
const result = await fetchListBranch({
|
||||||
|
includeCustomer: true,
|
||||||
|
query: val,
|
||||||
|
pageSize: 30,
|
||||||
|
});
|
||||||
|
if (result) {
|
||||||
|
employeeStore.ownerOption = result.result.map((i) => ({
|
||||||
|
label: i.code,
|
||||||
|
value: i.id,
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
async function assignFormData(data: Customer & { branch: CustomerBranch[] }) {
|
async function assignFormData(data: Customer & { branch: CustomerBranch[] }) {
|
||||||
formData.value = {
|
formData.value = {
|
||||||
status: 'CREATED',
|
status: 'CREATED',
|
||||||
|
|
@ -630,6 +731,10 @@ onMounted(async () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (resultListEmployee) listEmployee.value = resultListEmployee.result;
|
if (resultListEmployee) listEmployee.value = resultListEmployee.result;
|
||||||
|
|
||||||
|
const resultOption = await fetch('/option/option.json');
|
||||||
|
employeeStore.globalOption = await resultOption.json();
|
||||||
|
console.log(employeeStore.globalOption);
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(locale, () => {
|
watch(locale, () => {
|
||||||
|
|
@ -742,6 +847,7 @@ watch(fieldSelectedCustomer, async () => {
|
||||||
<div class="row q-py-md">
|
<div class="row q-py-md">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<q-select
|
<q-select
|
||||||
|
v-if="selectorLabel === 'EMPLOYER'"
|
||||||
v-model="fieldSelectedCustomer"
|
v-model="fieldSelectedCustomer"
|
||||||
style="width: 150px"
|
style="width: 150px"
|
||||||
outlined
|
outlined
|
||||||
|
|
@ -1202,8 +1308,10 @@ watch(fieldSelectedCustomer, async () => {
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
separator
|
separator
|
||||||
|
:employee-owner-option="employeeStore.ownerOption"
|
||||||
v-model:customer-branch-id="formDataEmployee.customerBranchId"
|
v-model:customer-branch-id="formDataEmployee.customerBranchId"
|
||||||
v-model:nrc-no="formDataEmployee.nrcNo"
|
v-model:nrc-no="formDataEmployee.nrcNo"
|
||||||
|
@filter-owner-branch="employeeFilterOwnerBranch"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -1231,12 +1339,22 @@ watch(fieldSelectedCustomer, async () => {
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model:employee-checkup="formDataEmployee.employeeCheckup"
|
v-model:employee-checkup="formDataEmployee.employeeCheckup"
|
||||||
|
v-model:checkup-type-option="employeeStore.globalOption.tha.nationality"
|
||||||
|
v-model:medical-benefit-option="
|
||||||
|
employeeStore.globalOption.tha.typeInsurance
|
||||||
|
"
|
||||||
|
v-model:insurance-company-option="
|
||||||
|
employeeStore.globalOption.tha.insurancePlace
|
||||||
|
"
|
||||||
/>
|
/>
|
||||||
<FormEmployeeWorkHistory
|
<FormEmployeeWorkHistory
|
||||||
v-if="formDataEmployeeTab === 'workHistory'"
|
v-if="formDataEmployeeTab === 'workHistory'"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model:employee-work="formDataEmployee.employeeWork"
|
v-model:employee-work="formDataEmployee.employeeWork"
|
||||||
|
v-model:position-name-option="employeeStore.globalOption.tha.position"
|
||||||
|
v-model:job-type-option="employeeStore.globalOption.tha.businessType"
|
||||||
|
v-model:workplace-option="employeeStore.globalOption.tha.area"
|
||||||
/>
|
/>
|
||||||
<FormEmployeeOther
|
<FormEmployeeOther
|
||||||
v-if="
|
v-if="
|
||||||
|
|
@ -1258,13 +1376,19 @@ watch(fieldSelectedCustomer, async () => {
|
||||||
v-model:passport-number="formDataEmployee.passportNumber"
|
v-model:passport-number="formDataEmployee.passportNumber"
|
||||||
v-model:passport-issue-date="formDataEmployee.passportIssueDate"
|
v-model:passport-issue-date="formDataEmployee.passportIssueDate"
|
||||||
v-model:passport-expiry-date="formDataEmployee.passportExpiryDate"
|
v-model:passport-expiry-date="formDataEmployee.passportExpiryDate"
|
||||||
|
v-model:passport-issuing-place="formDataEmployee.passportIssuingPlace"
|
||||||
v-model:passport-issuing-country="
|
v-model:passport-issuing-country="
|
||||||
formDataEmployee.passportIssuingCountry
|
formDataEmployee.passportIssuingCountry
|
||||||
"
|
"
|
||||||
v-model:passport-issuing-place="formDataEmployee.passportIssuingCountry"
|
|
||||||
v-model:previous-passport-reference="
|
v-model:previous-passport-reference="
|
||||||
formDataEmployee.previousPassportReference
|
formDataEmployee.previousPassportReference
|
||||||
"
|
"
|
||||||
|
v-model:passport-type-option="
|
||||||
|
employeeStore.globalOption.tha.nationality
|
||||||
|
"
|
||||||
|
v-model:passport-issuing-country-option="
|
||||||
|
employeeStore.globalOption.tha.nationality
|
||||||
|
"
|
||||||
/>
|
/>
|
||||||
<FormEmployeeVisa
|
<FormEmployeeVisa
|
||||||
v-if="formDataEmployeeTab === 'personalInfo'"
|
v-if="formDataEmployeeTab === 'personalInfo'"
|
||||||
|
|
@ -1279,6 +1403,7 @@ watch(fieldSelectedCustomer, async () => {
|
||||||
v-model:visa-stay-until-date="formDataEmployee.visaStayUntilDate"
|
v-model:visa-stay-until-date="formDataEmployee.visaStayUntilDate"
|
||||||
v-model:tm6-number="formDataEmployee.tm6Number"
|
v-model:tm6-number="formDataEmployee.tm6Number"
|
||||||
v-model:entry-date="formDataEmployee.entryDate"
|
v-model:entry-date="formDataEmployee.entryDate"
|
||||||
|
v-model:visa-type-option="employeeStore.globalOption.tha.nationality"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</FormDialog>
|
</FormDialog>
|
||||||
|
|
|
||||||
|
|
@ -7,6 +7,9 @@ import axios from 'axios';
|
||||||
|
|
||||||
const useEmployeeStore = defineStore('api-employee', () => {
|
const useEmployeeStore = defineStore('api-employee', () => {
|
||||||
const data = ref<Pagination<Employee[]>>();
|
const data = ref<Pagination<Employee[]>>();
|
||||||
|
const globalOption = ref();
|
||||||
|
const ownerOption = ref<{ label: string; value: string }[]>();
|
||||||
|
|
||||||
async function fetchList(
|
async function fetchList(
|
||||||
opts?: {
|
opts?: {
|
||||||
page?: number;
|
page?: number;
|
||||||
|
|
@ -136,6 +139,8 @@ const useEmployeeStore = defineStore('api-employee', () => {
|
||||||
|
|
||||||
return {
|
return {
|
||||||
data,
|
data,
|
||||||
|
globalOption,
|
||||||
|
ownerOption,
|
||||||
|
|
||||||
fetchList,
|
fetchList,
|
||||||
create,
|
create,
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue