Files
jikimo_sf/web_map/static/src/map_view/map_renderer.xml
2023-04-14 17:42:23 +08:00

218 lines
10 KiB
XML

<?xml version ="1.0" encoding="UTF-8"?>
<templates id="template" xml:space="preserve">
<t t-name="web_map.MapRenderer" owl="1">
<div class="o-map-renderer row g-0">
<t t-if="props.model.data.routingError">
<t t-call="web_map.MapRenderer.RountingUnavailable"/>
</t>
<t t-elif="props.model.metaData.routing and !props.model.data.useMapBoxAPI">
<t t-call="web_map.MapRenderer.NoMapToken"/>
</t>
<t t-if="props.model.data.fetchingCoordinates">
<t t-call="web_map.MapRenderer.FetchingCoordinates"/>
</t>
<div class="o-map-renderer--container col-md-12 col-lg-10" t-ref="mapContainer"/>
<t t-call="web_map.MapRenderer.PinListContainer"/>
</div>
</t>
<t t-name="web_map.MapRenderer.FetchingCoordinates" owl="1">
<div class="alert alert-info col-md-12 col-lg-10 pe-5 ps-5 mb-0 text-center o-map-renderer--alert" role="status">
<i class="fa fa-spin fa-circle-o-notch"/> Locating new addresses...
</div>
</t>
<t t-name="web_map.MapRenderer.NoMapToken" owl="1">
<div class="alert alert-info alert-dismissible col-md-12 col-lg-10 pe-5 ps-5 mb-0 text-center o-map-renderer--alert" role="status">
To get routing on your map, you first need to setup your Mapbox token.
<a href="/web#action=base_setup.action_general_configuration" class="ml8">
<i class="fa fa-arrow-right"/>
Set up token
</a>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
</t>
<t t-name="web_map.MapRenderer.PinListContainer" owl="1">
<div class="o-map-renderer--pin-list-container d-none d-lg-block col-2 bg-view border-start cursor-default">
<t t-if="!props.model.metaData.hideTitle">
<div class="o-map-renderer--pin-list-header o_pin_list_header">
<header>
<i class="fa fa-list text-odoo"/>
<span class="fs-6 fw-bold" t-out="props.model.metaData.panelTitle"/>
</header>
</div>
</t>
<t t-if="props.model.data.isGrouped">
<t t-foreach="props.model.data.recordGroups" t-as="groupId" t-key="groupId">
<div class="o-map-renderer--pin-list-group">
<t t-set="group" t-value="props.model.data.recordGroups[groupId]"/>
<div class="o-map-renderer--pin-list-group-header" t-on-click="() => this.toggleGroup(groupId)">
<i t-attf-class="fa fa-caret-{{ state.closedGroupIds.includes(groupId) ? 'right' : 'down' }}"/>
<span t-att-style="'color:' + getGroupColor(groupId)">
<t t-call="web_map.pinSVG">
<t t-set="numbering" t-value="props.model.metaData.numbering" />
</t>
</span>
<t t-if="group.name" t-esc="group.name"/>
<t t-else="">Undefined</t>
</div>
<t t-if="!state.closedGroupIds.includes(groupId)">
<t t-call="web_map.MapRenderer.PinList">
<t t-set="records" t-value="group.records"/>
</t>
</t>
</div>
</t>
</t>
<t t-else="">
<t t-call="web_map.MapRenderer.PinList">
<t t-set="records" t-value="props.model.data.records"/>
</t>
</t>
</div>
</t>
<t t-name="web_map.MapRenderer.PinList" owl="1">
<t t-tag="props.model.metaData.numbering ? 'ol' : 'ul'" class="o-map-renderer--pin-list-details">
<t t-call="web_map.MapRenderer.PinListItems"/>
</t>
</t>
<t t-name="web_map.MapRenderer.PinListItems" owl="1">
<t t-foreach="records" t-as="record" t-key="record.id">
<t t-set="latitude" t-value="record.partner and record.partner.partner_latitude"/>
<t t-set="longitude" t-value="record.partner and record.partner.partner_longitude"/>
<li t-att-class="{'o-map-renderer--pin-located': latitude and longitude}" t-att-title="(!latitude or !longitude) and 'Could not locate'">
<a t-if="latitude and longitude" href="" t-on-click.prevent="() => this.centerAndOpenPin(record)">
<t t-esc="record.display_name"/>
</a>
<t t-else="">
<span class="text-muted" t-esc="record.display_name"/>
<span class="float-end" t-if="record.partner and record.partner.fetchingCoordinate">
<i class="fa fa-spin fa-circle-o-notch"/>
</span>
</t>
</li>
</t>
</t>
<t t-name="web_map.MapRenderer.RountingUnavailable" owl="1">
<div class="alert alert-warning alert-dismissible col-md-12 col-lg-10 pe-5 ps-5 mb-0 text-center o-map-renderer--alert" role="status">
<strong>Unsuccessful routing request: </strong>
<t t-esc="props.model.data.routingError"/>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
</t>
<t t-name="web_map.marker" owl="1">
<div t-att-style="color and ('color:' + color)">
<t t-call="web_map.pinSVG" />
<t t-if="numbering" t-call="web_map.markerNumber"/>
<t t-elif="isMulti" t-call="web_map.markerBadge"/>
</div>
</t>
<t t-name="web_map.markerBadge" owl="1">
<span class="badge text-bg-danger rounded-pill o-map-renderer--marker-badge" t-att-style="color and `background-color: ${color} !important`">
<t t-esc="count"/>
</span>
</t>
<t t-name="web_map.markerNumber" owl="1">
<p class="o-map-renderer--marker-number">
<t t-esc="number"/>
<t t-if="count gt 1">
<t t-call="web_map.markerBadge"/>
</t>
</p>
</t>
<t t-name="web_map.markerPopup" owl="1">
<div>
<table class="o-map-renderer--popup-table">
<thead>
<tr>
<th colspan="2"></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr t-foreach="fields" t-as="field" t-key="field.id">
<td class="o-map-renderer--popup-table-content-name">
<t t-esc="field.string"/>
</td>
<td class="o-map-renderer--popup-table-space"></td>
<td class="o-map-renderer--popup-table-content-value">
<t t-esc="field.value"/>
</td>
</tr>
</tbody>
</table>
<div class="o-map-renderer--popup-buttons mt8">
<t t-if="hasFormView">
<button class="btn btn-primary o-map-renderer--popup-buttons-open">
open
</button>
</t>
<div class="o-map-renderer--popup-buttons-divider"/>
<a class="btn btn-primary text-white" t-att-href="url" target="_blank">
navigate to
</a>
</div>
</div>
</t>
<t t-name="web_map.pinSVG" owl="1">
<t t-if="numbering">
<t t-call="web_map.pinNoCircleSVG" />
</t>
<t t-else="">
<t t-call="web_map.pinCircleSVG" />
</t>
</t>
<t t-name="web_map.pinCircleSVG" owl="1">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 60 78.6" style="enable-background:new 0 0 60 78.6;" xml:space="preserve">
<style type="text/css">
.st0{opacity:0.3;enable-background:new;}
.st1{fill:currentColor;stroke:#1A1919;stroke-width:3;stroke-miterlimit:10;}
</style>
<g>
<g id="Layer_2_1_">
<g id="Layer_1-2">
<path class="st0" d="M32.5,4C17.3,4,5,16.3,5,31.5c0,18.2,23.4,44.6,24.4,45.7c1.5,1.7,4.1,1.8,5.8,0.3c0.1-0.1,0.2-0.2,0.3-0.3
c1-1.1,24.4-27.4,24.4-45.7C60,16.3,47.7,4,32.5,4z M32.5,42.4c-6.3,0-11.4-5.1-11.4-11.5s5.1-11.5,11.5-11.5S44,24.6,44,31v0
C43.9,37.3,38.8,42.4,32.5,42.4z"/>
<path class="st1" d="M28.8,1.8c-14.9,0-27,12.1-27.1,27.1c0,18.5,24.2,45.7,25.3,46.9c0.9,1,2.4,1.1,3.4,0.2
c0.1-0.1,0.1-0.1,0.2-0.2c1-1.1,25.3-28.3,25.3-46.9C55.9,13.9,43.7,1.8,28.8,1.8z M28.8,40.3c-6.3,0-11.5-5.1-11.5-11.4
s5.1-11.5,11.4-11.5s11.5,5.1,11.5,11.4v0C40.2,35.2,35.1,40.3,28.8,40.3z"/>
</g>
</g>
</g>
</svg>
</t>
<t t-name="web_map.pinNoCircleSVG" owl="1">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 61 78.9" style="enable-background:new 0 0 61 78.9;" xml:space="preserve">
<style type="text/css">
.st0{opacity:0.3;enable-background:new;}
.st1{fill:currentColor;stroke:#1A1919;stroke-width:3;stroke-miterlimit:10;}
</style>
<g>
<g id="Layer_2_1_">
<g id="Layer_1-2">
<path class="st0" d="M33.5,4C18.3,4,6,16.3,6,31.5c0,18.2,23.4,44.6,24.4,45.7c1.5,1.7,4.1,1.8,5.8,0.3c0.1-0.1,0.2-0.2,0.3-0.3
c1-1.1,24.4-27.4,24.4-45.7C61,16.3,48.7,4,33.5,4z"/>
<path class="st1" d="M28.7,1.7c-14.9,0-27,12.1-27.1,27.1c0,18.5,24.2,45.7,25.3,46.9c0.9,1,2.4,1.1,3.4,0.2
c0.1-0.1,0.1-0.1,0.2-0.2c1-1.1,25.3-28.3,25.3-46.9C55.8,13.8,43.6,1.7,28.7,1.7z"/>
</g>
</g>
</g>
</svg>
</t>
</templates>