@visns-studio/visns-components 1.0.1-2.1 → 1.0.2

package/components/cms/visns-form.jsx

@@ -1,427 +0,0 @@
-import React, { useState, useEffect } from "react";
-import CustomFetch from "../crm/visns-fetch";
-import Field from "./visns-field";
-import slugify from "react-slugify";
-import moment from "moment";
-import Reveal from "react-reveal/Reveal";
-import parse from "html-react-parser";
-import { confirmAlert } from "react-confirm-alert";
-import { toast } from "react-toastify";
-import { Copy, TrashBin } from "akar-icons";
-
-import "react-confirm-alert/src/react-confirm-alert.css";
-
-function Form(props) {
-	const { dataId, navigate, form, setActiveNav } = props;
-	const [data, setData] = useState({});
-	const [dataClass, setDataClass] = useState({});
-	const [audit, setAudit] = useState({
-		createdBy: {},
-		created: "",
-		updatedBy: {},
-		updated: "",
-	});
-	const [uploadProgress, setUploadProgress] = useState({});
-
-	const handleChange = (e) => {
-		if (e) {
-			switch (e.target.name) {
-				case "title":
-					setData((prevState) => ({
-						...prevState,
-						[e.target.name]: e.target.value,
-					}));
-
-					setData((prevState) => ({
-						...prevState,
-						slug: slugify(e.target.value),
-					}));
-					break;
-				default:
-					setData((prevState) => ({
-						...prevState,
-						[e.target.name]: e.target.value,
-					}));
-					break;
-			}
-		}
-	};
-
-	const handleChangeSelect = (value, action, id) => {
-		if (value && action && id) {
-			setData((prevState) => ({
-				...prevState,
-				[id]: value,
-			}));
-		}
-	};
-
-	const handleChangeRicheditor = (value, name) => {
-		setData((prevState) => ({
-			...prevState,
-			[name]: value,
-		}));
-	};
-
-	const handleChangeFile = (e) => {
-		if (e) {
-			setData((prevState) => ({
-				...prevState,
-				[e.target.name]: e.target.files[0],
-			}));
-
-			Vapor.store(e.target.files[0], {
-				progress: (progress) => {
-					setUploadProgress((prevState) => ({
-						...prevState,
-						[e.target.name]: progress * 100,
-					}));
-				},
-			}).then((response) => {
-				if (data.hasOwnProperty("files")) {
-					let _files = data.files;
-					let _new = true;
-
-					data.files.forEach((a, b) => {
-						if (e.target.name === a.field) {
-							_files[b] = {
-								field: e.target.name,
-								uuid: response.uuid,
-								key: response.key,
-								bucket: response.bucket,
-								filename: e.target.files[0].name,
-								filesize: e.target.files[0].size,
-								extension: response.extension,
-							};
-
-							_new = false;
-						}
-					});
-
-					if (_new === true) {
-						setData((prevState) => ({
-							...prevState,
-							files: [
-								...prevState.files,
-								{
-									field: e.target.name,
-									uuid: response.uuid,
-									key: response.key,
-									bucket: response.bucket,
-									filename: e.target.files[0].name,
-									filesize: e.target.files[0].size,
-									extension: response.extension,
-								},
-							],
-						}));
-					} else {
-						setData((prevState) => ({
-							...prevState,
-							files: _files,
-						}));
-					}
-				} else {
-					setData((prevState) => ({
-						...prevState,
-						files: [
-							{
-								field: e.target.name,
-								uuid: response.uuid,
-								key: response.key,
-								bucket: response.bucket,
-								filename: e.target.files[0].name,
-								filesize: e.target.files[0].size,
-								extension: response.extension,
-							},
-						],
-					}));
-				}
-			});
-		}
-	};
-
-	const handleSubmit = (e) => {
-		if (e) {
-			e.preventDefault();
-
-			let error = "";
-			let url = "";
-			let method = "";
-			let message = "";
-
-			if (data.title === "") {
-				error += "Please enter a title.<br />";
-			}
-
-			if (data.summary === "") {
-				error += "Please enter a summary.<br />";
-			}
-
-			if (error === "") {
-				if (dataId === "create") {
-					url = form.url;
-					method = "POST";
-					message = "You have successfully created a new entry.";
-				} else {
-					url = form.url + "/" + dataId;
-					method = "PUT";
-					message = "You have successfully updated this entry.";
-				}
-
-				CustomFetch(url, method, data, function (result) {
-					if (result.error === "") {
-						let _uploadProgress = uploadProgress;
-
-						Object.keys(_uploadProgress).forEach((a, b) => {
-							setUploadProgress((prevState) => ({
-								...prevState,
-								[b]: 0,
-							}));
-						});
-
-						toast.success(message);
-
-						if (dataId === "create") {
-							navigate(
-								form.url.replace("/ajax", "") +
-									"/" +
-									result.data.id,
-								{
-									state: {
-										form: form,
-									},
-								}
-							);
-						}
-					} else {
-						toast.error(result.error);
-					}
-				});
-			} else {
-				toast.error(<div>{parse(error)}</div>);
-			}
-		}
-	};
-
-	const handleDelete = (e) => {
-		if (e) {
-			confirmAlert({
-				title: "Delete this entry",
-				message: "Are you sure you want to delete it?",
-				buttons: [
-					{
-						label: "Yes",
-						onClick: () =>
-							CustomFetch(
-								`${form.url}/${dataId}`,
-								"DELETE",
-								{},
-								function (result) {
-									if (result.error === "") {
-										navigate(form.url.replace("/ajax", ""));
-										toast.success(
-											"You have successfully deleted this entry."
-										);
-									} else {
-										toast.error(result.error);
-									}
-								}
-							),
-					},
-					{
-						label: "No",
-						onClick: () => close(),
-					},
-				],
-			});
-		}
-	};
-
-	const fetchData = () => {
-		form.fields.forEach((a) => {
-			setData((prevState) => ({
-				...prevState,
-				[a.id]: "",
-			}));
-		});
-
-		if (dataId !== "create") {
-			CustomFetch(
-				`${form.url}/${dataId}`,
-				"GET",
-				{},
-				function (result) {
-					let now = moment();
-					let created = moment.duration(
-						now.diff(result.data.created_at)
-					);
-					let updated = moment.duration(
-						now.diff(result.data.updated_at)
-					);
-
-					setData(result.data);
-					setAudit((prevState) => ({
-						...prevState,
-						createdBy: result.audit_first,
-						created:
-							created.hours() > 24
-								? created.days() +
-								  " Days " +
-								  created.hours() +
-								  " Hour(s) " +
-								  created.minutes() +
-								  " Minutes"
-								: created.hours() +
-								  " Hour(s) " +
-								  created.minutes() +
-								  " Minutes",
-						updatedBy: result.audit_latest,
-						updated:
-							updated.hours() > 24
-								? updated.days() +
-								  " Days " +
-								  updated.hours() +
-								  " Hour(s) " +
-								  updated.minutes() +
-								  " Minutes"
-								: updated.hours() +
-								  " Hour(s) " +
-								  updated.minutes() +
-								  " Minutes",
-					}));
-				},
-				function (error) {
-					navigate("/insights");
-
-					toast.error(String(error));
-				}
-			);
-		}
-	};
-
-	useEffect(() => {
-		form.fields.forEach((a) => {
-			if (a.type === "image") {
-				setUploadProgress((prevState) => ({
-					...prevState,
-					[a.id]: 0,
-				}));
-			}
-
-			setData((prevState) => ({
-				...prevState,
-				[a.id]: "",
-			}));
-
-			setDataClass((prevState) => ({
-				...prevState,
-				[a.id]: "",
-			}));
-		});
-
-		fetchData();
-		setActiveNav();
-	}, [dataId]);
-
-	return (
-		<Reveal effect="fadeInUp">
-			<div className="grid">
-				<div className="grid__row">
-					<div className="grid__full cmstitle">
-						<h1>{data.title}</h1>
-						<div className="cmstitle__actions">
-							<button
-								className="btn actionbtn"
-								onClick={handleSubmit}
-							>
-								<Copy size={18} strokeWidth={2} />{" "}
-								{dataId !== "create" ? "Save" : "Create"}
-							</button>
-						</div>
-					</div>
-				</div>
-			</div>
-			<div className="dynamic">
-				<div className="dynamic__left">
-					<div className="formcontainer">
-						<div className="dynamicform">
-							{form.fields.map((a, b) => (
-								<Field
-									settings={a}
-									key={
-										b +
-										"-fields-" +
-										(a.hasOwnProperty("key")
-											? a.id + "-" + a.key
-											: a.id)
-									}
-									inputValue={
-										a.hasOwnProperty("key")
-											? data[a.key]
-											: Array.isArray(data[a.id]) &&
-											  a.type === "image"
-											? data[a.id].length > 0
-												? data[a.id][0]
-												: ""
-											: data[a.id]
-									}
-									inputClass={dataClass}
-									onChange={handleChange}
-									onChangeFile={handleChangeFile}
-									onChangeRicheditor={handleChangeRicheditor}
-									onChangeSelect={handleChangeSelect}
-									setFormData={setData}
-									uploadProgress={uploadProgress}
-								/>
-							))}
-						</div>
-					</div>
-				</div>
-				<div className="dynamic__right">
-					<h1>Information</h1>
-					<ul>
-						<li>
-							Created: <span>{audit.created} Ago</span>
-						</li>
-						<li>
-							By:{" "}
-							<span>
-								{audit &&
-								audit.createdBy &&
-								audit.createdBy.user
-									? audit.createdBy.user.name
-									: null}
-							</span>
-						</li>
-						<li>
-							Last Update: <span>{audit.updated} Ago</span>
-						</li>
-						<li>
-							by:{" "}
-							<span>
-								{audit &&
-								audit.updatedBy &&
-								audit.updatedBy.user
-									? audit.updatedBy.user.name
-									: null}
-							</span>
-						</li>
-						{dataId !== "create" ? (
-							<li>
-								<button
-									className="btn actionbtn deletebtn"
-									onClick={handleDelete}
-								>
-									<TrashBin size={14} strokeWidth={2} />{" "}
-									Delete Entry
-								</button>
-							</li>
-						) : null}
-					</ul>
-				</div>
-			</div>
-		</Reveal>
-	);
-}
-
-export default Form;

package/components/crm/visns-table-filter.jsx

@@ -1,130 +0,0 @@
-import React from "react";
-
-function TableFilter(props) {
-	const { filters, setFilters, setSettings } = props;
-
-	const filterTable = (e) => {
-		const { id, value, url } = e.target.dataset;
-
-		console.info("a", url);
-
-		if (props.hasOwnProperty("setSettings") === true) {
-			console.info("b");
-			if (url && url !== "") {
-				console.info("c");
-				window.open(url);
-			} else {
-				console.info("d");
-				setSettings((prevState) => {
-					if (prevState.ajaxSetting) {
-						let _where = [];
-
-						prevState.ajaxSetting.where.forEach((a) => {
-							if (a.id === id) {
-								let _push = true;
-
-								_where.forEach((b) => {
-									if (b.id === id) {
-										_push = false;
-									}
-								});
-
-								if (_push === true) {
-									_where.push({
-										id: id,
-										value: value,
-									});
-								}
-							} else {
-								_where.push(a);
-							}
-						});
-
-						let _push = true;
-
-						_where.forEach((a) => {
-							if (a.id === id) {
-								_push = false;
-							}
-						});
-
-						if (_push === true) {
-							_where.push({
-								id: id,
-								value: value,
-							});
-						}
-
-						return {
-							...prevState,
-							ajaxSetting: {
-								...prevState.ajaxSetting,
-								where: _where,
-							},
-						};
-					} else {
-						let w = prevState.where;
-
-						prevState.where.forEach((a, b) => {
-							if (id === a.id) {
-								w[b].value = value;
-							}
-						});
-
-						return { ...prevState, where: w };
-					}
-				});
-			}
-		}
-
-		let tempFilters = filters;
-
-		filters.map((item, index) => {
-			if (
-				e.target.dataset.hasOwnProperty("value") &&
-				parseInt(value) >= 0
-			) {
-				if (parseInt(value) === parseInt(item.value)) {
-					tempFilters[index].class = "subactive";
-					tempFilters[index].show = true;
-				} else {
-					tempFilters[index].class = "";
-					tempFilters[index].show = false;
-				}
-			} else {
-				if (id === item.id) {
-					tempFilters[index].class = "subactive";
-					tempFilters[index].show = true;
-				} else {
-					tempFilters[index].class = "";
-					tempFilters[index].show = false;
-				}
-			}
-		});
-
-		setFilters(tempFilters);
-		setFilters((prevState) => [...prevState]);
-	};
-
-	return (
-		<ul>
-			{filters.map((item, key) => (
-				<li key={"table-filter-" + key}>
-					<a
-						data-id={item.id}
-						data-value={
-							item.hasOwnProperty("value") ? item.value : ""
-						}
-						data-url={item.url || ""}
-						onClick={filterTable}
-						className={item.class}
-					>
-						{item.label}
-					</a>
-				</li>
-			))}
-		</ul>
-	);
-}
-
-export default TableFilter;