mirror of
https://github.com/wanderer-industries/wanderer
synced 2025-12-12 02:35:42 +00:00
fix: change structure tooltip to avoid paste confusion (#125)
* fix: change structure tooltip to avoid paste confusion * fix: clarify use of evetime and use primereact calendar
This commit is contained in:
@@ -79,14 +79,14 @@ export const SystemStructures: React.FC = () => {
|
|||||||
content: (
|
content: (
|
||||||
<div className="flex flex-col gap-1">
|
<div className="flex flex-col gap-1">
|
||||||
<InfoDrawer title={<b className="text-slate-50">How to add/update structures?</b>}>
|
<InfoDrawer title={<b className="text-slate-50">How to add/update structures?</b>}>
|
||||||
In game, select one or more structures in D-Scan and press Ctrl+C,
|
In game, select one or more structures in D-Scan and then
|
||||||
<br />
|
<br />
|
||||||
then click on this widget and press Ctrl+V
|
use the blue add structure data button
|
||||||
</InfoDrawer>
|
</InfoDrawer>
|
||||||
<InfoDrawer title={<b className="text-slate-50">How to add a timer?</b>}>
|
<InfoDrawer title={<b className="text-slate-50">How to add a timer?</b>}>
|
||||||
In game, select a structure with an active timer, right click to copy, and then use the
|
In game, select a structure with an active timer, right click to copy, and then
|
||||||
<span className="text-blue-500"> blue </span>
|
<span className="text-blue-500"> blue </span>
|
||||||
add timer button
|
use the blue add structure data button
|
||||||
</InfoDrawer>
|
</InfoDrawer>
|
||||||
</div>
|
</div>
|
||||||
),
|
),
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ import React, { useEffect, useState, useCallback } from 'react';
|
|||||||
import { Dialog } from 'primereact/dialog';
|
import { Dialog } from 'primereact/dialog';
|
||||||
import { Button } from 'primereact/button';
|
import { Button } from 'primereact/button';
|
||||||
import { AutoComplete } from 'primereact/autocomplete';
|
import { AutoComplete } from 'primereact/autocomplete';
|
||||||
|
import { Calendar } from 'primereact/calendar';
|
||||||
import clsx from 'clsx';
|
import clsx from 'clsx';
|
||||||
|
|
||||||
import { StructureItem, StructureStatus, statusesRequiringTimer, formatToISO } from '../helpers';
|
import { StructureItem, StructureStatus, statusesRequiringTimer, formatToISO } from '../helpers';
|
||||||
@@ -53,7 +54,9 @@ export const SystemStructuresDialog: React.FC<StructuresEditDialogProps> = ({
|
|||||||
|
|
||||||
// If user typed more text but we have partial match in prevResults
|
// If user typed more text but we have partial match in prevResults
|
||||||
if (newQuery.startsWith(prevQuery) && prevResults.length > 0) {
|
if (newQuery.startsWith(prevQuery) && prevResults.length > 0) {
|
||||||
const filtered = prevResults.filter(item => item.label.toLowerCase().includes(newQuery.toLowerCase()));
|
const filtered = prevResults.filter(item =>
|
||||||
|
item.label.toLowerCase().includes(newQuery.toLowerCase()),
|
||||||
|
);
|
||||||
setOwnerSuggestions(filtered);
|
setOwnerSuggestions(filtered);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@@ -74,12 +77,18 @@ export const SystemStructuresDialog: React.FC<StructuresEditDialogProps> = ({
|
|||||||
[prevQuery, prevResults, outCommand],
|
[prevQuery, prevResults, outCommand],
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleChange = (field: keyof StructureItem, val: string) => {
|
const handleChange = (field: keyof StructureItem, val: string | Date) => {
|
||||||
// If we want to forbid changing structureTypeId or structureType from the dialog, do so here:
|
// If we want to forbid changing structureTypeId or structureType from the dialog, do so here:
|
||||||
if (field === 'structureTypeId' || field === 'structureType') return;
|
if (field === 'structureTypeId' || field === 'structureType') return;
|
||||||
|
|
||||||
setEditData(prev => {
|
setEditData(prev => {
|
||||||
if (!prev) return null;
|
if (!prev) return null;
|
||||||
|
|
||||||
|
// If this is the endTime (Date from Calendar), we store as ISO or string:
|
||||||
|
if (field === 'endTime' && val instanceof Date) {
|
||||||
|
return { ...prev, endTime: val.toISOString() };
|
||||||
|
}
|
||||||
|
|
||||||
return { ...prev, [field]: val };
|
return { ...prev, [field]: val };
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
@@ -87,7 +96,9 @@ export const SystemStructuresDialog: React.FC<StructuresEditDialogProps> = ({
|
|||||||
// when user picks a corp from auto-complete
|
// when user picks a corp from auto-complete
|
||||||
const handleSelectOwner = (selected: { label: string; value: string }) => {
|
const handleSelectOwner = (selected: { label: string; value: string }) => {
|
||||||
setOwnerInput(selected.label);
|
setOwnerInput(selected.label);
|
||||||
setEditData(prev => (prev ? { ...prev, ownerName: selected.label, ownerId: selected.value } : null));
|
setEditData(prev =>
|
||||||
|
prev ? { ...prev, ownerName: selected.label, ownerId: selected.value } : null,
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleStatusChange = (val: string) => {
|
const handleStatusChange = (val: string) => {
|
||||||
@@ -107,7 +118,7 @@ export const SystemStructuresDialog: React.FC<StructuresEditDialogProps> = ({
|
|||||||
if (!statusesRequiringTimer.includes(editData.status)) {
|
if (!statusesRequiringTimer.includes(editData.status)) {
|
||||||
editData.endTime = '';
|
editData.endTime = '';
|
||||||
} else if (editData.endTime) {
|
} else if (editData.endTime) {
|
||||||
// convert to full ISO
|
// convert to full ISO if not already
|
||||||
editData.endTime = formatToISO(editData.endTime);
|
editData.endTime = formatToISO(editData.endTime);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -146,7 +157,11 @@ export const SystemStructuresDialog: React.FC<StructuresEditDialogProps> = ({
|
|||||||
<div className="flex flex-col gap-2 text-[14px]">
|
<div className="flex flex-col gap-2 text-[14px]">
|
||||||
<label className="grid grid-cols-[100px_250px_1fr] gap-2 items-center">
|
<label className="grid grid-cols-[100px_250px_1fr] gap-2 items-center">
|
||||||
<span>Type:</span>
|
<span>Type:</span>
|
||||||
<input readOnly className="p-inputtext p-component cursor-not-allowed" value={editData.structureType ?? ''} />
|
<input
|
||||||
|
readOnly
|
||||||
|
className="p-inputtext p-component cursor-not-allowed"
|
||||||
|
value={editData.structureType ?? ''}
|
||||||
|
/>
|
||||||
</label>
|
</label>
|
||||||
<label className="grid grid-cols-[100px_250px_1fr] gap-2 items-center">
|
<label className="grid grid-cols-[100px_250px_1fr] gap-2 items-center">
|
||||||
<span>Name:</span>
|
<span>Name:</span>
|
||||||
@@ -186,17 +201,21 @@ export const SystemStructuresDialog: React.FC<StructuresEditDialogProps> = ({
|
|||||||
<option value="Reinforced">Reinforced</option>
|
<option value="Reinforced">Reinforced</option>
|
||||||
</select>
|
</select>
|
||||||
</label>
|
</label>
|
||||||
|
|
||||||
{statusesRequiringTimer.includes(editData.status) && (
|
{statusesRequiringTimer.includes(editData.status) && (
|
||||||
<label className="grid grid-cols-[100px_250px_1fr] gap-2 items-center">
|
<label className="grid grid-cols-[100px_250px_1fr] gap-2 items-center">
|
||||||
<span>End Time:</span>
|
<span>Timer <br /> (Eve Time):</span>
|
||||||
<input
|
<Calendar
|
||||||
type="datetime-local"
|
value={editData.endTime ? new Date(editData.endTime) : undefined}
|
||||||
className="p-inputtext p-component"
|
onChange={(e) => handleChange('endTime', e.value ?? '')}
|
||||||
value={editData.endTime ? editData.endTime.replace('Z', '').slice(0, 16) : ''}
|
showTime
|
||||||
onChange={e => handleChange('endTime', e.target.value)}
|
hourFormat="24"
|
||||||
|
dateFormat="yy-mm-dd"
|
||||||
|
showIcon
|
||||||
/>
|
/>
|
||||||
</label>
|
</label>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<label className="grid grid-cols-[100px_1fr] gap-2 items-start mt-2">
|
<label className="grid grid-cols-[100px_1fr] gap-2 items-start mt-2">
|
||||||
<span className="mt-1">Notes:</span>
|
<span className="mt-1">Notes:</span>
|
||||||
<textarea
|
<textarea
|
||||||
|
|||||||
Reference in New Issue
Block a user