eventi grafica

src/common/shared_vuejs.ts

@@ -207,7 +207,7 @@ export const shared_consts = {
   TABLES_ORDER_DATE_UPDATED: ['myskills', 'myhosps', 'mygoods'],
   TABLES_ORDER_DESCR: ['mygroups'],
 
-  TABLES_VISU_IMG: ['myskills', 'mybachecas', 'myhosps', 'mygoods', 'mygroups'],
+  TABLES_VISU_IMG: ['myskills', 'myhosps', 'mygoods', 'mygroups'],
   TABLES_DIRECTORY_A_PARTE: ['mygroups'],
   TABLES_WITH_ADMINS: ['mygroups', 'circuits'],
   TABLES_DIRECTORY_SINGLE_IMG: ['circuits'],

src/components/CGridTableRec/CGridTableRec.ts

@@ -643,10 +643,11 @@ export default defineComponent({
     function getObjSort(sortBy: any, descending: any) {
       let myobj: any = {}
       if (tools.isObject(sortBy)) {
+        console.log('sortBy', sortBy)
         return sortBy
       } else if (sortBy) {
         sortBy = sortBy + ''
-        descending = descending + ''
+        // descending = descending + ''
         let arrsort = (sortBy && sortBy.indexOf(',') > 0) ? sortBy.split(',') : [];
         let arrdescending = (descending && descending.lenght > 1 && descending.indexOf(',') > 0) ? descending.split(',') : [];
         if (arrsort.length > 0) {
@@ -660,6 +661,7 @@ export default defineComponent({
         }
       }
 
+      console.log('myobj', myobj)
       return myobj
     }
 

src/components/CGridTableRec/CGridTableRec.vue

@@ -249,7 +249,14 @@
                 color="positive"
                 icon="fas fa-filter"
                 @click="showfilter = !showfilter"
-                ><q-badge v-if="getNumFilterSelected()" color="red" floating transparent> {{ getNumFilterSelected() }} </q-badge>
+                ><q-badge
+                  v-if="getNumFilterSelected()"
+                  color="red"
+                  floating
+                  transparent
+                >
+                  {{ getNumFilterSelected() }}
+                </q-badge>
               </q-btn>
 
               <q-btn
@@ -369,8 +376,27 @@
           <div v-if="row && shared_consts.TABLES_WITH_DATE.includes(tablesel)">
             <div
               v-if="
-                row.dateTimeStart &&
+                actmonth !== tools.getstrMonth(row.dateTimeStart) || !actmonth
-                (tools.getstrVeryShortDate(row.dateTimeStart) !== actual) || index === 0
+              "
+            >
+              <span style="display: none">{{
+                (actmonth = tools.getstrMonth(row.dateTimeStart))
+              }}</span>
+              <div class="">
+                <div>
+                  <strong>{{ tools.getstrMonth(row.dateTimeStart) }}</strong>
+                </div>
+                <div>
+                  <q-separator />
+                </div>
+              </div>
+            </div>
+
+            <div
+              v-if="false &&
+                ((row.dateTimeStart &&
+                  tools.getstrVeryShortDate(row.dateTimeStart) !== actual) ||
+                index === 0)
               "
               class="actualdate"
             >
@@ -1090,7 +1116,6 @@
       @hide="hidewindow"
       :maximized="$q.screen.lt.sm"
     >
-
       <CMyCardGrpPopup
         v-if="mytable === toolsext.TABMYGROUPS"
         :table="mytable"
@@ -1103,8 +1128,11 @@
         :prop_myrec="myrecdialog"
       >
       </CMyCardCircuitPopup>
-      <CMyCardService v-else-if="shared_consts.TABLES_FAVORITE_BOOKMARK.includes(mytable)"
+      <CMyCardService
-        :table="mytable" :prop_myrec="myrecdialog">
+        v-else-if="shared_consts.TABLES_FAVORITE_BOOKMARK.includes(mytable)"
+        :table="mytable"
+        :prop_myrec="myrecdialog"
+      >
       </CMyCardService>
       <CMyCardPopup v-else :table="mytable" :prop_myrec="myrecdialog">
       </CMyCardPopup>

src/components/CMyRecCard/CMyRecCard.vue

@@ -11,21 +11,50 @@
         : ``)
     "
   >
+    <div v-if="myrec && table === shared_consts.TABLES_MYBACHECAS">
+      <div class="row">
+        <div class="col-2 q-my-sm">
+          <div class="column">
+            <span class="ev_dayofweek">{{
+              tools.getDayOfWeek(myrec.dateTimeStart)
+            }}</span>
+            <span class="ev_day">{{
+              tools.getstrDay(myrec.dateTimeStart)
+            }}</span>
+          </div>
+        </div>
+        <div class="col-10">
+          <q-img
+            :src="
+              tools.getFullFileName(myrec.photos, table, myrec.username, '')
+            "
+            :alt="myrec.descr"
+            img-class="imgprofile"
+            height="270px"
+            fit="contain"
+            @click="cmdExt(costanti.CMD_SHOW_PAGE, myrec)"
+          />
+          <div>
+            {{tools.getstrDateTimeEvent($t, myrec, false)}}</div>
+
+        </div>
+      </div>
+    </div>
     <q-item
       v-if="myrec"
       clickable
       v-ripple
       :class="
-        `shadow-2 butt_rounded ` + (tools.isPartecipero(myrec) ? ` butt_green ` : '')
+        `shadow-2 butt_rounded ` +
+        (tools.isPartecipero(myrec) ? ` butt_green ` : '')
       "
     >
       <q-item-section
         v-if="
-          shared_consts.TABLES_VISU_IMG.includes(table) &&
+          (shared_consts.TABLES_VISU_IMG.includes(table) &&
-          (myrec.photos &&
+            myrec.photos &&
             myrec.photos.length > 0) ||
-          (myrec.mygrp &&
+          (myrec.mygrp && myrec.mygrp.photos.length > 0)
-          myrec.mygrp.photos.length > 0)
         "
         avatar
         @click="cmdExt(costanti.CMD_SHOW_PAGE, myrec)"
@@ -45,7 +74,11 @@
 
         <q-avatar size="60px">
           <q-img
-            v-if="myrec.mygrp && myrec.mygrp.groupname && tools.getValue(myrec.mygrp, 'photos', '')"
+            v-if="
+              myrec.mygrp &&
+              myrec.mygrp.groupname &&
+              tools.getValue(myrec.mygrp, 'photos', '')
+            "
             :src="
               tools.getFullFileName(
                 tools.getValue(myrec.mygrp, 'photos', ''),
@@ -59,6 +92,7 @@
           >
           </q-img>
           <q-img
+            v-else
             :src="
               tools.getFullFileName(myrec.photos, table, myrec.username, '')
             "
@@ -69,7 +103,7 @@
         </q-avatar>
       </q-item-section>
 
-      <q-item-section v-else avatar @click="naviga(`/my/` + myrec.username)">
+      <q-item-section v-else-if="!myrec.organisedBy" avatar @click="naviga(`/my/` + myrec.username)">
         <q-badge
           v-if="showBadge()"
           class="q-my-xs self-center"
@@ -120,7 +154,7 @@
           <!--<span class="dateevent" v-if="myrec.dateTimeStart">dal <span class="datainizio">{{tools.getstrVeryShortDate(myrec.dateStart) }}</span> al <span class="datafine">{{ tools.getstrVeryShortDate(myrec.dateEnd) }}</span>
           </span>-->
         </q-item-label>
-        <q-item-label lines="4" v-if="myrec.descr"
+        <q-item-label lines="4" :class="(table === shared_consts.TABLES_MYBACHECAS) ? 'text-bold':''" v-if="myrec.descr"
           >{{ myrec.descr }}<br />
         </q-item-label>
         <q-item-label lines="1" style="" class="text_user_city">

src/css/app.scss

@@ -1650,3 +1650,26 @@ h3 {
 .butt_green{
   background-color: rgb(202, 232, 202) !important;
 }
+
+.ev_dayofweek{
+  color: grey;
+  font-size: 0.85rem;
+  text-transform: uppercase;
+  text-align: center;
+  margin-bottom: -4px;
+}
+.ev_day{
+  color: black;
+  font-size: 1.25rem;
+  font-weight: bold;
+  text-align: center;
+}
+
+.col-105{
+    height: auto;
+    width: 90%;
+}
+.col-15{
+    height: auto;
+    width: 10%;
+}

src/store/Modules/tools.ts

@@ -3043,6 +3043,16 @@ export const tools = {
     if (mytimestamp) return date.formatDate(mytimestamp, 'DD/MM/YYYY')
     return ''
   },
+  getstrMonth(mytimestamp: Date | number | string | undefined) {
+    // console.log('getstrDate', mytimestamp)
+    if (mytimestamp) return date.formatDate(mytimestamp, 'MMMM YYYY')
+    return ''
+  },
+
+  getstrDay(mytimestamp: Date | number | string | undefined) {
+    if (mytimestamp) return date.formatDate(mytimestamp, 'D')
+    return ''
+  },
 
   getstrDateYY(mytimestamp: Date | number | string | undefined) {
     // console.log('getstrDate', mytimestamp)