antontranelis/utopia-ui
1
0
Fork 0
mirror of https://github.com/utopia-os/utopia-ui.git synced 2025-12-13 07:46:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

change item color, image and markericon on groupe type change

Browse Source
This commit is contained in:
Anton Tranelis 2024-07-11 11:15:41 +02:00
parent 1d01d5d91f
commit ddcb4469b2
2 changed files with 44 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
src/Components/Profile/OverlayItemProfileSettings.tsx
View File

@ -26,14 +26,14 @@ import { useHasUserPermission } from '../Map/hooks/usePermissions';
export function OverlayItemProfileSettings() { export function OverlayItemProfileSettings() {
const typeMapping = [ const typeMapping = [
{value: 'kompass', label: 'Würdekompass'}, { value: 'wuerdekompass', label: 'Regional-Gruppe' },
{value: 'themenkompass', label: 'Themenkompass-Gruppe'}, { value: 'themenkompass', label: 'Themen-Gruppe' },
{value: 'liebevoll.jetzt', label: 'liebevoll.jetzt'} { value: 'liebevoll.jetzt', label: 'liebevoll.jetzt' }
]; ];
const statusMapping = [ const statusMapping = [
{value: 'active', label: 'aktiv'}, { value: 'active', label: 'aktiv' },
{value: 'in_planning', label: 'in Planung'}, { value: 'in_planning', label: 'in Planung' },
{value: 'paused', label: 'pausiert'} { value: 'paused', label: 'pausiert' }
]; ];
const [id, setId] = useState<string>(""); const [id, setId] = useState<string>("");
@ -45,6 +45,7 @@ export function OverlayItemProfileSettings() {
const [contact, setContact] = useState<string>(""); const [contact, setContact] = useState<string>("");
const [telephone, setTelephone] = useState<string>(""); const [telephone, setTelephone] = useState<string>("");
const [nextAppointment, setNextAppointment] = useState<string>(""); const [nextAppointment, setNextAppointment] = useState<string>("");
const [markerIcon, setMarkerIcon] = useState<string>("");
const [image, setImage] = useState<string>(""); const [image, setImage] = useState<string>("");
const [color, setColor] = useState<string>(""); const [color, setColor] = useState<string>("");
const [offers, setOffers] = useState<Array<Tag>>([]); const [offers, setOffers] = useState<Array<Tag>>([]);
@ -70,6 +71,34 @@ export function OverlayItemProfileSettings() {
const hasUserPermission = useHasUserPermission(); const hasUserPermission = useHasUserPermission();
const getItemTags = useGetItemTags(); const getItemTags = useGetItemTags();
useEffect(() => {
switch (groupType) {
case "wuerdekompass":
setColor("#DF4D39");
setMarkerIcon("group");
setImage("88930921-6076-4bdf-a5b2-241d6e7bc875")
break;
case "themenkompass":
setColor("#26A269");
setMarkerIcon("group");
setImage("88930921-6076-4bdf-a5b2-241d6e7bc875")
break;
case "liebevoll.jetzt":
setColor("#E8B620");
setMarkerIcon("liebevoll.jetzt");
setImage("e735b96c-507b-471c-8317-386ece0ca51d")
break;
default:
break;
}
}, [groupType])
const items = useItems(); const items = useItems();
@ -122,6 +151,7 @@ export function OverlayItemProfileSettings() {
setTelephone(item?.telephone || ""); setTelephone(item?.telephone || "");
setNextAppointment(item?.next_appointment || ""); setNextAppointment(item?.next_appointment || "");
setImage(item?.image ? item?.image : ""); setImage(item?.image ? item?.image : "");
setMarkerIcon(item?.marker_icon ? item.marker_icon : "");
setOffers([]); setOffers([]);
setNeeds([]); setNeeds([]);
setRelations([]); setRelations([]);
@ -175,6 +205,7 @@ export function OverlayItemProfileSettings() {
position: item.position, position: item.position,
contact: contact, contact: contact,
telephone: telephone, telephone: telephone,
markerIcon: markerIcon,
next_appointment: nextAppointment, next_appointment: nextAppointment,
...image.length > 10 && { image: image }, ...image.length > 10 && { image: image },
...offers.length > 0 && { offers: offer_updates }, ...offers.length > 0 && { offers: offer_updates },
@ -286,10 +317,10 @@ export function OverlayItemProfileSettings() {
} }
useEffect(() => { useEffect(() => {
console.log(item); console.log(item);
}, [item]) }, [item])
@ -381,7 +412,7 @@ export function OverlayItemProfileSettings() {
</div> </div>
)} )}
{!item.layer?.itemType.onepager && {!item.layer?.itemType.onepager &&
<div role="tablist" className="tw-tabs tw-tabs-lifted tw-mt-4"> <div role="tablist" className="tw-tabs tw-tabs-lifted tw-mt-4">

4
src/types.ts
View File

@ -7,7 +7,9 @@ export interface UtopiaMapProps {
zoom?: number, zoom?: number,
tags?: Tag[], tags?: Tag[],
children?: React.ReactNode, children?: React.ReactNode,
geo?: any geo?: any,
showFilterControl?: boolean,
showLayerControl?: boolean
} }
export interface LayerProps { export interface LayerProps {