sprint-asia-custom-component 0.1.41 → 0.1.43
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +303 -1
- package/package.json +1 -1
- package/src/components/chip/index.js +1 -1
- package/src/components/table/listTable/cellmodefour/index.js +147 -0
- package/src/components/table/listTable/cellmodelthree/index.js +171 -0
- package/src/index.js +4 -2
- package/src/templates/index.js +173 -0
package/dist/index.js
CHANGED
|
@@ -323,7 +323,7 @@
|
|
|
323
323
|
onClick: onClick
|
|
324
324
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
325
325
|
className: `
|
|
326
|
-
${type == "neutral" && "text-
|
|
326
|
+
${type == "neutral" && "text-neutral300 border-neutral300 bg-neutral30 cursor-pointer"}
|
|
327
327
|
${type == "success" && "text-success600 border-success600 bg-success50"}
|
|
328
328
|
${type == "primary" && "text-primary500 border-primary500 bg-primary50"}
|
|
329
329
|
${type == "dropdown" && "text-primary500 border-primary500 bg-primary50"}
|
|
@@ -46739,6 +46739,306 @@
|
|
|
46739
46739
|
}, "\xA0"))))));
|
|
46740
46740
|
};
|
|
46741
46741
|
|
|
46742
|
+
const CellModelThree = ({
|
|
46743
|
+
Column_One_A,
|
|
46744
|
+
Column_One_B,
|
|
46745
|
+
Column_One_C,
|
|
46746
|
+
Column_One_D,
|
|
46747
|
+
Column_Two_A,
|
|
46748
|
+
Column_Two_B,
|
|
46749
|
+
Column_Three_A,
|
|
46750
|
+
Column_Four_A,
|
|
46751
|
+
Column_Four_B,
|
|
46752
|
+
Column_Four_C,
|
|
46753
|
+
Column_Five_A,
|
|
46754
|
+
Column_Five_B,
|
|
46755
|
+
Column_Five_C,
|
|
46756
|
+
onClickEdit,
|
|
46757
|
+
onClickDelete,
|
|
46758
|
+
Column_Six_A = "Active",
|
|
46759
|
+
onClickBody
|
|
46760
|
+
}) => {
|
|
46761
|
+
let chipType = "success";
|
|
46762
|
+
let chipTitle = Column_Six_A;
|
|
46763
|
+
switch (Column_Six_A.toLowerCase()) {
|
|
46764
|
+
case "active":
|
|
46765
|
+
chipType = "success";
|
|
46766
|
+
chipTitle = "Active";
|
|
46767
|
+
break;
|
|
46768
|
+
case "waiting":
|
|
46769
|
+
chipType = "primary";
|
|
46770
|
+
chipTitle = "Waiting";
|
|
46771
|
+
break;
|
|
46772
|
+
case "inactive":
|
|
46773
|
+
chipType = "neutral";
|
|
46774
|
+
chipTitle = "Inactive";
|
|
46775
|
+
break;
|
|
46776
|
+
}
|
|
46777
|
+
return /*#__PURE__*/React__default["default"].createElement("tr", {
|
|
46778
|
+
className: `bg-white hover:bg-neutral20 border-t border-neutral40 ${onClickBody != undefined && "cursor-pointer"}`
|
|
46779
|
+
}, /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46780
|
+
className: "align-top"
|
|
46781
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46782
|
+
className: "flex items-center",
|
|
46783
|
+
onClick: () => {
|
|
46784
|
+
if (onClickBody != undefined) {
|
|
46785
|
+
onClickBody();
|
|
46786
|
+
}
|
|
46787
|
+
}
|
|
46788
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46789
|
+
className: "py-3.5 px-4"
|
|
46790
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46791
|
+
className: "font-semibold text-black text-sm"
|
|
46792
|
+
}, Column_One_A ? Column_One_A : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46793
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46794
|
+
}, Column_One_B ? Column_One_B : "-")))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46795
|
+
className: "align-top"
|
|
46796
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46797
|
+
className: "flex items-center",
|
|
46798
|
+
onClick: () => {
|
|
46799
|
+
if (onClickBody != undefined) {
|
|
46800
|
+
onClickBody();
|
|
46801
|
+
}
|
|
46802
|
+
}
|
|
46803
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46804
|
+
className: "py-3.5 px-4"
|
|
46805
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46806
|
+
className: "font-semibold text-black text-sm"
|
|
46807
|
+
}, Column_Two_A ? Column_Two_A : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46808
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46809
|
+
}, Column_Two_B ? Column_Two_B : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46810
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46811
|
+
}, Column_Two_B ? Column_Two_B : "-")))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46812
|
+
className: "align-top"
|
|
46813
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46814
|
+
className: "flex items-center",
|
|
46815
|
+
onClick: () => {
|
|
46816
|
+
if (onClickBody != undefined) {
|
|
46817
|
+
onClickBody();
|
|
46818
|
+
}
|
|
46819
|
+
}
|
|
46820
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46821
|
+
className: "flex items-center py-3.5 px-4"
|
|
46822
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46823
|
+
className: "font-semibold text-black text-sm"
|
|
46824
|
+
}, Column_Three_A ? Column_Three_A : "-")))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46825
|
+
className: "align-top"
|
|
46826
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46827
|
+
className: "flex items-center",
|
|
46828
|
+
onClick: () => {
|
|
46829
|
+
if (onClickBody != undefined) {
|
|
46830
|
+
onClickBody();
|
|
46831
|
+
}
|
|
46832
|
+
}
|
|
46833
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46834
|
+
className: "py-3.5 px-4"
|
|
46835
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46836
|
+
className: "font-semibold text-black text-sm"
|
|
46837
|
+
}, Column_Four_A ? Column_Four_A : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46838
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46839
|
+
}, Column_Four_B ? Column_Four_B : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46840
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46841
|
+
}, Column_Four_C ? Column_Four_C : "-")))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46842
|
+
className: "align-top"
|
|
46843
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46844
|
+
className: "flex items-center",
|
|
46845
|
+
onClick: () => {
|
|
46846
|
+
if (onClickBody != undefined) {
|
|
46847
|
+
onClickBody();
|
|
46848
|
+
}
|
|
46849
|
+
}
|
|
46850
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46851
|
+
className: "py-3.5 px-4"
|
|
46852
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46853
|
+
className: "font-semibold text-black text-sm"
|
|
46854
|
+
}, Column_Five_A ? Column_Five_A : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46855
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46856
|
+
}, Column_Five_B ? Column_Five_B : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46857
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46858
|
+
}, Column_Five_C ? Column_Five_C : "-")))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46859
|
+
className: "align-top"
|
|
46860
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46861
|
+
className: "flex items-center",
|
|
46862
|
+
onClick: () => {
|
|
46863
|
+
if (onClickBody != undefined) {
|
|
46864
|
+
onClickBody();
|
|
46865
|
+
}
|
|
46866
|
+
}
|
|
46867
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46868
|
+
className: "py-3.5 px-4"
|
|
46869
|
+
}, /*#__PURE__*/React__default["default"].createElement(Chip, {
|
|
46870
|
+
type: chipType,
|
|
46871
|
+
title: chipTitle
|
|
46872
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46873
|
+
className: "flex items-center pt-1"
|
|
46874
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46875
|
+
className: "font-normal text-neutral500 text-sm"
|
|
46876
|
+
}, "\xA0")), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46877
|
+
className: "flex items-center pt-1"
|
|
46878
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46879
|
+
className: "font-normal text-neutral500 text-sm"
|
|
46880
|
+
}, "\xA0")), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46881
|
+
className: "flex items-center pt-1"
|
|
46882
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46883
|
+
className: "font-normal text-neutral500 text-sm"
|
|
46884
|
+
}, "\xA0"))))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46885
|
+
className: "items-start flex h-full"
|
|
46886
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46887
|
+
className: "flex items-start"
|
|
46888
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46889
|
+
className: "flex py-3.5 px-4"
|
|
46890
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46891
|
+
onClick: onClickEdit
|
|
46892
|
+
}, /*#__PURE__*/React__default["default"].createElement(PiNotePencil, {
|
|
46893
|
+
size: "24",
|
|
46894
|
+
variant: "Bold",
|
|
46895
|
+
className: "text-neutral500 cursor-pointer mr-2"
|
|
46896
|
+
})), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46897
|
+
onClick: onClickDelete
|
|
46898
|
+
}, /*#__PURE__*/React__default["default"].createElement(PiTrash, {
|
|
46899
|
+
size: "24",
|
|
46900
|
+
variant: "Bold",
|
|
46901
|
+
className: "text-neutral500 cursor-pointer"
|
|
46902
|
+
}))))));
|
|
46903
|
+
};
|
|
46904
|
+
|
|
46905
|
+
const CellModelFour = ({
|
|
46906
|
+
Column_One_A,
|
|
46907
|
+
Column_One_B,
|
|
46908
|
+
Column_One_C,
|
|
46909
|
+
Column_Two_A,
|
|
46910
|
+
Column_Two_B,
|
|
46911
|
+
Column_Three_A,
|
|
46912
|
+
Column_Three_B,
|
|
46913
|
+
Column_Four_A,
|
|
46914
|
+
Column_Four_B,
|
|
46915
|
+
Column_Five_A = "Active",
|
|
46916
|
+
onClickEdit,
|
|
46917
|
+
onClickDelete,
|
|
46918
|
+
onClickBody,
|
|
46919
|
+
imageUrl
|
|
46920
|
+
}) => {
|
|
46921
|
+
let chipType = "success";
|
|
46922
|
+
let chipTitle = Column_Five_A;
|
|
46923
|
+
switch (Column_Five_A.toLowerCase()) {
|
|
46924
|
+
case "active":
|
|
46925
|
+
chipType = "success";
|
|
46926
|
+
chipTitle = "Active";
|
|
46927
|
+
break;
|
|
46928
|
+
case "waiting":
|
|
46929
|
+
chipType = "primary";
|
|
46930
|
+
chipTitle = "Waiting";
|
|
46931
|
+
break;
|
|
46932
|
+
case "inactive":
|
|
46933
|
+
chipType = "neutral";
|
|
46934
|
+
chipTitle = "Inactive";
|
|
46935
|
+
break;
|
|
46936
|
+
}
|
|
46937
|
+
return /*#__PURE__*/React__default["default"].createElement("tr", {
|
|
46938
|
+
className: `bg-white hover:bg-neutral20 border-t border-neutral40 ${onClickBody != undefined && "cursor-pointer"}`
|
|
46939
|
+
}, /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46940
|
+
className: "align-top"
|
|
46941
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46942
|
+
className: "flex items-center",
|
|
46943
|
+
onClick: () => {
|
|
46944
|
+
if (onClickBody != undefined) {
|
|
46945
|
+
onClickBody();
|
|
46946
|
+
}
|
|
46947
|
+
}
|
|
46948
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46949
|
+
className: "flex items-center py-3.5 px-4"
|
|
46950
|
+
}, /*#__PURE__*/React__default["default"].createElement("img", {
|
|
46951
|
+
src: imageUrl,
|
|
46952
|
+
alt: "icon",
|
|
46953
|
+
className: "w-10 h-10 mr-2 rounded-full self-start"
|
|
46954
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46955
|
+
className: "font-semibold text-black text-sm"
|
|
46956
|
+
}, Column_One_A ? Column_One_A : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46957
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46958
|
+
}, Column_One_B ? Column_One_B : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46959
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46960
|
+
}, Column_One_C ? Column_One_C : "-"))))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46961
|
+
className: "align-top"
|
|
46962
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46963
|
+
className: "flex items-center",
|
|
46964
|
+
onClick: () => {
|
|
46965
|
+
if (onClickBody != undefined) {
|
|
46966
|
+
onClickBody();
|
|
46967
|
+
}
|
|
46968
|
+
}
|
|
46969
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46970
|
+
className: "py-3.5 px-4"
|
|
46971
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46972
|
+
className: "font-semibold text-black text-sm"
|
|
46973
|
+
}, Column_Two_A ? Column_Two_A : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46974
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46975
|
+
}, Column_Two_B ? Column_Two_B : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46976
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46977
|
+
}, Column_Three_B ? Column_Three_B : "-")))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46978
|
+
className: "align-top"
|
|
46979
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46980
|
+
className: "flex items-center",
|
|
46981
|
+
onClick: () => {
|
|
46982
|
+
if (onClickBody != undefined) {
|
|
46983
|
+
onClickBody();
|
|
46984
|
+
}
|
|
46985
|
+
}
|
|
46986
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46987
|
+
className: "py-3.5 px-4"
|
|
46988
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46989
|
+
className: "font-normal text-black text-sm"
|
|
46990
|
+
}, Column_Three_A ? Column_Three_A : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46991
|
+
className: "font-normal text-neutral300 text-sm"
|
|
46992
|
+
}, Column_Three_B ? Column_Three_B : "-")))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46993
|
+
className: "align-top"
|
|
46994
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46995
|
+
className: "flex items-center",
|
|
46996
|
+
onClick: () => {
|
|
46997
|
+
if (onClickBody != undefined) {
|
|
46998
|
+
onClickBody();
|
|
46999
|
+
}
|
|
47000
|
+
}
|
|
47001
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
47002
|
+
className: "py-3.5 px-4"
|
|
47003
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
47004
|
+
className: "font-normal text-black text-sm"
|
|
47005
|
+
}, Column_Four_A ? Column_Four_A : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
47006
|
+
className: "font-normal text-neutral300 text-sm"
|
|
47007
|
+
}, Column_Four_B ? Column_Four_B : "-")))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
47008
|
+
className: "align-top"
|
|
47009
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
47010
|
+
className: "flex items-center",
|
|
47011
|
+
onClick: () => {
|
|
47012
|
+
if (onClickBody != undefined) {
|
|
47013
|
+
onClickBody();
|
|
47014
|
+
}
|
|
47015
|
+
}
|
|
47016
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
47017
|
+
className: "py-3.5 px-4"
|
|
47018
|
+
}, /*#__PURE__*/React__default["default"].createElement(Chip, {
|
|
47019
|
+
type: chipType,
|
|
47020
|
+
title: chipTitle
|
|
47021
|
+
})))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
47022
|
+
className: "items-start flex h-full"
|
|
47023
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
47024
|
+
className: "flex items-start"
|
|
47025
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
47026
|
+
className: "flex py-3.5 px-4"
|
|
47027
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
47028
|
+
onClick: onClickEdit
|
|
47029
|
+
}, /*#__PURE__*/React__default["default"].createElement(PiNotePencil, {
|
|
47030
|
+
size: "24",
|
|
47031
|
+
variant: "Bold",
|
|
47032
|
+
className: "text-primary500 cursor-pointer mr-2"
|
|
47033
|
+
})), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
47034
|
+
onClick: onClickDelete
|
|
47035
|
+
}, /*#__PURE__*/React__default["default"].createElement(PiTrash, {
|
|
47036
|
+
size: "24",
|
|
47037
|
+
variant: "Bold",
|
|
47038
|
+
className: "text-primary500 cursor-pointer"
|
|
47039
|
+
}))))));
|
|
47040
|
+
};
|
|
47041
|
+
|
|
46742
47042
|
const SearchDropdown = ({
|
|
46743
47043
|
options = [{
|
|
46744
47044
|
option: "Name 1",
|
|
@@ -47108,7 +47408,9 @@
|
|
|
47108
47408
|
exports.BillerProductList = BillerProductList;
|
|
47109
47409
|
exports.BillingList = BillingList;
|
|
47110
47410
|
exports.CardInternalProduct = CardInternalProduct;
|
|
47411
|
+
exports.CellModelFour = CellModelFour;
|
|
47111
47412
|
exports.CellModelOne = CellModelOne;
|
|
47413
|
+
exports.CellModelThree = CellModelThree;
|
|
47112
47414
|
exports.CellModelTwo = CellModelTwo;
|
|
47113
47415
|
exports.Chip = Chip;
|
|
47114
47416
|
exports.ChipBar = ChipBar;
|
package/package.json
CHANGED
|
@@ -8,7 +8,7 @@ const Chip = ({
|
|
|
8
8
|
return (
|
|
9
9
|
<div className='w-fit' onClick={onClick}>
|
|
10
10
|
<div className={`
|
|
11
|
-
${type == "neutral" && "text-
|
|
11
|
+
${type == "neutral" && "text-neutral300 border-neutral300 bg-neutral30 cursor-pointer"}
|
|
12
12
|
${type == "success" && "text-success600 border-success600 bg-success50"}
|
|
13
13
|
${type == "primary" && "text-primary500 border-primary500 bg-primary50"}
|
|
14
14
|
${type == "dropdown" && "text-primary500 border-primary500 bg-primary50"}
|
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
import React from 'react'
|
|
2
|
+
import Chip from '../../../chip'
|
|
3
|
+
import { PiTrash, PiNotePencil} from 'react-icons/pi'
|
|
4
|
+
|
|
5
|
+
const CellModelFour = ({
|
|
6
|
+
Column_One_A,
|
|
7
|
+
Column_One_B,
|
|
8
|
+
Column_One_C,
|
|
9
|
+
Column_Two_A,
|
|
10
|
+
Column_Two_B,
|
|
11
|
+
Column_Three_A,
|
|
12
|
+
Column_Three_B,
|
|
13
|
+
Column_Four_A,
|
|
14
|
+
Column_Four_B,
|
|
15
|
+
Column_Five_A = "Active",
|
|
16
|
+
onClickEdit,
|
|
17
|
+
onClickDelete,
|
|
18
|
+
onClickBody,
|
|
19
|
+
imageUrl,
|
|
20
|
+
}) => {
|
|
21
|
+
let chipType = "success";
|
|
22
|
+
let chipTitle = Column_Five_A;
|
|
23
|
+
|
|
24
|
+
switch (Column_Five_A.toLowerCase()) {
|
|
25
|
+
case "active":
|
|
26
|
+
chipType = "success";
|
|
27
|
+
chipTitle = "Active";
|
|
28
|
+
break;
|
|
29
|
+
case "waiting":
|
|
30
|
+
chipType = "primary";
|
|
31
|
+
chipTitle = "Waiting";
|
|
32
|
+
break;
|
|
33
|
+
case "inactive":
|
|
34
|
+
chipType = "neutral";
|
|
35
|
+
chipTitle = "Inactive";
|
|
36
|
+
break;
|
|
37
|
+
}
|
|
38
|
+
return (
|
|
39
|
+
<tr
|
|
40
|
+
className={`bg-white hover:bg-neutral20 border-t border-neutral40 ${onClickBody != undefined && "cursor-pointer"}`}
|
|
41
|
+
>
|
|
42
|
+
<td className="align-top">
|
|
43
|
+
<div className='flex items-center'
|
|
44
|
+
onClick={
|
|
45
|
+
() => {
|
|
46
|
+
if (onClickBody != undefined) {
|
|
47
|
+
onClickBody()
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}>
|
|
51
|
+
<div className="flex items-center py-3.5 px-4">
|
|
52
|
+
<img src={imageUrl} alt="icon" className="w-10 h-10 mr-2 rounded-full self-start" />
|
|
53
|
+
<div>
|
|
54
|
+
<p className='font-semibold text-black text-sm'>{Column_One_A ? Column_One_A : "-"}</p>
|
|
55
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_One_B ? Column_One_B : "-"}</p>
|
|
56
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_One_C ? Column_One_C : "-"}</p>
|
|
57
|
+
</div>
|
|
58
|
+
</div>
|
|
59
|
+
</div>
|
|
60
|
+
</td>
|
|
61
|
+
<td className="align-top">
|
|
62
|
+
<div className='flex items-center'
|
|
63
|
+
onClick={
|
|
64
|
+
() => {
|
|
65
|
+
if (onClickBody != undefined) {
|
|
66
|
+
onClickBody()
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
}>
|
|
70
|
+
<div className= "py-3.5 px-4">
|
|
71
|
+
<p className='font-semibold text-black text-sm'>{Column_Two_A ? Column_Two_A : "-"}</p>
|
|
72
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Two_B ? Column_Two_B : "-"}</p>
|
|
73
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Three_B ? Column_Three_B : "-"}</p>
|
|
74
|
+
</div>
|
|
75
|
+
</div>
|
|
76
|
+
</td>
|
|
77
|
+
<td className="align-top">
|
|
78
|
+
<div className='flex items-center'
|
|
79
|
+
onClick={
|
|
80
|
+
() => {
|
|
81
|
+
if (onClickBody != undefined) {
|
|
82
|
+
onClickBody()
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
}>
|
|
86
|
+
<div className= "py-3.5 px-4">
|
|
87
|
+
<p className='font-normal text-black text-sm'>{Column_Three_A ? Column_Three_A : "-"}</p>
|
|
88
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Three_B ? Column_Three_B : "-"}</p>
|
|
89
|
+
</div>
|
|
90
|
+
</div>
|
|
91
|
+
</td>
|
|
92
|
+
<td className="align-top">
|
|
93
|
+
<div className='flex items-center'
|
|
94
|
+
onClick={
|
|
95
|
+
() => {
|
|
96
|
+
if (onClickBody != undefined) {
|
|
97
|
+
onClickBody()
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
}>
|
|
101
|
+
<div className= "py-3.5 px-4">
|
|
102
|
+
<p className='font-normal text-black text-sm'>{Column_Four_A ? Column_Four_A : "-"}</p>
|
|
103
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Four_B ? Column_Four_B : "-"}</p>
|
|
104
|
+
</div>
|
|
105
|
+
</div>
|
|
106
|
+
</td>
|
|
107
|
+
<td className="align-top">
|
|
108
|
+
<div className='flex items-center'
|
|
109
|
+
onClick={
|
|
110
|
+
() => {
|
|
111
|
+
if (onClickBody != undefined) {
|
|
112
|
+
onClickBody()
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
}>
|
|
116
|
+
<div className= "py-3.5 px-4">
|
|
117
|
+
<Chip
|
|
118
|
+
type={chipType}
|
|
119
|
+
title={chipTitle}/>
|
|
120
|
+
</div>
|
|
121
|
+
</div>
|
|
122
|
+
</td>
|
|
123
|
+
<td className='items-start flex h-full'>
|
|
124
|
+
<div className='flex items-start'>
|
|
125
|
+
<div className= "flex py-3.5 px-4">
|
|
126
|
+
<div onClick={onClickEdit}>
|
|
127
|
+
<PiNotePencil
|
|
128
|
+
size="24"
|
|
129
|
+
variant="Bold"
|
|
130
|
+
className="text-primary500 cursor-pointer mr-2"
|
|
131
|
+
/>
|
|
132
|
+
</div>
|
|
133
|
+
<div onClick={onClickDelete}>
|
|
134
|
+
<PiTrash
|
|
135
|
+
size="24"
|
|
136
|
+
variant="Bold"
|
|
137
|
+
className="text-primary500 cursor-pointer"
|
|
138
|
+
/>
|
|
139
|
+
</div>
|
|
140
|
+
</div>
|
|
141
|
+
</div>
|
|
142
|
+
</td>
|
|
143
|
+
</tr>
|
|
144
|
+
)
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
export default CellModelFour
|
|
@@ -0,0 +1,171 @@
|
|
|
1
|
+
import React from 'react'
|
|
2
|
+
import Chip from '../../../chip'
|
|
3
|
+
import { PiTrash, PiNotePencil, PiWalletFill } from 'react-icons/pi'
|
|
4
|
+
|
|
5
|
+
const CellModelThree = ({
|
|
6
|
+
Column_One_A,
|
|
7
|
+
Column_One_B,
|
|
8
|
+
Column_One_C,
|
|
9
|
+
Column_One_D,
|
|
10
|
+
Column_Two_A,
|
|
11
|
+
Column_Two_B,
|
|
12
|
+
Column_Three_A,
|
|
13
|
+
Column_Four_A,
|
|
14
|
+
Column_Four_B,
|
|
15
|
+
Column_Four_C,
|
|
16
|
+
Column_Five_A,
|
|
17
|
+
Column_Five_B,
|
|
18
|
+
Column_Five_C,
|
|
19
|
+
onClickEdit,
|
|
20
|
+
onClickDelete,
|
|
21
|
+
Column_Six_A = "Active",
|
|
22
|
+
onClickBody,
|
|
23
|
+
}) => {
|
|
24
|
+
let chipType = "success";
|
|
25
|
+
let chipTitle = Column_Six_A;
|
|
26
|
+
|
|
27
|
+
switch (Column_Six_A.toLowerCase()) {
|
|
28
|
+
case "active":
|
|
29
|
+
chipType = "success";
|
|
30
|
+
chipTitle = "Active";
|
|
31
|
+
break;
|
|
32
|
+
case "waiting":
|
|
33
|
+
chipType = "primary";
|
|
34
|
+
chipTitle = "Waiting";
|
|
35
|
+
break;
|
|
36
|
+
case "inactive":
|
|
37
|
+
chipType = "neutral";
|
|
38
|
+
chipTitle = "Inactive";
|
|
39
|
+
break;
|
|
40
|
+
}
|
|
41
|
+
return (
|
|
42
|
+
<tr
|
|
43
|
+
className={`bg-white hover:bg-neutral20 border-t border-neutral40 ${onClickBody != undefined && "cursor-pointer"}`}
|
|
44
|
+
>
|
|
45
|
+
<td className="align-top">
|
|
46
|
+
<div className='flex items-center'
|
|
47
|
+
onClick={
|
|
48
|
+
() => {
|
|
49
|
+
if (onClickBody != undefined) {
|
|
50
|
+
onClickBody()
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
}>
|
|
54
|
+
<div className= "py-3.5 px-4">
|
|
55
|
+
<p className='font-semibold text-black text-sm'>{Column_One_A ? Column_One_A : "-"}</p>
|
|
56
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_One_B ? Column_One_B : "-"}</p>
|
|
57
|
+
</div>
|
|
58
|
+
</div>
|
|
59
|
+
</td>
|
|
60
|
+
<td className="align-top">
|
|
61
|
+
<div className='flex items-center'
|
|
62
|
+
onClick={
|
|
63
|
+
() => {
|
|
64
|
+
if (onClickBody != undefined) {
|
|
65
|
+
onClickBody()
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
}>
|
|
69
|
+
<div className= "py-3.5 px-4">
|
|
70
|
+
<p className='font-semibold text-black text-sm'>{Column_Two_A ? Column_Two_A : "-"}</p>
|
|
71
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Two_B ? Column_Two_B : "-"}</p>
|
|
72
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Two_B ? Column_Two_B : "-"}</p>
|
|
73
|
+
</div>
|
|
74
|
+
</div>
|
|
75
|
+
</td>
|
|
76
|
+
<td className="align-top">
|
|
77
|
+
<div className='flex items-center'
|
|
78
|
+
onClick={
|
|
79
|
+
() => {
|
|
80
|
+
if (onClickBody != undefined) {
|
|
81
|
+
onClickBody()
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
}>
|
|
85
|
+
<div className= "flex items-center py-3.5 px-4">
|
|
86
|
+
<p className='font-semibold text-black text-sm'>{Column_Three_A ? Column_Three_A : "-"}</p>
|
|
87
|
+
</div>
|
|
88
|
+
</div>
|
|
89
|
+
</td>
|
|
90
|
+
<td className="align-top">
|
|
91
|
+
<div className='flex items-center'
|
|
92
|
+
onClick={
|
|
93
|
+
() => {
|
|
94
|
+
if (onClickBody != undefined) {
|
|
95
|
+
onClickBody()
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
}>
|
|
99
|
+
<div className= "py-3.5 px-4">
|
|
100
|
+
<p className='font-semibold text-black text-sm'>{Column_Four_A ? Column_Four_A : "-"}</p>
|
|
101
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Four_B ? Column_Four_B : "-"}</p>
|
|
102
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Four_C ? Column_Four_C : "-"}</p>
|
|
103
|
+
</div>
|
|
104
|
+
</div>
|
|
105
|
+
</td>
|
|
106
|
+
<td className="align-top">
|
|
107
|
+
<div className='flex items-center'
|
|
108
|
+
onClick={
|
|
109
|
+
() => {
|
|
110
|
+
if (onClickBody != undefined) {
|
|
111
|
+
onClickBody()
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
}>
|
|
115
|
+
<div className= "py-3.5 px-4">
|
|
116
|
+
<p className='font-semibold text-black text-sm'>{Column_Five_A ? Column_Five_A : "-"}</p>
|
|
117
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Five_B ? Column_Five_B : "-"}</p>
|
|
118
|
+
<p className='font-normal text-neutral300 text-sm'>{Column_Five_C ? Column_Five_C : "-"}</p>
|
|
119
|
+
</div>
|
|
120
|
+
</div>
|
|
121
|
+
</td>
|
|
122
|
+
<td className="align-top">
|
|
123
|
+
<div className='flex items-center'
|
|
124
|
+
onClick={
|
|
125
|
+
() => {
|
|
126
|
+
if (onClickBody != undefined) {
|
|
127
|
+
onClickBody()
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
}>
|
|
131
|
+
<div className= "py-3.5 px-4">
|
|
132
|
+
<Chip
|
|
133
|
+
type={chipType}
|
|
134
|
+
title={chipTitle}/>
|
|
135
|
+
<div className='flex items-center pt-1'>
|
|
136
|
+
<p className='font-normal text-neutral500 text-sm'> </p>
|
|
137
|
+
</div>
|
|
138
|
+
<div className='flex items-center pt-1'>
|
|
139
|
+
<p className='font-normal text-neutral500 text-sm'> </p>
|
|
140
|
+
</div>
|
|
141
|
+
<div className='flex items-center pt-1'>
|
|
142
|
+
<p className='font-normal text-neutral500 text-sm'> </p>
|
|
143
|
+
</div>
|
|
144
|
+
</div>
|
|
145
|
+
</div>
|
|
146
|
+
</td>
|
|
147
|
+
<td className='items-start flex h-full'>
|
|
148
|
+
<div className='flex items-start'>
|
|
149
|
+
<div className= "flex py-3.5 px-4">
|
|
150
|
+
<div onClick={onClickEdit}>
|
|
151
|
+
<PiNotePencil
|
|
152
|
+
size="24"
|
|
153
|
+
variant="Bold"
|
|
154
|
+
className="text-neutral500 cursor-pointer mr-2"
|
|
155
|
+
/>
|
|
156
|
+
</div>
|
|
157
|
+
<div onClick={onClickDelete}>
|
|
158
|
+
<PiTrash
|
|
159
|
+
size="24"
|
|
160
|
+
variant="Bold"
|
|
161
|
+
className="text-neutral500 cursor-pointer"
|
|
162
|
+
/>
|
|
163
|
+
</div>
|
|
164
|
+
</div>
|
|
165
|
+
</div>
|
|
166
|
+
</td>
|
|
167
|
+
</tr>
|
|
168
|
+
)
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
export default CellModelThree
|
package/src/index.js
CHANGED
|
@@ -62,12 +62,14 @@ import DepositList from './components/table/listTable/deposit';
|
|
|
62
62
|
import ModalDeposit from './components/modal/modalDeposit';
|
|
63
63
|
import CellModelOne from './components/table/listTable/cellmodelone';
|
|
64
64
|
import CellModelTwo from './components/table/listTable/cellmodeltwo';
|
|
65
|
+
import CellModelThree from './components/table/listTable/cellmodelthree';
|
|
66
|
+
import CellModelFour from './components/table/listTable/cellmodefour';
|
|
65
67
|
import SearchDropdown from './components/searchdropdown';
|
|
66
68
|
import FilterDropdown from './components/filter/filterDropdown';
|
|
67
69
|
import Footer from './components/footer';
|
|
68
70
|
import Header from './components/header';
|
|
69
71
|
|
|
70
72
|
|
|
71
|
-
export {Header, Footer, CellModelOne, CellModelTwo, SearchDropdown, FilterDropdown, HeaderTable, TextInput, Pagination, ReportList, ReportListClient, InternalProductList, BillerProductList, BillerList, TabBar, ChipBar, Switch, Stepper,
|
|
73
|
+
export {Header, Footer, CellModelOne, CellModelTwo, CellModelThree,CellModelFour, SearchDropdown, FilterDropdown, HeaderTable, TextInput, Pagination, ReportList, ReportListClient, InternalProductList, BillerProductList, BillerList, TabBar, ChipBar, Switch, Stepper,
|
|
72
74
|
SearchInput, Notification, ModalState, ModalResult, ModalLoading, Menu, FilterText, FilterCheckbox, ExportToExcel, NotFound, EmptyData, DropzoneUploadPhoto, DropzoneUploadFile, DropdownText, DropdownChip, DropdownCard, Description, CustomDatePicker, Chip, CardInternalProduct, PrimaryButton, OutlineButton,
|
|
73
|
-
DangerButton, Alert, BillingList, ModalBilling, LimitList, ModalLimit, VerticalStepBar, DepositList, ModalDeposit}
|
|
75
|
+
DangerButton, Alert, BillingList, ModalBilling, LimitList, ModalLimit, VerticalStepBar, DepositList, ModalDeposit}
|
package/src/templates/index.js
CHANGED
|
@@ -53,6 +53,8 @@ import CellModelOne from '../components/table/listTable/cellmodelone';
|
|
|
53
53
|
import FilterDropdown from '../components/filter/filterDropdown';
|
|
54
54
|
import Header from '../components/header';
|
|
55
55
|
import CellModelTwo from '../components/table/listTable/cellmodeltwo';
|
|
56
|
+
import CellModelThree from '../components/table/listTable/cellmodelthree';
|
|
57
|
+
import CellModelFour from '../components/table/listTable/cellmodefour';
|
|
56
58
|
|
|
57
59
|
|
|
58
60
|
const Templates = () => {
|
|
@@ -585,6 +587,100 @@ const Templates = () => {
|
|
|
585
587
|
};
|
|
586
588
|
|
|
587
589
|
const [internalProducts, setInternalProducts] = useState(initialProducts);
|
|
590
|
+
const division = [
|
|
591
|
+
{
|
|
592
|
+
Column_One_A: "PT. Adira Finance Indonesia - Blok M",
|
|
593
|
+
Column_One_B: "Client ID",
|
|
594
|
+
Column_Two_A: "Agus Yulianto Carolous Wisesa",
|
|
595
|
+
Column_Two_B: "herubendrat@caricinta.co.id",
|
|
596
|
+
Column_Two_C: "082158423437",
|
|
597
|
+
Column_Three_A: "Prepaid",
|
|
598
|
+
Column_Four_A: "2023 Nov 29",
|
|
599
|
+
Column_Four_B: "At 15.27 AM",
|
|
600
|
+
Column_Four_C: "By Julius Caesar",
|
|
601
|
+
Column_Five_A: "2024 Feb 29",
|
|
602
|
+
Column_Five_B: "At 12.00 AM",
|
|
603
|
+
Column_Five_C: "By Agus Yulianto Carolous",
|
|
604
|
+
Column_Six_A: "Active",
|
|
605
|
+
},
|
|
606
|
+
{
|
|
607
|
+
Column_One_A: "PT. Adira Finance Indonesia - Pondok Indah",
|
|
608
|
+
Column_One_B: "Client ID",
|
|
609
|
+
Column_Two_A: "Yulianna Yullyanty",
|
|
610
|
+
Column_Two_B: "Yulyulyul@Adira.co.id",
|
|
611
|
+
Column_Two_C: "082158423437",
|
|
612
|
+
Column_Three_A: "Postpaid",
|
|
613
|
+
Column_Four_A: "2023 Nov 29",
|
|
614
|
+
Column_Four_B: "At 15.27 AM",
|
|
615
|
+
Column_Four_C: "By Julius Caesar",
|
|
616
|
+
Column_Five_A: "2024 Feb 29",
|
|
617
|
+
Column_Five_B: "At 12.00 AM",
|
|
618
|
+
Column_Five_C: "By Agus Yulianto Carolous",
|
|
619
|
+
Column_Six_A: "Inactive",
|
|
620
|
+
},
|
|
621
|
+
];
|
|
622
|
+
|
|
623
|
+
const client = [
|
|
624
|
+
{
|
|
625
|
+
Column_One_A: "CV Sejahtera Berkat Mandiri",
|
|
626
|
+
Column_One_B: "Finance",
|
|
627
|
+
Column_One_C: "86729.1.1",
|
|
628
|
+
Column_Two_A: "Galuh Sekartaji",
|
|
629
|
+
Column_Two_B: "redangel@mail.com",
|
|
630
|
+
Column_Two_C: "081234568348",
|
|
631
|
+
Column_Three_A: "13 Feb 2024, 10.07",
|
|
632
|
+
Column_Three_B: "Create by",
|
|
633
|
+
Column_Four_A: "13 Mar 2024, 10.05",
|
|
634
|
+
Column_Four_B: "By Agus Yulianto Carolus",
|
|
635
|
+
Column_Five_A: "Active",
|
|
636
|
+
imageUrl: "https://source.unsplash.com/random/50x50"
|
|
637
|
+
},
|
|
638
|
+
// Add more data objects following the same structure
|
|
639
|
+
{
|
|
640
|
+
Column_One_A: "CV Cahaya Makmur Terang",
|
|
641
|
+
Column_One_B: "Forestry",
|
|
642
|
+
Column_One_C: "495271.3",
|
|
643
|
+
Column_Two_A: "Paulus Jehanu",
|
|
644
|
+
Column_Two_B: "dciajeng@mail.com",
|
|
645
|
+
Column_Two_C: "081234568433",
|
|
646
|
+
Column_Three_A: "13 Feb 2024, 10.07",
|
|
647
|
+
Column_Three_B: "Create by",
|
|
648
|
+
Column_Four_A: "13 Mar 2024, 10.05",
|
|
649
|
+
Column_Four_B: "By Agus Yulianto Carolus",
|
|
650
|
+
Column_Five_A: "Inactive",
|
|
651
|
+
imageUrl: "https://source.unsplash.com/random/50x50"
|
|
652
|
+
},
|
|
653
|
+
{
|
|
654
|
+
Column_One_A: "CV Jaya Inovasi Berkah",
|
|
655
|
+
Column_One_B: "Automotive",
|
|
656
|
+
Column_One_C: "19582.1.1",
|
|
657
|
+
Column_Two_A: "Johan Sebastian Wardoyo",
|
|
658
|
+
Column_Two_B: "cdeni@mail.com",
|
|
659
|
+
Column_Two_C: "081234568410",
|
|
660
|
+
Column_Three_A: "13 Feb 2024, 10.07",
|
|
661
|
+
Column_Three_B: "Create by",
|
|
662
|
+
Column_Four_A: "13 Mar 2024, 10.05",
|
|
663
|
+
Column_Four_B: "By Agus Yulianto Carolus",
|
|
664
|
+
Column_Five_A: "Active",
|
|
665
|
+
imageUrl: "https://source.unsplash.com/random/50x50"
|
|
666
|
+
},
|
|
667
|
+
{
|
|
668
|
+
Column_One_A: "PT Cipta Inovasi Terkini",
|
|
669
|
+
Column_One_B: "Retail",
|
|
670
|
+
Column_One_C: "33819.15.1",
|
|
671
|
+
Column_Two_A: "Suseno Sulistiyawan",
|
|
672
|
+
Column_Two_B: "gsogood@mail.com",
|
|
673
|
+
Column_Two_C: "081234568437",
|
|
674
|
+
Column_Three_A: "13 Feb 2024, 10.07",
|
|
675
|
+
Column_Three_B: "Create by",
|
|
676
|
+
Column_Four_A: "13 Mar 2024, 10.05",
|
|
677
|
+
Column_Four_B: "By Agus Yulianto Carolus",
|
|
678
|
+
Column_Five_A: "Active",
|
|
679
|
+
imageUrl: "https://source.unsplash.com/random/50x50"
|
|
680
|
+
},
|
|
681
|
+
// Add additional entries as needed to match the screenshot
|
|
682
|
+
];
|
|
683
|
+
|
|
588
684
|
|
|
589
685
|
const handleClickInternalProduct = (productName) => {
|
|
590
686
|
console.log(`Product ${productName} clicked`);
|
|
@@ -1280,6 +1376,19 @@ const Templates = () => {
|
|
|
1280
1376
|
</tbody>
|
|
1281
1377
|
</table>
|
|
1282
1378
|
|
|
1379
|
+
|
|
1380
|
+
<table className='w-full text-left'>
|
|
1381
|
+
<HeaderTable dataHeader={["Column One", "Column Two", "Column Three", "Column Four", "Column Five"]} />
|
|
1382
|
+
<tbody>
|
|
1383
|
+
asdasdas
|
|
1384
|
+
{
|
|
1385
|
+
internalProducts.map((product, index) => (
|
|
1386
|
+
<CellModelThree />
|
|
1387
|
+
))
|
|
1388
|
+
}
|
|
1389
|
+
</tbody>
|
|
1390
|
+
</table>
|
|
1391
|
+
|
|
1283
1392
|
<div className='m-9'></div>
|
|
1284
1393
|
<p className='text-black font-bold text-2xl text-center py-2'>Report</p>
|
|
1285
1394
|
<ReportList {...reportData} />
|
|
@@ -1609,7 +1718,71 @@ const Templates = () => {
|
|
|
1609
1718
|
declineReason={currentDepositItem?.declineReason}
|
|
1610
1719
|
/>
|
|
1611
1720
|
|
|
1721
|
+
<div className='m-9'></div>
|
|
1722
|
+
<table className='w-full text-left'>
|
|
1723
|
+
<HeaderTable dataHeader={["Cient Data", "PIC", "Data Created", "Last Updated", "State", "Action"]} />
|
|
1724
|
+
<tbody>
|
|
1725
|
+
{
|
|
1726
|
+
client.map((product, index) => (
|
|
1727
|
+
<CellModelFour
|
|
1728
|
+
key={index}
|
|
1729
|
+
Column_One_A={product.Column_One_A}
|
|
1730
|
+
Column_One_B={product.Column_One_B}
|
|
1731
|
+
Column_One_C={product.Column_One_C}
|
|
1732
|
+
Column_One_D={product.Column_One_D}
|
|
1733
|
+
Column_Two_A={product.Column_Two_A}
|
|
1734
|
+
Column_Two_B={product.Column_Two_B}
|
|
1735
|
+
Column_Two_C={product.Column_Two_C}
|
|
1736
|
+
Column_Three_A={product.Column_Three_A}
|
|
1737
|
+
Column_Three_B={product.Column_Three_B}
|
|
1738
|
+
Column_Four_A={product.Column_Four_A}
|
|
1739
|
+
Column_Four_B={product.Column_Four_B}
|
|
1740
|
+
Column_Five_A={product.Column_Five_A}
|
|
1741
|
+
imageUrl={product.imageUrl}
|
|
1742
|
+
onClickEdit={() => console.log('Edit', product)}
|
|
1743
|
+
onClickDelete={() => console.log('Delete', product)}
|
|
1744
|
+
onClickBody={() => console.log('Body', product)}
|
|
1745
|
+
/>
|
|
1746
|
+
))
|
|
1747
|
+
}
|
|
1748
|
+
</tbody>
|
|
1749
|
+
</table>
|
|
1750
|
+
|
|
1751
|
+
|
|
1752
|
+
<div className='m-9'></div>
|
|
1753
|
+
<table className='w-full text-left'>
|
|
1754
|
+
<HeaderTable dataHeader={["Division DATA", "PIC DATA", "TYPE", "DATA CREATED", "LAST UPDATE", "STATUS", "Action"]} />
|
|
1755
|
+
<tbody>
|
|
1756
|
+
{
|
|
1757
|
+
division.map((division, index) => (
|
|
1758
|
+
<CellModelThree
|
|
1759
|
+
key={index}
|
|
1760
|
+
Column_One_A={division.Column_One_A}
|
|
1761
|
+
Column_One_B={division.Column_One_B}
|
|
1762
|
+
Column_Two_A={division.Column_Two_A}
|
|
1763
|
+
Column_Two_B={division.Column_Two_B}
|
|
1764
|
+
Column_Two_C={division.Column_Two_C}
|
|
1765
|
+
Column_Three_A={division.Column_Three_A}
|
|
1766
|
+
Column_Four_A={division.Column_Four_A}
|
|
1767
|
+
Column_Four_B={division.Column_Four_B}
|
|
1768
|
+
Column_Four_C={division.Column_Four_C}
|
|
1769
|
+
Column_Five_A={division.Column_Five_A}
|
|
1770
|
+
Column_Five_B={division.Column_Five_B}
|
|
1771
|
+
Column_Five_C={division.Column_Five_C}
|
|
1772
|
+
Column_Six_A={division.Column_Six_A}
|
|
1773
|
+
imageUrl={division.imageUrl}
|
|
1774
|
+
onClickEdit={() => console.log('Edit', division)}
|
|
1775
|
+
onClickDelete={() => console.log('Delete', division)}
|
|
1776
|
+
onClickBody={() => console.log('Body', division)}
|
|
1777
|
+
/>
|
|
1778
|
+
))
|
|
1779
|
+
}
|
|
1780
|
+
</tbody>
|
|
1781
|
+
</table>
|
|
1782
|
+
|
|
1612
1783
|
</div>
|
|
1784
|
+
|
|
1785
|
+
|
|
1613
1786
|
)
|
|
1614
1787
|
}
|
|
1615
1788
|
|