added file component to accept offer model
This commit was merged in pull request #712.
This commit is contained in:
victorAnumudu
@@ -4,7 +4,7 @@ import axios from 'axios'
|
||||
|
||||
import usersService from '../../services/UsersService'
|
||||
|
||||
export default function AttachFile({data}) {
|
||||
export default function AttachFile({data='', showOnData=false}) {
|
||||
|
||||
const apiCall = new usersService()
|
||||
|
||||
@@ -62,7 +62,7 @@ export default function AttachFile({data}) {
|
||||
}
|
||||
|
||||
useEffect(()=>{
|
||||
apiCall.jobManagerFiles({job_uid:data?.job_uid}).then(res => {
|
||||
apiCall.jobManagerFiles({job_uid:data?.job_uid || data?.origin_job_uid}).then(res => {
|
||||
setUploadedList({loading: false, data:res.data})
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
@@ -71,55 +71,99 @@ export default function AttachFile({data}) {
|
||||
},[data, reloadList])
|
||||
|
||||
return (
|
||||
<div className='w-full h-full flex flex-col justify-center items-center rounded-md'>
|
||||
<div className='w-full flex flex-col items-start gap-1 overflow-hidden'>
|
||||
<div className='w-full flex justify-between items-center gap-1'>
|
||||
<div className='job-label job-label-flex'>
|
||||
Files {
|
||||
requestStatus.loading ?
|
||||
<LoadingSpinner size='6' />
|
||||
<>
|
||||
{!showOnData ?
|
||||
<div className='w-full h-full flex flex-col justify-center items-center rounded-md'>
|
||||
<div className='w-full flex flex-col items-start gap-1 overflow-hidden'>
|
||||
<div className='w-full flex justify-between items-center gap-1'>
|
||||
<div className='job-label job-label-flex'>
|
||||
Files {
|
||||
requestStatus.loading ?
|
||||
<LoadingSpinner size='6' />
|
||||
:
|
||||
<span className={`text-[10px] ${requestStatus.status ? 'text-emerald-600' : 'text-red-500'}`}>{requestStatus.message}</span>
|
||||
}
|
||||
</div>
|
||||
<label htmlFor='file' className={`cursor-pointer text-[12px] py-1 px-2 rounded-full border ${ requestStatus.loading && 'pointer-events-none'}`}>+ Add</label>
|
||||
</div>
|
||||
<div className='text-[12px] w-full px-2 py-1 h-20 overflow-y-auto flex flex-col gap-1 border'>
|
||||
{uploadedList.loading ?
|
||||
<div className='w-full h-full justify-center items-center'>
|
||||
<LoadingSpinner size='6' height='h-full' />
|
||||
</div>
|
||||
:
|
||||
Object.keys(uploadedList.data).length > 0 ?
|
||||
uploadedList.data.result_list.length > 0 ?
|
||||
uploadedList.data.result_list.map((item, index) => {
|
||||
let fileNameExt = item.originalname.split('.')[item.originalname.split('.').length - 1]
|
||||
return(
|
||||
<div key={item.file_uid} className='my-1 flex justify-start gap-2'>
|
||||
<span>{index + 1}:</span>
|
||||
<a
|
||||
target='_blank'
|
||||
alt='download-link'
|
||||
className=''
|
||||
href={`${uploadedList?.data?.session_image_server}/${localStorage.getItem("session_token")}/jobfile/${item.file_uid}`}
|
||||
>
|
||||
{(item.originalname).toString().length > 30 ? (item.originalname).toString().slice(0, 26) + '..._.' + fileNameExt : (item.originalname).toString()}
|
||||
</a>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
:
|
||||
<span className={`text-[10px] ${requestStatus.status ? 'text-emerald-600' : 'text-red-500'}`}>{requestStatus.message}</span>
|
||||
}
|
||||
<p className='text-sm'>No Uploaded files yet</p>
|
||||
:
|
||||
<></>
|
||||
}
|
||||
</div>
|
||||
<label htmlFor='file' className={`cursor-pointer text-[12px] py-1 px-2 rounded-full border ${ requestStatus.loading && 'pointer-events-none'}`}>+ Add</label>
|
||||
<input
|
||||
type="file"
|
||||
id='file'
|
||||
ref={inputFile}
|
||||
className='hidden file:rounded-full job-label p-1'
|
||||
onChange={upload}
|
||||
/>
|
||||
</div>
|
||||
<div className='text-[12px] w-full px-2 py-1 h-20 overflow-y-auto flex flex-col gap-1 border'>
|
||||
{uploadedList.loading ?
|
||||
<div className='w-full h-full justify-center items-center'>
|
||||
<LoadingSpinner size='6' height='h-full' />
|
||||
</div>
|
||||
:
|
||||
Object.keys(uploadedList.data).length > 0 ?
|
||||
uploadedList.data.result_list.length > 0 ?
|
||||
uploadedList.data.result_list.map((item, index) => (
|
||||
<div className='flex justify-start gap-2'>
|
||||
<span>{index + 1}:</span>
|
||||
<a
|
||||
target='_blank'
|
||||
alt='download-link'
|
||||
key={item.file_uid}
|
||||
className=''
|
||||
href={`${uploadedList?.data?.session_image_server}/${localStorage.getItem("session_token")}/jobfile/${item.file_uid}`}
|
||||
>
|
||||
{item.originalname}
|
||||
</a>
|
||||
</div>
|
||||
))
|
||||
:
|
||||
<p className='text-sm'>No Uploaded files yet</p>
|
||||
:
|
||||
<></>
|
||||
}
|
||||
</div>
|
||||
<input
|
||||
type="file"
|
||||
id='file'
|
||||
ref={inputFile}
|
||||
className='hidden file:rounded-full job-label p-1'
|
||||
onChange={upload}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
:showOnData && uploadedList?.data?.result_list?.length > 0 ?
|
||||
<div className='w-full h-full flex flex-col justify-center items-center rounded-md'>
|
||||
<div className='w-full flex flex-col items-start gap-1 overflow-hidden'>
|
||||
<div className='w-full flex justify-between items-center gap-1'>
|
||||
<div className='job-label job-label-flex'>
|
||||
Files
|
||||
</div>
|
||||
</div>
|
||||
<div className='text-[12px] w-full px-2 py-1 h-20 overflow-y-auto flex flex-col gap-1 border'>
|
||||
{uploadedList.data.result_list.map((item, index) => {
|
||||
let fileNameExt = item.originalname.split('.')[item.originalname.split('.').length - 1]
|
||||
return(
|
||||
<div key={item.file_uid} className='flex justify-start gap-2'>
|
||||
<span>{index + 1}:</span>
|
||||
<a
|
||||
target='_blank'
|
||||
alt='download-link'
|
||||
className=''
|
||||
href={`${uploadedList?.data?.session_image_server}/${localStorage.getItem("session_token")}/jobfile/${item.file_uid}`}
|
||||
>
|
||||
{(item.originalname).toString().length > 30 ? (item.originalname).toString().slice(0, 26) + '..._.' + fileNameExt : (item.originalname).toString()}
|
||||
</a>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
<input
|
||||
type="file"
|
||||
id='file'
|
||||
ref={inputFile}
|
||||
className='hidden file:rounded-full job-label p-1'
|
||||
onChange={upload}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
:
|
||||
<></>
|
||||
}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user