- Codice internazionale numero + Country

package.json

@@ -69,7 +69,6 @@
     "vue-scroll-reveal": "^1.0.11",
     "vue-svgicon": "^4.0.0-alpha.3",
     "vue2-dragula": "^2.5.5",
-    "vue3-tel-input": "^1.0.4",
     "vuex": "^4.0.1",
     "vuex-router-sync": "^6.0.0-rc.1"
   },

quasar.conf.js

@@ -37,7 +37,7 @@ module.exports = configure((ctx) => ({
   // --> boot files are part of "main.js"
   // https://v2.quasar.dev/quasar-cli/boot-files
   // boot: ['vue-i18n', 'vue-meta', 'axios', 'vee-validate', 'myconfig', 'local-storage', 'error-handler', 'globalroutines', 'vue-idb', 'dragula', 'guard'],
-  boot: ['i18n', 'axios', 'vee-validate', 'myconfig', 'local-storage', 'error-handler', 'globalroutines', 'vuetelinput'],
+  boot: ['i18n', 'axios', 'vee-validate', 'myconfig', 'local-storage', 'error-handler', 'globalroutines'],
 
   // https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
   css: [

src/common/shared_vuejs.ts

@@ -44,6 +44,11 @@ export const shared_consts = {
   REPORT_FILT_RESP: 1,
   REPORT_FILT_ATTIVITA: 2,
 
+  TAB_COUNTRY: 'countries',
+  TAB_PHONES: 'phones',
+
+  TablePickup: ['countries', 'phones'],
+
   CashType: {
     None: 0,
     Incoming: 1,

src/components/CEventsCalendar/CEventsCalendar.vue

@@ -207,12 +207,12 @@
                       :label="$t('event.icon')"></q-input>
                   </div>
 
-                  <CMyEditor v-model:value="eventForm.details" :showButtons="false">
+                  <CMyEditor v-model:value="eventForm.details" :showButtons="false" :canModify="true" >
 
                   </CMyEditor>
                 </q-tab-panel>
                 <q-tab-panel name="container">
-                  <CMyEditor v-model:value="eventForm.bodytext" :showButtons="false">
+                  <CMyEditor v-model:value="eventForm.bodytext" :showButtons="false" :canModify="true">
 
                   </CMyEditor>
                 </q-tab-panel>

src/components/CGridTableRec/CGridTableRec.ts

@@ -223,8 +223,9 @@ export default defineComponent({
           // E' il mio, quindi modificalo
           return true
         }
+      } else {
+        return true
       }
-      return false
       // if (userStore.isAdmin || userStore.isManager)
       //   return true
     }

src/components/CGridTableRec/CGridTableRec.vue

@@ -214,6 +214,7 @@
                 <CMyPopupEdit
                   :table="mytable"
                   :canEdit="canEdit"
+                  :canModify="canModifyThisRec(props.row)"
                   :disable="disabilita()"
                   :mycol="col"
                   v-model:row="props.row"
@@ -338,6 +339,7 @@
               <CMyPopupEdit
                 :table="mytable"
                 :canEdit="true"
+                :canModify="canModifyThisRec(rowclicksel)"
                 :disable="disabilita()"
                 view="field"
                 :mycol="mycol"
@@ -373,6 +375,7 @@
                 <CMyPopupEdit
                   :table="mytable"
                   :canEdit="true"
+                  :canModify="true"
                   :mycol="col"
                   v-model:row="newRecord"
                   :field="col.field"
@@ -412,6 +415,7 @@
                 <CMyPopupEdit
                   :table="mytable"
                   :canEdit="true"
+                  :canModify="canModifyThisRec(recModif)"
                   :mycol="col"
                   :isInModif="true"
                   v-model:row="recModif"

src/components/CMyAvatar/CMyAvatar.ts

@@ -14,6 +14,7 @@ export default defineComponent({
       required: false,
       default: '40px',
     },
+    //++Todo: add username
   },
 
   setup(props) {
@@ -25,6 +26,7 @@ export default defineComponent({
     const imgprofile = ref(userStore.my.profile.img)
     const myimgvar = toRef(props, 'myimg')
 
+
     function refresh() {
       if (!props.myimg) {
         myicon.value = 'fas fa-user-circle'

src/components/CMyAvatar/CMyAvatar.vue

@@ -1,5 +1,6 @@
 <template>
     <div>
+      {{myimgint}}
         <q-avatar v-if="!myimgint" class="q-mb-sx center_img" :icon="myicon" :font-size="size">
 
         </q-avatar>

src/components/CMyFieldDb/CMyFieldDb.ts

@@ -45,6 +45,11 @@ export default defineComponent({
       required: false,
       default: false,
     },
+    canModify: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
     disable: {
       type: Boolean,
       required: false,
@@ -75,6 +80,16 @@ export default defineComponent({
       required: false,
       default: '',
     },
+    tablesel: {
+      type: String,
+      required: false,
+      default: '',
+    },
+    pickup: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
   components: { CMyPopupEdit },
   setup(props, { emit }) {
@@ -94,6 +109,10 @@ export default defineComponent({
         setValDb($q, props.mykey, newval, props.type, props.serv, props.table, props.mysubkey, props.id, props.indrec, props.mysubsubkey)
     }
 
+    function withBorder() {
+      return col.value.fieldtype !== costanti.FieldType.onlydate && col.value.fieldtype !== costanti.FieldType.date
+    }
+
     return {
       tools,
       costanti,
@@ -102,6 +121,7 @@ export default defineComponent({
       col,
       row,
       showandsel,
+      withBorder,
     }
   },
 })

src/components/CMyFieldDb/CMyFieldDb.vue

@@ -20,8 +20,9 @@
         </q-field>
       </div>
 
-      <div :class="` q-ma-sm q-pa-sm col-grow rounded-borders `" style="border: 1px solid #bbb">
+      <div :class="` q-ma-sm q-pa-sm col-grow rounded-borders `" :style="withBorder() ? `border: 1px solid #bbb` : ``">
         <CMyPopupEdit
+          v-bind="$attrs"
           :title="title"
           :field="mykey"
           :subfield="mysubkey"
@@ -35,8 +36,11 @@
           :myimg="myimg"
           :id="id"
           :idmain="idmain"
+          :canModify="canModify"
           :canEdit="true"
           :mycol="col"
+          :tablesel="tablesel"
+          :pickup="pickup"
           v-model:row="row"
           minuteinterval="1"
           @showandsave="showandsel"
@@ -44,266 +48,6 @@
 
         </CMyPopupEdit>
       </div>
-
-      <!--
-
-        @save="SaveValue"
-        @show="selItem(props.row, col)"
-        @showandsave="showandsel"
-
-
-      <div :class="getclassCol(col) + ` q-ma-sm q-pa-sm col-grow rounded-borders `" style="border: 1px solid #bbb">
-        <div v-if="type === costanti.FieldType.date">
-          <CDateTime
-            :label="col.label"
-            class="cursor-pointer"
-            v-model:value="myvalue"
-            :readonly="false"
-            :dense="true"
-            :canEdit="canEdit"
-          >
-          </CDateTime>
-        </div>
-        <div v-else-if="type === costanti.FieldType.onlydate">
-          <CDateTime
-            :label="col.label"
-            class="cursor-pointer"
-            v-model:value="myvalue"
-            :readonly="false"
-            :dense="true"
-            :canEdit="canEdit"
-            view="date"
-          >
-          </CDateTime>
-        </div>
-        <div v-else :class="mycl">
-          <div v-if="type === costanti.FieldType.binary">
-            <CMyChipList
-              :type="costanti.FieldType.binary"
-              :value="myvalue"
-              :options="globalStore.getTableJoinByName(col.jointable)"
-              :optval="fieldsTable.getKeyByTable(col.jointable)"
-              :optlab="fieldsTable.getLabelByTable(col.jointable)"
-              :opticon="fieldsTable.getIconByTable(col.jointable)"></CMyChipList>
-          </div>
-          <div v-else-if="type === costanti.FieldType.nationality">
-            <q-input
-              input-class="cursor-pointer text-center"
-              :readonly="true"
-              v-model="countryname"
-              rounded
-              dense
-              debounce="1000"
-            >
-
-              <div class="hidden">
-              </div>
-
-            </q-input>
-          </div>
-          <div v-else-if="type === costanti.FieldType.intcode">
-
-            <div v-html="myvalprinted()"></div>
-
-          </div>
-          <div v-else-if="((type === costanti.FieldType.multiselect) || (type === costanti.FieldType.multioption))">
-            <CMyChipList
-              :type="type"
-              :value="myvalue"
-              :options="globalStore.getTableJoinByName(col.jointable)"
-              :optval="fieldsTable.getKeyByTable(col.jointable)"
-              :optlab="fieldsTable.getLabelByTable(col.jointable)"
-              :opticon="fieldsTable.getIconByTable(col.jointable)"></CMyChipList>
-          </div>
-          <div v-else-if="type === costanti.FieldType.select">
-            <CMyChipList
-              myclass="text-center"
-              :type="costanti.FieldType.select"
-              :value="myvalue"
-              :options="globalStore.getTableJoinByName(col.jointable)"
-              :optval="fieldsTable.getKeyByTable(col.jointable)"
-              :optlab="fieldsTable.getLabelByTable(col.jointable)"
-              :opticon="fieldsTable.getIconByTable(col.jointable)"></CMyChipList>
-          </div>
-          <div v-else-if="type === costanti.FieldType.image">
-
-            <div v-if="myvalue" class="text-center">
-              <q-img
-                :src="myvalue"
-                class="text-center"
-                style="height: 100px; width: 100px;"
-                alt="foto del profilo">
-              </q-img>
-            </div>
-            <div v-else class="text-center">
-              <q-img
-                src="images/noimg-user.svg"
-                class="text-center"
-                style="height: 100px; width: 100px;"
-                alt="nessuna immagine">
-              </q-img>
-            </div>
-          </div>
-          <div v-else-if="type === costanti.FieldType.html">
-            <div v-html="myvalprinted()">
-
-            </div>
-          </div>
-          <div v-else-if="type === costanti.FieldType.boolean">
-            <q-toggle
-              dark color="green" v-model="myvalue" :label="col.title"
-              @update:model-value="savefieldboolean"></q-toggle>
-          </div>
-          <div v-else>
-            <div v-html="myvalprinted()"></div>
-          </div>
-
-          <q-popup-edit
-            v-if="(canEdit && type !== costanti.FieldType.boolean) && !disable"
-            v-model="myvalue"
-            :disable="col.disable"
-            :title="col.title"
-            @save="(val, initialValue) => savefield(val, initialValue, myq)"
-            buttons
-            v-slot="scope"
-            class="clinput"
-          >
-
-            <div v-if="type === costanti.FieldType.boolean">
-              <q-checkbox v-model="scope.value" :label="col.title">
-              </q-checkbox>
-              <div v-html="visuValByType(myvalue)">
-              </div>
-            </div>
-            <div v-else-if="type === costanti.FieldType.string">
-              <q-input
-                :label="title"
-                v-model="scope.value"
-                :autogrow="$q.screen.gt.md"
-                @keyup.enter.stop
-                autofocus>
-
-              </q-input>
-            </div>
-            <div v-else-if="type === costanti.FieldType.password">
-              <q-input
-                v-model="scope.value"
-                type="password"
-                @keyup.enter="scope.set"
-                autofocus>
-
-              </q-input>
-            </div>
-            <div v-else-if="type === costanti.FieldType.number">
-              <q-input
-                v-model="scope.value" type="number"
-                @keyup.enter="scope.set"
-                autofocus>
-
-              </q-input>
-            </div>
-            <div v-else-if="type === costanti.FieldType.hours">
-              <CMySelect
-                label="Ore" v-model:value="myvalue"
-                optval="_id" optlab="label"
-                :useinput="false"
-                :options="tools.SelectHours">
-              </CMySelect>
-            </div>
-            <div v-else-if="type === costanti.FieldType.binary">
-              <CMyToggleList
-                :label="col.title"
-                :options="globalStore.getTableJoinByName(col.jointable)"
-                v-model:value="myvalue"
-                :optval="fieldsTable.getKeyByTable(col.jointable)"
-                :optlab="fieldsTable.getLabelByTable(col.jointable)">
-              </CMyToggleList>
-            </div>
-            <div v-else-if="type === costanti.FieldType.html">
-              <CMyEditor v-model:value="myvalue" :title="title" @keyup.enter.stop>
-
-              </CMyEditor>
-            </div>
-            <div v-else-if="type === costanti.FieldType.select">
-              <CMySelect
-                :label="col.title"
-                v-model:value="myvalue"
-                :optval="fieldsTable.getKeyByTable(col.jointable)"
-                :optlab="fieldsTable.getLabelByTable(col.jointable)"
-                :options="globalStore.getTableJoinByName(col.jointable)"
-                :useinput="false">
-              </CMySelect>
-            </div>
-            <div v-else-if="col.fieldtype === costanti.FieldType.nationality">
-              <div class="justify-center q-gutter-sm clgutter q-mt-sm">
-                <q-input
-                  v-model="countryname"
-                  :readonly="true"
-                  rounded dense
-                  debounce="1000"
-                  @keyup.enter="scope.set"
-                  :label="title">
-
-                  <template v-slot:prepend>
-                    <div style="font-size: 1rem;">
-                    </div>
-                  </template>
-                </q-input>
-                <div style="height: 180px;">
-
-                </div>
-              </div>
-            </div>
-            <div v-else-if="col.fieldtype === costanti.FieldType.intcode">
-
-              <div class="justify-center q-gutter-sm clgutter q-mt-sm">
-                <div style="height: 180px;">
-
-                </div>
-              </div>
-
-            </div>
-            <div v-else-if="col.fieldtype === costanti.FieldType.multiselect">
-              <CMyToggleList
-                :label="col.title"
-                :options="globalStore.getTableJoinByName(col.jointable)"
-                v-model:value="myvalue"
-                :optval="fieldsTable.getKeyByTable(col.jointable)"
-                :optlab="fieldsTable.getLabelByTable(col.jointable)"
-                :isarray="true">
-              </CMyToggleList>
-
-            </div>
-            <div v-else-if="col.fieldtype === costanti.FieldType.multioption">
-            </div>
-            <div v-else-if="col.fieldtype === costanti.FieldType.image">
-              <q-uploader
-                label="Aggiungi Foto"
-                accept=".jpg, image/*"
-                :url="tools.geturlupload()+ tools.escapeslash(`profile/` + getMyUsername())"
-                :headers="tools.getheaders()"
-                :max-file-size="2000000"
-                auto-upload
-                hide-upload-btn
-                @uploaded="uploaded"
-                style="width: 208px"
-              ></q-uploader>
-
-            </div>
-
-          </q-popup-edit>
-        </div>
-      </div>
-      <div>
-        <div v-if="type === costanti.FieldType.image">
-          <q-btn
-            v-if="myvalue"
-            label="Rimuovi Foto"
-            color="blue" icon="fas fa-trash-alt" size="sm"
-            @click="removephoto"></q-btn>
-        </div>
-      </div>-->
-
     </div>
   </div>
 </template>

src/components/CMyPopupEdit/CMyPopupEdit.ts

@@ -135,6 +135,16 @@ export default defineComponent({
       required: false,
       default: '',
     },
+    tablesel: {
+      type: String,
+      required: false,
+      default: '',
+    },
+    pickup: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
   components: { CMyChipList, CDateTime, CDate, CMyToggleList, CMySelect, CMyEditor, CGallery },
   setup(props, { emit }) {
@@ -230,7 +240,7 @@ export default defineComponent({
       // console.log('row', props.row, 'col', props.mycol, 'newval', newval)
       // console.log('row[col.value.name]', props.row[col.value.name])
       if (props.type === costanti.FieldType.image) {
-        console.log('image', newval)
+        // console.log('image', newval)
       }
       myrow.value[col.value.name] = newval
       // console.log('changevalRec update:row', newval)
@@ -429,6 +439,16 @@ export default defineComponent({
           return '[---]'
         else
           return globalStore.getValueByTable(col, val)
+      } else if (col.fieldtype === costanti.FieldType.nationality) {
+        if (!val)
+          return '[---]'
+        else
+          return val
+      } else if (col.fieldtype === costanti.FieldType.intcode) {
+        if (!val)
+          return '[---]'
+        else
+          return val
       } else if (col.fieldtype === costanti.FieldType.multiselect) {
         if (val === undefined)
           return '[---]'
@@ -558,7 +578,6 @@ export default defineComponent({
       )
     }
 
-
     onBeforeMount(mounted)
 
     crea()

src/components/CMyPopupEdit/CMyPopupEdit.vue

@@ -124,52 +124,38 @@
           </div>
           <div v-else-if="col.fieldtype === costanti.FieldType.nationality">
             <div v-if="isInModif" class="justify-center q-gutter-sm clgutter q-mt-sm">
-              <q-input
+              <CMySelect
-                v-model:value="countryname"
+                :label="col.label"
+                v-model:value="myvalue"
                 @update:value="changevalRec"
-                :readonly="true"
+                :tablesel="tablesel"
-                rounded dense
+                :pickup="pickup"
-                debounce="1000"
+                :optval="fieldsTable.getKeyByTable(col.jointable)"
-                @keyup.enter="scope.set"
+                :optlab="fieldsTable.getLabelByTable(col.jointable)"
-                :label="title"
+                :options="globalStore.getTableJoinByName(col.jointable)"
-              >
+                :useinput="false">
-
+              </CMySelect>
-                <template v-slot:prepend>
-                  <div style="font-size: 1rem;">
-                    <!--<vue-country-code
-                      :defaultCountry="myvalue"
-                      :disabledFetchingCountry="true"
-                      @onSelect="selectcountry"
-                      :preferredCountries="tools.getprefCountries"
-                      :dropdownOptions="{ disabledDialCode: true }">
-
-                    </vue-country-code>-->
-                  </div>
-                </template>
-              </q-input>
-              <div style="height: 180px;">
-
-              </div>
             </div>
             <div v-else>
-              {{ myvalue }}
+              <span v-html="visuValByType(myvalue, col, row)"></span>
             </div>
           </div>
           <div v-else-if="col.fieldtype === costanti.FieldType.intcode">
-            <div v-if="isInModif">
+            <div v-if="isInModif" class="justify-center q-gutter-sm clgutter q-mt-sm">
-              <!--                <vue-tel-input
+              <CMySelect
-                                @country-changed="intcode_change"
+                :label="col.label"
-                                :value="scope.value"
+                v-model:value="myvalue"
-                                @update:model-value="oninput"
+                @update:value="changevalRec"
-                                :placeholder="$t('reg.cell')"
+                :tablesel="tablesel"
-                                :enabledCountryCode="true"
+                :pickup="pickup"
-                                inputClasses="clCell"
+                :optval="fieldsTable.getKeyByTable(col.jointable)"
-                                wrapperClasses="clCellCode">
+                :optlab="fieldsTable.getLabelByTable(col.jointable)"
-                              </vue-tel-input>
+                :options="globalStore.getTableJoinByName(col.jointable)"
-                              -->
+                :useinput="false">
+              </CMySelect>
             </div>
             <div v-else>
-              {{ myvalue }}
+              <span v-html="visuValByType(myvalue, col, row)"></span>
             </div>
           </div>
           <div v-else-if="col.fieldtype === costanti.FieldType.date">
@@ -445,46 +431,33 @@
             </div>
             <div v-else-if="col.fieldtype === costanti.FieldType.nationality">
               <div class="justify-center q-gutter-sm clgutter q-mt-sm">
-                <q-input
+                <CMySelect
-                  v-model="countryname"
+                  :label="col.label"
-                  :readonly="true"
+                  v-model:value="scope.value"
-                  rounded dense
+                  @update:value="changevalRec"
-                  debounce="1000"
+                  :tablesel="tablesel"
-                  @keyup.enter="scope.set"
+                  :pickup="pickup"
-                  :label="title"
+                  :optval="fieldsTable.getKeyByTable(tablesel)"
-                >
+                  :optlab="fieldsTable.getLabelByTable(tablesel)"
-
+                  :options="[]"
-                  <template v-slot:prepend>
+                  :useinput="false">
-                    <div style="font-size: 1rem;">
+                </CMySelect>
-                      <!--<vue-country-code
-                        :defaultCountry="scope.value"
-                        :disabledFetchingCountry="true"
-                        @onSelect="selectcountry"
-                        :preferredCountries="tools.getprefCountries"
-                        :dropdownOptions="{ disabledDialCode: true }">
-
-                      </vue-country-code>-->
-                    </div>
-                  </template>
-                </q-input>
-                <div style="height: 180px;">
-
-                </div>
               </div>
             </div>
             <div v-else-if="col.fieldtype === costanti.FieldType.intcode">
-
+              <div class="justify-center q-gutter-sm clgutter q-mt-sm">
-              <!--                <vue-tel-input
+                <CMySelect
-                                @country-changed="intcode_change"
+                  :label="col.label"
-                                :value="scope.value"
+                  v-model:value="scope.value"
-                                @update:model-value="oninput"
+                  @update:value="changevalRec"
-                                :placeholder="$t('reg.cell')"
+                  :tablesel="tablesel"
-                                :enabledCountryCode="true"
+                  :pickup="pickup"
-                                inputClasses="clCell"
+                  :optval="fieldsTable.getKeyByTable(tablesel)"
-                                wrapperClasses="clCellCode">
+                  :optlab="fieldsTable.getLabelByTable(tablesel)"
-                              </vue-tel-input>
+                  :options="[]"
-                              -->
+                  :useinput="false">
-
+                </CMySelect>
+              </div>
             </div>
             <div v-else-if="col.fieldtype === costanti.FieldType.binary">
 

src/components/CMySelect/CMySelect.ts

@@ -4,6 +4,8 @@ import { useUserStore } from '@store/UserStore'
 import { useGlobalStore } from '@store/globalStore'
 import { useQuasar } from 'quasar'
 import { costanti } from '@costanti'
+import { fieldsTable } from '@store/Modules/fieldsTable'
+import { shared_consts } from '@/common/shared_vuejs'
 
 export default defineComponent({
   name: 'CMySelect',
@@ -23,6 +25,11 @@ export default defineComponent({
       required: false,
       default: ''
     },
+    tablesel: {
+      type: String,
+      required: false,
+      default: ''
+    },
     optlab: [String, Function],
     optval: {
       type: String,
@@ -33,6 +40,11 @@ export default defineComponent({
       required: false,
       default: true
     },
+    pickup: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     addall: {
       type: Boolean,
       required: false,
@@ -64,9 +76,12 @@ export default defineComponent({
     const userStore = useUserStore()
     const globalStore = useGlobalStore()
 
+    const optFiltered = ref(<any>[])
+    const valori = ref(<any>[])
+
     const myvalue = ref(<string | number>'')
 
-    const valori = computed(() => {
+    const valoriload = computed(() => {
       let myarr = props.options
       if (props.addall) {
         let myobj: any = {}
@@ -82,10 +97,15 @@ export default defineComponent({
     })
 
     function changeval(newval: any) {
-      console.log('changeval', newval)
+      if (props.tablesel === shared_consts.TAB_COUNTRY)
+        myvalue.value = newval && newval['value'] ? newval['value'] : newval
+      else if (props.tablesel === shared_consts.TAB_PHONES)
+        myvalue.value = newval && newval['code'] ? newval['code'] : newval
+      else
         myvalue.value = newval
-      emit('update:value', newval)
+      console.log('Myselect changeval', myvalue.value)
-      emit('changeval', newval)
+      emit('update:value', myvalue.value)
+      emit('changeval', myvalue.value)
     }
 
     function mounted() {
@@ -117,12 +137,63 @@ export default defineComponent({
       // console.log('cmyselect: myvalue.value', myvalue.value)
     }
 
+    function filterFn(val: any, update: any, abort: any) {
+      update(
+        async () => {
+          console.log('Filter val', val, val.length)
+          let myarr: any = []
+
+          if (val.length < 1) {
+            abort()
+            return
+          }
+
+          let mystr = val.toLocaleLowerCase()
+
+          if (fieldsTable.tableRemotePickup.includes(props.tablesel)) {
+            // if (myvalue.value.length > 1) {
+            if (mystr !== '')
+              myarr = await globalStore.loadPickup({ table: props.tablesel, search: mystr })
+            // const needle = val.toLocaleLowerCase()
+            // optFiltered.value = optFiltered.value.filter((v: any) => v.toLocaleLowerCase().indexOf(needle) > -1)
+            // }
+          } else {
+            myarr = props.options
+          }
+
+          if (props.addall) {
+            let myobj: any = {}
+            if (typeof props.optlab === 'string') {
+              myobj[props.optlab] = '(Tutti)'
+              myobj[props.optval] = costanti.FILTER_TUTTI
+            }
+
+            myarr = [myobj, ...myarr]
+          }
+
+          valori.value = myarr
+
+          console.log('tablesel', props.tablesel, 'filterFn', myarr)
+        },
+        // "ref" is the Vue reference to the QSelect
+        (ref: any) => {
+          if (val !== '' && ref.options.length > 0) {
+            ref.setOptionIndex(-1) // reset optionIndex in case there is something selected
+            ref.moveOptionSelection(1, true) // focus the first selectable option and do not update the input-value
+          }
+        }
+      )
+    }
+
     onMounted(mounted)
 
+    valori.value = valoriload.value
+
     return {
       changeval,
       myvalue,
       valori,
+      filterFn,
     }
   }
 })

src/components/CMySelect/CMySelect.vue

@@ -22,6 +22,47 @@
     </div>
     <div v-else>
       <q-select
+        v-if="pickup"
+        filled
+        :model-value="myvalue"
+        clearable
+        use-input
+        hide-selected
+        fill-input
+        input-debounce="300"
+        :dense="dense"
+        :input-class="myclass"
+        :options="valori"
+        :option-value="optval"
+        :option-label="optlab"
+        map-options
+        @filter="filterFn"
+        @update:model-value="changeval"
+        :label="label"
+        options-selected-class="text-deep-orange"
+        v-bind="$attrs"
+        style="width: 250px"
+      >
+        <template v-slot:no-option>
+          <q-item>
+            <q-item-section class="text-grey">
+              No results
+            </q-item-section>
+          </q-item>
+        </template>
+        <template v-slot:option="scope">
+          <q-item v-bind="scope.itemProps">
+            <q-item-section avatar>
+              {{ scope.opt.flag }}
+            </q-item-section>
+            <q-item-section>
+              <q-item-label> {{ scope.opt.value }}</q-item-label>
+            </q-item-section>
+          </q-item>
+        </template>
+      </q-select>
+      <q-select
+        v-else
         :multiple="multiple"
         rounded
         outlined

src/model/GlobalStore.ts

@@ -435,6 +435,10 @@ export interface IParLookup {
   lk_proj?: string,
 }
 
+export interface IParamsPickup {
+  table: string
+  search: string
+}
 export interface IParamsQuery {
   table: string
   startRow: number
@@ -485,6 +489,7 @@ export interface ITableRec {
   colicon?: string
   onlyAdmin?: boolean
   noshow: boolean
+  remote?: boolean
 }
 
 export interface ISearchList {

src/model/UserStore.ts

@@ -13,8 +13,6 @@ export interface IUserProfile {
   intcode_cell?: string
   iso2_cell?: string
   cell?: string
-  dateofbirth?: Date
-  sex?: ESexType
   country_pay?: string
   email_paypal?: string
   payeer_id?: string
@@ -25,20 +23,27 @@ export interface IUserProfile {
   username_telegram?: string
   teleg_id?: number
   teleg_checkcode?: number
-  my_dream?: string
   paymenttypes?: IPaymentType[]
   manage_telegram?: boolean
+  resplist?: any
+  workerslist?: any
+  dateofbirth?: Date
+  born_city?: string
+  born_province?: string
+  born_country?: string
+  my_dream?: string
+  saw_and_accepted?: boolean
   saw_zoom_presentation?: boolean
   ask_zoom_partecipato?: boolean
-  saw_and_accepted?: boolean
   qualified?: boolean
   qualified_2invitati?: boolean
-  myshares: IShareWithUs[]
+  special_req?: boolean
+  sex?: ESexType
+  biografia?: string
   socio?: boolean
   socioresidente?: boolean
   consiglio?: boolean
-  resplist?: any
+  myshares: IShareWithUs[]
-  workerslist?: any
 }
 
 export interface IPaymentType {

src/statics/lang/it.js

@@ -374,7 +374,7 @@ const msg_it = {
       intcode_cell: 'Prefisso Int.',
       cell: 'Cellulare',
       cellreg: 'Cellulare con cui ti eri registrato',
-      nationality: 'Nazionalità',
+      nationality: 'Paese di Nascita',
       email_paypal: 'Email Paypal',
       payeer_id: 'Id Payeer',
       advcash_id: 'Email Advanced Cash',

src/store/Modules/fieldsTable.ts

@@ -321,6 +321,17 @@ export const colCitys = [
   AddCol(DuplicateRec),
 ]
 
+export const colTableCountry = [
+  AddCol({ name: 'id', label_trans: 'index', fieldtype: costanti.FieldType.string }),
+  AddCol({ name: 'value', label_trans: 'city.country' }),
+  AddCol({ name: 'flag', label_trans: 'city.flag' }),
+]
+export const colTablePhones = [
+  AddCol({ name: 'id', label_trans: 'index', fieldtype: costanti.FieldType.string }),
+  AddCol({ name: 'value', label_trans: 'city.country' }),
+  AddCol({ name: 'flag', label_trans: 'city.flag' }),
+]
+
 export const colSkills = [
   // AddCol({ name: '_id', label_trans: 'index', fieldtype: costanti.FieldType.number }),
   AddCol({ name: 'descr', label_trans: 'store.description' }),
@@ -415,6 +426,12 @@ export const colTableSites = [
   AddCol({ name: 'telegram_key', label_trans: 'sites.telegram_key', fieldtype: costanti.FieldType.string }),
   AddCol({ name: 'telegram_bot_name', label_trans: 'sites.telegram_bot_name', fieldtype: costanti.FieldType.string }),
   AddCol({ name: 'pathreg_add', label_trans: 'sites.pathreg_add', fieldtype: costanti.FieldType.string }),
+  AddCol({ name: 'who', label_trans: 'sites.who', fieldtype: costanti.FieldType.string }),
+  AddCol({ name: 'status', label_trans: 'sites.status', fieldtype: costanti.FieldType.string }),
+  AddCol({ name: 'note', label_trans: 'sites.note', fieldtype: costanti.FieldType.string }),
+  AddCol({ name: 'domain_provider', label_trans: 'sites.domain_provider', fieldtype: costanti.FieldType.string }),
+  AddCol({ name: 'domain_expiring', label_trans: 'reg.domain_expiring', fieldtype: costanti.FieldType.onlydate }),
+  AddCol({ name: 'next_payment', label_trans: 'reg.next_payment', fieldtype: costanti.FieldType.onlydate }),
   AddCol(DeleteRec),
   AddCol(DuplicateRec),
 ]
@@ -871,6 +888,9 @@ export const fieldsTable = {
     AddCol({ name: 'email', label_trans: 'reg.email' }),
     AddCol({ name: 'verified_email', label_trans: 'reg.verified_email', fieldtype: costanti.FieldType.boolean }),
     AddCol({ name: 'profile.dateofbirth', label_trans: 'reg.dateofbirth', fieldtype: costanti.FieldType.onlydate }),
+    AddCol({ name: 'profile.born_city', label_trans: 'reg.born_city', fieldtype: costanti.FieldType.string }),
+    AddCol({ name: 'profile.born_province', label_trans: 'reg.born_province', fieldtype: costanti.FieldType.string }),
+    AddCol({ name: 'profile.born_country', label_trans: 'reg.born_country', fieldtype: costanti.FieldType.string }),
     AddCol({
       name: 'profile.resplist',
       field: 'profile',
@@ -1264,6 +1284,11 @@ export const fieldsTable = {
     'myskills',
   ],
 
+  tableRemotePickup: [
+    'countries',
+    'phones',
+  ],
+
   tableWithUsername: [
     'myskills',
   ],
@@ -1512,6 +1537,22 @@ export const fieldsTable = {
       colkey: '_id',
       collabel: 'comune',
     },
+    {
+      value: 'countries',
+      label: 'Nazione',
+      columns: colTableCountry,
+      colkey: 'id',
+      collabel: 'value',
+      remote: true,
+    },
+    {
+      value: 'phones',
+      label: 'Prefisso Int.',
+      columns: colTablePhones,
+      colkey: 'id',
+      collabel: 'value',
+      remote: true,
+    },
   ],
 }
 

src/store/globalStore.ts

@@ -6,7 +6,7 @@ import {
   IDataToSet,
   IGlobalState,
   IListRoutes,
-  IMyPage,
+  IMyPage, IParamsPickup,
   IParamsQuery,
   ISettings,
   StateConnection,
@@ -232,7 +232,9 @@ export const useGlobalStore = defineStore('GlobalStore', {
         return state.sectors
       else if (table === 'cities')
         return state.cities
-      else return ris
+      else {
+        return ris
+      }
 
       return ris
     },
@@ -720,6 +722,22 @@ export const useGlobalStore = defineStore('GlobalStore', {
         })
     },
 
+    async loadPickup(params: IParamsPickup) {
+      console.log('loadPickup', params)
+      const userStore = useUserStore()
+
+      return Api.SendReq('/pickup', 'POST', params)
+        .then((res) => {
+          // console.table(res)
+          return res.data
+        })
+        .catch((error) => {
+          console.log('error loadPickup', error)
+          userStore.setErrorCatch(error)
+          return null
+        })
+    },
+
     async loadPage(path: string) {
       const userStore = useUserStore()
 

src/views/user/profile/profile.vue

@@ -45,15 +45,19 @@
             :type="costanti.FieldType.string">
           </CMyFieldDb>
         </div>
-        <!--<CMyFieldDb
-          :title="$t('reg.nationality')"
-          table="users"
-          mykey="profile"
-          mysubkey="nationality"
-          :type="costanti.FieldType.nationality">
-        </CMyFieldDb>-->
 
         <div class="myrow">
+          <CMyFieldDb
+            :title="$t('reg.nationality')"
+            table="users"
+            tablesel="countries"
+            mykey="profile"
+            :useinput="false"
+            mysubkey="nationality"
+            :pickup="true"
+            :type="costanti.FieldType.nationality">
+          </CMyFieldDb>
+
           <CMyFieldDb
             :title="$t('reg.dateofbirth')"
             table="users"
@@ -63,7 +67,6 @@
           </CMyFieldDb>
         </div>
 
-
         <div class="myrow">
 
           <CMyFieldDb
@@ -71,7 +74,9 @@
             table="users"
             mykey="profile"
             mysubkey="intcode_cell"
-            :type="costanti.FieldType.intcode">
+            :type="costanti.FieldType.intcode"
+            tablesel="phones"
+            :pickup="true">
           </CMyFieldDb>
           <CMyFieldDb
             :title="$t('reg.cell')"

yarn.lock

@@ -12886,10 +12886,10 @@ vue2-dragula@^2.5.5:
   dependencies:
     dragula "3.7.2"
 
-vue3-tel-input@^1.0.4:
+vue3-tel-input@^5.0.4-vue3:
-  version "1.0.4"
+  version "5.0.4-vue3"
-  resolved "https://registry.yarnpkg.com/vue3-tel-input/-/vue3-tel-input-1.0.4.tgz#ed26cb808d124aebb5073d03f366b23e686804d6"
+  resolved "https://registry.yarnpkg.com/vue3-tel-input/-/vue3-tel-input-5.0.4-vue3.tgz#ed79e21e9fba84eef2ba7a467cade202c2e7ada2"
-  integrity sha512-C60OyAq5ORDErSJ4x7UmJJbF95CDncMswnySmAUtbuBP0pcVcJBu6DOTxKquykvTbJEh9I73DXyqMtDxtLrwJg==
+  integrity sha512-QvN7tyqzqL/gIBOohNcYdEbjpWzd3kucCMcqyVIpckBIPNl6ki/ARd0y/I73jKfUJ0Hg5RSxHu/IgIWAtMKMrw==
   dependencies:
     core-js "^3.6.5"
     libphonenumber-js "^1.9.6"