@bjsdistribution/dms-client-return 0.1.70-prod → 0.1.71-prod

package/dist/components/order-daily-overview/return-order-table/return-orders-filters/returnstyles.js

@@ -0,0 +1,515 @@
+import { Button as e } from "@bjsdistribution/dms-component-library";
+import r from "styled-components";
+r.div`
+  display: flex;
+  gap: 5px;
+  i {
+    display: flex;
+    width: 25px;
+    height: 25px;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    gap: 10px;
+    flex-shrink: 0;
+    border-radius: 15px;
+    background: #edebe8;
+    svg {
+    }
+  }
+`;
+r.div`
+  display: flex;
+  justify-content: center;
+`;
+r.span`
+  font-size: 20px;
+  font-weight: 900;
+  line-height: 32px;
+  margin: 5px;
+  padding: 0;
+  text-transform: uppercase;
+  align-items: center;
+  display: flex;
+  justify-content: center;
+`;
+r.span`
+  color: #aea9a1;
+  padding: 10px;
+`;
+r.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 75px;
+  height: 75px;
+  padding: 14px;
+  border-radius: 50%;
+  background: #eff2f5;
+  border: 10px solid #b7d0f7;
+`;
+r(e)``;
+r.button`
+  cursor: pointer;
+  font-size: 16px;
+  opacity: 1;
+  background: white;
+  color: #3a3630;
+  border: thin solid #3a3630;
+  white-space: nowrap;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 40px;
+  padding: 8px 10px;
+  border-radius: 6px;
+`;
+r.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 10px;
+  text-align: center;
+`;
+r.div`
+  padding: 24px;
+  border-radius: 12px;
+  background: #ffffff;
+  box-shadow: 0px 20px 24px -4px #10182814;
+  width: 30%;
+  max-width: 50%;
+  margin: 0 auto;
+  @media (max-width: 1024px) {
+    max-width: 40%;
+  }
+`;
+r.div`
+  display: flex;
+  flex-direction: row;
+  gap: 10px;
+`;
+r.div`
+  display: flex;
+  justify-content: space-between;
+  border-bottom: 1px solid #e3e3e3;
+`;
+r.div`
+  color: #3a3630;
+  font-size: 16px;
+  font-weight: 500;
+  text-transform: uppercase;
+  padding: 10px;
+`;
+r.div`
+  padding: 0px 10px 10px 10px;
+`;
+r.div`
+  display: flex;
+  flex-direction: column;
+  padding: 10px;
+`;
+r.div`
+  border: 1px solid #e3e3e3;
+  background: #f8fafc;
+  justify-content: space-between;
+  align-items: center;
+  border-radius: 15px 15px 0 0;
+  margin-top: 15px;
+  padding-top: 10px;
+`;
+r(e)`
+  border-radius: 25px;
+  &:disabled {
+    background-color: #d3d3d3;
+    cursor: not-allowed;
+  }
+`;
+r.span`
+  background-color: rgba(153, 153, 153, 0.1);
+  padding: 3px 12px;
+  border-radius: 4px;
+`;
+const t = r.div`
+  display: flex;
+  justify-content: center;
+`, i = r.table`
+  border-spacing: 0 10px;
+  width: 100%;
+  /* min-width: 1600px; */
+  thead {
+    white-space: nowrap;
+    position: sticky;
+    top: 10px;
+    z-index: 1;
+    background: #fff;
+    box-shadow: 0px 0px 1px #ffffff, 0px -10px 1px #ffffff;
+    tr {
+      border-radius: 40px;
+      border-spacing: 0 10px;
+      position: relative;
+      font-family: 'lato', sans-serif;
+      .emailInvoiceCheckbox {
+        padding-right: 0px;
+        width: 0;
+        > div {
+          width: fit-content;
+        }
+      }
+      .custom-check {
+        position: absolute;
+      }
+      .emailInvoiceNo {
+        padding-left: 0px;
+      }
+      .emailInvoiceShare {
+        width: 100px;
+      }
+      th {
+        color: #3a3630;
+        font-size: 14px;
+        font-style: normal;
+        font-weight: 600;
+        line-height: normal;
+        padding: 11px 15px;
+        background: #f0f2f2;
+        border-right: none;
+        border-left: none;
+        text-align: left;
+        border: 1px solid rgba(0, 0, 0, 0.08);
+        border-width: 1px 0;
+        &:first-child {
+          border-radius: 100px 0 0 100px;
+          border-left: 1px solid rgba(0, 0, 0, 0.08);
+        }
+        &:last-child {
+          border-radius: 0px 100px 100px 0;
+          border-right: 1px solid rgba(0, 0, 0, 0.08);
+        }
+        .sortIconClass {
+          cursor: pointer;
+          display: flex;
+        }
+      }
+    }
+  }
+  tbody {
+    max-height: 400px;
+    overflow-y: auto;
+    tr {
+      td {
+        color: #3a3630;
+        font-size: 13px;
+        font-style: normal;
+        font-weight: 400;
+        line-height: normal;
+        padding: 12px 15px;
+        background: #fff;
+        border: 1px solid rgba(0, 0, 0, 0.08);
+        border-right: none;
+        border-left: none;
+        position: relative;
+        .disabled-wrapper {
+          cursor: not-allowed !important;
+          display: inline-block;
+          * {
+            pointer-events: none !important;
+          }
+        }
+        .actionbox {
+          display: flex;
+          gap: 5px;
+        }
+        .shareIconContainer {
+          display: flex;
+          padding: 2px 12px;
+          align-items: center;
+          gap: 8px;
+          border-radius: 20px;
+          border: 1px solid var(--tonal-brown-101, #e2e0db);
+          background: #fff;
+          list-style-type: none;
+          /* padding-left: 0; */
+          /* fontWeight: 600,
+          paddingLeft: 0, */
+          cursor: pointer;
+          position: relative;
+        }
+        .statusCancelled {
+          color: #e95252;
+          /* background: rgba(233, 82, 82, 0.15); */
+          padding: 4px 8px;
+          border-radius: 4px;
+        }
+
+        .statusOnHold {
+          color: #f4a503;
+          /* background: #fff1d6; */
+          padding: 4px 8px;
+          border-radius: 4px;
+        }
+
+        .statusSubContracted {
+          color: #845adf;
+          /* background: rgba(132, 90, 223, 0.15); */
+          padding: 4px 8px;
+          border-radius: 4px;
+        }
+
+        .statusAwaiting {
+          color: #845adf;
+          /* background: rgba(132, 90, 223, 0.15); */
+          padding: 4px 8px;
+          border-radius: 4px;
+        }
+
+        .statusCompleted {
+          color: #1f9254;
+          /* background: rgba(41, 204, 106, 0.15); */
+          padding: 4px 8px;
+          border-radius: 4px;
+        }
+
+        .statusOutstanding {
+          color: #f4a503;
+          /* background: #fff1d6; */
+          padding: 4px 8px;
+          border-radius: 4px;
+        }
+
+        .statusUnknown {
+          color: #000;
+          /* background: #fff; */
+          padding: 4px 8px;
+          border-radius: 4px;
+        }
+        .statustext {
+          color: #1f9254;
+          font-family: 'Open Sans';
+          font-size: 12px;
+          font-style: normal;
+          font-weight: 600;
+          line-height: normal;
+        }
+        .downloadcontainer {
+          display: flex;
+          padding: 2px 12px;
+          align-items: center;
+
+          width: 28px;
+          height: 28px;
+          flex-direction: column;
+
+          border-radius: 14px;
+          border: 1px solid #e2e0db;
+          background: #fff;
+        }
+        .statuscontainer {
+          display: flex;
+          padding: 5px 30px 5px 30px;
+          justify-content: center;
+          align-items: center;
+          gap: 5px;
+          flex: 1 0 0;
+          border-radius: 22px;
+          background: rgba(41, 204, 106, 0.15);
+        }
+        .awaiting {
+          display: flex;
+          min-width: 85px;
+          padding: 6px 10px;
+          justify-content: center;
+          align-items: center;
+          gap: 5px;
+          border-radius: 22px;
+          background: rgba(233, 82, 82, 0.15);
+          color: #e95252;
+          font-family: 'Open Sans';
+          font-size: 12px;
+          font-weight: 600;
+        }
+        ul > li > a {
+          text-decoration: none !important;
+          color: #0099ff;
+        }
+      }
+      &:nth-child(even) td {
+        background: #f6fbff;
+      }
+      td:first-child {
+        border-radius: 100px 0 0 100px;
+        border-left: 1px solid rgba(0, 0, 0, 0.08);
+      }
+      td:last-child {
+        border-radius: 0px 100px 100px 0;
+        border-right: 1px solid rgba(0, 0, 0, 0.08);
+      }
+      .flex {
+        display: flex;
+        flex-direction: row;
+        gap: 5px;
+        height: 29px;
+        align-items: center;
+      }
+
+      &.insideTable {
+        td {
+          border-radius: 0;
+          border: none;
+          &:last-child {
+            border-radius: 0;
+            border-right: none;
+          }
+        }
+        table {
+          border-spacing: 0;
+          width: 100%;
+          border-radius: 5px;
+          border: 1px solid rgba(0, 0, 0, 0.08);
+          overflow: hidden;
+          border-top-left-radius: 15px;
+          border-top-right-radius: 15px;
+          thead {
+            tr {
+              border-bottom: none;
+              th {
+                padding: 14px 20px;
+                text-align: left;
+                border-top: 0;
+                border-right: 0;
+                border-left: 0;
+                background: #f8fafc;
+
+                &:first-child {
+                  border-radius: 0;
+                  border-left: 1px solid rgba(0, 0, 0, 0.08);
+                  border-top-left-radius: 15px;
+                }
+                &:last-child {
+                  border-radius: 0;
+                }
+              }
+            }
+          }
+          tbody {
+            tr.product-row td {
+              border-bottom: none;
+            }
+
+            tr.ni-row td {
+              border-top: none;
+              padding-top: 0;
+              background: #fff;
+            }
+
+            tr.product-row td:first-child {
+              border-bottom-left-radius: 0;
+            }
+
+            tr.product-row td:last-child {
+              border-bottom-right-radius: 0;
+            }
+
+            tr.ni-row td:first-child {
+              border-top-left-radius: 0;
+            }
+
+            tr.ni-row td:last-child {
+              border-top-right-radius: 0;
+            }
+
+            tr.ni-row:nth-child(even) td {
+              background: #fff;
+            }
+            tr {
+              td {
+                padding: 14px 20px;
+                text-align: left;
+                border-bottom: 1px solid rgba(58, 54, 48, 0.15);
+                background: #fff;
+                > svg {
+                  transform: scale(1.5);
+                  background-color: #edebe8;
+                  border-radius: 20px;
+                  padding: 5px;
+                }
+                &:last-child {
+                  border-radius: 0;
+                  border-right: none;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .actions {
+    display: flex;
+    align-items: center;
+    gap: 20px;
+    > svg {
+      transform: scale(1.5);
+      background-color: #edebe8;
+      border-radius: 20px;
+      padding: 5px;
+    }
+
+    .close-icon {
+      transform: scale(1.3);
+      background-color: transparent;
+      border-radius: 0;
+      padding: 0;
+    }
+  }
+`, a = r.div`
+  max-height: 60vh;
+  overflow-x: auto;
+  // min-height: 50vh;
+
+  .fortables {
+    max-height: 60vh;
+    overflow-x: auto;
+    min-height: 50vh;
+  }
+  /* height: 600px; */
+  /* box-shadow: 0px 0px 30px 6px rgba(46, 45, 116, 0.05); */
+  &::-webkit-scrollbar {
+    width: 5px;
+    border-radius: 100px;
+    height: 5px;
+  }
+
+  &::-webkit-scrollbar-track {
+    background: #777;
+    border-radius: 100px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background: #7b61ff;
+    border-radius: 100px;
+  }
+
+  &::-webkit-scrollbar-thumb:hover {
+    background: #7b61ff;
+  }
+`, n = r.div`
+  /* border-radius: 20px;
+  border: 1px solid #e2e0db;
+  background: #fff;
+  display: flex;
+  padding: 4px 8px;
+  gap: 8px;
+  align-items: center; */
+  cursor: pointer;
+  &.active .drop {
+    transform: rotate(180deg);
+  }
+`;
+export {
+  n as CustomDrop,
+  t as EmptyDataContainer,
+  i as StyledTable,
+  a as StyledTableWrapper
+};
+//# sourceMappingURL=returnstyles.js.map

package/dist/components/order-daily-overview/return-order-table/return-orders-filters/returnstyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"returnstyles.js","sources":["../../../../../src/components/order-daily-overview/return-order-table/return-orders-filters/returnstyles.ts"],"sourcesContent":["import { Button } from '@bjsdistribution/dms-component-library';\nimport styled from 'styled-components';\n\nexport const IconContainers = styled.div`\n  display: flex;\n  gap: 5px;\n  i {\n    display: flex;\n    width: 25px;\n    height: 25px;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 10px;\n    flex-shrink: 0;\n    border-radius: 15px;\n    background: #edebe8;\n    svg {\n    }\n  }\n`;\n\nexport const Div = styled.div`\n  display: flex;\n  justify-content: center;\n`;\n\nexport const ModalTitle = styled.span`\n  font-size: 20px;\n  font-weight: 900;\n  line-height: 32px;\n  margin: 5px;\n  padding: 0;\n  text-transform: uppercase;\n  align-items: center;\n  display: flex;\n  justify-content: center;\n`;\n\nexport const Description = styled.span`\n  color: #aea9a1;\n  padding: 10px;\n`;\n\nexport const Container = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 75px;\n  height: 75px;\n  padding: 14px;\n  border-radius: 50%;\n  background: #eff2f5;\n  border: 10px solid #b7d0f7;\n`;\n\nexport const ConfirmButton = styled(Button)``;\n\nexport const CancelButton = styled.button`\n  cursor: pointer;\n  font-size: 16px;\n  opacity: 1;\n  background: white;\n  color: #3a3630;\n  border: thin solid #3a3630;\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 40px;\n  padding: 8px 10px;\n  border-radius: 6px;\n`;\n\nexport const SectionsContainer = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 10px;\n  text-align: center;\n`;\n\nexport const MainContainer = styled.div`\n  padding: 24px;\n  border-radius: 12px;\n  background: #ffffff;\n  box-shadow: 0px 20px 24px -4px #10182814;\n  width: 30%;\n  max-width: 50%;\n  margin: 0 auto;\n  @media (max-width: 1024px) {\n    max-width: 40%;\n  }\n`;\n\nexport const ButtonContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  gap: 10px;\n`;\n\n// export const StyledTable = styled.table`\n//   border-spacing: 0 12px;\n//   width: 100%;\n//   thead {\n//     tr {\n//       border-radius: 40px;\n//       border-spacing: 0 12px;\n//       th {\n//         color: #3a3630;\n//         font-size: 14px;\n//         font-style: normal;\n//         font-weight: 600;\n//         line-height: normal;\n//         padding: 11px 15px;\n//         background: #f0f2f2;\n//         border-right: none;\n//         border-left: none;\n//         text-align: left;\n//         border: 1px solid rgba(0, 0, 0, 0.08);\n//         border-width: 1px 0;\n//         &:first-child {\n//           border-radius: 100px 0 0 100px;\n//           border-left: 1px solid rgba(0, 0, 0, 0.08);\n//         }\n//         &:last-child {\n//           border-radius: 0px 100px 100px 0;\n//           border-right: 1px solid rgba(0, 0, 0, 0.08);\n//         }\n//       }\n//     }\n//   }\n//   tbody {\n//     tr {\n//       td {\n//         color: #3a3630;\n//         font-size: 13px;\n//         font-style: normal;\n//         font-weight: 400;\n//         line-height: normal;\n//         padding: 12px 15px;\n//         background: #fff;\n//         border: 1px solid rgba(0, 0, 0, 0.08);\n//         border-right: none;\n//         border-left: none;\n\n//         > svg {\n//           transform: scale(1.5);\n//           background-color: #edebe8;\n//           border-radius: 20px;\n//           padding: 5px;\n//         }\n//       }\n//       td:first-child {\n//         border-radius: 100px 0 0 100px;\n//         border-left: 1px solid rgba(0, 0, 0, 0.08);\n//       }\n//       td:last-child {\n//         border-radius: 0px 100px 100px 0;\n//         border-right: 1px solid rgba(0, 0, 0, 0.08);\n//       }\n//       .flex {\n//         display: flex;\n//         flex-direction: row;\n//         gap: 15px;\n//         height: 29px;\n//         align-items: center;\n\n//         > svg {\n//           transform: scale(1.5);\n//           background-color: #edebe8;\n//           border-radius: 20px;\n//         }\n//       }\n//     }\n//   }\n// `;\n\nexport const Header = styled.div`\n  display: flex;\n  justify-content: space-between;\n  border-bottom: 1px solid #e3e3e3;\n`;\n\nexport const HeaderText = styled.div`\n  color: #3a3630;\n  font-size: 16px;\n  font-weight: 500;\n  text-transform: uppercase;\n  padding: 10px;\n`;\n\nexport const Padding = styled.div`\n  padding: 0px 10px 10px 10px;\n`;\n\nexport const HeaderCont = styled.div`\n  display: flex;\n  flex-direction: column;\n  padding: 10px;\n`;\n\nexport const Main = styled.div`\n  border: 1px solid #e3e3e3;\n  background: #f8fafc;\n  justify-content: space-between;\n  align-items: center;\n  border-radius: 15px 15px 0 0;\n  margin-top: 15px;\n  padding-top: 10px;\n`;\n\nexport const SendButton = styled(Button)`\n  border-radius: 25px;\n  &:disabled {\n    background-color: #d3d3d3;\n    cursor: not-allowed;\n  }\n`;\n\nexport const TdWrapper = styled.span`\n  background-color: rgba(153, 153, 153, 0.1);\n  padding: 3px 12px;\n  border-radius: 4px;\n`;\n\nexport const EmptyDataContainer = styled.div`\n  display: flex;\n  justify-content: center;\n`;\n\nexport const StyledTable = styled.table`\n  border-spacing: 0 10px;\n  width: 100%;\n  /* min-width: 1600px; */\n  thead {\n    white-space: nowrap;\n    position: sticky;\n    top: 10px;\n    z-index: 1;\n    background: #fff;\n    box-shadow: 0px 0px 1px #ffffff, 0px -10px 1px #ffffff;\n    tr {\n      border-radius: 40px;\n      border-spacing: 0 10px;\n      position: relative;\n      font-family: 'lato', sans-serif;\n      .emailInvoiceCheckbox {\n        padding-right: 0px;\n        width: 0;\n        > div {\n          width: fit-content;\n        }\n      }\n      .custom-check {\n        position: absolute;\n      }\n      .emailInvoiceNo {\n        padding-left: 0px;\n      }\n      .emailInvoiceShare {\n        width: 100px;\n      }\n      th {\n        color: #3a3630;\n        font-size: 14px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: normal;\n        padding: 11px 15px;\n        background: #f0f2f2;\n        border-right: none;\n        border-left: none;\n        text-align: left;\n        border: 1px solid rgba(0, 0, 0, 0.08);\n        border-width: 1px 0;\n        &:first-child {\n          border-radius: 100px 0 0 100px;\n          border-left: 1px solid rgba(0, 0, 0, 0.08);\n        }\n        &:last-child {\n          border-radius: 0px 100px 100px 0;\n          border-right: 1px solid rgba(0, 0, 0, 0.08);\n        }\n        .sortIconClass {\n          cursor: pointer;\n          display: flex;\n        }\n      }\n    }\n  }\n  tbody {\n    max-height: 400px;\n    overflow-y: auto;\n    tr {\n      td {\n        color: #3a3630;\n        font-size: 13px;\n        font-style: normal;\n        font-weight: 400;\n        line-height: normal;\n        padding: 12px 15px;\n        background: #fff;\n        border: 1px solid rgba(0, 0, 0, 0.08);\n        border-right: none;\n        border-left: none;\n        position: relative;\n        .disabled-wrapper {\n          cursor: not-allowed !important;\n          display: inline-block;\n          * {\n            pointer-events: none !important;\n          }\n        }\n        .actionbox {\n          display: flex;\n          gap: 5px;\n        }\n        .shareIconContainer {\n          display: flex;\n          padding: 2px 12px;\n          align-items: center;\n          gap: 8px;\n          border-radius: 20px;\n          border: 1px solid var(--tonal-brown-101, #e2e0db);\n          background: #fff;\n          list-style-type: none;\n          /* padding-left: 0; */\n          /* fontWeight: 600,\n          paddingLeft: 0, */\n          cursor: pointer;\n          position: relative;\n        }\n        .statusCancelled {\n          color: #e95252;\n          /* background: rgba(233, 82, 82, 0.15); */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusOnHold {\n          color: #f4a503;\n          /* background: #fff1d6; */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusSubContracted {\n          color: #845adf;\n          /* background: rgba(132, 90, 223, 0.15); */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusAwaiting {\n          color: #845adf;\n          /* background: rgba(132, 90, 223, 0.15); */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusCompleted {\n          color: #1f9254;\n          /* background: rgba(41, 204, 106, 0.15); */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusOutstanding {\n          color: #f4a503;\n          /* background: #fff1d6; */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusUnknown {\n          color: #000;\n          /* background: #fff; */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n        .statustext {\n          color: #1f9254;\n          font-family: 'Open Sans';\n          font-size: 12px;\n          font-style: normal;\n          font-weight: 600;\n          line-height: normal;\n        }\n        .downloadcontainer {\n          display: flex;\n          padding: 2px 12px;\n          align-items: center;\n\n          width: 28px;\n          height: 28px;\n          flex-direction: column;\n\n          border-radius: 14px;\n          border: 1px solid #e2e0db;\n          background: #fff;\n        }\n        .statuscontainer {\n          display: flex;\n          padding: 5px 30px 5px 30px;\n          justify-content: center;\n          align-items: center;\n          gap: 5px;\n          flex: 1 0 0;\n          border-radius: 22px;\n          background: rgba(41, 204, 106, 0.15);\n        }\n        .awaiting {\n          display: flex;\n          min-width: 85px;\n          padding: 6px 10px;\n          justify-content: center;\n          align-items: center;\n          gap: 5px;\n          border-radius: 22px;\n          background: rgba(233, 82, 82, 0.15);\n          color: #e95252;\n          font-family: 'Open Sans';\n          font-size: 12px;\n          font-weight: 600;\n        }\n        ul > li > a {\n          text-decoration: none !important;\n          color: #0099ff;\n        }\n      }\n      &:nth-child(even) td {\n        background: #f6fbff;\n      }\n      td:first-child {\n        border-radius: 100px 0 0 100px;\n        border-left: 1px solid rgba(0, 0, 0, 0.08);\n      }\n      td:last-child {\n        border-radius: 0px 100px 100px 0;\n        border-right: 1px solid rgba(0, 0, 0, 0.08);\n      }\n      .flex {\n        display: flex;\n        flex-direction: row;\n        gap: 5px;\n        height: 29px;\n        align-items: center;\n      }\n\n      &.insideTable {\n        td {\n          border-radius: 0;\n          border: none;\n          &:last-child {\n            border-radius: 0;\n            border-right: none;\n          }\n        }\n        table {\n          border-spacing: 0;\n          width: 100%;\n          border-radius: 5px;\n          border: 1px solid rgba(0, 0, 0, 0.08);\n          overflow: hidden;\n          border-top-left-radius: 15px;\n          border-top-right-radius: 15px;\n          thead {\n            tr {\n              border-bottom: none;\n              th {\n                padding: 14px 20px;\n                text-align: left;\n                border-top: 0;\n                border-right: 0;\n                border-left: 0;\n                background: #f8fafc;\n\n                &:first-child {\n                  border-radius: 0;\n                  border-left: 1px solid rgba(0, 0, 0, 0.08);\n                  border-top-left-radius: 15px;\n                }\n                &:last-child {\n                  border-radius: 0;\n                }\n              }\n            }\n          }\n          tbody {\n            tr.product-row td {\n              border-bottom: none;\n            }\n\n            tr.ni-row td {\n              border-top: none;\n              padding-top: 0;\n              background: #fff;\n            }\n\n            tr.product-row td:first-child {\n              border-bottom-left-radius: 0;\n            }\n\n            tr.product-row td:last-child {\n              border-bottom-right-radius: 0;\n            }\n\n            tr.ni-row td:first-child {\n              border-top-left-radius: 0;\n            }\n\n            tr.ni-row td:last-child {\n              border-top-right-radius: 0;\n            }\n\n            tr.ni-row:nth-child(even) td {\n              background: #fff;\n            }\n            tr {\n              td {\n                padding: 14px 20px;\n                text-align: left;\n                border-bottom: 1px solid rgba(58, 54, 48, 0.15);\n                background: #fff;\n                > svg {\n                  transform: scale(1.5);\n                  background-color: #edebe8;\n                  border-radius: 20px;\n                  padding: 5px;\n                }\n                &:last-child {\n                  border-radius: 0;\n                  border-right: none;\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n\n  .actions {\n    display: flex;\n    align-items: center;\n    gap: 20px;\n    > svg {\n      transform: scale(1.5);\n      background-color: #edebe8;\n      border-radius: 20px;\n      padding: 5px;\n    }\n\n    .close-icon {\n      transform: scale(1.3);\n      background-color: transparent;\n      border-radius: 0;\n      padding: 0;\n    }\n  }\n`;\n\n// Styled components\nexport const StyledTableWrapper = styled.div`\n  max-height: 60vh;\n  overflow-x: auto;\n  // min-height: 50vh;\n\n  .fortables {\n    max-height: 60vh;\n    overflow-x: auto;\n    min-height: 50vh;\n  }\n  /* height: 600px; */\n  /* box-shadow: 0px 0px 30px 6px rgba(46, 45, 116, 0.05); */\n  &::-webkit-scrollbar {\n    width: 5px;\n    border-radius: 100px;\n    height: 5px;\n  }\n\n  &::-webkit-scrollbar-track {\n    background: #777;\n    border-radius: 100px;\n  }\n\n  &::-webkit-scrollbar-thumb {\n    background: #7b61ff;\n    border-radius: 100px;\n  }\n\n  &::-webkit-scrollbar-thumb:hover {\n    background: #7b61ff;\n  }\n`;\n\nexport const CustomDrop = styled.div`\n  /* border-radius: 20px;\n  border: 1px solid #e2e0db;\n  background: #fff;\n  display: flex;\n  padding: 4px 8px;\n  gap: 8px;\n  align-items: center; */\n  cursor: pointer;\n  &.active .drop {\n    transform: rotate(180deg);\n  }\n`;\n"],"names":["styled","Button","EmptyDataContainer","StyledTable","StyledTableWrapper","CustomDrop"],"mappings":";;AAG8BA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBlBA,EAAO;AAAA;AAAA;AAAA;AAKAA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYNA,EAAO;AAAA;AAAA;AAAA;AAKTA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYHA,EAAOC,CAAM;AAEdD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBFA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQXA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaLA,EAAO;AAAA;AAAA;AAAA;AAAA;AAmFhBA,EAAO;AAAA;AAAA;AAAA;AAAA;AAMHA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQVA,EAAO;AAAA;AAAA;AAIJA,EAAO;AAAA;AAAA;AAAA;AAAA;AAMbA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUDA,EAAOC,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQdD,EAAO;AAAA;AAAA;AAAA;AAAA;AAMzB,MAAME,IAAqBF,EAAO;AAAA;AAAA;AAAA,GAK5BG,IAAcH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA6UrBI,IAAqBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAiC5BK,IAAaL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/components/order-daily-overview/shared/elements/PrintDropDown.js

@@ -0,0 +1,65 @@
+import { jsx as p, jsxs as d } from "react/jsx-runtime";
+import s from "styled-components";
+import { optionsClientPortPrint as a, optionsPrint as x } from "../../common/fakedata.js";
+import { PrintIconMap as c } from "../utlis.js";
+import { useClientPortal as f } from "../../../store.js";
+const C = ({
+  legacyProductId: o
+}) => {
+  const l = (n) => {
+    let i;
+    n && (i = o[n]), i ? window.open(i, "_blank") : console.log("URL not available for", n);
+  }, [e] = f();
+  return /* @__PURE__ */ p(b, { children: (e ? a : x)?.map((n, i) => {
+    const t = c[n.icon], r = !o[n.type];
+    return /* @__PURE__ */ d(
+      m,
+      {
+        onClick: () => !r && l(n.type),
+        disabled: r,
+        children: [
+          t && /* @__PURE__ */ p(t, {}),
+          n.label
+        ]
+      },
+      i
+    );
+  }) });
+}, b = s.ul`
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  box-sizing: border-box;
+  border-radius: 6px;
+  border: 1px solid rgba(224, 226, 231, 0.5);
+  background: #fff;
+  box-shadow: 0px 4px 30px 0px rgba(46, 45, 116, 0.05);
+  width: 177px;
+  padding: 5px 1px 3px 1px;
+  position: absolute;
+  top: 34px;
+  right: 0;
+  z-index: 99;
+  min-width: 194px;
+`, m = s.li`
+  border-bottom: 1px solid #f0f2f2;
+  padding: 8px 10px;
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  font-size: 13px;
+  cursor: ${({ disabled: o }) => o ? "not-allowed" : "pointer"};
+  color: ${({ disabled: o }) => o ? "#d3d3d3" : "inherit"};
+  &:last-child {
+    border: none;
+  }
+  &:hover {
+    background-color: ${({ disabled: o }) => o ? "transparent" : "#f0f0f0"};
+  }
+`;
+export {
+  b as OptionsList,
+  m as OptionsListLi,
+  C as default
+};
+//# sourceMappingURL=PrintDropDown.js.map

package/dist/components/order-daily-overview/shared/elements/PrintDropDown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PrintDropDown.js","sources":["../../../../../src/components/order-daily-overview/shared/elements/PrintDropDown.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { optionsClientPortPrint, optionsPrint } from '../../common/fakedata';\nimport { PrintIconMap } from '../utlis';\nimport { useClientPortal } from '../../../store';\n\nconst PrintDropDown = ({\n  legacyProductId,\n}: {\n  legacyProductId: Record<string, any>;\n}) => {\n  const downloadFiles = (type: string) => {\n    let url: string | undefined;\n\n    if (type) {\n      url = legacyProductId[type];\n    }\n\n    if (url) {\n      window.open(url, '_blank');\n    } else {\n      console.log('URL not available for', type);\n    }\n  };\n  const [clientPortal] = useClientPortal();\n  const printOptions = clientPortal ? optionsClientPortPrint : optionsPrint;\n  return (\n    <OptionsList>\n      {printOptions?.map((item: any, index: any) => {\n        const IconComponent = PrintIconMap[item.icon];\n        const isDisabled = !legacyProductId[item.type];\n\n        return (\n          <OptionsListLi\n            key={index}\n            onClick={() => !isDisabled && downloadFiles(item.type)}\n            disabled={isDisabled}\n          >\n            {IconComponent && <IconComponent />}\n            {item.label}\n          </OptionsListLi>\n        );\n      })}\n    </OptionsList>\n  );\n};\n\nexport default PrintDropDown;\n\nexport const OptionsList = styled.ul`\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  box-sizing: border-box;\n  border-radius: 6px;\n  border: 1px solid rgba(224, 226, 231, 0.5);\n  background: #fff;\n  box-shadow: 0px 4px 30px 0px rgba(46, 45, 116, 0.05);\n  width: 177px;\n  padding: 5px 1px 3px 1px;\n  position: absolute;\n  top: 34px;\n  right: 0;\n  z-index: 99;\n  min-width: 194px;\n`;\n\nexport const OptionsListLi = styled.li<{ disabled?: boolean }>`\n  border-bottom: 1px solid #f0f2f2;\n  padding: 8px 10px;\n  display: flex;\n  gap: 12px;\n  align-items: center;\n  font-size: 13px;\n  cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n  color: ${({ disabled }) => (disabled ? '#d3d3d3' : 'inherit')};\n  &:last-child {\n    border: none;\n  }\n  &:hover {\n    background-color: ${({ disabled }) =>\n      disabled ? 'transparent' : '#f0f0f0'};\n  }\n`;\n"],"names":["PrintDropDown","legacyProductId","downloadFiles","type","url","clientPortal","useClientPortal","OptionsList","optionsClientPortPrint","optionsPrint","item","index","IconComponent","PrintIconMap","isDisabled","jsxs","OptionsListLi","styled","disabled"],"mappings":";;;;;AAMA,MAAMA,IAAgB,CAAC;AAAA,EACrB,iBAAAC;AACF,MAEM;AACJ,QAAMC,IAAgB,CAACC,MAAiB;AACtC,QAAIC;AAEJ,IAAID,MACFC,IAAMH,EAAgBE,CAAI,IAGxBC,IACF,OAAO,KAAKA,GAAK,QAAQ,IAEzB,QAAQ,IAAI,yBAAyBD,CAAI;AAAA,EAE7C,GACM,CAACE,CAAY,IAAIC,EAAA;AAEvB,2BACGC,GAAA,EACE,WAHgBF,IAAeG,IAAyBC,IAG1C,IAAI,CAACC,GAAWC,MAAe;AAC5C,UAAMC,IAAgBC,EAAaH,EAAK,IAAI,GACtCI,IAAa,CAACb,EAAgBS,EAAK,IAAI;AAE7C,WACE,gBAAAK;AAAA,MAACC;AAAA,MAAA;AAAA,QAEC,SAAS,MAAM,CAACF,KAAcZ,EAAcQ,EAAK,IAAI;AAAA,QACrD,UAAUI;AAAA,QAET,UAAA;AAAA,UAAAF,uBAAkBA,GAAA,EAAc;AAAA,UAChCF,EAAK;AAAA,QAAA;AAAA,MAAA;AAAA,MALDC;AAAA,IAAA;AAAA,EAQX,CAAC,EAAA,CACH;AAEJ,GAIaJ,IAAcU,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAkBrBD,IAAgBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOxB,CAAC,EAAE,UAAAC,EAAA,MAAgBA,IAAW,gBAAgB,SAAU;AAAA,WACzD,CAAC,EAAE,UAAAA,EAAA,MAAgBA,IAAW,YAAY,SAAU;AAAA;AAAA;AAAA;AAAA;AAAA,wBAKvC,CAAC,EAAE,UAAAA,EAAA,MACrBA,IAAW,gBAAgB,SAAS;AAAA;AAAA;"}

package/dist/components/order-daily-overview/shared/utlis.js

@@ -0,0 +1,26 @@
+import s from "../../../assets/icons/CollectionLabelIcon.js";
+import c from "../../../assets/icons/CustomerLabelIcon.js";
+import i from "../../../assets/icons/DeliveryNotes.js";
+import a from "../../../assets/icons/LoadSheetIcon.js";
+import l from "../../../assets/icons/RunsheetIcon.js";
+const A = {
+  runSheet: l,
+  loadSheet: a,
+  deliveryLables: i,
+  customerLables: c,
+  collectionLables: s
+}, L = (o) => {
+  const t = (n) => n.toString().padStart(2, "0"), r = o.getFullYear(), e = t(o.getMonth() + 1);
+  return `
+  ${t(o.getDate())}/${e}/${r}
+  `;
+}, b = (o) => {
+  const t = Array.isArray(o) && o.length === 0;
+  return o === 0 ? 0 : o === "NA" || o === void 0 || o === null || t ? "NA" : o;
+};
+export {
+  A as PrintIconMap,
+  b as displayValueOrNA,
+  L as formatDate
+};
+//# sourceMappingURL=utlis.js.map

package/dist/components/order-daily-overview/shared/utlis.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utlis.js","sources":["../../../../src/components/order-daily-overview/shared/utlis.ts"],"sourcesContent":["import CollectionLabelIcon from '../../../assets/icons/CollectionLabelIcon';\nimport CustomerLabelIcon from '../../../assets/icons/CustomerLabelIcon';\nimport DeliveryNotes from '../../../assets/icons/DeliveryNotes';\nimport LoadSheetIcon from '../../../assets/icons/LoadSheetIcon';\nimport RunsheetIcon from '../../../assets/icons/RunsheetIcon';\n\nexport const getStatusBg = (status: string) => {\n  switch (status) {\n    case 'onTotalOrder':\n      return 'rgba(99, 150, 229, 0.20)';\n    case 'late':\n      return 'rgba(233, 82, 82, 0.20)';\n    case 'onComplete':\n      return 'rgba(87, 219, 122, 0.20)';\n    case 'onPending':\n      return 'rgba(254, 186, 48, 0.20)';\n    case 'onCollection':\n      return 'rgba(123, 97, 255, 0.20)';\n    default:\n      return 'gray';\n  }\n};\n\nexport const getStatusColor = (status: string) => {\n  switch (status) {\n    case 'onTotalOrder':\n      return '#6396E5';\n    case 'late':\n      return '#E95252';\n    case 'onComplete':\n      return '#29CC6A';\n    case 'onPending':\n      return '#FEBA30';\n    case 'onCollection':\n      return '#7B61FF';\n    default:\n      return 'gray';\n  }\n};\n\nexport const iconMap: Record<\n  string,\n  React.ComponentType<React.SVGProps<SVGSVGElement>>\n> = {\n  assembly: RunsheetIcon,\n  heavyItems: RunsheetIcon,\n  supplier: RunsheetIcon,\n  vip: RunsheetIcon,\n};\n\nexport const PrintIconMap: Record<\n  string,\n  React.ComponentType<React.SVGProps<SVGSVGElement>>\n> = {\n  runSheet: RunsheetIcon,\n  loadSheet: LoadSheetIcon,\n  deliveryLables: DeliveryNotes,\n  customerLables: CustomerLabelIcon,\n  collectionLables: CollectionLabelIcon,\n};\n\n// Date format\nexport const formatDate = (date: any) => {\n  const padZero = (num: any) => num.toString().padStart(2, '0');\n  const year = date.getFullYear();\n  const month = padZero(date.getMonth() + 1);\n  const day = padZero(date.getDate());\n  // const hours = padZero(date.getHours());\n  // const minutes = padZero(date.getMinutes());\n  // const seconds = padZero(date.getSeconds());\n\n  return `\n  ${day}/${month}/${year}\n  `;\n};\n\nexport const displayValueOrNA = (value: any) => {\n  const isBlankArray = Array.isArray(value) && value.length === 0;\n  if (value === 0) {\n    return 0;\n  }\n  if (value === 'NA' || value === undefined || value === null || isBlankArray) {\n    return 'NA';\n  }\n  return value;\n};\n"],"names":["PrintIconMap","RunsheetIcon","LoadSheetIcon","DeliveryNotes","CustomerLabelIcon","CollectionLabelIcon","formatDate","date","padZero","num","year","month","displayValueOrNA","value","isBlankArray"],"mappings":";;;;;AAkDO,MAAMA,IAGT;AAAA,EACF,UAAUC;AAAA,EACV,WAAWC;AAAA,EACX,gBAAgBC;AAAA,EAChB,gBAAgBC;AAAA,EAChB,kBAAkBC;AACpB,GAGaC,IAAa,CAACC,MAAc;AACvC,QAAMC,IAAU,CAACC,MAAaA,EAAI,WAAW,SAAS,GAAG,GAAG,GACtDC,IAAOH,EAAK,YAAA,GACZI,IAAQH,EAAQD,EAAK,SAAA,IAAa,CAAC;AAMzC,SAAO;AAAA,IALKC,EAAQD,EAAK,QAAA,CAAS,CAM7B,IAAII,CAAK,IAAID,CAAI;AAAA;AAExB,GAEaE,IAAmB,CAACC,MAAe;AAC9C,QAAMC,IAAe,MAAM,QAAQD,CAAK,KAAKA,EAAM,WAAW;AAC9D,SAAIA,MAAU,IACL,IAELA,MAAU,QAAQA,MAAU,UAAaA,MAAU,QAAQC,IACtD,OAEFD;AACT;"}