chamomind/jws-frontend
chamomind/jws-frontend
6
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

refactor: show peview

Browse source
This commit is contained in:
Thanaphon Frappet 2024-10-16 18:03:50 +07:00
parent 614423e1f8
commit 624d6facd4
3 changed files with 420 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

122
src/pages/05_quotation/peview/ViewHeader.vue Normal file
View file

@ -0,0 +1,122 @@
<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>