122 lines
3.2 KiB
Vue
122 lines
3.2 KiB
Vue
<script lang="ts" setup>
|
|
// NOTE: Import stores
|
|
|
|
// NOTE Import Types
|
|
// NOTE: Import Components
|
|
</script>
|
|
|
|
<template>
|
|
<div class="row items-center q-mb-lg">
|
|
<div class="column" style="width: 50%">
|
|
<img src="/logo.png" width="192px" style="object-fit: scale-down" />
|
|
</div>
|
|
<div
|
|
class="column"
|
|
style="text-align: center; width: 50%; font-weight: 800; font-size: 24px"
|
|
>
|
|
ใบเสนอราคา
|
|
</div>
|
|
</div>
|
|
|
|
<article class="detail-card">
|
|
<section class="detail-customer-info">
|
|
<article>
|
|
<b>
|
|
บริษัท นำคนต่างด้าวมาทำงานในประเทศ จ๊อบส์ เวิร์คเกอร์ เซอร์วิส จำกัด
|
|
(สำนักงานใหญ่)
|
|
</b>
|
|
<span>
|
|
49,51,53 ถ.สุขสวัสดิ์ แขวงราษฏร์บูรณะ เขตราษฏร์บูรณะ กรุงเทพมหานคร
|
|
10140
|
|
</span>
|
|
<span>เลขประจำตัวผู้เสียภาษี 0225566001988</span>
|
|
<span>เบอร์โทร 02-018-8688</span>
|
|
<span>https://www.jobsworkerservice.com</span>
|
|
</article>
|
|
<article>
|
|
<b>ลูกค้า</b>
|
|
<span>
|
|
49,51,53 ถ.สุขสวัสดิ์ แขวงราษฏร์บูรณะ เขตราษฏร์บูรณะ กรุงเทพมหานคร
|
|
10140
|
|
</span>
|
|
<span>เลขประจำตัวผู้เสียภาษี 0225566001988</span>
|
|
<span>เบอร์โทร 02-018-8688</span>
|
|
<span>https://www.jobsworkerservice.com</span>
|
|
</article>
|
|
</section>
|
|
<section class="detail-quotation-info">
|
|
<div>
|
|
<div>เลขที่ใบเสนอราคา</div>
|
|
<div>QT240120S0003</div>
|
|
</div>
|
|
<div>
|
|
<div>วันที่ใบเสนอราคา</div>
|
|
<div>20/01/2024 10:36</div>
|
|
</div>
|
|
<div>
|
|
<div>ผู้ขาย</div>
|
|
<div>นายสดใส ใจงาม 084-363-5222</div>
|
|
</div>
|
|
<div>
|
|
<div>เงื่อนไขการชำระ</div>
|
|
<div>เงินสด - เต็มจำนวน</div>
|
|
</div>
|
|
<div>
|
|
<div>ชื่องาน</div>
|
|
<div>MOU Myanmar (Re-turn)</div>
|
|
</div>
|
|
<div>
|
|
<div>ผู้ติดต่อ</div>
|
|
<div>สุนี เจริญงาม</div>
|
|
</div>
|
|
<div>
|
|
<div>วันครบกำหนดชำระ</div>
|
|
<div>27/01/2024</div>
|
|
</div>
|
|
</section>
|
|
</article>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.detail-card {
|
|
display: flex;
|
|
gap: 16px;
|
|
|
|
& > * {
|
|
flex-grow: 1;
|
|
}
|
|
|
|
& > :first-child {
|
|
max-width: 57.5%;
|
|
}
|
|
}
|
|
|
|
.detail-customer-info {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 16px;
|
|
|
|
& > * {
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
& > :first-child {
|
|
color: var(--orange-5);
|
|
}
|
|
}
|
|
}
|
|
|
|
.detail-quotation-info {
|
|
& > * {
|
|
display: flex;
|
|
|
|
& > :first-child {
|
|
color: var(--orange-5);
|
|
}
|
|
|
|
& > * {
|
|
width: 50%;
|
|
}
|
|
}
|
|
}
|
|
</style>
|