첫 커밋

src/entities/transaction/ui/list-date-group.tsx

@@ -0,0 +1,52 @@
+import moment from 'moment';
+import 'moment/dist/locale/ko';
+import { ListDateGroupProps } from '../model/types';
+import { ListItem } from './list-item';
+
+export const ListDateGroup = ({
+  pageType,
+  date,
+  items
+}: ListDateGroupProps) => {
+  moment.locale('ko');
+  const getStateDate = () => {
+    let stateDate = moment(date).format('YY.MM.DD(ddd)');
+    return stateDate;
+  };
+
+  const getListItem = () => {
+    let rs = [];
+    if(!!items && items.length>0){
+      for(let i=0;i<items.length;i++){
+        let key = 'ListItem-'+i;
+        rs.push(
+          <ListItem
+            pageType={ pageType }
+            key={ key }
+            tid={ items[i]?.tid }
+            mid={ items[i]?.mid }
+            stateDate={ items[i]?.stateDate }
+            stateCode={ items[i]?.stateCode }
+            stateName={ items[i]?.stateName }
+            installmentMonth={ items[i]?.installmentMonth }
+            serviceCode={ items[i]?.serviceCode }
+            serviceName={ items[i]?.serviceName }
+            serviceDetailName={ items[i]?.serviceDetailName }
+            goodsAmount={ items[i]?.goodsAmount }
+          ></ListItem>
+        )
+      }  
+    }
+    
+    return rs;
+  };
+
+  return (
+    <>
+      <div className="date-group">
+        <div className="date-header">{ getStateDate() }</div>
+        { getListItem() }
+      </div>
+    </>
+  );
+};