@visns-studio/visns-components 1.6.4 → 1.6.6

package/components/cms/visns-data-grid.jsx

@@ -139,13 +139,21 @@ const DataGrid = ({
 	const [dataReload, setDataReload] = useState(0);
 	const [dSearch, setDSearch] = useState("");
 	const data = useCallback(
-		(params) => loadData(params, dSearch, ajaxSetting),
+		(params) => {
+			const sqlResult = loadData(params, dSearch, ajaxSetting);
+
+			sqlResult.then((res) => {
+				setDataCount(res.count);
+			});
+
+			return sqlResult;
+		},
 		[ajaxSetting, dataReload, dSearch]
 	);
 	const [filterDataSource, setFilterDataSource] = useState([]);
 	const [filterValue, setFilterValue] = useState([]);
 	const [gridColumns, setGridColumns] = useState([]);
-	const limit = ajaxSetting.take || 10;
+	const [limit, setLimit] = useState(ajaxSetting.take || 10);
 	const [search, setSearch] = useState("");
 	const sortInfo =
 		ajaxSetting.sortBy && ajaxSetting.sort
@@ -1285,14 +1293,48 @@ const DataGrid = ({
 
 	// Data Grid Styling
 	const [windowHeight, setWindowHeight] = useState(window.innerHeight);
-	const gridStyle = {
-		minHeight: windowHeight * 0.7 > 550 ? windowHeight * 0.7 : 550,
+	const [dataCount, setDataCount] = useState(0);
+	const [gridStyle, setGridStyle] = useState({
+		minHeight:
+			dataCount > 5
+				? dataCount > 8
+					? windowHeight * 0.7 > 550
+						? windowHeight * 0.7
+						: 550
+					: 450
+				: 400,
 		boxShadow: "none",
-	};
+	});
 	const headerProps = {
 		style: style ? style : {},
 	};
 
+	useEffect(() => {
+		setGridStyle((prevState) => ({
+			...prevState,
+			minHeight:
+				dataCount > 5
+					? dataCount > 8
+						? windowHeight * 0.7 > 550
+							? windowHeight * 0.7
+							: 550
+						: 450
+					: 400,
+		}));
+
+		let dgHeight =
+			dataCount > 5
+				? dataCount > 8
+					? windowHeight * 0.7 > 550
+						? windowHeight * 0.7
+						: 550
+					: 450
+				: 400;
+
+		let rowCount = Math.floor((dgHeight - 100) / 40);
+		setLimit(rowCount);
+	}, [dataCount]);
+
 	useEffect(() => {
 		const handleResize = () => {
 			setWindowHeight(window.innerHeight);
@@ -1345,7 +1387,6 @@ const DataGrid = ({
 				columns={gridColumns}
 				dataSource={data}
 				filterValue={filterValue}
-				defaultLimit={limit}
 				defaultSortInfo={sortInfo}
 				enableColumnAutosize={false}
 				enableColumnFilterContextMenu={false}
@@ -1355,8 +1396,10 @@ const DataGrid = ({
 					/\//g,
 					"-"
 				)}`}
+				limit={limit}
 				minRowHeight={40}
 				onFilterValueChange={setFilterValue}
+				onLimitChange={setLimit}
 				onRenderRow={onRenderRow}
 				pagination
 				renderColumnContextMenu={renderColumnContextMenu}

package/components/crm/visns-data-grid.jsx

@@ -172,7 +172,7 @@ const DataGrid = forwardRef(
 		const [filterDataSource, setFilterDataSource] = useState([]);
 		const [filterValue, setFilterValue] = useState([]);
 		const [gridColumns, setGridColumns] = useState([]);
-		const limit = ajaxSetting.take || 10;
+		const [limit, setLimit] = useState(ajaxSetting.take || 10);
 		const [search, setSearch] = useState("");
 		const sortInfo =
 			ajaxSetting.sortBy && ajaxSetting.sort
@@ -1653,15 +1653,17 @@ const DataGrid = forwardRef(
 						: 400,
 			}));
 
-			console.info(
+			let dgHeight =
 				dataCount > 5
 					? dataCount > 8
 						? windowHeight * 0.7 > 550
 							? windowHeight * 0.7
 							: 550
 						: 450
-					: 400
-			);
+					: 400;
+
+			let rowCount = Math.floor((dgHeight - 100) / 40);
+			setLimit(rowCount);
 		}, [dataCount]);
 
 		useEffect(() => {
@@ -1685,7 +1687,7 @@ const DataGrid = forwardRef(
 					columns={gridColumns}
 					dataSource={data}
 					filterValue={filterValue}
-					defaultLimit={limit}
+					limit={limit}
 					defaultSortInfo={sortInfo}
 					enableColumnAutosize={false}
 					enableColumnFilterContextMenu={false}
@@ -1697,6 +1699,7 @@ const DataGrid = forwardRef(
 					)}`}
 					minRowHeight={40}
 					onFilterValueChange={setFilterValue}
+					onLimitChange={setLimit}
 					onRenderRow={onRenderRow}
 					pagination
 					renderColumnContextMenu={renderColumnContextMenu}

package/components/crm/visns-form.jsx

@@ -583,6 +583,8 @@ function Form(props) {
 							? result.data
 							: result;
 
+						console.info(result);
+
 						Object.keys(formData).forEach((item) => {
 							let tempRes = "";
 							let tempResKey = "";
@@ -655,9 +657,20 @@ function Form(props) {
 										tempObj !== undefined &&
 										tempObj !== null
 									) {
+										let labelValue;
+
+										if (Array.isArray(field.relationName)) {
+											labelValue = field.relationName.map(
+												(name) => `${tempObj[name]} `
+											);
+										} else {
+											labelValue =
+												tempObj[field.relationName];
+										}
+
 										tempRes = {
 											value: tempObj.id,
-											label: tempObj[field.relationName],
+											label: labelValue,
 										};
 									}
 
@@ -709,14 +722,23 @@ function Form(props) {
 											}
 										}
 
+										let labelValue;
+
+										if (Array.isArray(field.relationName)) {
+											labelValue = field.relationName.map(
+												(name) => `${tempObj[name]} `
+											);
+										} else {
+											labelValue =
+												tempObj[field.relationName];
+										}
+
 										tempRes =
 											tempObj !== undefined &&
 											tempObj !== null
 												? {
 														value: tempObj.id,
-														label: tempObj[
-															field.relationName
-														],
+														label: labelValue,
 												  }
 												: {};
 

package/package.json

@@ -34,7 +34,7 @@
 		"react-dom": "^17.0.1"
 	},
 	"name": "@visns-studio/visns-components",
-	"version": "1.6.4",
+	"version": "1.6.6",
 	"description": "Various packages to assist in the development of our Custom Applications.",
 	"main": "index.js",
 	"devDependencies": {},