admin/BlockchainUI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Naming fix

Browse Source
This commit is contained in:
DwCay
2022-05-26 22:34:07 +03:00
parent e6142b1402
commit 5fca3bdc4e
7 changed files with 46 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/pages/digitalId/Validate.jsx
View File

@@ -5,7 +5,6 @@ import Header from '../../partials/Header';
import ValidateTable from "../../partials/validate/ValidateTable"; import ValidateTable from "../../partials/validate/ValidateTable";
import ValidatePanel from "../../partials/validate/ValidatePanel"; import ValidatePanel from "../../partials/validate/ValidatePanel";
import ValidateRoadMap from "../../partials/validationlog/ValidateRoadMap"; import ValidateRoadMap from "../../partials/validationlog/ValidateRoadMap";
import {TransactionID} from "../../utils/TransactionID";
import {Link} from "react-router-dom"; import {Link} from "react-router-dom";
import User06 from "../../images/user-28-06.jpg"; import User06 from "../../images/user-28-06.jpg";
import User08 from "../../images/user-28-08.jpg"; import User08 from "../../images/user-28-08.jpg";
@@ -20,7 +19,7 @@ function Validate () {
{ {
id: '40', id: '40',
name: 'Today', name: 'Today',
transid: TransactionID(), data: '7234ABC342342352345',
usersImges: [ usersImges: [
{ {
img: User06, img: User06,
@@ -41,21 +40,21 @@ function Validate () {
], ],
items: [ items: [
{ {
seasonId: TransactionID(), dataSeason: '7234ABC342342352345',
id: '555', id: '555',
trunsText: 'Second name for', text: 'Second name for',
checked: true checked: true
}, },
{ {
seasonId: TransactionID(), dataSeason: '7234ABC342342352345',
id: '534', id: '534',
trunsText: 'Gender name for', text: 'Gender name for',
checked: true checked: true
}, },
{ {
seasonId: TransactionID(), dataSeason: '7234ABC342342352345',
id: '567', id: '567',
trunsText: 'Document ID name for', text: 'Document ID name for',
checked: true checked: true
}, },
] ]
@@ -110,7 +109,7 @@ function Validate () {
<h1 className="text-2xl md:text-3xl text-slate-800 font-bold">Digiatl ID validation log ✨</h1> <h1 className="text-2xl md:text-3xl text-slate-800 font-bold">Digiatl ID validation log ✨</h1>
</div> </div>
{validateItems.map(item => { {validateItems.map(item => {
return <ValidateRoadMap trunsSeason={item} key={item.id}/> return <ValidateRoadMap season={item} key={item.id}/>
})} })}
</div> </div>
</div> </div>

31
src/pages/digitalId/ValidationLog.jsx
View File

@@ -9,7 +9,6 @@ import User09 from "../../images/user-28-09.jpg";
import User06 from "../../images/user-28-06.jpg"; import User06 from "../../images/user-28-06.jpg";
import User03 from "../../images/user-28-03.jpg"; import User03 from "../../images/user-28-03.jpg";
import User01 from "../../images/user-28-01.jpg"; import User01 from "../../images/user-28-01.jpg";
import {TransactionID} from "../../utils/TransactionID";
function ValidationLog () { function ValidationLog () {
const [sidebarOpen, setSidebarOpen] = useState(false); const [sidebarOpen, setSidebarOpen] = useState(false);
@@ -18,7 +17,7 @@ function ValidationLog () {
{ {
id: '20', id: '20',
name: 'Today', name: 'Today',
transid: TransactionID(), data: '7234ABC342342352345',
usersImges: [ usersImges: [
{ {
img: User06, img: User06,
@@ -39,21 +38,21 @@ function ValidationLog () {
], ],
items: [ items: [
{ {
seasonId: TransactionID(), dataSeason: '7234ABC342342352345',
id: '434', id: '434',
trunsText: 'Second name', text: 'Second name',
checked: true checked: true
}, },
{ {
seasonId: TransactionID(), dataSeason: '7234ABC342342352345',
id: '476', id: '476',
trunsText: 'First name by', text: 'First name by',
checked: true checked: true
}, },
{ {
seasonId: TransactionID(), dataSeason: '7234ABC342342352345',
id: '422', id: '422',
trunsText: 'Document name by', text: 'Document name by',
checked: true checked: true
}, },
] ]
@@ -61,7 +60,7 @@ function ValidationLog () {
{ {
id: '30', id: '30',
name: 'Last Week', name: 'Last Week',
transid: TransactionID(), data: '7234ABC342342352345',
usersImges: [ usersImges: [
{ {
img: User06, img: User06,
@@ -82,21 +81,21 @@ function ValidationLog () {
], ],
items: [ items: [
{ {
seasonId: TransactionID(), dataSeason: '7234ABC342342352345',
id: '654', id: '654',
trunsText: 'Gender name by', text: 'Gender name by',
checked: true checked: true
}, },
{ {
seasonId: TransactionID(), dataSeason: '7234ABC342342352345',
id: '617', id: '617',
trunsText: 'Second name Updated', text: 'Second name Updated',
checked: false checked: false
}, },
{ {
seasonId: TransactionID(), dataSeason: '7234ABC342342352345',
id: '643', id: '643',
trunsText: 'Gender name by', text: 'Gender name by',
checked: true checked: true
}, },
] ]
@@ -126,7 +125,7 @@ function ValidationLog () {
<div className="xl:-translate-x-16 max-w-fit"> <div className="xl:-translate-x-16 max-w-fit">
{/* PostsID */} {/* PostsID */}
{logItems.map(item => { {logItems.map(item => {
return <ValidateRoadMap trunsSeason={item} key={item.id} /> return <ValidateRoadMap season={item} key={item.id} />
})} })}
{/* Post */} {/* Post */}
<article className="pt-6"> <article className="pt-6">

7
src/partials/validate/ValidateItem.jsx
View File

@@ -13,8 +13,13 @@ function ValidateTableItem(props) {
} }
}; };
function openValidatePanel (event) {
event.stopPropagation()
props.setValidatePanelOpen(true)
}
return ( return (
<tr className="hover:bg-[#E2E8F0] cursor-pointer" onClick={(e) => { e.stopPropagation(); props.setValidatePanelOpen(true); }}> <tr className="hover:bg-[#E2E8F0] cursor-pointer" onClick={(e) => openValidatePanel(e)}>
<td className="px-2 first:pl-5 last:pr-5 py-3 whitespace-nowrap w-px"> <td className="px-2 first:pl-5 last:pr-5 py-3 whitespace-nowrap w-px">
<div className="flex items-center"> <div className="flex items-center">
<label className="inline-flex"> <label className="inline-flex">

18
src/partials/validate/ValidateTable.jsx
View File

@@ -49,28 +49,28 @@ function ValidateTable({
]; ];
const [selectAll, setSelectAll] = useState(false); const [selectAll, setSelectAll] = useState(false);
const [isCheck, setIsCheck] = useState([]); const [marked, setMarked] = useState([]);
const [list, setList] = useState([]); const [selectedList, setSelectedList] = useState([]);
useEffect(() => { useEffect(() => {
setList(validateData); setSelectedList(validateData);
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, []); }, []);
const handleSelectAll = () => { const handleSelectAll = () => {
setSelectAll(!selectAll); setSelectAll(!selectAll);
setIsCheck(list.map(li => li.id)); setMarked(selectedList.map(li => li.id));
if (selectAll) { if (selectAll) {
setIsCheck([]); setMarked([]);
} }
}; };
const handleClick = e => { const handleClick = e => {
const { id, checked } = e.target; const { id, checked } = e.target;
setSelectAll(false); setSelectAll(false);
setIsCheck([...isCheck, id]); setMarked([...marked, id]);
if (!checked) { if (!checked) {
setIsCheck(isCheck.filter(item => item !== id)); setMarked(marked.filter(item => item !== id));
} }
}; };
@@ -108,7 +108,7 @@ function ValidateTable({
</thead> </thead>
{/* Table body */} {/* Table body */}
<tbody className="text-sm divide-y divide-slate-200 border-b border-slate-200"> <tbody className="text-sm divide-y divide-slate-200 border-b border-slate-200">
{list.map((data) => { {selectedList.map((data) => {
return ( return (
<ValidateTableItem <ValidateTableItem
key={data.id} key={data.id}
@@ -119,7 +119,7 @@ function ValidateTable({
seed={data.seed} seed={data.seed}
check={data.check} check={data.check}
handleClick={handleClick} handleClick={handleClick}
isChecked={isCheck.includes(data.id)} isChecked={marked.includes(data.id)}
setValidatePanelOpen={setValidatePanelOpen} setValidatePanelOpen={setValidatePanelOpen}
/> />
); );

10
src/partials/validationlog/ValidateRoadMap.jsx
View File

@@ -3,20 +3,20 @@ import React from "react";
import ValidationSeasonItem from "./ValidationSeasonItem"; import ValidationSeasonItem from "./ValidationSeasonItem";
import ValidationUsersImg from "./ValidationUsersImg"; import ValidationUsersImg from "./ValidationUsersImg";
function ValidateRoadMap({ trunsSeason }) { function ValidateRoadMap({ season }) {
return ( return (
<article className="pt-6"> <article className="pt-6">
<div className="xl:flex"> <div className="xl:flex">
<div className="w-32 shrink-0"> <div className="w-32 shrink-0">
<h2 className="text-xl leading-snug font-bold text-slate-800 xl:leading-7 mb-4 xl:mb-0">{trunsSeason.name}</h2> <h2 className="text-xl leading-snug font-bold text-slate-800 xl:leading-7 mb-4 xl:mb-0">{season.name}</h2>
</div> </div>
<div className="grow pb-6 border-b border-slate-200"> <div className="grow pb-6 border-b border-slate-200">
<header> <header>
<div className="flex flex-nowrap items-center space-x-2 mb-6"> <div className="flex flex-nowrap items-center space-x-2 mb-6">
{/* Avatars */} {/* Avatars */}
<div className="flex shrink-0 -space-x-3 -ml-px"> <div className="flex shrink-0 -space-x-3 -ml-px">
{trunsSeason.usersImges.map(pic => { {season.usersImges.map(pic => {
return <ValidationUsersImg key={pic.imgId} image={pic}/> return <ValidationUsersImg key={pic.imgId} image={pic}/>
})} })}
</div> </div>
@@ -26,8 +26,8 @@ function ValidateRoadMap({ trunsSeason }) {
{/* List */} {/* List */}
<ul className="-my-2"> <ul className="-my-2">
{/* List item(s) */} {/* List item(s) */}
{trunsSeason.items.map((item, index) => { {season.items.map((item, index) => {
return <ValidationSeasonItem key={item.id} length={trunsSeason.items.length} item={item} index={index}/> return <ValidationSeasonItem key={item.id} length={season.items.length} item={item} index={index}/>
})} })}
</ul> </ul>
</div> </div>

6
src/partials/validationlog/ValidationSeasonItem.jsx
View File

@@ -11,15 +11,15 @@ function ValidationSeasonItem({ length, item, index }) {
</svg> </svg>
</div> </div>
<h3 className="text-lg font-bold text-slate-800 pl-9"> <h3 className="text-lg font-bold text-slate-800 pl-9">
{item.trunsText} {item.checked && <a className="cursor-pointer font-bold text-indigo-500 hover:text-indigo-600 underline hover:no-underline" >{`0x${item.seasonId}`}</a>} {item.text} {item.checked && <a className="cursor-pointer font-bold text-indigo-500 hover:text-indigo-600 underline hover:no-underline" >{`0x${item.dataSeason}`}</a>}
</h3> </h3>
</div> </div>
<div className="block text-slate-800 w-fit pl-9"> <div className="block text-slate-800 w-fit pl-9">
<div className="text-base font-semibold underline mb-[-10px]">{`0x${item.seasonId}`}</div> <div className="text-base font-semibold underline mb-[-10px]">{`0x${item.dataSeason}`}</div>
<span className="font-normal text-[10px]">Transactions ID</span> <span className="font-normal text-[10px]">Transactions ID</span>
</div> </div>
<div className="mb-3.5 block text-slate-800 w-fit pl-9"> <div className="mb-3.5 block text-slate-800 w-fit pl-9">
<div className="text-base font-semibold underline mb-[-10px]">{item.seasonId}</div> <div className="text-base font-semibold underline mb-[-10px]">{item.dataSeason}</div>
<span className="font-normal text-[10px]">Validated data</span> <span className="font-normal text-[10px]">Validated data</span>
</div> </div>
<a className="cursor-pointer pl-9 font-normal text-sm text-indigo-500 hover:text-indigo-600">Explore -&gt;</a> <a className="cursor-pointer pl-9 font-normal text-sm text-indigo-500 hover:text-indigo-600">Explore -&gt;</a>

10
src/utils/TransactionID.js
View File

@@ -1,10 +0,0 @@
export var TransactionID = (function(ID){
return function () {
if(ID) {
localStorage.setItem('transID', ID)
} else {
localStorage.setItem('transID', '7234ABC342342352345')
}
return localStorage.getItem('transID')
}
})()