summaryrefslogtreecommitdiff
path: root/src/lib
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib')
-rw-r--r--src/lib/checkout/api/getVoucher.js18
-rw-r--r--src/lib/checkout/components/Checkout.jsx165
-rw-r--r--src/lib/flashSale/components/FlashSale.jsx13
-rw-r--r--src/lib/flashSale/skeleton/FlashSaleSkeleton.jsx36
-rw-r--r--src/lib/home/api/popularProductApi.js2
-rw-r--r--src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx22
-rw-r--r--src/lib/product/api/productSimilarApi.js25
-rw-r--r--src/lib/product/components/Product/ProductDesktop.jsx95
-rw-r--r--src/lib/product/components/Product/ProductMobile.jsx128
-rw-r--r--src/lib/product/components/ProductCard.jsx42
-rw-r--r--src/lib/product/components/ProductSimilar.jsx3
-rw-r--r--src/lib/product/components/ProductSlider.jsx2
-rw-r--r--src/lib/product/hooks/useProductSimilar.js5
-rw-r--r--src/lib/transaction/api/airwayBillApi.js13
-rw-r--r--src/lib/transaction/components/Transaction.jsx180
-rw-r--r--src/lib/transaction/components/Transactions.jsx2
-rw-r--r--src/lib/transaction/hooks/useAirwayBill.js11
17 files changed, 585 insertions, 177 deletions
diff --git a/src/lib/checkout/api/getVoucher.js b/src/lib/checkout/api/getVoucher.js
index 57d8acf5..07cf376e 100644
--- a/src/lib/checkout/api/getVoucher.js
+++ b/src/lib/checkout/api/getVoucher.js
@@ -1,11 +1,21 @@
import odooApi from '@/core/api/odooApi'
-export const getVoucher = async (id) => {
- const dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher`)
+export const getVoucher = async (id, source) => {
+ let dataVoucher = null
+ if(source){
+ dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher?source=${source}`)
+ }else {
+ dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher`)
+ }
return dataVoucher
}
-export const findVoucher = async (code, id) => {
- const dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher?code=${code}`)
+export const findVoucher = async (code, id, source) => {
+ let dataVoucher = null
+ if(source){
+ dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher?code=${code}&source=${source}`)
+ }else{
+ dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher?code=${code}`)
+ }
return dataVoucher
}
diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx
index 53ac63e1..afb94c10 100644
--- a/src/lib/checkout/components/Checkout.jsx
+++ b/src/lib/checkout/components/Checkout.jsx
@@ -107,7 +107,7 @@ const Checkout = () => {
const voucher = async () => {
if (!listVouchers) {
try {
- let dataVoucher = await getVoucher(auth?.id)
+ let dataVoucher = await getVoucher(auth?.id, query)
SetListVoucher(dataVoucher)
} finally {
setLoadingVoucher(false)
@@ -115,7 +115,7 @@ const Checkout = () => {
}
}
const VoucherCode = async (code) => {
- let dataVoucher = await findVoucher(code, auth.id)
+ let dataVoucher = await findVoucher(code, auth.id, query)
if (dataVoucher.length <= 0) {
SetFindVoucher(1)
return
@@ -301,7 +301,7 @@ const Checkout = () => {
voucher: activeVoucher,
type: 'sale_order'
}
- if(query){
+ if (query) {
data.source = 'buy'
}
if (poNumber.current.value) data.po_number = poNumber.current.value
@@ -427,7 +427,7 @@ const Checkout = () => {
<hr className='mt-10 my-4 border-gray_r-10' />
<div className=''>
- {!loadingVoucher && listVouchers.length === 0 ? (
+ {!loadingVoucher && listVouchers?.length === 0 ? (
<div className='flex items-center justify-center mt-4 mb-4'>
<div className='text-center'>
<h1 className='font-bold mb-4'>Tidak ada voucher tersedia</h1>
@@ -490,7 +490,78 @@ const Checkout = () => {
<div className='absolute w-full h-full bg-gray_r-3/40 top-0 left-0 z-50' />
)}
- <div className={`border border-solid mb-5 w-full hover:cursor-pointer p-4 `}>
+ <div className={`border border-solid mb-5 w-full hover:cursor-pointer p-2 pl-4 pr-4 `}>
+ {item.canApply && (
+ <div
+ class='p-2 mb-4 text-sm text-green-800 rounded-lg bg-green-50 dark:text-green-400'
+ role='alert'
+ >
+ <p>
+ Potensi potongan sebesar{' '}
+ <span className='text-green font-bold'>
+ {currencyFormat(item.discountVoucher)}
+ </span>
+ </p>
+ </div>
+ )}
+ {!item.canApply && item.applyStatus === 'MPA-HF' && (
+ <div
+ class='p-2 mb-4 text-sm text-red-800 rounded-lg bg-red-50 dark:bg-gray-800 dark:text-red-400'
+ role='alert'
+ >
+ <p className='text-sm'>Voucher tidak bisa digabung dengan promo lainya</p>
+ </div>
+ )}
+ {!item.canApply && item.applyStatus === 'UM' && (
+ <div
+ class='p-2 mb-4 text-sm text-red-800 rounded-lg bg-red-50 dark:bg-gray-800 dark:text-red-400'
+ role='alert'
+ >
+ <p className='text-sm'>
+ Tambah produk{' '}
+ <span className='text-red-500 font-bold '>{item.manufactureNames}</span> senilai{' '}
+ <span className='text-red-500 font-bold'>
+ {currencyFormat(item.minPurchaseAmount)}
+ </span>{' '}
+ untuk pakai promo ini
+ </p>
+ </div>
+ )}
+
+ {!item.canApply &&
+ item.applyStatus === 'MPA' &&
+ item.manufactureNames != '' && (
+ <div
+ class='p-2 mb-4 text-sm text-red-800 rounded-lg bg-red-50 dark:bg-gray-800 dark:text-red-400'
+ role='alert'
+ >
+ <p className='text-sm'>
+ Tambah produk{' '}
+ <span className='text-red-500 font-bold'>{item.manufactureNames}</span> senilai{' '}
+ <span className='text-red-500 font-bold'>
+ {currencyFormat(item.differenceToApply)}
+ </span>{' '}
+ untuk pakai promo ini
+ </p>
+ </div>
+ )}
+
+ {!item.canApply &&
+ item.applyStatus === 'MPA' &&
+ item.manufactureNames === '' && (
+ <div
+ class='p-2 mb-4 text-sm text-red-800 rounded-lg bg-red-50 dark:bg-gray-800 dark:text-red-400'
+ role='alert'
+ >
+ <p className='text-sm'>
+ Tambah{' '}
+ <span className='text-red-500 font-bold'>
+ {currencyFormat(item.differenceToApply)}
+ </span>{' '}
+ untuk pakai promo ini{' '}
+ </p>
+ </div>
+ )}
<div className={`flex gap-x-3`}>
<div className='hidden md:w-[250px] md:block'>
<Image src={item.image} alt={item.name} className={`object-cover`} />
@@ -516,7 +587,7 @@ const Checkout = () => {
</label>
</div>
</div>
- <hr className='mt-3 my-4 border-gray_r-8' />
+ <hr className='mt-2 my-2 border-gray_r-8' />
<div className='flex justify-between items-center'>
<p className='text-justify text-sm md:text-xs'>
Kode Voucher :{' '}
@@ -528,51 +599,30 @@ const Checkout = () => {
)}
</p>
</div>
+ <div className='flex items-center mt-3'>
+ <svg
+ aria-hidden='true'
+ fill='none'
+ stroke='currentColor'
+ stroke-width='1.5'
+ viewBox='0 0 24 24'
+ className='w-5 text-black'
+ >
+ <path
+ d='M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z'
+ stroke-linecap='round'
+ stroke-linejoin='round'
+ ></path>
+ </svg>
+ <span className='text-left ml-3 text-sm '>
+ Berakhir dalam{' '}
+ <span className='text-red-600'>{item.remainingTime}</span> lagi{' '}
+ </span>
+ </div>
</div>
</div>
<div className='mt-3'>
<p className='text-justify text-sm '>
- {!item.canApply &&
- item.applyStatus === 'MPA' &&
- item.manufactureNames != '' && (
- <p>
- Tambah produk{' '}
- <span className='text-red-500'>{item.manufactureNames}</span> senilai{' '}
- <span className='text-red-500'>
- {currencyFormat(item.differenceToApply)}
- </span>{' '}
- untuk pakai promo ini
- </p>
- )}
- {!item.canApply &&
- item.applyStatus === 'MPA' &&
- item.manufactureNames === '' && (
- <p>
- Tambah{' '}
- <span className='text-red-500'>
- {currencyFormat(item.differenceToApply)}
- </span>{' '}
- untuk pakai promo ini{' '}
- </p>
- )}
- {!item.canApply && item.applyStatus === 'UM' && (
- <p>
- Tambah produk{' '}
- <span className='text-red-500'>{item.manufactureNames}</span> senilai{' '}
- <span className='text-red-500'>
- {currencyFormat(item.minPurchaseAmount)}
- </span>{' '}
- untuk pakai promo ini
- </p>
- )}
- {item.canApply && (
- <p>
- Potensi potongan sebesar{' '}
- <span className='text-red-500'>
- {currencyFormat(item.discountVoucher)}
- </span>
- </p>
- )}
{/* {item.canApply === false
? 'Tambah ' +
currencyFormat(item.differenceToApply) +
@@ -580,27 +630,6 @@ const Checkout = () => {
: 'Potensi potongan sebesar ' +
currencyFormat(hitungDiscountVoucher(item.code))} */}
</p>
- <hr className='mt-2 my-4 border-gray_r-8' />
- <div className='flex items-center'>
- <svg
- aria-hidden='true'
- fill='none'
- stroke='currentColor'
- stroke-width='1.5'
- viewBox='0 0 24 24'
- className='w-5 text-black'
- >
- <path
- d='M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z'
- stroke-linecap='round'
- stroke-linejoin='round'
- ></path>
- </svg>
- <span className='text-left ml-3 text-sm '>
- Berakhir dalam <span className='text-red-600'>{item.remainingTime}</span>{' '}
- lagi{' '}
- </span>
- </div>
</div>
</div>
</div>
diff --git a/src/lib/flashSale/components/FlashSale.jsx b/src/lib/flashSale/components/FlashSale.jsx
index e4a4a25c..87545d8d 100644
--- a/src/lib/flashSale/components/FlashSale.jsx
+++ b/src/lib/flashSale/components/FlashSale.jsx
@@ -1,21 +1,28 @@
import { useEffect, useState } from 'react'
import flashSaleApi from '../api/flashSaleApi'
-import Image from '@/core/components/elements/Image/Image'
+import Image from 'next/image'
import CountDown from '@/core/components/elements/CountDown/CountDown'
import productSearchApi from '@/lib/product/api/productSearchApi'
import ProductSlider from '@/lib/product/components/ProductSlider'
+import { FlashSaleSkeleton } from '../skeleton/FlashSaleSkeleton'
const FlashSale = () => {
const [flashSales, setFlashSales] = useState(null)
+ const [isLoading, setIsLoading] = useState(true)
useEffect(() => {
const loadFlashSales = async () => {
const dataFlashSales = await flashSaleApi()
setFlashSales(dataFlashSales)
+ setIsLoading(false)
}
loadFlashSales()
}, [])
+ if (isLoading) {
+ return <FlashSaleSkeleton />
+ }
+
return (
flashSales?.length > 0 && (
<div className='px-4 sm:px-0 grid grid-cols-1 gap-y-8'>
@@ -30,11 +37,15 @@ const FlashSale = () => {
<Image
src={flashSale.banner}
alt={flashSale.name}
+ width={1080}
+ height={192}
className='w-full rounded mb-4 hidden sm:block'
/>
<Image
src={flashSale.bannerMobile}
alt={flashSale.name}
+ width={256}
+ height={48}
className='w-full rounded mb-4 block sm:hidden'
/>
<FlashSaleProduct flashSaleId={flashSale.pricelistId} />
diff --git a/src/lib/flashSale/skeleton/FlashSaleSkeleton.jsx b/src/lib/flashSale/skeleton/FlashSaleSkeleton.jsx
new file mode 100644
index 00000000..e9a200d9
--- /dev/null
+++ b/src/lib/flashSale/skeleton/FlashSaleSkeleton.jsx
@@ -0,0 +1,36 @@
+import useDevice from '@/core/hooks/useDevice'
+import PopularProductSkeleton from '@/lib/home/components/Skeleton/PopularProductSkeleton'
+import Skeleton from 'react-loading-skeleton'
+
+const FlashSaleSkeleton = () => {
+ return (
+ <div className='px-4 md:px-0'>
+ <TitleSkeleton />
+ <div className='my-4'>
+ <BannerSkeleton />
+ </div>
+ <PopularProductSkeleton />
+ </div>
+ )
+}
+
+const TitleSkeleton = () => {
+ return (
+ <div className='w-full md:w-[36%] flex gap-x-4'>
+ <Skeleton containerClassName='block w-1/2' height={24} />
+ <div className='w-1/2 flex gap-x-1'>
+ <Skeleton height={40} containerClassName='w-full' />
+ <Skeleton height={40} containerClassName='w-full' />
+ <Skeleton height={40} containerClassName='w-full' />
+ <Skeleton height={40} containerClassName='w-full' />
+ </div>
+ </div>
+ )
+}
+
+const BannerSkeleton = () => {
+ const { isDesktop } = useDevice()
+ return <Skeleton duration={1.2} height={isDesktop ? 192 : 48} containerClassName='w-full' />
+}
+
+export { FlashSaleSkeleton, TitleSkeleton, BannerSkeleton }
diff --git a/src/lib/home/api/popularProductApi.js b/src/lib/home/api/popularProductApi.js
index 37e4390e..4bb5e580 100644
--- a/src/lib/home/api/popularProductApi.js
+++ b/src/lib/home/api/popularProductApi.js
@@ -2,7 +2,7 @@ import axios from 'axios'
const popularProductApi = async () => {
const dataPopularProducts = await axios(
- `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/search?q=*&page=1&orderBy=popular`
+ `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/search?q=*&page=1&orderBy=popular-weekly`
)
return dataPopularProducts.data.response
}
diff --git a/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx b/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
index 00589342..bd783053 100644
--- a/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
+++ b/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
@@ -1,12 +1,16 @@
-import BrandSkeleton from '@/core/components/elements/Skeleton/BrandSkeleton'
+import useDevice from '@/core/hooks/useDevice'
+import Skeleton from 'react-loading-skeleton'
-const PreferredBrandSkeleton = () => (
- <div className='grid grid-cols-4 gap-x-3'>
- <BrandSkeleton />
- <BrandSkeleton />
- <BrandSkeleton />
- <BrandSkeleton />
- </div>
-)
+const PreferredBrandSkeleton = () => {
+ const { isDesktop } = useDevice()
+
+ return (
+ <div className='grid grid-cols-4 md:grid-cols-8 gap-x-3'>
+ {Array.from({ length: isDesktop ? 8 : 4 }, (_, index) => (
+ <Skeleton count={1} height={isDesktop ? 84 : 56} key={index} />
+ ))}
+ </div>
+ )
+}
export default PreferredBrandSkeleton
diff --git a/src/lib/product/api/productSimilarApi.js b/src/lib/product/api/productSimilarApi.js
index 93c7f22c..c1bccd59 100644
--- a/src/lib/product/api/productSimilarApi.js
+++ b/src/lib/product/api/productSimilarApi.js
@@ -1,9 +1,30 @@
+import odooApi from '@/core/api/odooApi'
import axios from 'axios'
+import productSearchApi from './productSearchApi'
-const productSimilarApi = async ({ query }) => {
+const productSimilarApi = async ({ query, source }) => {
+ let dataflashSale = null
+ const flashSale = await odooApi('GET', '/api/v1/flashsale/header')
+ if (flashSale && flashSale.length > 0) {
+ const dataFlash = await productSearchApi({
+ query: `fq=flashsale_id_i:${flashSale[0].pricelistId}&fq=flashsale_price_f:[1 TO *]&limit=${
+ source === 'bottom' ? '4' : '1'
+ }`,
+ operation: 'AND'
+ })
+ if (source === 'bottom') {
+ dataflashSale = dataFlash.response.products.slice('2', '4')
+ } else {
+ dataflashSale = dataFlash.response.products
+ }
+ }
const dataProductSimilar = await axios(
- `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/search?q=${query}&page=1&orderBy=popular&operation=OR`
+ `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/search?q=${query}&page=1&orderBy=popular-weekly&operation=OR`
)
+ dataProductSimilar.data.response.products = [
+ ...dataflashSale,
+ ...dataProductSimilar.data.response.products,
+ ];
return dataProductSimilar.data.response
}
diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx
index 7e1d0d3b..3b9296a8 100644
--- a/src/lib/product/components/Product/ProductDesktop.jsx
+++ b/src/lib/product/components/Product/ProductDesktop.jsx
@@ -18,6 +18,9 @@ import odooApi from '@/core/api/odooApi'
import { Button, Spinner } from 'flowbite-react'
import PromotionType from '@/lib/promotinProgram/components/PromotionType'
import useAuth from '@/core/hooks/useAuth'
+import ImageNext from 'next/image'
+import CountDown2 from '@/core/components/elements/CountDown/CountDown2'
+import CountDown from '@/core/components/elements/CountDown/CountDown'
const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
const router = useRouter()
@@ -33,6 +36,7 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
const [promotionType, setPromotionType] = useState(false)
const [promotionActiveId, setPromotionActiveId] = useState(null)
const [selectVariantPromoActive, setSelectVariantPromoActive] = useState(null)
+ const [backgorundFlashSale, setBackgorundFlashSale] = useState(null)
const getLowestPrice = useCallback(() => {
const prices = product.variants.map((variant) => variant.price)
@@ -47,6 +51,14 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
setLowestPrice(lowest)
}, [getLowestPrice])
+ useEffect(() => {
+ const getBackgound = async () => {
+ const get = await odooApi('GET', '/api/v1/banner?type=flash-sale-background-banner')
+ setBackgorundFlashSale(get[0].image)
+ }
+ getBackgound()
+ }, [])
+
const [informationTab, setInformationTab] = useState(informationTabOptions[0].value)
const variantQuantityRefs = useRef([])
@@ -54,7 +66,7 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
const setVariantQuantityRef = (variantId) => (element) => {
if (element) {
let variantIndex = product.variants.findIndex((varian) => varian.id == variantId)
- product.variants[variantIndex].quantity = element.value
+ product.variants[variantIndex].quantity = element?.value
}
variantQuantityRefs.current[variantId] = element
}
@@ -96,7 +108,7 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
router.push(`/login?next=/shop/product/${slug}`)
return
}
-
+
const quantity = variantQuantityRefs.current[variantId].value
if (!validQuantity(quantity)) return
@@ -106,6 +118,15 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
setAddCartAlert(true)
}
+ const handleQuantityChange = (variantId) => (event) => {
+ const { value } = event.target
+ const variantIndex = product.variants.findIndex((variant) => variant.id === variantId)
+ if (variantIndex !== -1) {
+ product.variants[variantIndex].quantity = parseInt(value, 10) // Pastikan untuk mengubah ke tipe number jika diperlukan
+ // Lakukan sesuatu jika nilai quantity diubah
+ }
+ }
+
const handleBuy = (variant) => {
const quantity = variantQuantityRefs.current[variant].value
if (!validQuantity(quantity)) return
@@ -142,7 +163,8 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
useEffect(() => {
const loadProductSimilarInBrand = async () => {
const productSimilarQuery = [product?.name, `fq=-product_id_i:${product.id}`].join('&')
- const dataProductSimilar = await productSimilarApi({ query: productSimilarQuery })
+ const source = 'right'
+ const dataProductSimilar = await productSimilarApi({ query: productSimilarQuery, source })
setProductSimilarInBrand(dataProductSimilar.products)
}
if (!productSimilarInBrand) loadProductSimilarInBrand()
@@ -171,11 +193,52 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
<div className='flex'>
<div className='w-full flex flex-wrap'>
<div className='w-5/12'>
- <Image
- src={product.image}
- alt={product.name}
- className='h-[430px] object-contain object-center w-full border border-gray_r-4'
- />
+ <div className='relative mb-2'>
+ {product?.flashSale?.remainingTime > 0 && (
+ <div className={`absolute bottom-0 w-full`}>
+ <div className='absolute bottom-0 w-full h-full'>
+ <ImageNext src={backgorundFlashSale || '/images/GAMBAR-BG-FLASH-SALE.jpg'} width={1000} height={100} />
+ </div>
+ <div className='relative'>
+ <div className='flex gap-x-2 items-center p-2'>
+ <div className='bg-yellow-400 rounded-full p-1 h-9 w-20 flex items-center justify-center '>
+ <span className='text-lg font-bold'>
+ {product.lowestPrice.discountPercentage}%
+ </span>
+ </div>
+ <div
+ className={`bg-red-600 border border-solid border-yellow-400 rounded-full h-9 p-2 flex w-[50%] items-center justify-center gap-x-4`}
+ >
+ <ImageNext
+ src='/images/ICON_FLASH_SALE_WEBSITE_INDOTEKNIK.svg'
+ width={17}
+ height={10}
+ />
+ <span className='text-white text-lg font-semibold'>
+ {product.flashSale.tag || 'FLASH SALE'}
+ </span>
+ </div>
+ <div>
+ <CountDown2 initialTime={product.flashSale.remainingTime} />
+ </div>
+ </div>
+ </div>
+ </div>
+ )}
+ <Image
+ src={product.image}
+ alt={product.name}
+ className='h-[430px] object-contain object-center w-full border border-gray_r-4'
+ />
+ </div>
+ <div>
+ <p className='text-justify text-xs leading-5'>
+ <span className='font-semibold '>Keterangan : </span>Gambar atau foto berperan
+ sebagai ilustrasi produk. Kadang tidak sesuai dengan kondisi terbaru dengan
+ berbagai perubahan dan perbaikan. Hubungi tim sales kami untuk informasi yang
+ lebih baik perihal gambar di 021-2933 8828.
+ </p>
+ </div>
</div>
<div className='w-7/12 px-4'>
@@ -375,6 +438,18 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
<div className='text-gray_r-11 line-through text-caption-1'>
{currencyFormat(lowestPrice?.price)}
</div>
+ {product.flashSale.remainingTime > 0 && (
+ <div className='bg-red-600 rounded-full mb-1 p-2 pl-3 pr-3 flex w-fit items-center gap-x-1'>
+ <ImageNext
+ src='/images/ICON_FLASH_SALE_WEBSITE_INDOTEKNIK.svg'
+ width={15}
+ height={10}
+ />
+ <span className='text-white text-xs font-semibold'>
+ {product.flashSale.tag || 'FLASH SALE'}
+ </span>
+ </div>
+ )}
</div>
)}
<h3 className='text-danger-500 font-semibold mt-1 text-title-md'>
@@ -412,7 +487,7 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
type='number'
className='form-input w-16 py-2 text-center bg-gray_r-1'
ref={setVariantQuantityRef(product.variants[0].id)}
- onChange={setVariantQuantityRef(product.variants[0].id)}
+ onChange={handleQuantityChange(product.variants[0].id)}
defaultValue={1}
/>
<button
@@ -579,7 +654,7 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => {
type='number'
className='form-input w-16 py-2 text-center bg-gray_r-1'
ref={setVariantQuantityRef(variant.id)}
- onChange={setVariantQuantityRef(variant.id)}
+ onChange={handleQuantityChange(variant.id)}
defaultValue={1}
/>
</td>
diff --git a/src/lib/product/components/Product/ProductMobile.jsx b/src/lib/product/components/Product/ProductMobile.jsx
index 2edd1a5f..d25d0861 100644
--- a/src/lib/product/components/Product/ProductMobile.jsx
+++ b/src/lib/product/components/Product/ProductMobile.jsx
@@ -18,6 +18,8 @@ import PromotionType from '@/lib/promotinProgram/components/PromotionType'
import { gtagAddToCart } from '@/core/utils/googleTag'
import odooApi from '@/core/api/odooApi'
import { Button, Spinner } from 'flowbite-react'
+import ImageNext from 'next/image'
+import CountDown2 from '@/core/components/elements/CountDown/CountDown2'
const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
const router = useRouter()
@@ -30,6 +32,7 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
const [isLoadingSLA, setIsLoadingSLA] = useState(true)
const [promotionType, setPromotionType] = useState(false)
const [promotionActiveId, setPromotionActiveId] = useState(null)
+ const [backgorundFlashSale, setBackgorundFlashSale] = useState(null)
const getLowestPrice = () => {
const prices = product.variants.map((variant) => variant.price)
@@ -39,6 +42,16 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
return lowest
}
+ useEffect(() => {
+ const getBackgound = async () => {
+ const get = await odooApi('GET', '/api/v1/banner?type=flash-sale-background-banner')
+ if (get.length > 0) {
+ setBackgorundFlashSale(get[0].image)
+ }
+ }
+ getBackgound()
+ }, [])
+
const [activeVariant, setActiveVariant] = useState({
id: null,
code: product.code,
@@ -69,11 +82,11 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
product.variants = variantData
setIsLoadingSLA(false)
- if(product.variants.length === 1){
+ if (product.variants.length === 1) {
setActiveVariant({
id: product.variants[0].id,
code: product.variants[0].code,
- name: product.variants[0].parent.name ,
+ name: product.variants[0].parent.name,
price: product.variants[0].price,
stock: product.variants[0].stock,
weight: product.variants[0].weight,
@@ -143,7 +156,7 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
quantity,
programLineId: promotionActiveId,
selected: true,
- source : 'buy'
+ source: 'buy'
})
router.push(`/shop/checkout?source=buy`)
}
@@ -156,11 +169,48 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
return (
<MobileView>
- <Image
- src={product.image}
- alt={product.name}
- className='h-72 object-contain object-center w-full border-b border-gray_r-4'
- />
+ <div className='relative'>
+ {product?.flashSale?.remainingTime > 0 && (
+ <div className={`absolute bottom-0 w-full`}>
+ <div className='absolute bottom-0 w-full'>
+ <ImageNext
+ src={backgorundFlashSale || '/images/GAMBAR-BG-FLASH-SALE.jpg'}
+ width={1000}
+ height={100}
+ />
+ </div>
+ <div className='relative'>
+ <div className='flex gap-x-2 items-center p-2'>
+ <div className='bg-yellow-400 rounded-full p-1 h-9 w-20 flex items-center justify-center '>
+ <span className='text-lg font-bold'>
+ {product.lowestPrice.discountPercentage}%
+ </span>
+ </div>
+ <div
+ className={`bg-red-600 border border-solid border-yellow-400 rounded-full h-9 p-2 flex w-[50%] items-center justify-center gap-x-4`}
+ >
+ <ImageNext
+ src='/images/ICON_FLASH_SALE_WEBSITE_INDOTEKNIK.svg'
+ width={17}
+ height={10}
+ />
+ <span className='text-white text-lg font-semibold'>
+ {product.flashSale.tag || 'FLASH SALE'}
+ </span>
+ </div>
+ <div>
+ <CountDown2 initialTime={product.flashSale.remainingTime} />
+ </div>
+ </div>
+ </div>
+ </div>
+ )}
+ <Image
+ src={product.image}
+ alt={product.name}
+ className='h-72 object-contain object-center w-full border-b border-gray_r-4'
+ />
+ </div>
<div className='p-4'>
<div className='flex items-end mb-2'>
@@ -294,40 +344,44 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
<Spinner aria-label='Alternate spinner button example' />
<span className='pl-3'>Loading...</span>
</Button>
- ) : selectedVariant ? activeVariant?.sla?.slaDate != '-' ? (
- <button
- type='button'
- title={`Masa Persiapan Barang ${activeVariant?.sla?.slaDate}`}
- className={`flex gap-x-1 items-center p-2 h-8 rounded-lg w-full ${
- activeVariant?.sla?.slaDate === 'indent' ? 'bg-indigo-900' : 'btn-light'
- }`}
- >
- <div
- className={`flex-1 text-sm ${
- activeVariant?.sla?.slaDate === 'indent' ? 'text-white' : ''
+ ) : selectedVariant ? (
+ activeVariant?.sla?.slaDate != '-' ? (
+ <button
+ type='button'
+ title={`Masa Persiapan Barang ${activeVariant?.sla?.slaDate}`}
+ className={`flex gap-x-1 items-center p-2 h-8 rounded-lg w-full ${
+ activeVariant?.sla?.slaDate === 'indent' ? 'bg-indigo-900' : 'btn-light'
}`}
>
- {activeVariant?.sla?.slaDate}
- </div>
- <div className='flex-end'>
- <svg
- aria-hidden='true'
- fill='none'
- stroke='currentColor'
- stroke-width='1.5'
- className={`w-7 h-7 text-sm ${
+ <div
+ className={`flex-1 text-sm ${
activeVariant?.sla?.slaDate === 'indent' ? 'text-white' : ''
}`}
>
- <path
- d='M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z'
- stroke-linecap='round'
- stroke-linejoin='round'
- ></path>
- </svg>
- </div>
- </button>
- ):('-') : (
+ {activeVariant?.sla?.slaDate}
+ </div>
+ <div className='flex-end'>
+ <svg
+ aria-hidden='true'
+ fill='none'
+ stroke='currentColor'
+ stroke-width='1.5'
+ className={`w-7 h-7 text-sm ${
+ activeVariant?.sla?.slaDate === 'indent' ? 'text-white' : ''
+ }`}
+ >
+ <path
+ d='M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z'
+ stroke-linecap='round'
+ stroke-linejoin='round'
+ ></path>
+ </svg>
+ </div>
+ </button>
+ ) : (
+ '-'
+ )
+ ) : (
'-'
)}
</span>
diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx
index a8964310..2c849bd6 100644
--- a/src/lib/product/components/ProductCard.jsx
+++ b/src/lib/product/components/ProductCard.jsx
@@ -3,8 +3,12 @@ import Link from '@/core/components/elements/Link/Link'
import currencyFormat from '@/core/utils/currencyFormat'
import { createSlug } from '@/core/utils/slug'
import whatsappUrl from '@/core/utils/whatsappUrl'
+import ImageNext from 'next/image'
+import { useRouter } from 'next/router'
const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
+ const router = useRouter()
+
const callForPriceWhatsapp = whatsappUrl('product', {
name: product.name,
url: createSlug('/shop/product/', product.name, product.id, true)
@@ -12,7 +16,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
if (variant == 'vertical') {
return (
- <div className='rounded shadow-sm border border-gray_r-4 bg-white h-[350px]'>
+ <div className='rounded shadow-sm border border-gray_r-4 bg-white h-[300px] md:h-[350px]'>
<Link
href={createSlug('/shop/product/', product?.name, product?.id)}
className='border-b border-gray_r-4 relative'
@@ -22,6 +26,32 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
alt={product?.name}
className='w-full object-contain object-center h-36 sm:h-48'
/>
+ {router.pathname != '/' && product?.flashSale?.id > 0 && (
+ <div className='absolute bottom-0 w-full grid'>
+ <div className='absolute bottom-0 w-full h-full'>
+ <ImageNext src='/images/GAMBAR-BG-FLASH-SALE.jpg' className='h-full' width={1000} height={100} />
+ </div>
+ <div className='relative'>
+ <div className='flex gap-x-1 items-center p-2 justify-center'>
+ <div className='bg-yellow-400 rounded-full p-1 h-6 w-19 flex items-center justify-center '>
+ <span className='text-sm font-bold text-black'>
+ {product?.lowestPrice.discountPercentage}%
+ </span>
+ </div>
+ <div className='bg-red-600 border border-solid border-yellow-400 p-2 rounded-full h-6 flex w-fit items-center justify-center gap-x-2'>
+ <ImageNext
+ src='/images/ICON_FLASH_SALE_WEBSITE_INDOTEKNIK.svg'
+ width={13}
+ height={5}
+ />
+ <span className='text-white text-[11px] font-semibold'>
+ {product?.flashSale?.tag != "false" || product?.flashSale?.tag != product?.flashSale?.tag ? product?.flashSale?.tag : 'FLASH SALE'}
+ </span>
+ </div>
+ </div>
+ </div>
+ </div>
+ )}
{product.variantTotal > 1 && (
<div className='absolute badge-gray bottom-1.5 left-1.5'>
{product.variantTotal} Varian
@@ -101,6 +131,16 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
</Link>
</div>
<div className='w-8/12 p-2'>
+ {product.flashSale.id > 0 && (
+ <div className='bg-red-600 rounded-full mb-1 p-2 pl-3 pr-3 flex w-fit items-center gap-x-1'>
+ <ImageNext
+ src='/images/ICON_FLASH_SALE_WEBSITE_INDOTEKNIK.svg'
+ width={15}
+ height={10}
+ />
+ <span className='text-white text-xs font-semibold'>{product?.flashSale?.tag != "false" || product?.flashSale?.tag != product?.flashSale?.tag ? product?.flashSale?.tag : 'FLASH SALE'}</span>
+ </div>
+ )}
{product?.manufacture?.name ? (
<Link
href={createSlug(
diff --git a/src/lib/product/components/ProductSimilar.jsx b/src/lib/product/components/ProductSimilar.jsx
index 63a33089..1b82c2e5 100644
--- a/src/lib/product/components/ProductSimilar.jsx
+++ b/src/lib/product/components/ProductSimilar.jsx
@@ -3,7 +3,8 @@ import useProductSimilar from '../hooks/useProductSimilar'
import ProductSlider from './ProductSlider'
const ProductSimilar = ({ query }) => {
- const { productSimilar } = useProductSimilar({ query })
+ const source = "bottom"
+ const { productSimilar } = useProductSimilar({ query, source })
if (productSimilar.isLoading) {
return <PopularProductSkeleton />
diff --git a/src/lib/product/components/ProductSlider.jsx b/src/lib/product/components/ProductSlider.jsx
index b511eea5..dedbd6ab 100644
--- a/src/lib/product/components/ProductSlider.jsx
+++ b/src/lib/product/components/ProductSlider.jsx
@@ -66,7 +66,7 @@ const ProductSlider = ({ products, simpleTitle = false, bannerMode = false }) =>
</MobileView>
<DesktopView>
- <Swiper slidesPerView={5.6} spaceBetween={16} {...swiperProps}>
+ <Swiper slidesPerView={6.7} spaceBetween={16} {...swiperProps}>
{swiperContent}
</Swiper>
</DesktopView>
diff --git a/src/lib/product/hooks/useProductSimilar.js b/src/lib/product/hooks/useProductSimilar.js
index d16e4c58..712d07ad 100644
--- a/src/lib/product/hooks/useProductSimilar.js
+++ b/src/lib/product/hooks/useProductSimilar.js
@@ -1,10 +1,9 @@
import productSimilarApi from '../api/productSimilarApi'
import { useQuery } from 'react-query'
-const useProductSimilar = ({ query }) => {
- const fetchProductSimilar = async () => await productSimilarApi({ query })
+const useProductSimilar = ({ query, source }) => {
+ const fetchProductSimilar = async () => await productSimilarApi({ query, source })
const { data, isLoading } = useQuery(`productSimilar-${query}`, fetchProductSimilar)
-
return {
productSimilar: { data, isLoading }
}
diff --git a/src/lib/transaction/api/airwayBillApi.js b/src/lib/transaction/api/airwayBillApi.js
new file mode 100644
index 00000000..1ef579c7
--- /dev/null
+++ b/src/lib/transaction/api/airwayBillApi.js
@@ -0,0 +1,13 @@
+import odooApi from '@/core/api/odooApi'
+import { getAuth } from '@/core/utils/auth'
+
+const airwayBillApi = async ({ orderId }) => {
+ const auth = getAuth()
+ const dataAirwayBill = await odooApi(
+ 'GET',
+ `/api/v1/partner/${auth.partnerId}/sale-order/${orderId}/awb`
+ )
+ return dataAirwayBill
+}
+
+export default airwayBillApi
diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx
index dca85f0c..74f3dbd5 100644
--- a/src/lib/transaction/components/Transaction.jsx
+++ b/src/lib/transaction/components/Transaction.jsx
@@ -12,7 +12,6 @@ import currencyFormat from '@/core/utils/currencyFormat'
import VariantGroupCard from '@/lib/variant/components/VariantGroupCard'
import { ChevronDownIcon, ChevronRightIcon, ChevronUpIcon } from '@heroicons/react/24/outline'
import Link from '@/core/components/elements/Link/Link'
-import Alert from '@/core/components/elements/Alert/Alert'
import checkoutPoApi from '../api/checkoutPoApi'
import cancelTransactionApi from '../api/cancelTransactionApi'
import MobileView from '@/core/components/views/MobileView'
@@ -21,9 +20,13 @@ import Menu from '@/lib/auth/components/Menu'
import Image from '@/core/components/elements/Image/Image'
import { createSlug } from '@/core/utils/slug'
import toTitleCase from '@/core/utils/toTitleCase'
+import useAirwayBill from '../hooks/useAirwayBill'
const Transaction = ({ id }) => {
const { transaction } = useTransaction({ id })
+ const { queryAirwayBill } = useAirwayBill({ orderId: id })
+
+ const [airwayBillPopup, setAirwayBillPopup] = useState(null)
const poNumber = useRef(null)
const poFile = useRef(null)
@@ -173,6 +176,35 @@ const Transaction = ({ id }) => {
<Divider />
+ <div className='p-4'>
+ <div className='font-medium'>Pengiriman</div>
+ <div className='flex flex-col gap-y-3 mt-4'>
+ {queryAirwayBill.data?.airways?.map((airway) => (
+ <button
+ className='shadow rounded-md p-4 text-gray_r-12 font-normal flex justify-between items-center text-left'
+ key={airway?.waybillNumber}
+ onClick={() => setAirwayBillPopup(airway?.waybillNumber)}
+ >
+ <div>
+ <span className='text-sm text-gray_r-11'>No Resi</span>
+ <p className='mt-1 font-medium'>{airway?.waybillNumber}</p>
+ </div>
+ <div className='flex gap-x-2'>
+ <div className='text-sm text-gray_r-11 badge-green'>
+ {airway?.deliveryStatus?.status}
+ </div>
+ <ChevronRightIcon className='w-5 stroke-2' />
+ </div>
+ </button>
+ ))}
+ </div>
+ {!queryAirwayBill?.data?.airways && (
+ <div className='badge-red text-sm px-2'>Belum ada pengiriman</div>
+ )}
+ </div>
+
+ <Divider />
+
<div className='p-4 flex flex-col gap-y-4'>
<DescriptionRow label='Purchase Order'>
{transaction.data?.purchaseOrderName || '-'}
@@ -229,9 +261,7 @@ const Transaction = ({ id }) => {
</Link>
))}
{transaction.data?.invoices?.length === 0 && (
- <Alert type='info' className='text-center'>
- Belum ada Invoice
- </Alert>
+ <div className='badge-red text-sm px-2'>Belum ada invoice</div>
)}
</div>
</div>
@@ -268,20 +298,36 @@ const Transaction = ({ id }) => {
<div className='w-3/12 pr-4'>
<Menu />
</div>
- <div className='w-9/12 p-4 bg-white border border-gray_r-6 rounded'>
+ <div className='w-9/12 p-4 py-6 bg-white border border-gray_r-6 rounded'>
<h1 className='text-title-sm font-semibold mb-6'>Detail Transaksi</h1>
<div className='flex items-center gap-x-2 mb-3'>
<span className='text-h-sm font-medium'>{transaction?.data?.name}</span>
<TransactionStatusBadge status={transaction?.data?.status} />
</div>
- <button
- type='button'
- className='btn-solid-red px-3 py-2'
- onClick={() => downloadQuotation(transaction.data)}
- >
- Download
- </button>
+ <div className='flex gap-x-4'>
+ <button
+ type='button'
+ className='btn-solid-red px-3 py-2 mr-auto'
+ onClick={() => downloadQuotation(transaction.data)}
+ >
+ Download
+ </button>
+ {transaction.data?.status == 'draft' && (
+ <button className='btn-yellow' onClick={checkout}>
+ Lanjutkan Transaksi
+ </button>
+ )}
+ {transaction.data?.status != 'draft' && (
+ <button
+ className='btn-light'
+ disabled={transaction.data?.status != 'waiting'}
+ onClick={openCancelTransaction}
+ >
+ Batalkan Transaksi
+ </button>
+ )}
+ </div>
<div className='grid grid-cols-2 gap-x-6 mt-6'>
<div className='grid grid-cols-2 gap-y-4'>
@@ -313,7 +359,7 @@ const Transaction = ({ id }) => {
</div>
</div>
- <div className='text-h-sm font-semibold mt-6 mb-4'>Informasi Pelanggan</div>
+ <div className='text-h-sm font-semibold mt-10 mb-4'>Informasi Pelanggan</div>
<div className='grid grid-cols-2 gap-x-4'>
<div className='border border-gray_r-6 rounded p-3'>
<div className='font-medium mb-4'>Detail Pelanggan</div>
@@ -321,7 +367,32 @@ const Transaction = ({ id }) => {
</div>
</div>
- <div className='text-h-sm font-semibold mt-6 mb-4'>Rincian Pembelian</div>
+ <div className='text-h-sm font-semibold mt-10 mb-4'>Pengiriman</div>
+ <div className='grid grid-cols-3 gap-4'>
+ {queryAirwayBill.data?.airways?.map((airway) => (
+ <button
+ className='shadow rounded-md p-4 text-gray_r-12 font-normal flex justify-between items-center text-left'
+ key={airway?.waybillNumber}
+ onClick={() => setAirwayBillPopup(airway?.waybillNumber)}
+ >
+ <div>
+ <span className='text-sm text-gray_r-11'>No Resi</span>
+ <p className='mt-1 font-medium'>{airway?.waybillNumber}</p>
+ </div>
+ <div className='flex gap-x-2'>
+ <div className='text-sm text-gray_r-11 badge-green'>
+ {airway?.deliveryStatus?.status}
+ </div>
+ <ChevronRightIcon className='w-5 stroke-2' />
+ </div>
+ </button>
+ ))}
+ </div>
+ {!queryAirwayBill.data?.airways && (
+ <div className='badge-red text-sm'>Belum ada pengiriman</div>
+ )}
+
+ <div className='text-h-sm font-semibold mt-10 mb-4'>Rincian Pembelian</div>
<table className='table-data'>
<thead>
<tr>
@@ -401,7 +472,7 @@ const Transaction = ({ id }) => {
{currencyFormat(transaction.data?.amountTax)}
</div>
- <div className='text-right'>Biaya Pengiriman</div>
+ <div className='text-right whitespace-nowrap'>Biaya Pengiriman</div>
<div className='text-right font-medium'>
{currencyFormat(transaction.data?.deliveryAmount)}
</div>
@@ -413,8 +484,8 @@ const Transaction = ({ id }) => {
</div>
</div>
- <div className='text-h-sm font-semibold mt-6 mb-4'>Invoice</div>
- <div className='grid grid-cols-4 gap-4'>
+ <div className='text-h-sm font-semibold mt-10 mb-4'>Invoice</div>
+ <div className='grid grid-cols-3 gap-4'>
{transaction.data?.invoices?.map((invoice, index) => (
<Link href={`/my/invoices/${invoice.id}`} key={index}>
<div className='shadow rounded-md p-4 text-gray_r-12 font-normal flex justify-between'>
@@ -437,30 +508,63 @@ const Transaction = ({ id }) => {
))}
</div>
{transaction.data?.invoices?.length === 0 && (
- <Alert type='info' className='text-center'>
- Belum ada Invoice
- </Alert>
+ <div className='badge-red text-sm'>Belum ada invoice</div>
)}
-
- <div className='mt-6'>
- {transaction.data?.status == 'draft' && (
- <button className='btn-yellow' onClick={checkout}>
- Lanjutkan Transaksi
- </button>
- )}
- {transaction.data?.status != 'draft' && (
- <button
- className='btn-light'
- disabled={transaction.data?.status != 'waiting'}
- onClick={openCancelTransaction}
- >
- Batalkan Transaksi
- </button>
- )}
- </div>
</div>
</div>
</DesktopView>
+
+ {queryAirwayBill.data?.airways?.map((airway) => (
+ <BottomPopup
+ key={airway.waybillNumber}
+ title='Detail Pengiriman'
+ active={airwayBillPopup == airway.waybillNumber}
+ close={() => setAirwayBillPopup(null)}
+ >
+ <div className='flex flex-col gap-y-4 my-4'>
+ <div className='flex justify-between'>
+ <div className='text-gray_r-11'>No Pengiriman</div>
+ <div>{airway?.deliveryOrder?.name}</div>
+ </div>
+ <div className='flex justify-between'>
+ <div className='text-gray_r-11'>Kurir</div>
+ <div>{airway?.deliveryOrder?.carrier}</div>
+ </div>
+ <div className='flex justify-between'>
+ <div className='text-gray_r-11'>No Resi</div>
+ <div>{airway?.waybillNumber}</div>
+ </div>
+ </div>
+
+ <div className='pt-4'>
+ <div className='font-semibold text-body-1 mb-4'>Status Pengiriman</div>
+ <ol class='relative border-l border-gray_r-7'>
+ {airway?.manifests?.map((manifest, index) => (
+ <li class='mb-6 ml-4' key={index}>
+ <div
+ class={`absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 border ${
+ index == 0 ? 'bg-red-600 border-red-600' : 'bg-gray_r-7 border-white'
+ }`}
+ />
+ <time class='text-sm leading-none text-gray-400'>
+ {manifest.datetime}
+ </time>
+ <p
+ class={`leading-6 font-medium text-body-2 mt-2 ${
+ index == 0 ? 'text-red-600' : 'text-gray_r-11'
+ }`}
+ >
+ {manifest.description}
+ </p>
+ </li>
+ ))}
+ {(!airway?.manifests || airway?.manifests?.length == 0) && (
+ <div className='badge-red text-sm'>Belum ada pengiriman</div>
+ )}
+ </ol>
+ </div>
+ </BottomPopup>
+ ))}
</>
)
)
@@ -536,7 +640,7 @@ const SectionContent = ({ address }) => {
const DescriptionRow = ({ children, label }) => (
<div className='grid grid-cols-2'>
<span className='text-gray_r-11'>{label}</span>
- <span className='text-right break-all leading-6'>{children}</span>
+ <span className='text-right leading-6'>{children}</span>
</div>
)
diff --git a/src/lib/transaction/components/Transactions.jsx b/src/lib/transaction/components/Transactions.jsx
index 642881a6..be63effd 100644
--- a/src/lib/transaction/components/Transactions.jsx
+++ b/src/lib/transaction/components/Transactions.jsx
@@ -252,7 +252,7 @@ const Transactions = ({ context = '' }) => {
{transactions.data?.saleOrders?.map((saleOrder) => (
<tr key={saleOrder.id}>
<td>
- <Link href={`${router.pathname}/${saleOrder.id}`}>{saleOrder.name}</Link>
+ <Link className='whitespace-nowrap' href={`${router.pathname}/${saleOrder.id}`}>{saleOrder.name}</Link>
</td>
<td>{saleOrder.purchaseOrderName || '-'}</td>
<td>{saleOrder.dateOrder || '-'}</td>
diff --git a/src/lib/transaction/hooks/useAirwayBill.js b/src/lib/transaction/hooks/useAirwayBill.js
new file mode 100644
index 00000000..c711ab77
--- /dev/null
+++ b/src/lib/transaction/hooks/useAirwayBill.js
@@ -0,0 +1,11 @@
+import { useQuery } from 'react-query'
+import airwayBillApi from '../api/airwayBillApi'
+
+const useAirwayBill = ({ orderId }) => {
+ const fetchAirwayBill = async () => await airwayBillApi({ orderId })
+ const queryAirwayBill = useQuery(`airwayBill-${orderId}`, fetchAirwayBill)
+
+ return { queryAirwayBill }
+}
+
+export default useAirwayBill
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-18 03:46:38 +0000