This commit is contained in:
zadit
2025-02-02 18:17:56 +07:00
parent b0813e1519
commit 02e101025e
13 changed files with 216 additions and 738 deletions

View File

@@ -236,634 +236,6 @@ const LinktreePage = ({ user, setModal }) => {
return (
<>
{user && user.roleId < 2 ? (
// <>
// <div className={styles.nonCenteredLinktreePage}>
// <div className={styles.dashboard}>
// <div className={styles.header}>
// <Header
// HeaderText={"selamat sore " + user.username}
// isEdit={() => setIsModalOpen(true)}
// isLogout={handleLogout}
// user={user}
// showProfile={true}
// setModal={setModal}
// HeaderMargin='0px'
// />
// </div>
// <div className={styles.headerCardWrapper}>
// <div className={styles.headerCard}>
// {user.roleId == 0 ? (
// selectedItemId == 0 || selectedItemId == -1 ? (
// <div className={styles.cardBody}>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{items?.totalIncome}</p>
// <p> pemasukan</p>
// </div>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p> Tagihan</p>
// <p>{items?.totalIncome * 0.02}</p>
// </div>
// </div>
// ) : (
// <div className={styles.cardBody}>
// <div className={styles.cardItem} >
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{selectedItems?.totalIncome}</p>
// <p>pemasukann</p>
// </div>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{selectedItems?.totalIncome * 0.02}</p>
// <p>tagihan</p>
// </div>
// <div className={styles.cardImg}>
// <img
// src={filteredItems?.welcomePageConfig ?
// API_BASE_URL + "/" + (JSON.parse(filteredItems.welcomePageConfig)?.image || '') : 'https://png.pngtree.com/png-vector/20221125/ourmid/pngtree-no-image-available-icon-flatvector-illustration-pic-design-profile-vector-png-image_40966566.jpg'
// }
// />
// <p>{selectedItems?.totalIncome * 0.02}</p>
// <p>{filteredItems.name}</p>
// </div>
// </div>
// )
// ) : (
// selectedItemId == 0 || selectedItemId == -1 ?
// (
// <div className={styles.cardBody}>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(items?.totalIncome)}</p>
// <p> pemasukan</p>
// </div>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(items?.totalOutcome)}</p>
// <p> pengeluaran</p>
// </div>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(items?.totalIncome * 0.02)}</p>
// <p> tanggungan</p>
// </div>
// </div>
// ) : (
// <div className={styles.cardBody}>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(selectedItems?.report?.totalIncome)}</p>
// <p>pemasukan</p>
// </div>
// <div className={styles.cardItem} >
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(selectedItems?.report?.currentOutcome)}</p>
// <p>pengeluaran</p>
// </div>
// <div className={styles.cardImg}>
// <img
// src={selectedItems?.welcomePageConfig ?
// API_BASE_URL + "/" + (JSON.parse(selectedItems.welcomePageConfig)?.image || '') : 'https://png.pngtree.com/png-vector/20221125/ourmid/pngtree-no-image-available-icon-flatvector-illustration-pic-design-profile-vector-png-image_40966566.jpg'
// }
// />
// <p>&nbsp;</p>
// <p>{selectedItems?.name}</p>
// </div>
// </div>
// )
// )}
// </div>
// </div>
// </div>
// <div className={styles.dashboardBody}>
// <button className={styles.goCafeButton} style={{ visibility: (selectedItems?.cafeId || selectedSubItems.find(cafe => cafe.cafeId == selectedSubItemId)?.cafeId) == null ? 'hidden' : 'visible' }} onClick={() => window.location.href = window.location.origin + '/' + (selectedItems?.cafeIdentifyName || selectedSubItems.find(cafe => cafe.cafeId == selectedSubItemId)?.cafeIdentifyName)}>Kunjungi kedai</button>
// <h3 style={{ color: 'black' }}>terlaku</h3>
// <div
// style={{
// display: "flex",
// alignItems: "center",
// justifyContent: "space-between",
// margin: '5px'
// }}
// >
// <div style={{ flex: 1 }}>
// <CircularDiagram segments={segments} />
// </div>
// <div style={{ flex: "1 1 20%" }}>
// {segments && segments.map((item, index) => (
// <div
// key={index}
// style={{
// display: "flex",
// alignItems: "center",
// }}
// >
// <div
// style={{
// marginRight: "5px",
// fontSize: "1.2em",
// color: colors[index],
// }}
// >
// ★
// </div>
// <h5 style={{ margin: 0, textAlign: "left", color: 'black' }}>{item.percentage == 'Infinity' || isNaN(item.percentage) ? 0 : item.percentage}% &nbsp; {item.value} </h5>
// </div>
// ))}
// {segments.length < 1 &&
// <>
// {Array.from({ length: 5 }).map((_, index) => (
// <div
// key={index}
// style={{
// display: "flex",
// alignItems: "center",
// }}
// >
// <h5
// style={{
// width: '100%',
// margin: 0,
// textAlign: "left",
// backgroundColor: 'gray',
// color: 'gray',
// borderRadius: '20px',
// marginBottom: '2px',
// }}
// >
// -
// </h5>
// </div>
// ))}
// </>
// }
// </div>
// </div>
// <h3>penambahan stok</h3>
// <DailyCharts Data={selectedItems?.report?.materialsPurchased || sortedMaterials} />
// {coupons && coupons.map((coupon) => {
// return <Coupon
// code={coupon?.code || null}
// value={coupon?.discountValue}
// period={coupon?.discountPeriods}
// expiration={coupon?.discountEndDate}
// />
// })}
// <button onClick={()=>setModal('claim-coupon')}></button>
// <div style={{ height: '24vh' }}></div>
// </div>
// </div>
// <div className={styles.cafeListWrapper}>
// <div className={styles.cafeListHeader}>
// Semua {user.roleId < 1 ? 'penyewa' : 'kedai anda'}
// </div>
// <div className={styles.cafeList}>
// </div>
// {user.roleId < 1 &&
// <div className={styles.rectangle}
// style={{ backgroundColor: selectedItemId == -1 ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)' }}
// onClick={() => {
// setSelectedItemId(selectedItemId === -1 ? 0 : -1);
// setModal('create_tenant');
// }}
// >
// Tambah penyewa
// </div>
// }
// {
// items?.items?.length > 0 ? (
// items.items.map((item) => {
// const isTenantSelected = selectedItemId === (item.userId || item.cafeId);
// const tenantBackgroundColor = isTenantSelected && !selectedSubItemId ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)';
// const hasSubItems = item?.subItems?.length > 0;
// return (
// <div key={item.userId || item.cafeId}>
// <div
// onClick={() => {
// setSelectedItemId(isTenantSelected && !selectedSubItemId ? 0 : (item.userId || item.cafeId));
// setSelectedSubItemId(0); // Reset subitem selection when changing tenant
// }}
// style={{ backgroundColor: tenantBackgroundColor }}
// className={isTenantSelected ? styles.rectangleNLine : styles.rectangle}
// >
// <h3>{item.username || item.name} &nbsp;</h3>
// <h3>
// Rp{formatIncome(item.totalIncome || item.report?.currentTotals.income) || 0}
// </h3>
// </div>
// {/* Only show cafes if the tenant is selected */}
// {selectedItemId === (item.userId || item.cafeId) && hasSubItems && item.subItems.map((subItem) => {
// const isCafeSelected = selectedSubItemId == (subItem.cafeId || subItem.userId);
// const cafeBackgroundColor = isCafeSelected ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)';
// return (
// <div
// key={subItem.cafeId || subItem.userId}
// className={styles.subRectangle}
// onClick={() => {
// setSelectedSubItemId(isCafeSelected ? 0 : (subItem.cafeId || subItem.userId)); // Toggle subitem selection
// setSelectedItemId(item.userId || item.cafeId); // Ensure tenant stays selected
// }}
// style={{ backgroundColor: cafeBackgroundColor }}
// >
// {subItem.name || subItem.username}
// {/* &nbsp;pendapatan {formatIncome(subItem.report?.totalIncome || 0)} */}
// </div>
// );
// })}
// {selectedItemId == item.cafeId &&
// <div
// className={styles.subRectangle}
// onClick={() => { setSelectedSubItemId(selectedSubItemId == -1 ? 0 : -1); setModal('create_clerk') }}
// style={{ backgroundColor: selectedItemId == item.cafeId && selectedSubItemId == -1 ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)' }}
// >
// tambah kasir
// </div>
// }
// </div>
// );
// })
// ) : (
// <div>No tenants available</div>
// )
// }
// {user.roleId > 0 &&
// <div className={styles.rectangle}
// style={{ backgroundColor: selectedItemId == -1 ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)' }}
// onClick={() => { setSelectedItemId(selectedItemId == -1 ? 0 : -1); setModal('create_kedai') }}
// >
// Tambah kedai
// </div>
// }
// <div style={{ height: '2px' }}></div>
// </div>
// </>
<div>
<div className={styles.header}>
@@ -878,20 +250,7 @@ const LinktreePage = ({ user, setModal }) => {
/>
</div>
<Reports forCafe={false} otherCafes={items?.items} />
<div style={{ padding: '25px' }}>
<h2>Kupon</h2>
{coupons && coupons.map((coupon) => {
return <Coupon
code={coupon?.code || null}
value={coupon?.discountValue}
period={coupon?.discountPeriods}
expiration={coupon?.discountEndDate}
/>
})}
<button onClick={() => setModal('claim-coupon')}></button>
</div>
<Reports forCafe={false} otherCafes={items?.items} coupons={coupons} setModal={setModal} user={user}/>
</div>
) : (
<div className={styles.centeredLinktreePage}>