Improving infos.tsx
This commit is contained in:
parent
ee000862f8
commit
3153ee308d
|
@ -1,4 +1,4 @@
|
|||
import { Grid, IconButton } from '@suid/material';
|
||||
import { Button, Grid, IconButton } from '@suid/material';
|
||||
import { Feature } from 'ol';
|
||||
import { Geometry } from 'ol/geom';
|
||||
import { getLength } from 'ol/sphere';
|
||||
|
@ -6,6 +6,9 @@ import { Component, createSignal, For, Show } from 'solid-js';
|
|||
import { useI18n } from '@solid-primitives/i18n';
|
||||
import EditIcon from '@suid/icons-material/Edit';
|
||||
import TravelExploreIcon from '@suid/icons-material/TravelExplore';
|
||||
import AddLocationAltIcon from '@suid/icons-material/AddLocationAlt';
|
||||
import OpenInNewIcon from '@suid/icons-material/OpenInNew';
|
||||
import CallIcon from '@suid/icons-material/Call';
|
||||
import { Paper, Stack } from '@suid/material';
|
||||
import styled from '@suid/material/styles/styled';
|
||||
import Dialog from '../dialog';
|
||||
|
@ -171,13 +174,17 @@ const Infos: Component<{}> = (props) => {
|
|||
${feature.get('name') || ''}`}
|
||||
</div>
|
||||
<div>
|
||||
<IconButton>
|
||||
<AddLocationAltIcon />
|
||||
</IconButton>
|
||||
<IconButton
|
||||
onClick={async () => {
|
||||
await Browser.open({
|
||||
url: `https://www.qwant.com/?q=${encodeURIComponent(`${feature.get(
|
||||
'class'
|
||||
)}
|
||||
${feature.get('name') || ''}`)}&t=web`,
|
||||
url: `https://www.qwant.com/?q=${encodeURIComponent(
|
||||
feature.get('class') +
|
||||
' ' +
|
||||
feature.get('name') || ''
|
||||
)}&t=web`,
|
||||
});
|
||||
}}
|
||||
>
|
||||
|
@ -196,9 +203,42 @@ const Infos: Component<{}> = (props) => {
|
|||
</>
|
||||
<For each={Object.keys(feature.getProperties())}>
|
||||
{(key: string) => (
|
||||
<div>{`${key}: ${
|
||||
<div>
|
||||
<Show
|
||||
when={key === 'website'}
|
||||
fallback={
|
||||
<Show
|
||||
when={key === 'phone'}
|
||||
fallback={`${key}: ${
|
||||
feature.getProperties()[key]
|
||||
}`}</div>
|
||||
}`}
|
||||
>
|
||||
<Button
|
||||
size='small'
|
||||
startIcon={<CallIcon />}
|
||||
href={
|
||||
'tel:' +
|
||||
feature.getProperties()[key]
|
||||
}
|
||||
>
|
||||
{feature.getProperties()[key]}
|
||||
</Button>
|
||||
</Show>
|
||||
}
|
||||
>
|
||||
<Button
|
||||
size='small'
|
||||
startIcon={<OpenInNewIcon />}
|
||||
onClick={async () => {
|
||||
await Browser.open({
|
||||
url: feature.getProperties()[key],
|
||||
});
|
||||
}}
|
||||
>
|
||||
{feature.getProperties()[key]}
|
||||
</Button>
|
||||
</Show>
|
||||
</div>
|
||||
)}
|
||||
</For>
|
||||
</>
|
||||
|
|
Loading…
Reference in New Issue