src/UI/WebBundle/Resources/views/Whater/public_whater_point_show.html.twig line 1

Open in your IDE?
  1. {% extends 'Common/base.html.twig' %}
  2. {% import 'Common/parts/functions.html.twig' as function %}
  4. {% block title %}{{ 'admin.whater_point.show.title'|trans }} - {{ whaterPoint.name | title }} | {{ parent() }}{% endblock %}
  5. {% block classBody %}whaterpoint {{ parent() }}{% endblock %}
  7. {% block ogTitle %}{{ 'admin.whater_point.show.title'|trans }} - {{ whaterPoint.name | title }} | {{ parent() }}{% endblock ogTitle %}
  9. {% block javascripts %}
  10. {{ parent() }}
  11. <script type="text/javascript" src="/build/theme/phoenix/assets/vendors/swiper/swiper-bundle.min.js"></script>
  12. {{ encore_entry_script_tags('rater_js') }}
  13. {{ encore_entry_script_tags('leaflet_js') }}
  14. {{ encore_entry_script_tags('select2_js') }}
  15. {{ encore_entry_script_tags('wt_whater_point_show') }}
  16. {% endblock javascripts %}
  18. {% block stylesheets %}
  19. {{ parent() }}
  20. {{ encore_entry_link_tags('select2_styles') }}
  21. {{ encore_entry_link_tags('leaflet_styles') }}
  22. {% endblock stylesheets %}
  24. {% block contents %}
  25. <div class="container-small" ng-controller="showPointCtrl">
  26. <nav class="mb-2" aria-label="breadcrumb">
  27. <ol class="breadcrumb mb-0">
  28. <li class="breadcrumb-item"><a href="{{path('web_init')}}">Inicio</a></li>
  29. <li class="breadcrumb-item">{{ whaterPoint.town.country.name | title }}</li>
  30. {% if whaterPoint.town.countryArea %}
  31. <li class="breadcrumb-item"><a href="{{ path('web_public_country_area_show_by_slug', { 'countryAreaSlug': whaterPoint.town.countryArea.slug})}}">{{ whaterPoint.town.countryArea.name | title }}</a></li>
  32. {% endif %}
  33. <li class="breadcrumb-item"><a href="{{path('web_public_town_show_by_slug',{'townSlug':whaterPoint.town.slug })}}">{{ whaterPoint.town.name | title }}</a></li>
  34. <li class="breadcrumb-item active" aria-current="page">
  35. {{ whaterPoint.name }}
  36. {% if is_granted('IS_AUTHENTICATED_REMEMBERED') and app.user.user.hasRole('ROLE_ADMIN') %}
  37. (<a href="{{path('web_admin_whater_point_edit', {'whaterPointId': whaterPoint.id})}}">Editar</a>)
  38. {% endif %}
  39. </li>
  40. </ol>
  41. </nav>
  43. <div class="pb-9">
  44. <h2 class="mb-4">{{ whaterPoint.name | title }}</h2>
  45. <div class="row g-5 mb-5" ng-init="initWhaterPointMap({{whaterPoint.latitude}},{{whaterPoint.longitude}},'{{whaterPoint.whaterStatus}}','{{whaterPoint.name | url_encode }}')">
  46. {% if whaterPoint.images|length == 0 %}
  47. <div class="col-12 col-lg-12" >
  48. <div id="whater_point_map" style="height:400px;width:100%"></div>
  49. </div>
  50. {% else %}
  51. <div class="col-12 col-lg-8">
  52. <div id="whater_point_map" style="height:400px;width:100%"></div>
  53. </div>
  54. <div class="col-12 col-lg-4 d-flex align-self-center">
  55. <div class="carousel slide theme-slider text-center carousel-fade " id="carouselControls" data-bs-ride="carousel">
  56. <div class="carousel-indicators">
  57. {% for image in whaterPoint.images %}
  58. {% if loop.first %}
  59. <button class="active" type="button" data-bs-target="#carouselControls" data-bs-slide-to="{{loop.index0}}" aria-current="true" aria-label="{{ whaterPoint.name }} - {{loop.index}}"></button>
  60. {% else %}
  61. <button type="button" data-bs-target="#carouselControls" data-bs-slide-to="{{loop.index0}}" aria-label="{{ whaterPoint.name }} - {{loop.index}}"></button>
  62. {% endif %}
  63. {% endfor %}
  64. </div>
  65. <div class="carousel-inner rounded">
  66. {% for image in whaterPoint.images %}
  67. {% if loop.first %}
  68. <div class="carousel-item active">
  69. <img class="d-block w-100" src="{{ vich_uploader_asset(image, 'fileWhaterPointImage') | imagine_filter('whaterpoint_gallery')}}" alt="{{ whaterPoint.name }} - {{loop.index}}" />
  70. <div class="carousel-caption d-none d-md-block">
  71. <a href="{{ vich_uploader_asset(image, 'fileWhaterPointImage') }}" target="_blank" class="text-white" >{{ whaterPoint.name }} - {{loop.index}}</a>
  72. </div>
  73. </div>
  74. {% else %}
  75. <div class="carousel-item">
  76. <img class="d-block w-100" src="{{ vich_uploader_asset(image, 'fileWhaterPointImage')| imagine_filter('whaterpoint_gallery') }}" alt="{{ whaterPoint.name }} - {{loop.index}}" />
  77. <div class="carousel-caption d-none d-md-block">
  78. <a href="{{ vich_uploader_asset(image, 'fileWhaterPointImage') }}" target="_blank" class="text-white">{{ whaterPoint.name }} - {{loop.index}}</a>
  79. </div>
  80. </div>
  81. {% endif %}
  82. {% endfor %}
  83. </div>
  85. <button class="carousel-control-prev" type="button" data-bs-target="#carouselControls" data-bs-slide="prev">
  86. <span class="fas fa-angle-left"></span>
  87. <span class="sr-only">Anterior</span>
  88. </button>
  90. <button class="carousel-control-next" type="button" data-bs-target="#carouselControls" data-bs-slide="next">
  91. <span class="fas fa-angle-right"></span>
  92. <span class="sr-only">Siguiente</span>
  93. </button>
  94. </div>
  96. </div>
  97. {% endif %}
  98. </div>
  100. <div class="row g-5 mb-5">
  101. <div class="col-xl-6">
  102. <h3 class="mb-3" >Información</h3>
  103. <div class="mb-2">
  104. <h6 class="mb-0">Tipo de punto de agua</h6>
  105. <div class="my-2 ms-2">
  106. {% if whaterPoint.type == 'WP_TYPE_FOUNTAIN' %}
  107. <i class="fa-solid fa-faucet fs-2"></i>
  108. {% elseif whaterPoint.type == 'WP_TYPE_TAP'%}
  109. <i class="bi bi-building fs-2"></i>
  110. {% elseif whaterPoint.type == 'WP_TYPE_DEPOSIT'%}
  111. <i class="fa-solid fa-glass-water-droplet fs-2"></i>
  112. {% elseif whaterPoint.type == 'WP_TYPE_BOTTLED'%}
  113. <i class="fa-solid fa-bottle-water fs-2"></i>
  114. {% elseif whaterPoint.type == 'WP_TYPE_TREATED'%}
  115. <i class="fa-solid fa-flask fs-2"></i>
  116. {% elseif whaterPoint.type == 'WP_TYPE_SPRING'%}
  117. <i class="fa-solid fa-mountain-sun fs-2"></i>
  118. {% endif %}
  119. {{ ('whaterpoint.type.' ~ whaterPoint.type) | trans }}
  120. </div>
  121. </div>
  123. {% set establishment = whaterPoint.establishment %}
  124. {% if whaterPoint.whaterDevice %}
  125. {% set establishment = whaterPoint.whaterDevice.establishment %}
  126. <div class="mb-2">
  127. <h6 class="mb-0">Dispositivo</h6>
  128. <div class="my-2 ms-2">
  129. <i class="fas fa-faucet fs-2"></i>
  130. <a class="ms-2" href="{{ path('web_public_whater_device_show', {'whaterDeviceId': whaterPoint.whaterDevice.id} ) }}">{{ whaterPoint.whaterDevice.name | title }}</a>
  131. </div>
  132. </div>
  133. {% endif %}
  135. {% if establishment is not none %}
  136. <div class="mb-2">
  137. <h6 class="mb-0">Establecimiento</h6>
  138. <div class="my-2 ms-2">
  139. <i class="bi bi-shop-window fs-2"></i>
  140. <a href="{{ path('web_public_establishment_show', {'establishmentId': establishment.id } ) }}">{{ establishment.name | title }}</a>
  141. </div>
  142. </div>
  143. {% endif %}
  145. {% if establishment is not none and establishment.ubication is not none %}
  146. <div class="mb-2">
  147. <h6 class="mb-0">Ubicación</h6>
  148. <div class="my-2 ms-2">
  149. <i class="bi bi-geo-alt fs-2"></i>
  150. <a class="ms-2" href="{{ path('web_public_ubication_show', {'ubicationId': establishment.ubication.id } ) }}">{{ establishment.ubication.name | title }}</a>
  151. </div>
  152. </div>
  153. {% endif %}
  155. <div class="mb-2">
  156. <h6 class="mb-0">Ciudad/Municipio</h6>
  157. <div class="my-2 ms-2">
  158. <i class="bi bi-signpost-2 fs-2"></i>
  159. <a class="ms-2" href="{{ path('web_public_town_show', {'townId': whaterPoint.town.id } ) }}">{{ whaterPoint.town.name | title }}</a>
  160. </div>
  161. </div>
  163. <div class="mb-2">
  164. <h6 class="mb-0">Dirección</h6>
  165. <div class="my-2 ms-2">
  166. <i class="fas fa-directions fs-2"></i>
  167. {% if whaterPoint.town.countryArea %}
  168. {{ whaterPoint.town.name | title }}, {{ whaterPoint.town.countryArea.name | title }}, {{ whaterPoint.town.countryArea.country.name | title }}
  169. {% else %}
  170. {{ whaterPoint.town.name | title }}, {{ whaterPoint.town.country.name | title }}
  171. {% endif %}
  172. </div>
  173. </div>
  175. {% if whaterPoint.distributionNetwork %}
  176. <div class="mb-2 mt-4">
  177. <h3 class="my-3" >Red de distribución</h3>
  178. <div class="">
  179. <i class="fa-solid fa-circle-nodes fs-2"></i>
  180. <a href="{{ path('web_public_distribution_network_show_by_id',{'distributionNetworkId':whaterPoint.distributionNetwork.id})}}"
  181. class="ms-2 fs-0 fw-bold">{{ whaterPoint.distributionNetwork.name | title }}</a>
  182. </div>
  183. <div class="ms-4 me-auto">
  184. Tipo:
  185. <span class="fw-bold">{{ ('distributionNetwork.type.' ~ whaterPoint.distributionNetwork.type) | trans }}</span>
  186. </div>
  187. <div class="ms-4 me-auto">
  188. Estado:
  189. {% if whaterPoint.distributionNetwork.whaterStatus == 'DN_STATUS_SUITABLE' %}
  190. <span class="fw-bold text-success ">Apta</span>
  191. {% elseif whaterPoint.distributionNetwork.whaterStatus == 'DN_STATUS_NOT_SUITABLE' %}
  192. <span class="fw-bold text-danger ">No apta</span>
  193. {% else %}
  194. <span class="fw-bold">Sin Información</span>
  195. {% endif %}
  196. </div>
  197. <div class="ms-4 me-auto">
  198. Fecha última actualización:
  199. <span class="fw-bold">{{whaterPoint.distributionNetwork.lastAnalitycsUpdateAt | date('d-m-Y') }}</span>
  200. </div>
  201. {% if whaterPoint.distributionNetwork.sinacId is not none and whaterPoint.town.externalIds is not none and whaterPoint.town.externalIds.sinac is defined %}
  202. <div class="ms-4 me-auto">
  203. Enlace web SINAC:
  204. <a href="{{ sinac_domain }}/CiudadanoWeb/ciudadano/informacionAbastecimientoActionDetalleRed.do?idRed={{ whaterPoint.distributionNetwork.sinacId }}&codMunicipio={{ whaterPoint.town.externalIds.sinac}}"
  205. target="_black"
  206. >{{sinac_domain}}</a>
  207. </div>
  208. {% endif %}
  209. </div>
  212. <div class="row g-5 mb-2 mt-4">
  213. <div class="col-12 text-center text-md-start" >
  214. <h3 class="mb-3" >Calidad del agua</h3>
  216. <ul class="list-group">
  217. {% if whaterPoint.responsableOrganizationUbication is not none %}
  218. <li class="list-group-item">
  219. <h5 class="ms-2 mb-3">Responsable de ubicación</h5>
  220. <div class="row ms-2">
  221. <div class="col-12 col-lg-5 mb-2">
  222. <h6 class="mb-0">Nombre</h6>
  223. <div class="mt-2">{{ whaterPoint.responsableOrganizationUbication.name | title }}</div>
  224. </div>
  225. <div class="col-12 col-lg-4 mb-2">
  226. <h6 class="mb-0">Ultima información</h6>
  227. <div class="mt-2">
  228. {% if whaterPoint.whaterStatusAt is not none %}
  229. {{ whaterPoint.whaterStatusAt | date('d-m-Y') }}
  230. {% else %}
  231. -
  232. {% endif %}
  233. </div>
  234. </div>
  235. <div class="col-12 col-lg-3 mb-2">
  236. <h6 class="mb-0">Estado</h6>
  237. <div class="mt-1">
  238. {% if whaterPoint.whaterStatus is not none %}
  239. {% if whaterPoint.whaterStatus == 'WP_STATUS_SUITABLE' %}
  240. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-green.svg')) }}" />
  241. {% elseif whaterPoint.whaterStatus == 'WP_STATUS_NOT_SUITABLE' %}
  242. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-red.svg')) }}" />
  243. {% else %}
  244. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-yellow.svg')) }}" />
  245. {% endif %}
  246. {% else %}
  247. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-yellow.svg')) }}" />
  248. {% endif %}
  249. </div>
  250. </div>
  251. </div>
  252. </li>
  253. {% endif %}
  254. {% if whaterPoint.distributionNetwork.responsableOrganizationGovernment is not none %}
  255. <li class="list-group-item">
  256. <h5 class="ms-2 mb-3">Responsable de la Red</h5>
  257. <div class="row ms-2">
  258. <div class="col-12 col-lg-5 mb-2">
  259. <h6 class="mb-0">Nombre</h6>
  260. <div class="mt-2">{{ whaterPoint.distributionNetwork.responsableOrganizationGovernment.name | title }}</div>
  261. </div>
  262. <div class="col-12 col-lg-4 mb-2">
  263. <h6 class="mb-0">Ultima información</h6>
  264. <div class="mt-2">
  265. {% if whaterPoint.distributionNetwork.whaterStatusByGovernmentUpdatedAt is not none %}
  266. {{ whaterPoint.distributionNetwork.whaterStatusByGovernmentUpdatedAt | date('d-m-Y') }}
  267. {% else %}
  268. -
  269. {% endif %}
  270. </div>
  271. </div>
  272. <div class="col-12 col-lg-3 mb-2">
  273. <h6 class="mb-0">Estado</h6>
  274. <div class="mt-1">
  275. {% if whaterPoint.distributionNetwork.whaterStatusByGovernment is not none %}
  276. {% if whaterPoint.distributionNetwork.whaterStatusByGovernment == 'DN_STATUS_SUITABLE' %}
  277. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-green.svg')) }}" />
  278. {% elseif whaterPoint.distributionNetwork.whaterStatusByGovernment == 'DN_STATUS_NOT_SUITABLE' %}
  279. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-red.svg')) }}" />
  280. {% else %}
  281. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-yellow.svg')) }}" />
  282. {% endif %}
  283. {% else %}
  284. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-yellow.svg')) }}" />
  285. {% endif %}
  286. </div>
  287. </div>
  288. </div>
  289. </li>
  290. {% endif %}
  292. {% if whaterPoint.distributionNetwork.responsableOrganizationOperator is not none %}
  293. <li class="list-group-item">
  294. <h5 class="ms-2 mb-3">Operador responsable de la Red</h5>
  295. <div class="row ms-2">
  296. <div class="col-12 col-lg-5 mb-2">
  297. <h6 class="mb-0">Nombre</h6>
  298. <div class="mt-2">{{ whaterPoint.distributionNetwork.responsableOrganizationOperator.name | title }}</div>
  299. </div>
  300. <div class="col-12 col-lg-4 mb-2">
  301. <h6 class="mb-0">Ultima información</h6>
  302. <div class="mt-2">
  303. {% if whaterPoint.distributionNetwork.whaterStatusByOperatorUpdatedAt is not none %}
  304. {{ whaterPoint.distributionNetwork.whaterStatusByOperatorUpdatedAt | date('d-m-Y') }}
  305. {% else %}
  306. -
  307. {% endif %}
  308. </div>
  309. </div>
  310. <div class="col-12 col-lg-3 mb-2">
  311. <h6 class="mb-0">Estado</h6>
  312. <div class="">
  313. {% if whaterPoint.distributionNetwork.whaterStatusByOperator is not none %}
  314. {% if whaterPoint.distributionNetwork.whaterStatusByOperator == 'DN_STATUS_SUITABLE' %}
  315. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-green.svg')) }}" />
  316. {% elseif whaterPoint.distributionNetwork.whaterStatusByOperator == 'DN_STATUS_NOT_SUITABLE' %}
  317. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-red.svg')) }}" />
  318. {% else %}
  319. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-yellow.svg')) }}" />
  320. {% endif %}
  321. {% else %}
  322. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-yellow.svg')) }}" />
  323. {% endif %}
  324. </div>
  325. </div>
  326. </div>
  327. </li>
  328. {% endif %}
  329. {% if whaterPoint.distributionNetwork.responsableOrganizationUbication is not none %}
  330. <li class="list-group-item">
  331. <h5 class="ms-2 mb-3">Responsable de ubicación de la Red</h5>
  332. <div class="row ms-2">
  333. <div class="col-12 col-lg-5 mb-2">
  334. <h6 class="mb-0">Nombre</h6>
  335. <div class="mt-2">{{ whaterPoint.distributionNetwork.responsableOrganizationUbication.name | title }}</div>
  336. </div>
  337. <div class="col-12 col-lg-4 mb-2">
  338. <h6 class="mb-0">Ultima información</h6>
  339. <div class="mt-2">
  340. {% if whaterPoint.distributionNetwork.whaterStatusByUbicationUpdatedAt is not none %}
  341. {{ whaterPoint.distributionNetwork.whaterStatusByUbicationUpdatedAt | date('d-m-Y') }}
  342. {% else %}
  343. -
  344. {% endif %}
  345. </div>
  346. </div>
  347. <div class="col-12 col-lg-3 mb-2">
  348. <h6 class="mb-0">Estado</h6>
  349. <div class="mt-1">
  350. {% if whaterPoint.distributionNetwork.whaterStatusByUbication is not none %}
  351. {% if whaterPoint.distributionNetwork.whaterStatusByUbication == 'DN_STATUS_SUITABLE' %}
  352. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-green.svg')) }}" />
  353. {% elseif whaterPoint.distributionNetwork.whaterStatusByUbication == 'DN_STATUS_NOT_SUITABLE' %}
  354. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-red.svg')) }}" />
  355. {% else %}
  356. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-yellow.svg')) }}" />
  357. {% endif %}
  358. {% else %}
  359. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-circle-yellow.svg')) }}" />
  360. {% endif %}
  361. </div>
  362. </div>
  363. </div>
  364. </li>
  365. {% endif %}
  366. </ul>
  367. </div>
  369. </div>
  370. {% endif %}
  371. </div>
  373. <div class="col-xl-6">
  375. <h3 class="mb-2" >Código QR del WhaterPoint</h3>
  376. <div class="mb-3">
  377. <img src="{{ qr_code_data_uri(url('web_public_whater_point_show_by_slug', {'whaterPointSlug': whaterPoint.slug }), 'qr_ticket') }}"/>
  378. </div>
  380. {% if is_ecommerce_active %}
  381. {% if whaterPoint.product is not none and whaterPoint.product.isEnable %}
  382. <p class="text-muted">
  383. ¿Estás en este punto de hidratación? Satisfaz tu sed con solo un clic. ¡Recarga tu botella de agua y revive la experiencia de hidratación en este waterpoint!
  384. <a href="#" class="fs--1">(más informacion)</a>
  385. </p>
  386. <div class="text-center">
  387. <p class="text-primary fw-bold">Recarga tu botella de agua en este whaterpoint por: </p>
  388. <div class="d-flex">
  389. <button type="button" ng-click="buyProduct('{{ whaterPoint.product.id }}', 'whatercoins')"
  390. class="btn btn-lg btn-primary w-100 mb-4 mx-2">
  391. {{ whaterPoint.product.productPrice | number_format(2, ',', '.') }} whatercoins!
  392. </button>
  393. </div>
  394. </div>
  395. {% endif %}
  396. {% endif %}
  398. {% if is_granted('IS_AUTHENTICATED_FULLY') and app.user %}
  399. <h3 class="mb-2">¡Danos tu opinión!</h3>
  400. {% set myvaloration = app.user.user.valorationForWhaterpoint(whaterPoint.id) %}
  401. <div class="row align-items-center pb-3" ng-init="initValorations('{{whaterPoint.id}}')" >
  402. <div class="col-2">General:</div>
  403. <div class="col-10">
  404. <div class="radio-container d-flex" id="select-general-quality" {% if myvaloration is not none %}data-valoration="{{myvaloration.generalValoration}}"{% endif %}>
  405. <div class="mx-3">
  406. <input type="radio" id="radio-val1" name="general" value="WP_QUALITY_ACCEPTABLE_VALORATION">
  407. <label for="radio-val1"><img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-face-smile.svg')) }}" data-bs-toggle="tooltip" data-bs-placement="top" title="Aceptable" /></label>
  408. </div>
  410. <div class="mx-3">
  411. <input type="radio" id="radio-val2" name="general" value="WP_QUALITY_NEEDS_IMPROVEMENT_VALORATION">
  412. <label for="radio-val2"><img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-face-normal.svg')) }}" data-bs-toggle="tooltip" data-bs-placement="top" title="Mejorable"/></label>
  413. </div>
  415. <div class="mx-3">
  416. <input type="radio" id="radio-val3" name="general" value="WP_QUALITY_NOT_ACCEPTABLE_VALORATION">
  417. <label for="radio-val3"><img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-face-sad.svg')) }}" data-bs-toggle="tooltip" data-bs-placement="top" title="No aceptable"/></label>
  418. </div>
  419. </div>
  420. </div>
  421. </div>
  423. <h6 class="mt-2 mb-2">Danos una valoración más específica evaluando los siguientes parámetros </h6>
  424. <div class="row pb-3">
  425. <div class="row align-items-center" >
  426. <div class="col-2 text-end">Sabor:</div>
  427. <div class="col-10">
  428. <div class="radio-container d-flex" id="select-taste-quality" {% if myvaloration is not none %}data-valoration="{{myvaloration.tasteValoration}}"{% endif %}>
  429. <label class="me-3"><input type="radio" name="taste" value="WP_QUALITY_ACCEPTABLE_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_ACCEPTABLE_VALORATION') | trans}}</label>
  430. <label class="me-3"><input type="radio" name="taste" value="WP_QUALITY_NEEDS_IMPROVEMENT_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_NEEDS_IMPROVEMENT_VALORATION') | trans}}</label>
  431. <label><input type="radio" name="taste" value="WP_QUALITY_NOT_ACCEPTABLE_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_NOT_ACCEPTABLE_VALORATION') | trans}}</label>
  432. </div>
  433. </div>
  434. </div>
  435. <div class="row align-items-center">
  436. <div class="col-2 text-end">Olor:</div>
  437. <div class="col-10">
  438. <div class="radio-container d-flex" id="select-smell-quality" {% if myvaloration is not none %}data-valoration="{{myvaloration.smellValoration}}"{% endif %}>
  439. <label class="me-3"><input type="radio" name="smell" value="WP_QUALITY_ACCEPTABLE_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_ACCEPTABLE_VALORATION') | trans}}</label>
  440. <label class="me-3"><input type="radio" name="smell" value="WP_QUALITY_NEEDS_IMPROVEMENT_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_NEEDS_IMPROVEMENT_VALORATION') | trans}}</label>
  441. <label><input type="radio" name="smell" value="WP_QUALITY_NOT_ACCEPTABLE_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_NOT_ACCEPTABLE_VALORATION') | trans}}</label>
  442. </div>
  443. </div>
  444. </div>
  445. <div class="row align-items-center">
  446. <div class="col-2 text-end">Color:</div>
  447. <div class="col-10">
  448. <div class="radio-container d-flex" id="select-color-quality" {% if myvaloration is not none %}data-valoration="{{myvaloration.colorValoration}}"{% endif %}>
  449. <label class="me-3"><input type="radio" name="color" value="WP_QUALITY_ACCEPTABLE_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_ACCEPTABLE_VALORATION') | trans}}</label>
  450. <label class="me-3"><input type="radio" name="color" value="WP_QUALITY_NEEDS_IMPROVEMENT_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_NEEDS_IMPROVEMENT_VALORATION') | trans}}</label>
  451. <label><input type="radio" name="color" value="WP_QUALITY_NOT_ACCEPTABLE_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_NOT_ACCEPTABLE_VALORATION') | trans}}</label>
  452. </div>
  453. </div>
  454. </div>
  455. <div class="row align-items-center">
  456. <div class="col-2 text-end">Turbidez:</div>
  457. <div class="col">
  458. <div class="radio-container d-flex" id="select-turbidity-quality" {% if myvaloration is not none %}data-valoration="{{myvaloration.turbidityValoration}}"{% endif %}>
  459. <label class="me-3"><input type="radio" name="turbidity" value="WP_QUALITY_ACCEPTABLE_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_ACCEPTABLE_VALORATION') | trans}}</label>
  460. <label class="me-3"><input type="radio" name="turbidity" value="WP_QUALITY_NEEDS_IMPROVEMENT_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_NEEDS_IMPROVEMENT_VALORATION') | trans}}</label>
  461. <label><input type="radio" name="turbidity" value="WP_QUALITY_NOT_ACCEPTABLE_VALORATION"> {{ ('whater_valoration.quality.WP_QUALITY_NOT_ACCEPTABLE_VALORATION') | trans}}</label>
  462. </div>
  463. </div>
  464. </div>
  465. </div>
  466. {% endif %}
  468. {% if is_granted('IS_AUTHENTICATED_FULLY') and app.user and app.user.user.whaterOrganization and whaterPoint.responsableOrganizationUbication and app.user.user.whaterOrganization == whaterPoint.responsableOrganizationUbication %}
  469. <h5 class="mt-3 mb-2"
  470. ng-init="initRating('{{whaterPoint.id}}','{{whaterPoint.totalColor | json_encode }}','{{whaterPoint.totalSmell | json_encode}}','{{whaterPoint.totalTaste | json_encode}}','{{whaterPoint.totalTurbidity | json_encode}}','{{whaterPoint.totalGeneral | json_encode}}')">
  471. Resultado de valoraciones de usuarios
  472. </h5>
  473. <div class="row">
  474. <div class="col-md-2 text-center mb-2" >
  475. <div class="fs-0"></div>
  476. </div>
  477. <div class="col-md-3 text-center mb-2" >
  478. <div>Aceptable: </div>
  479. </div>
  480. <div class="col-md-4 text-center mb-2" >
  481. <div>Mejorable: </div>
  482. </div>
  484. <div class="col-md-3 text-center mb-2" >
  485. <div>No aceptable: </div>
  486. </div>
  487. </div>
  488. <div class="row">
  489. <div class="col-md-2 text-end mb-2" >
  490. <div class="fs-0">General:</div>
  491. </div>
  492. <div class="col-md-3 text-center mb-2" >
  493. <div id="totalAcceptableGeneral" ></div>
  494. </div>
  495. <div class="col-md-4 text-center mb-2" >
  496. <div id="totalNeedsImprovementGeneral" ></div>
  497. </div>
  499. <div class="col-md-3 text-center mb-2" >
  500. <div id="totalNotAcceptableGeneral" ></div>
  501. </div>
  502. </div>
  503. <div class="row">
  504. <div class="col-md-2 text-end mb-2" >
  505. <div class="fs-0">Sabor:</div>
  506. </div>
  507. <div class="col-md-3 text-center mb-2" >
  508. <div id="totalAcceptableTaste" ></div>
  509. </div>
  510. <div class="col-md-4 text-center mb-2" >
  511. <div id="totalNeedsImprovementTaste" ></div>
  512. </div>
  513. <div class="col-md-3 text-center mb-2" >
  514. <div id="totalNotAcceptableTaste" ></div>
  515. </div>
  516. </div>
  517. <div class="row">
  518. <div class="col-md-2 text-end mb-2" >
  519. <div class="fs-0">Olor:</div>
  520. </div>
  521. <div class="col-md-3 text-center mb-2" >
  522. <div id="totalAcceptableSmell" ></div>
  523. </div>
  524. <div class="col-md-4 text-center mb-2" >
  525. <div id="totalNeedsImprovementSmell" ></div>
  526. </div>
  528. <div class="col-md-3 text-center mb-2" >
  529. <div id="totalNotAcceptableSmell" ></div>
  530. </div>
  531. </div>
  532. <div class="row">
  533. <div class="col-md-2 text-end mb-2" >
  534. <div class="fs-0">Color:</div>
  535. </div>
  536. <div class="col-md-3 text-center mb-2" >
  537. <div id="totalAcceptableColor" ></div>
  538. </div>
  539. <div class="col-md-4 text-center mb-2" >
  540. <div id="totalNeedsImprovementColor" ></div>
  541. </div>
  543. <div class="col-md-3 text-center mb-2" >
  544. <div id="totalNotAcceptableColor" ></div>
  545. </div>
  546. </div>
  547. <div class="row">
  548. <div class="col-md-2 text-end mb-2" >
  549. <div class="fs-0">Turbidez: </div>
  550. </div>
  551. <div class="col-md-3 text-center mb-2" >
  552. <div id="totalAcceptableTurbidity" ></div>
  553. </div>
  554. <div class="col-md-4 text-center mb-2" >
  555. <div id="totalNeedsImprovementTurbidity" ></div>
  556. </div>
  558. <div class="col-md-3 text-center mb-2" >
  559. <div id="totalNotAcceptableTurbidity" ></div>
  560. </div>
  561. </div>
  562. {% endif %}
  564. <div class="d-flex align-items-center">
  565. <div class="">
  566. {% if whaterPoint.averageUserGeneral is not none %}
  567. {% if whaterPoint.averageUserGeneral <= 3 %}
  568. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-face-sad.svg')) }}" data-bs-toggle="tooltip" data-bs-placement="top" title="No aceptable"/>
  569. {% elseif whaterPoint.averageUserGeneral > 3 and whaterPoint.averageUserGeneral < 8 %}
  570. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-face-normal.svg')) }}" data-bs-toggle="tooltip" data-bs-placement="top" title="Mejorable"/>
  571. {% elseif whaterPoint.averageUserGeneral >= 8 %}
  572. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-face-smile.svg')) }}" data-bs-toggle="tooltip" data-bs-placement="top" title="Aceptable"/>
  573. {% endif %}
  574. {% elseif whaterPoint.averageProfessionalGeneral is not none %}
  575. {% if whaterPoint.averageProfessionalGeneral <= 3 %}
  576. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-face-sad.svg')) }}" data-bs-toggle="tooltip" data-bs-placement="top" title="No aceptable"/>
  577. {% elseif whaterPoint.averageUserGeneral > 3 and whaterPoint.averageProfessionalGeneral < 8 %}
  578. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-face-normal.svg')) }}" data-bs-toggle="tooltip" data-bs-placement="top" title="Mejorable"/>
  579. {% elseif whaterPoint.averageProfessionalGeneral >= 8 %}
  580. <img style="height:40px;" src="{{ absolute_url(asset('/assets/images/widget_icons/whater-widget-face-smile.svg')) }}" data-bs-toggle="tooltip" data-bs-placement="top" title="Aceptable"/>
  581. {% endif %}
  582. {% endif %}
  583. </div>
  584. <div class="d-flex align-items-center">
  585. {% if whaterPoint.averageUserGeneral is none and whaterPoint.averageProfessionalGeneral is none %}
  586. <div class="ms-3 text-1000">
  587. <div class="text-muted">Este whaterpoint aún no ha recibido valoraciones.</div>
  588. </div>
  589. {% else %}
  590. <div class="ms-3 text-1000">
  591. {% if whaterPoint.averageUserGeneral is not none %}
  592. <div>La valoracion media de usuarios es de <span class="fw-bold">{{whaterPoint.averageUserGeneral | number_format(2, ',', '.') }}</span> sobre 10</div>
  593. {% endif %}
  594. {% if whaterPoint.averageProfessionalGeneral is not none %}
  595. <div>La valoracion media de profesionales es de <span class="fw-bold">{{whaterPoint.averageProfessionalGeneral | number_format(2, ',', '.')}}</span> sobre 10</div>
  596. {% endif %}
  597. </div>
  598. {% endif %}
  599. </div>
  600. </div>
  602. <h3 class="mt-5 mb-2" >
  603. Comentarios de los usuarios
  604. </h3>
  606. {% set allow_comment_button = true %}
  607. {% if is_granted('IS_AUTHENTICATED_FULLY') %}
  608. {% for valoration in whaterPoint.valorations %}
  609. {% if valoration.createdBy.equals(app.user.user) and valoration.userCommentText is not none %}
  610. {% set allow_comment_button = false %}
  611. {% endif %}
  612. {% endfor %}
  613. <div class="d-flex flex-row-reverse mb-2">
  614. <button class="btn btn-secondary btn-sm" type="button"
  615. {% if allow_comment_button %}
  616. ng-click="createCommentModal()"
  617. {% else %}
  618. disabled="disabled"
  619. {% endif %}
  620. >Añadir comentario</button>
  621. </div>
  622. {% endif %}
  624. <div class="row pb-3">
  625. <div class="col-12 col-xl-auto flex-1">
  626. {% set num_comments = 0 %}
  627. {% for valoration in whaterPoint.valorations %}
  628. {% if valoration.hideUserComment == false and valoration.userCommentText is not none %}
  629. {% set num_comments = num_comments + 1 %}
  630. <div class="border-2 border-dashed mb-3 pt-2 border-top">
  631. <div class="d-flex">
  632. <div class="fs--1 text-600">
  633. <span class="fa-solid fa-clock me-2"></span>
  634. <span class="fw-semi-bold me-1">{{ valoration.createdAt | date('d-m-Y H:i') }}</span>
  635. </div>
  636. <p class="fs--1 mb-0 text-600">
  637. por
  638. <span class=" fw-semi-bold">{{ valoration.createdBy.fullName }}</span>
  639. </p>
  640. </div>
  641. <p class="mt-2 ms-3 text-1000">{{valoration.userCommentText | nl2br }}</p>
  642. {% if valoration.commentImage is not none %}
  643. <div class="w-100 w-md-50 ms-md-3">
  644. <a href="{{ vich_uploader_asset(valoration.commentImage, 'fileWhaterValorationImage') }}" data-gallery="gallery-posts-0">
  645. <img class="rounded h-100 w-100" src="{{ vich_uploader_asset(valoration.commentImage, 'fileWhaterValorationImage') | imagine_filter('whater_valoration_image_thumb_300_200') }}" alt="..." />
  646. </a>
  647. </div>
  648. {% endif %}
  651. {% set allow_delete = false %}
  652. {% set allow_reply = false %}
  654. {% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
  655. {% if app.user.user.checkPermission('PERMISSION_EDIT_WHATER_POINT',whaterPoint) %}
  656. {% set allow_delete = true %}
  657. {% set allow_reply = true %}
  658. {% endif %}
  659. {% if app.user.user.hasRole('ROLE_ADMIN') %}
  660. {% set allow_delete = true %}
  661. {% endif %}
  662. {% endif %}
  663. <div class="mt-2 ms-md-3">
  664. {% if allow_delete %}
  665. <button class="btn btn-link p-0 text-900 fw-bolder mb-2" type="button" ng-click="deleteCommentModal('{{valoration.id}}')" data-valoration-id="{{valoration.id}}">
  666. <span class="fa-solid fa-trash-alt fs--2 me-1 text-danger"></span>
  667. <span class="fw-bold fs--2 text-danger">Eliminar mensaje</span>
  668. </button>
  669. {% endif %}
  670. {% if allow_reply %}
  671. <button class="btn btn-link p-0 text-900 fw-bolder mb-2" type="button" ng-click="replyCommentModal('{{valoration.id}}')" data-valoration-id="{{valoration.id}}">
  672. <span class="fa-solid fa-reply fs--2 me-1">
  673. </span>
  674. <span class="fw-bold fs--2">
  675. {% if valoration.responseCommentText is none%}
  676. Responder mensaje
  677. {% else %}
  678. Editar respuesta
  679. {% endif %}
  680. </span>
  681. </button>
  682. {% endif %}
  683. </div>
  684. {% if valoration.responseCommentText %}
  685. <div class="d-flex ms-md-3">
  686. <div class="fs--1 text-600">
  687. <span class="fa-solid fa-clock me-2"></span>
  688. <span class="fw-semi-bold me-1">{{ valoration.responseCommentAt | date('d-m-Y H:i') }}</span>
  689. </div>
  690. <p class="fs--1 mb-0 text-600">
  691. por
  692. {% if whaterPoint.responsableOrganizationUbication is not none %}
  693. <span class=" fw-semi-bold">{{whaterPoint.responsableOrganizationUbication.name}}</span>
  694. {% else %}
  695. <span class=" fw-semi-bold">whater.app</span>
  696. {% endif %}
  697. </p>
  698. </div>
  699. <p class="mt-2 ms-3 text-1000">{{valoration.responseCommentText | nl2br }}</p>
  700. {% endif %}
  701. </div>
  702. {% endif %}
  703. {% endfor %}
  704. {% if num_comments == 0 %}
  705. <p class="mt-2 ms-3 text-1000">
  706. <span class="text-muted">Este whaterpoint aún no ha recibido comentarios.</span>
  707. </p>
  708. {% endif %}
  709. {% if not is_granted('IS_AUTHENTICATED_FULLY') %}
  710. <a href="{{path('web_login', {'_target_path': path('web_public_whater_point_show',{'whaterPointId': whaterPoint.id})})}}">Entra y comenta!</a>
  711. {%endif %}
  712. </div>
  713. </div>
  715. </div>
  716. </div>
  718. {% if (recommendedProducts | length ) > 0 %}
  719. <div class="row g-5 mb-5">
  720. <div class="col-12">
  721. <h3 class="mb-3">Productos recomendados</h3>
  722. <div class="row">
  723. {% for product in recommendedProducts %}
  724. <div class="col-6 col-lg-2 col-md-3">
  725. <div class="product-card h-100">
  726. <div class="d-flex flex-column justify-content-between h-100">
  727. <div class="">
  728. <a class="border border-1 rounded-3 position-relative mb-2"
  729. {% if single_page is defined and single_page == true %}
  730. target="_blank"
  731. {% endif %}
  732. href="{{ path('web_public_show_product', {'productSlug':product.productSlug})}}" >
  734. <img class="img-fluid product-image"
  735. {% if (product.images| length) > 0 %}
  736. src="{{ vich_uploader_asset( product.images.0, 'fileProductImage') | imagine_filter('product_list_image') }}"
  737. {% else %}
  738. src="{{asset('/assets/images/gota-foto-3@2x.png')}}"
  739. {% endif %}
  740. />
  741. </a>
  742. <a class="text-decoration-none"
  743. {% if single_page is defined and single_page == true %}
  744. target="_blank"
  745. {% endif %}
  746. href="{{ path('web_public_show_product', {'productSlug':product.productSlug})}}" >
  747. <span class="product-name fw-bold text-dark">{{product.productLabel}}</span>
  748. </a>
  749. </div>
  751. <div class="d-flex align-items-center justify-content-end mb-1">
  752. <p class="mb-0 text-700 product-price-label">Desde {{product.productPrice}}€</p>
  753. </div>
  754. </div>
  755. </div>
  756. </div>
  757. {% endfor %}
  758. </div>
  759. </div>
  760. </div>
  761. {% endif %}
  763. {% if (whaterArticles | length ) > 0 %}
  764. <div class="row g-5 mb-5">
  765. <div class="col-12">
  766. <div class="row g-0 py-3 align-items-end justify-content-between">
  767. <h3 class="flex-1 mb-0 text-nowrap me-3">Artículos recomendados</h3>
  768. </div>
  769. </div>
  770. {% for article in whaterArticles %}
  771. <div class="col-6 col-md-4 my-2 py-1">
  772. <div class="card" >
  773. {% if article.headerImageUrl %}
  774. <a href="{{ url('web_blog_show_article', { 'articleSlug' : article.slug('es'), '_locale': 'es' })}}">
  775. <img class="card-img-top" src="{{ article.headerImageUrl | imagine_filter('whater_blog_header_list_image_1200_200') }}" title="{{ article.title('es') }}">
  776. </a>
  777. {% endif %}
  779. <div class="card-body">
  780. <a class="text-dark" href="{{ url('web_blog_show_article', { 'articleSlug' : article.slug('es'), '_locale': 'es' })}}">
  781. <h3 class="card-title">{{ article.title('es') }}</h3>
  782. </a>
  783. <p class="card-text">{{ article.content('es') | striptags | u.truncate(350) |raw }}...</p>
  784. <div class="fs--1 text-muted">{{ article.publishAt | date('d-m-Y') }} - {{ article.publishAt | ago }}</div>
  785. <div class="my-1">
  786. {% for metaKeyword in article.metaKeywords('es') %}
  787. <a class="text-muted fs--1">#{{ metaKeyword | replace({' ': '-'})}}</a>
  788. {% endfor %}
  789. </div>
  791. </div>
  792. </div>
  793. </div>
  794. {% endfor %}
  795. </div>
  796. {% endif %}
  798. </div>
  800. <div class="modal fade" id="createCommentModal" tabindex="-1" aria-hidden="true">
  801. <div class="modal-dialog">
  802. <div class="modal-content">
  803. <div class="modal-header">
  804. <h5 class="modal-title" id="createCommentModalLabel">Añadir comentario</h5>
  805. <button class="btn p-1" type="button" data-bs-dismiss="modal" aria-label="Close">
  806. <span class="fas fa-times fs--1"></span>
  807. </button>
  808. </div>
  809. <div class="modal-body">
  810. <textarea class="form-control mb-3" ng-model="valorationCommentText" rows="4"></textarea>
  811. <div class="mt-2">¿Quieres subir una foto? (min 300x300)</div>
  812. <input id="fileImageInput" type="file" ng-model="valorationCommentImage" accept="image/*" class="form-control">
  813. </div>
  814. <div class="modal-footer">
  815. <button class="btn btn-primary" type="button" ng-click="acceptCommentModalButton()">Aceptar</button>
  816. <button class="btn btn-outline-primary" type="button" data-bs-dismiss="modal">Cancelar</button>
  817. </div>
  818. </div>
  819. </div>
  820. </div>
  822. <div class="modal fade" id="deleteCommentModal" tabindex="-1" aria-hidden="true">
  823. <div class="modal-dialog">
  824. <div class="modal-content">
  825. <div class="modal-header">
  826. <h5 class="modal-title" id="deleteCommentModalLabel">Eliminar comentario</h5>
  827. <button class="btn p-1" type="button" data-bs-dismiss="modal" aria-label="Close">
  828. <span class="fas fa-times fs--1"></span>
  829. </button>
  830. </div>
  831. <div class="modal-body">
  832. <p>Estás a punto de eliminar este comentario. ¿Deseas continuar?</p>
  833. <p>El usuario no podrá volver a realizar un comentario sobre este whaterpoint.</p>
  834. </div>
  835. <div class="modal-footer">
  836. <button class="btn btn-danger" type="button" ng-click="acceptDeleteCommentModalButton()">Aceptar</button>
  837. <button class="btn btn-secondary" type="button" data-bs-dismiss="modal">Cancelar</button>
  838. </div>
  839. </div>
  840. </div>
  841. </div>
  843. <div class="modal fade" id="replyCommentModal" tabindex="-1" aria-hidden="true">
  844. <div class="modal-dialog">
  845. <div class="modal-content">
  846. <div class="modal-header">
  847. <h5 class="modal-title" id="replyCommentModalLabel">Añadir comentario</h5>
  848. <button class="btn p-1" type="button" data-bs-dismiss="modal" aria-label="Close">
  849. <span class="fas fa-times fs--1"></span>
  850. </button>
  851. </div>
  852. <div class="modal-body">
  853. <textarea class="form-control mb-3" ng-model="valorationReplyCommentText" rows="4"></textarea>
  854. </div>
  855. <div class="modal-footer">
  856. <button class="btn btn-primary" type="button" ng-click="acceptReplyCommentModalButton()">Aceptar</button>
  857. <button class="btn btn-outline-primary" type="button" data-bs-dismiss="modal">Cancelar</button>
  858. </div>
  859. </div>
  860. </div>
  861. </div>
  864. </div>
  867. {% endblock contents %}