sprint-asia-custom-component 0.1.42 → 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 +208 -49
- 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 +60 -40
- package/src/index.js +3 -2
- package/src/templates/index.js +159 -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"}
|
|
@@ -46745,14 +46745,22 @@
|
|
|
46745
46745
|
Column_One_C,
|
|
46746
46746
|
Column_One_D,
|
|
46747
46747
|
Column_Two_A,
|
|
46748
|
+
Column_Two_B,
|
|
46748
46749
|
Column_Three_A,
|
|
46749
46750
|
Column_Four_A,
|
|
46750
|
-
|
|
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",
|
|
46751
46759
|
onClickBody
|
|
46752
46760
|
}) => {
|
|
46753
46761
|
let chipType = "success";
|
|
46754
|
-
let chipTitle =
|
|
46755
|
-
switch (
|
|
46762
|
+
let chipTitle = Column_Six_A;
|
|
46763
|
+
switch (Column_Six_A.toLowerCase()) {
|
|
46756
46764
|
case "active":
|
|
46757
46765
|
chipType = "success";
|
|
46758
46766
|
chipTitle = "Active";
|
|
@@ -46768,7 +46776,9 @@
|
|
|
46768
46776
|
}
|
|
46769
46777
|
return /*#__PURE__*/React__default["default"].createElement("tr", {
|
|
46770
46778
|
className: `bg-white hover:bg-neutral20 border-t border-neutral40 ${onClickBody != undefined && "cursor-pointer"}`
|
|
46771
|
-
}, /*#__PURE__*/React__default["default"].createElement("td",
|
|
46779
|
+
}, /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46780
|
+
className: "align-top"
|
|
46781
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46772
46782
|
className: "flex items-center",
|
|
46773
46783
|
onClick: () => {
|
|
46774
46784
|
if (onClickBody != undefined) {
|
|
@@ -46781,11 +46791,9 @@
|
|
|
46781
46791
|
className: "font-semibold text-black text-sm"
|
|
46782
46792
|
}, Column_One_A ? Column_One_A : "-"), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46783
46793
|
className: "font-normal text-neutral300 text-sm"
|
|
46784
|
-
}, Column_One_B ? Column_One_B : "-"), /*#__PURE__*/React__default["default"].createElement("
|
|
46785
|
-
className: "
|
|
46786
|
-
},
|
|
46787
|
-
className: "font-normal text-neutral300 text-sm"
|
|
46788
|
-
}, Column_One_D ? Column_One_D : "-")))), /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46794
|
+
}, Column_One_B ? Column_One_B : "-")))), /*#__PURE__*/React__default["default"].createElement("td", {
|
|
46795
|
+
className: "align-top"
|
|
46796
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46789
46797
|
className: "flex items-center",
|
|
46790
46798
|
onClick: () => {
|
|
46791
46799
|
if (onClickBody != undefined) {
|
|
@@ -46796,19 +46804,43 @@
|
|
|
46796
46804
|
className: "py-3.5 px-4"
|
|
46797
46805
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46798
46806
|
className: "font-semibold text-black text-sm"
|
|
46799
|
-
}, Column_Two_A ? Column_Two_A : "-"), /*#__PURE__*/React__default["default"].createElement("
|
|
46800
|
-
className: "
|
|
46801
|
-
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46802
|
-
className: "font-normal text-
|
|
46803
|
-
}, "
|
|
46804
|
-
className: "
|
|
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"
|
|
46805
46822
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46806
|
-
className: "font-
|
|
46807
|
-
}, "
|
|
46808
|
-
className: "
|
|
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"
|
|
46809
46835
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46810
|
-
className: "font-
|
|
46811
|
-
}, "
|
|
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", {
|
|
46812
46844
|
className: "flex items-center",
|
|
46813
46845
|
onClick: () => {
|
|
46814
46846
|
if (onClickBody != undefined) {
|
|
@@ -46818,8 +46850,26 @@
|
|
|
46818
46850
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46819
46851
|
className: "py-3.5 px-4"
|
|
46820
46852
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46821
|
-
className: "font-
|
|
46822
|
-
},
|
|
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", {
|
|
46823
46873
|
className: "flex items-center pt-1"
|
|
46824
46874
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46825
46875
|
className: "font-normal text-neutral500 text-sm"
|
|
@@ -46831,7 +46881,85 @@
|
|
|
46831
46881
|
className: "flex items-center pt-1"
|
|
46832
46882
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46833
46883
|
className: "font-normal text-neutral500 text-sm"
|
|
46834
|
-
}, "\xA0"))))), /*#__PURE__*/React__default["default"].createElement("td",
|
|
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", {
|
|
46835
46963
|
className: "flex items-center",
|
|
46836
46964
|
onClick: () => {
|
|
46837
46965
|
if (onClickBody != undefined) {
|
|
@@ -46841,20 +46969,44 @@
|
|
|
46841
46969
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46842
46970
|
className: "py-3.5 px-4"
|
|
46843
46971
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46844
|
-
className: "font-
|
|
46845
|
-
},
|
|
46846
|
-
className: "
|
|
46847
|
-
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46848
|
-
className: "font-normal text-
|
|
46849
|
-
}, "
|
|
46850
|
-
className: "
|
|
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"
|
|
46851
46988
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46852
|
-
className: "font-normal text-
|
|
46853
|
-
}, "
|
|
46854
|
-
className: "
|
|
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"
|
|
46855
47003
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46856
|
-
className: "font-normal text-
|
|
46857
|
-
}, "
|
|
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", {
|
|
46858
47010
|
className: "flex items-center",
|
|
46859
47011
|
onClick: () => {
|
|
46860
47012
|
if (onClickBody != undefined) {
|
|
@@ -46866,19 +47018,25 @@
|
|
|
46866
47018
|
}, /*#__PURE__*/React__default["default"].createElement(Chip, {
|
|
46867
47019
|
type: chipType,
|
|
46868
47020
|
title: chipTitle
|
|
46869
|
-
}), /*#__PURE__*/React__default["default"].createElement("
|
|
46870
|
-
className: "
|
|
46871
|
-
}, /*#__PURE__*/React__default["default"].createElement("
|
|
46872
|
-
className: "
|
|
46873
|
-
},
|
|
46874
|
-
className: "flex
|
|
46875
|
-
}, /*#__PURE__*/React__default["default"].createElement("
|
|
46876
|
-
|
|
46877
|
-
},
|
|
46878
|
-
|
|
46879
|
-
|
|
46880
|
-
className: "
|
|
46881
|
-
}, "
|
|
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
|
+
}))))));
|
|
46882
47040
|
};
|
|
46883
47041
|
|
|
46884
47042
|
const SearchDropdown = ({
|
|
@@ -47250,6 +47408,7 @@
|
|
|
47250
47408
|
exports.BillerProductList = BillerProductList;
|
|
47251
47409
|
exports.BillingList = BillingList;
|
|
47252
47410
|
exports.CardInternalProduct = CardInternalProduct;
|
|
47411
|
+
exports.CellModelFour = CellModelFour;
|
|
47253
47412
|
exports.CellModelOne = CellModelOne;
|
|
47254
47413
|
exports.CellModelThree = CellModelThree;
|
|
47255
47414
|
exports.CellModelTwo = CellModelTwo;
|
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
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react'
|
|
2
2
|
import Chip from '../../../chip'
|
|
3
|
+
import { PiTrash, PiNotePencil, PiWalletFill } from 'react-icons/pi'
|
|
3
4
|
|
|
4
5
|
const CellModelThree = ({
|
|
5
6
|
Column_One_A,
|
|
@@ -7,15 +8,23 @@ const CellModelThree = ({
|
|
|
7
8
|
Column_One_C,
|
|
8
9
|
Column_One_D,
|
|
9
10
|
Column_Two_A,
|
|
11
|
+
Column_Two_B,
|
|
10
12
|
Column_Three_A,
|
|
11
13
|
Column_Four_A,
|
|
12
|
-
|
|
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",
|
|
13
22
|
onClickBody,
|
|
14
23
|
}) => {
|
|
15
24
|
let chipType = "success";
|
|
16
|
-
let chipTitle =
|
|
25
|
+
let chipTitle = Column_Six_A;
|
|
17
26
|
|
|
18
|
-
switch (
|
|
27
|
+
switch (Column_Six_A.toLowerCase()) {
|
|
19
28
|
case "active":
|
|
20
29
|
chipType = "success";
|
|
21
30
|
chipTitle = "Active";
|
|
@@ -33,7 +42,7 @@ const CellModelThree = ({
|
|
|
33
42
|
<tr
|
|
34
43
|
className={`bg-white hover:bg-neutral20 border-t border-neutral40 ${onClickBody != undefined && "cursor-pointer"}`}
|
|
35
44
|
>
|
|
36
|
-
<td>
|
|
45
|
+
<td className="align-top">
|
|
37
46
|
<div className='flex items-center'
|
|
38
47
|
onClick={
|
|
39
48
|
() => {
|
|
@@ -45,12 +54,10 @@ const CellModelThree = ({
|
|
|
45
54
|
<div className= "py-3.5 px-4">
|
|
46
55
|
<p className='font-semibold text-black text-sm'>{Column_One_A ? Column_One_A : "-"}</p>
|
|
47
56
|
<p className='font-normal text-neutral300 text-sm'>{Column_One_B ? Column_One_B : "-"}</p>
|
|
48
|
-
<p className='font-normal text-neutral300 text-sm'>{Column_One_C ? Column_One_C : "-"}</p>
|
|
49
|
-
<p className='font-normal text-neutral300 text-sm'>{Column_One_D ? Column_One_D : "-"}</p>
|
|
50
57
|
</div>
|
|
51
58
|
</div>
|
|
52
59
|
</td>
|
|
53
|
-
<td>
|
|
60
|
+
<td className="align-top">
|
|
54
61
|
<div className='flex items-center'
|
|
55
62
|
onClick={
|
|
56
63
|
() => {
|
|
@@ -60,20 +67,27 @@ const CellModelThree = ({
|
|
|
60
67
|
}
|
|
61
68
|
}>
|
|
62
69
|
<div className= "py-3.5 px-4">
|
|
63
|
-
<p className='font-semibold text-black text-sm'>{Column_Two_A ? Column_Two_A
|
|
64
|
-
<
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
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>
|
|
73
87
|
</div>
|
|
74
88
|
</div>
|
|
75
89
|
</td>
|
|
76
|
-
<td>
|
|
90
|
+
<td className="align-top">
|
|
77
91
|
<div className='flex items-center'
|
|
78
92
|
onClick={
|
|
79
93
|
() => {
|
|
@@ -83,20 +97,13 @@ const CellModelThree = ({
|
|
|
83
97
|
}
|
|
84
98
|
}>
|
|
85
99
|
<div className= "py-3.5 px-4">
|
|
86
|
-
<p className='font-
|
|
87
|
-
<
|
|
88
|
-
|
|
89
|
-
</div>
|
|
90
|
-
<div className='flex items-center pt-1'>
|
|
91
|
-
<p className='font-normal text-neutral500 text-sm'> </p>
|
|
92
|
-
</div>
|
|
93
|
-
<div className='flex items-center pt-1'>
|
|
94
|
-
<p className='font-normal text-neutral500 text-sm'> </p>
|
|
95
|
-
</div>
|
|
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>
|
|
96
103
|
</div>
|
|
97
104
|
</div>
|
|
98
105
|
</td>
|
|
99
|
-
<td>
|
|
106
|
+
<td className="align-top">
|
|
100
107
|
<div className='flex items-center'
|
|
101
108
|
onClick={
|
|
102
109
|
() => {
|
|
@@ -106,20 +113,13 @@ const CellModelThree = ({
|
|
|
106
113
|
}
|
|
107
114
|
}>
|
|
108
115
|
<div className= "py-3.5 px-4">
|
|
109
|
-
<p className='font-
|
|
110
|
-
<
|
|
111
|
-
|
|
112
|
-
</div>
|
|
113
|
-
<div className='flex items-center pt-1'>
|
|
114
|
-
<p className='font-normal text-neutral500 text-sm'> </p>
|
|
115
|
-
</div>
|
|
116
|
-
<div className='flex items-center pt-1'>
|
|
117
|
-
<p className='font-normal text-neutral500 text-sm'> </p>
|
|
118
|
-
</div>
|
|
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
119
|
</div>
|
|
120
120
|
</div>
|
|
121
121
|
</td>
|
|
122
|
-
<td>
|
|
122
|
+
<td className="align-top">
|
|
123
123
|
<div className='flex items-center'
|
|
124
124
|
onClick={
|
|
125
125
|
() => {
|
|
@@ -144,6 +144,26 @@ const CellModelThree = ({
|
|
|
144
144
|
</div>
|
|
145
145
|
</div>
|
|
146
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>
|
|
147
167
|
</tr>
|
|
148
168
|
)
|
|
149
169
|
}
|
package/src/index.js
CHANGED
|
@@ -63,12 +63,13 @@ 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
65
|
import CellModelThree from './components/table/listTable/cellmodelthree';
|
|
66
|
+
import CellModelFour from './components/table/listTable/cellmodefour';
|
|
66
67
|
import SearchDropdown from './components/searchdropdown';
|
|
67
68
|
import FilterDropdown from './components/filter/filterDropdown';
|
|
68
69
|
import Footer from './components/footer';
|
|
69
70
|
import Header from './components/header';
|
|
70
71
|
|
|
71
72
|
|
|
72
|
-
export {Header, Footer, CellModelOne, CellModelTwo, CellModelThree, 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,
|
|
73
74
|
SearchInput, Notification, ModalState, ModalResult, ModalLoading, Menu, FilterText, FilterCheckbox, ExportToExcel, NotFound, EmptyData, DropzoneUploadPhoto, DropzoneUploadFile, DropdownText, DropdownChip, DropdownCard, Description, CustomDatePicker, Chip, CardInternalProduct, PrimaryButton, OutlineButton,
|
|
74
|
-
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
|
@@ -54,6 +54,7 @@ import FilterDropdown from '../components/filter/filterDropdown';
|
|
|
54
54
|
import Header from '../components/header';
|
|
55
55
|
import CellModelTwo from '../components/table/listTable/cellmodeltwo';
|
|
56
56
|
import CellModelThree from '../components/table/listTable/cellmodelthree';
|
|
57
|
+
import CellModelFour from '../components/table/listTable/cellmodefour';
|
|
57
58
|
|
|
58
59
|
|
|
59
60
|
const Templates = () => {
|
|
@@ -586,6 +587,100 @@ const Templates = () => {
|
|
|
586
587
|
};
|
|
587
588
|
|
|
588
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
|
+
|
|
589
684
|
|
|
590
685
|
const handleClickInternalProduct = (productName) => {
|
|
591
686
|
console.log(`Product ${productName} clicked`);
|
|
@@ -1623,7 +1718,71 @@ const Templates = () => {
|
|
|
1623
1718
|
declineReason={currentDepositItem?.declineReason}
|
|
1624
1719
|
/>
|
|
1625
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
|
+
|
|
1626
1783
|
</div>
|
|
1784
|
+
|
|
1785
|
+
|
|
1627
1786
|
)
|
|
1628
1787
|
}
|
|
1629
1788
|
|