first commit

2022-05-23 12:56:31 +03:00
commit 3cea343aaf
395 changed files with 37099 additions and 0 deletions
--- a/src/pages/finance/TransactionDetails.jsx
+++ b/src/pages/finance/TransactionDetails.jsx
@@ -0,0 +1,107 @@
+import React, { useState } from 'react';
+
+import Sidebar from '../../partials/Sidebar';
+import Header from '../../partials/Header';
+import DeleteButton from '../../partials/actions/DeleteButton';
+import SearchForm from '../../partials/actions/SearchForm';
+import DropdownTransaction from '../../components/DropdownTransaction';
+import TransactionsTable from '../../partials/finance/TransactionsTable02';
+import TransactionPanel from '../../partials/finance/TransactionPanel';
+import PaginationClassic from '../../components/PaginationClassic';
+
+function TransactionDetails() {
+
+  const [sidebarOpen, setSidebarOpen] = useState(false);
+  const [selectedItems, setSelectedItems] = useState([]);
+  const [transactionPanelOpen, setTransactionPanelOpen] = useState(true);
+
+  const handleSelectedItems = (selectedItems) => {
+    setSelectedItems([...selectedItems]);
+  };
+
+  return (
+    <div className="flex h-screen overflow-hidden">
+
+      {/* Sidebar */}
+      <Sidebar sidebarOpen={sidebarOpen} setSidebarOpen={setSidebarOpen} />
+
+      {/* Content area */}
+      <div className="relative flex flex-col flex-1 overflow-y-auto overflow-x-hidden bg-white">
+        {/*  Site header */}
+        <Header sidebarOpen={sidebarOpen} setSidebarOpen={setSidebarOpen} />
+
+        <main>
+          <div className="relative">
+            {/* Content */}
+            <div className="px-4 sm:px-6 lg:px-8 py-8 w-full max-w-9xl mx-auto">
+              {/* Page header */}
+              <div className="sm:flex sm:justify-between sm:items-center mb-4 md:mb-2">
+                {/* Left: Title */}
+                <div className="mb-4 sm:mb-0">
+                  <h1 className="text-2xl md:text-3xl text-slate-800 font-bold">$47,347.09</h1>
+                </div>
+
+                {/* Right: Actions */}
+                <div className="grid grid-flow-col sm:auto-cols-max justify-start sm:justify-end gap-2">
+                  {/* Delete button */}
+                  <DeleteButton selectedItems={selectedItems} />
+
+                  {/* Search form */}
+                  <div className="hidden sm:block">
+                    <SearchForm />
+                  </div>
+
+                  {/* Export button */}
+                  <button className="btn bg-indigo-500 hover:bg-indigo-600 text-white">Export Transactions</button>
+                </div>
+              </div>
+
+              <div className="mb-5">
+                <span>Transactions from </span>
+                <DropdownTransaction />
+              </div>
+
+              {/* Filters */}
+              <div className="mb-5">
+                <ul className="flex flex-wrap -m-1">
+                  <li className="m-1">
+                    <button className="inline-flex items-center justify-center text-sm font-medium leading-5 rounded-full px-3 py-1 border border-transparent shadow-sm bg-indigo-500 text-white duration-150 ease-in-out">
+                      View All
+                    </button>
+                  </li>
+                  <li className="m-1">
+                    <button className="inline-flex items-center justify-center text-sm font-medium leading-5 rounded-full px-3 py-1 border border-slate-200 hover:border-slate-300 shadow-sm bg-white text-slate-500 duration-150 ease-in-out">
+                      Completed
+                    </button>
+                  </li>
+                  <li className="m-1">
+                    <button className="inline-flex items-center justify-center text-sm font-medium leading-5 rounded-full px-3 py-1 border border-slate-200 hover:border-slate-300 shadow-sm bg-white text-slate-500 duration-150 ease-in-out">
+                      Pending
+                    </button>
+                  </li>
+                  <li className="m-1">
+                    <button className="inline-flex items-center justify-center text-sm font-medium leading-5 rounded-full px-3 py-1 border border-slate-200 hover:border-slate-300 shadow-sm bg-white text-slate-500 duration-150 ease-in-out">
+                      Canceled
+                    </button>
+                  </li>
+                </ul>
+              </div>
+
+              {/* Table */}
+              <TransactionsTable selectedItems={handleSelectedItems} setTransactionPanelOpen={setTransactionPanelOpen} />
+
+              {/* Pagination */}
+              <div className="mt-8">
+                <PaginationClassic />
+              </div>
+            </div>
+
+            <TransactionPanel transactionPanelOpen={transactionPanelOpen} setTransactionPanelOpen={setTransactionPanelOpen} />
+          </div>
+        </main>
+      </div>
+    </div>
+  );
+}
+
+export default TransactionDetails;