Skip to content

Commit

Permalink
Update Downloading History to add Dimension Name
Browse files Browse the repository at this point in the history
  • Loading branch information
ccxzhang committed Aug 26, 2024
1 parent dc85ab5 commit b3876e7
Show file tree
Hide file tree
Showing 3 changed files with 117 additions and 72 deletions.
44 changes: 40 additions & 4 deletions src/renderer/src/output.css
Original file line number Diff line number Diff line change
Expand Up @@ -608,10 +608,18 @@ html {
position: relative;
}

.sticky {
position: sticky;
}

.inset-0 {
inset: 0px;
}

.left-0 {
left: 0px;
}

.right-0 {
right: 0px;
}
Expand Down Expand Up @@ -821,6 +829,10 @@ html {
flex-grow: 1;
}

.table-auto {
table-layout: auto;
}

.transform {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
Expand Down Expand Up @@ -923,6 +935,10 @@ html {
white-space: normal;
}

.whitespace-nowrap {
white-space: nowrap;
}

.whitespace-pre-wrap {
white-space: pre-wrap;
}
Expand Down Expand Up @@ -969,10 +985,6 @@ html {
border-bottom-width: 1px;
}

.border-b-2 {
border-bottom-width: 2px;
}

.border-r {
border-right-width: 1px;
}
Expand Down Expand Up @@ -1091,6 +1103,10 @@ html {
--tw-bg-opacity: 0.75;
}

.p-1 {
padding: 0.25rem;
}

.p-2 {
padding: 0.5rem;
}
Expand Down Expand Up @@ -1286,6 +1302,16 @@ html {
color: rgb(17 24 39 / var(--tw-text-opacity));
}

.text-green-600 {
--tw-text-opacity: 1;
color: rgb(22 163 74 / var(--tw-text-opacity));
}

.text-purple-600 {
--tw-text-opacity: 1;
color: rgb(147 51 234 / var(--tw-text-opacity));
}

.text-red-500 {
--tw-text-opacity: 1;
color: rgb(239 68 68 / var(--tw-text-opacity));
Expand Down Expand Up @@ -1439,6 +1465,16 @@ html {
color: rgb(209 213 219 / var(--tw-text-opacity));
}

.hover\:text-green-800:hover {
--tw-text-opacity: 1;
color: rgb(22 101 52 / var(--tw-text-opacity));
}

.hover\:text-purple-800:hover {
--tw-text-opacity: 1;
color: rgb(107 33 168 / var(--tw-text-opacity));
}

.hover\:underline:hover {
text-decoration-line: underline;
}
Expand Down
144 changes: 76 additions & 68 deletions src/renderer/src/pages/DownloadHistory/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -279,80 +279,88 @@ const HistoryPage = ({ dictionaryDb, queryDb }) => {
{/* Table Component */}
<div className="overflow-x-auto px-4">
<form onSubmit={handleSaveNotes}>
<table className="w-full max-w-4xl mx-auto bg-white rounded-lg shadow-lg">
<thead>
<tr className="bg-gray-100 text-gray-800 uppercase text-sm leading-normal">
<th className="py-3 px-3 border-b-2 border-gray-300">
<input
type="checkbox"
className="form-checkbox h-4 w-4 text-gray-600 transition duration-150 ease-in-out"
checked={selectedRows.length === downloadQueries.length}
onChange={handleSelectAllChange}
/>
</th>

{queryHeaders.map((name, index) => (
<th key={index} className="py-2 px-2 border-b-2 border-gray-300">
{name}
</th>
))}
</tr>
</thead>
<tbody className="text-gray-800 text-xs font-light">
{currentPageData.map((el) => (
<tr key={el.id} className="hover:bg-gray-50">
<td className="py-2 px-3 border-b border-gray-300">
<div className="w-full bg-white rounded-lg shadow-lg">
<table className="w-full table-auto">
<thead>
<tr className="bg-gray-100 text-gray-800 uppercase text-sm leading-normal">
<th className="py-3 px-3 sticky left-0 z-10 bg-gray-100">
<input
type="checkbox"
className="form-checkbox h-4 w-4 text-gray-600 transition duration-150 ease-in-out"
checked={selectedRows.includes(el.id)}
onChange={() => handleCheckboxChange(el.id)}
checked={selectedRows.length === downloadQueries.length}
onChange={handleSelectAllChange}
/>
<td className="py-3 text-left">
<button type="button" onClick={() => handleEditClick(el.id, el.notes)}>
Edit
</button>
{editedRow.rowId === el.id && (
<>
<button type="submit">Save</button>
<button type="button" onClick={() => handlePassParams(el.id)}>
Pass
</button>
</>
)}
</td>
</td>

{queryHeaders.map((header) => (
<td
key={header}
className="py-2 px-2 border-b border-gray-300 [word-break:break-word]"
>
{editedRow.rowId === el.id && header === 'notes' ? (
<input
type="text"
name={header}
value={temporaryNote}
onChange={handleNoteChange}
/>
) : header === 'url' ? (
<a
href={el[header]}
className="text-blue-500 hover:text-blue-600"
target="_blank"
rel="noopener noreferrer"
>
{el[header]}
</a>
) : (
el[header]
)}
</td>
</th>
{queryHeaders.map((name, index) => (
<th key={index} className="py-2 px-2 whitespace-nowrap">
{name}
</th>
))}
</tr>
))}
</tbody>
</table>
</thead>
<tbody className="text-gray-800 text-xs font-light">
{currentPageData.map((el) => (
<tr key={el.id} className="hover:bg-gray-50">
<td className="py-2 px-3 sticky left-0 z-10 bg-white">
<input
type="checkbox"
className="form-checkbox h-4 w-4 text-gray-600 transition duration-150 ease-in-out"
checked={selectedRows.includes(el.id)}
onChange={() => handleCheckboxChange(el.id)}
/>
<div className="flex space-x-2 mt-1">
<button
type="button"
onClick={() => handleEditClick(el.id, el.notes)}
className="text-blue-600 hover:text-blue-800"
>
Edit
</button>
{editedRow.rowId === el.id && (
<>
<button type="submit" className="text-green-600 hover:text-green-800">
Save
</button>
<button
type="button"
onClick={() => handlePassParams(el.id)}
className="text-purple-600 hover:text-purple-800"
>
Pass
</button>
</>
)}
</div>
</td>
{queryHeaders.map((header) => (
<td key={header} className="py-2 px-2 [word-break:break-word]">
{editedRow.rowId === el.id && header === 'notes' ? (
<input
type="text"
name={header}
value={temporaryNote}
onChange={handleNoteChange}
className="w-full p-1 border rounded"
/>
) : header === 'url' ? (
<a
href={el[header]}
className="text-blue-500 hover:text-blue-600"
target="_blank"
rel="noopener noreferrer"
>
{el[header]}
</a>
) : (
el[header]
)}
</td>
))}
</tr>
))}
</tbody>
</table>
</div>
</form>
<Pagination
currentPage={currentPage}
Expand Down
1 change: 1 addition & 0 deletions src/renderer/src/service/db.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ export const queryHeaders = [
'organizationLevel',
'period',
'dimension',
'dimensionName',
'disaggregation',
'url'
]
Expand Down

0 comments on commit b3876e7

Please sign in to comment.