WEBDIENSTE/OpenSign
1
0
Fork 0
mirror of https://github.com/OpenSignLabs/OpenSign.git synced 2026-08-17 21:25:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

make changes UI in file upload

Browse Source
This commit is contained in:
prafull-opensignlabs
2023-11-28 12:22:13 +05:30
parent 5ce50db001
commit 45b3e739d7
2 changed files with 45 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/OpenSign/src/components/fields/DropboxChoose.js
+2 -2
View File
@@ -50,8 +50,8 @@ export default function DropboxChooser({ children, onSuccess, onCancel }) {
return (
<div onClick={handleChoose}>
{children || (
<button className="px-2 py-2 rounded border-[1px] text-blue-400 border-gray-300 w-full">
<i className="fa-brands fa-dropbox"></i> Choose from Dropbox
<button className="px-2 py-[2px] text-2xl rounded border-[1px] text-blue-400 border-gray-300 w-full">
<i className="fa-brands fa-dropbox"></i>
</button>
)}
</div>
apps/OpenSign/src/components/fields/FileUpload.js
+43 -51
View File
@@ -8,8 +8,6 @@ const FileUpload = (props) => {
const [parseAppId] = useState(localStorage.getItem("parseAppId"));
const [_fileupload, setFileUpload] = useState("");
const [fileload, setfileload] = useState(false);
const [localValue, setLocalValue] = useState("");
const [Message] = useState(false);
const [percentage, setpercentage] = useState(0);
@@ -25,7 +23,6 @@ const FileUpload = (props) => {
const onChange = (e) => {
try {
let files = e.target.files;
setLocalValue(e.target.files);
if (typeof files[0] !== "undefined") {
if (props.schema.filetypes && props.schema.filetypes.length > 0) {
var fileName = files[0].name;
@@ -257,58 +254,53 @@ const FileUpload = (props) => {
</div>
<>
{localValue ? (
<input
type="file"
id="hashfile"
style={{
border: "1px solid #ccc",
color: "gray",
backgroundColor: "white",
padding: "5px 10px",
borderRadius: "4px",
fontSize: "13px",
width: "100%",
fontWeight: "bold"
}}
accept="application/pdf,application/vnd.ms-excel"
onChange={onChange}
/>
) : props.formData ? (
<div
style={{
border: "1px solid #ccc",
color: "gray",
backgroundColor: "white",
padding: "5px 10px",
borderRadius: "4px",
fontSize: "13px",
width: "100%",
fontWeight: "bold"
}}
>
file selected : {props.formData.split("/")[3]}
{props.formData ? (
<div className="flex gap-2 justify-center items-center">
<div className="flex justify-between items-center px-2 py-[6px] w-full font-bold rounded border-[1px] border-[#ccc] text-gray-500 bg-white text-[13px]">
<div className="break-all">
file selected : {props.formData.split("/")[3]}
</div>
<div
onClick={() => {
console.log("clicked");
setFileUpload([]);
props.onChange(undefined);
}}
className="cursor-pointer px-[10px] text-base font-bold bg-white"
>
X
</div>
</div>
<DropboxChooser
onSuccess={dropboxSuccess}
onCancel={dropboxCancel}
/>
</div>
) : (
<input
type="file"
id="hashfile"
style={{
border: "1px solid #ccc",
color: "gray",
backgroundColor: "white",
padding: "5px 10px",
borderRadius: "4px",
fontSize: "13px",
width: "100%",
fontWeight: "bold"
}}
accept="application/pdf,application/vnd.ms-excel"
onChange={onChange}
/>
<div className="flex gap-2 justify-center items-center">
<input
type="file"
id="hashfile"
style={{
border: "1px solid #ccc",
color: "gray",
backgroundColor: "white",
padding: "5px 10px",
borderRadius: "4px",
fontSize: "13px",
width: "100%",
fontWeight: "bold"
}}
accept="application/pdf,application/vnd.ms-excel"
onChange={onChange}
/>
<DropboxChooser
onSuccess={dropboxSuccess}
onCancel={dropboxCancel}
/>
</div>
)}
</>
<DropboxChooser onSuccess={dropboxSuccess} onCancel={dropboxCancel} />
</React.Fragment>
);
};