From 520c8d8714ea19020a8066c8ec483e89be740dba Mon Sep 17 00:00:00 2001
From: antoine37120 <ant.dupre@gmail.com>
Date: Tue, 12 Sep 2023 11:48:45 +0200
Subject: [PATCH] fix: add link user profil territries and clean code for user
territories list
---
src/custom-tzcld.js | 30 +++++++---------
src/styles/territory-list.scss | 48 +++++++++++++++++++++++++-
src/views-terrytories.js | 8 +----
src/widjets-display-territory-tzcld.js | 3 +-
4 files changed, 62 insertions(+), 27 deletions(-)
diff --git a/src/custom-tzcld.js b/src/custom-tzcld.js
index 8cd5f4b..26eebf7 100644
--- a/src/custom-tzcld.js
+++ b/src/custom-tzcld.js
@@ -186,11 +186,11 @@ import("./utils.js").then((utils) => {
id: await this.resource['@id'],
name: await this.resource.name,
communities: await this.resource.communities,
- tzcld_profile: await this.resource.tzcld_profile
+ //tzcld_profile: await this.resource.tzcld_profile
};
- let user_tzld_profile = {
+ /*let user_tzld_profile = {
jobs: await tzcldprofile.tzcld_profile.jobs
- };
+ };*/
if("label" in this.element.attributes) {
for(let ignore of this.element.attributes['label'].value.split(',')) {
tzcldprofile[ignore.trim()] = null;
@@ -202,18 +202,12 @@ import("./utils.js").then((utils) => {
\${value != "" ? \`- \${value}\` : \`\`}
</template>
</solid-widget>
- <solid-widget name="tzcld-display-user-member-community">
- <template>
- <solid-display
- class="segment whitespace-normal full"
- bind-resources=""
- fields="tzcld_profile.community"
- widget-tzcld_profile.community="customtzcld-display-user-territories"
- class-tzcld_profile.community="segment block"
- next="communities-community-profile"
- data-src="\${value}"
- solid-resource=""></solid-display>
- </template>
+ <solid-widget name="tzcld-communities-logo">
+ <template>
+ <div class="communities-logo">
+ \${value != "" ? \`<div \style="background-image:url(\${value});" />\` : \`<div></div>\`}
+ </div>
+ </template>
</solid-widget>
<div id="tzcld-user-profile-wrapper" class="tzcld-user-profile-wrapper segment full">
@@ -254,11 +248,11 @@ import("./utils.js").then((utils) => {
render += `<div class="territoires-mini-cards-2">`; //section-territoires cards 2
render += `<solid-display
class="segment whitespace-normal full"
- bind-resources=""
+ data-src="${tzcldprofile.id}"
+ nested-field="communities"
fields="community"
- widget-community="tzcld-display-user-member-community"
+ widget-community="customtzcld-display-user-territories"
class-community="segment block"
- data-src="${await tzcldprofile.communities['@id']}"
solid-resource=""></solid-display>`;
render += `</div>`; //section-avatar
render += `</div>`; //col 1
diff --git a/src/styles/territory-list.scss b/src/styles/territory-list.scss
index a7ba322..58f68d8 100644
--- a/src/styles/territory-list.scss
+++ b/src/styles/territory-list.scss
@@ -1,4 +1,5 @@
#communities-list,
+#tzcld-user-profile-wrapper,
#tzcld-mes-territoires {
[name=segment1] .ss-multi-selected {
background: #fff;
@@ -16,4 +17,49 @@
height: 100%;
width: 100%;
}
-}
\ No newline at end of file
+}
+#tzcld-user-profile-wrapper {
+ [name=segment1] .ss-multi-selected {
+ background: #fff;
+ }
+ .communities-logo {
+ display: block;
+ height: 0;
+ width: 100%;
+ padding-bottom: 60%;
+ }
+ .communities-logo div {
+ position: absolute;
+ background-position: 50%;
+ background-repeat: no-repeat;
+ background-size: contain;
+ display: block;
+ height: 100%;
+ width: 100%;
+ }
+}
+
+.territoires-mini-card-2 .links{
+ position: absolute;
+ right: 0;
+ top: 0;
+
+ solid-link.icon {
+ background: var(--color-primary);
+ border-radius: 50%;
+ display: inline-block;
+ padding: 10px;
+
+ &:before {
+ color: #fff!important;
+ font-size: 18px;
+ }
+ &:hover {
+ border: 2px solid var(--color-primary);
+ background-color: #fff;
+ &:before {
+ color: var(--color-primary)!important;
+ }
+ }
+ }
+}
diff --git a/src/views-terrytories.js b/src/views-terrytories.js
index 2dc250c..dc568bc 100644
--- a/src/views-terrytories.js
+++ b/src/views-terrytories.js
@@ -47,13 +47,7 @@ import("./utils.js").then((utils) => {
viewWidgets() {
let render = `
- <solid-widget name="tzcld-communities-logo">
- <template>
- <div class="communities-logo">
- \${value != "" ? \`<div \style="background-image:url(\${value});" />\` : \`<div></div>\`}
- </div>
- </template>
- </solid-widget>
+
<solid-widget name="tzcld-communities-counter-alternate">
<template>
diff --git a/src/widjets-display-territory-tzcld.js b/src/widjets-display-territory-tzcld.js
index 058196c..16923d2 100644
--- a/src/widjets-display-territory-tzcld.js
+++ b/src/widjets-display-territory-tzcld.js
@@ -48,7 +48,7 @@ import("./utils.js").then((utils) => {
render += `<div class="territoires-mini-card-2 segment full shadow margin-top-small">
<div class="segment width-25 padding-small padding-top-medium">
- <solid-display class="segment full" bind-resources="" label-logo="" fields="logo" class-logo="segment full" widget-logo="orbit-user-avatar" data-src="${await tzcldprofile.community['@id']}" solid-resource="" next="communities-community-profile"></solid-display>
+ <solid-display class="segment full" label-logo="" fields="logo" class-logo="segment full" widget-logo="tzcld-communities-logo" data-src="${await tzcldprofile.community['@id']}" solid-resource=""></solid-display>
</div>
<div class="segment width-75 padding-large border-left border-color-grey">
<div class="community-card-2 segment full">
@@ -56,6 +56,7 @@ import("./utils.js").then((utils) => {
<div>${html_region + html_step_state + html_kind }</div>
</div>
</div>
+ <div class="links"><solid-link class="icon icon-secondary hover icon-info margin-top-small margin-right-small" data-src="${await tzcldprofile.community['@id']}" next="communities-community-profile"></solid-link></div>
</div>`;
this.element.innerHTML = render;
},
--
GitLab