aboutsummaryrefslogtreecommitdiff
path: root/src/views
diff options
context:
space:
mode:
authorVidhu Kant Sharma <vidhukant@vidhukant.xyz>2022-09-27 21:42:51 +0530
committerVidhu Kant Sharma <vidhukant@vidhukant.xyz>2022-09-27 21:42:51 +0530
commit39819430fa47172c1a3a36218339f6baf86f8983 (patch)
treedafe65a48fcceb60b588c613e2d92be4c514633b /src/views
parent072e53f0b2eb8fa14c0aa49286193784c73257cb (diff)
added edit option for items and brands
Diffstat (limited to 'src/views')
-rw-r--r--src/views/manage/brands.js25
-rw-r--r--src/views/manage/items.js25
-rw-r--r--src/views/manage/scss/management-page.scss4
3 files changed, 48 insertions, 6 deletions
diff --git a/src/views/manage/brands.js b/src/views/manage/brands.js
index 61afe16..dad21e2 100644
--- a/src/views/manage/brands.js
+++ b/src/views/manage/brands.js
@@ -18,11 +18,12 @@
import { useState, useEffect } from 'react';
import './scss/management-page.scss'
-import { getAllBrands } from '../../classes/brand';
+import { Brand, getAllBrands } from '../../classes/brand';
import BrandEditor from './../../components/editors/brand-editor';
import BrandTable from './../../components/tables/brand-table';
const ManageBrandsPage = () => {
+ const [brandToEdit, setBrandToEdit] = useState(new Brand());
const [allBrands, setAllBrands] = useState([]);
// TODO: handle error
const updateList = () =>
@@ -34,9 +35,27 @@ const ManageBrandsPage = () => {
return (
<>
- <BrandEditor heading={"Add New Brand"} callback={updateList}/>
+ <BrandEditor
+ heading={"Add New Brand"}
+ brand={new Brand()}
+ callback={updateList}/>
<hr/>
- <BrandTable refresh={updateList} brands={allBrands}/>
+ <BrandTable
+ refresh={updateList}
+ brands={allBrands}
+ setBrandToEdit={setBrandToEdit}/>
+
+ {JSON.stringify(brandToEdit) !== JSON.stringify(new Brand()) &&
+ <div className={"floating-wrapper"}>
+ <BrandEditor
+ className={"floating-window"}
+ heading={`Edit ${brandToEdit.Name ? brandToEdit.Name : 'Brand'}:`}
+ brand={brandToEdit}
+ hide={() => setBrandToEdit(new Brand())}
+ editing={true}
+ callback={updateList}/>
+ </div>
+ }
</>
);
}
diff --git a/src/views/manage/items.js b/src/views/manage/items.js
index b9bf339..567be7c 100644
--- a/src/views/manage/items.js
+++ b/src/views/manage/items.js
@@ -22,11 +22,12 @@
import { useState, useEffect } from 'react';
import './scss/management-page.scss'
-import { getAllItems } from '../../classes/item';
+import { Item, getAllItems } from '../../classes/item';
import ItemEditor from './../../components/editors/item-editor';
import ItemTable from './../../components/tables/item-table';
const ManageItemsPage = () => {
+ const [itemToEdit, setItemToEdit] = useState(new Item());
const [allItems, setAllItems] = useState([]);
// TODO: handle error
const updateList = () =>
@@ -38,9 +39,27 @@ const ManageItemsPage = () => {
return (
<>
- <ItemEditor heading={"Add New Item"} callback={updateList}/>
+ <ItemEditor
+ heading={"Add New Item"}
+ item={new Item()}
+ callback={updateList}/>
<hr/>
- <ItemTable refresh={updateList} items={allItems}/>
+ <ItemTable
+ refresh={updateList}
+ items={allItems}
+ setItemToEdit={setItemToEdit}/>
+
+ {JSON.stringify(itemToEdit) !== JSON.stringify(new Item()) &&
+ <div className={"floating-wrapper"}>
+ <ItemEditor
+ className={"floating-window"}
+ heading={`Edit ${itemToEdit.Name ? itemToEdit.Name : 'Item'}:`}
+ item={itemToEdit}
+ hide={() => setItemToEdit(new Item())}
+ editing={true}
+ callback={updateList}/>
+ </div>
+ }
</>
);
}
diff --git a/src/views/manage/scss/management-page.scss b/src/views/manage/scss/management-page.scss
index df26819..656d224 100644
--- a/src/views/manage/scss/management-page.scss
+++ b/src/views/manage/scss/management-page.scss
@@ -15,6 +15,10 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
+@import "../../../styles";
+
+@include floating-window;
+
hr {
margin: 0.8rem auto 1rem auto;
}