- AbitaregliIblei.it

- Server aggiornamenti agli script. - Editor HTML corretto un po'. - Record Mysql per server (appena iniziato)
2024-09-06 19:57:17 +02:00
parent 8f4ff8ff9c
commit e9ac281125
50 changed files with 797 additions and 155 deletions
--- a/src/views/admin/server/server.scss
+++ b/src/views/admin/server/server.scss
@@ -40,4 +40,8 @@ $button-margin: 5px;
    /* Mostra i puntini di sospensione se il testo è troppo lungo (opzionale) */
    white-space: nowrap;
    /* Impedisce il wrapping della riga (opzionale) */
+}
+
+.selected-row {
+    background-color: #e3f2fd !important;
 }
--- a/src/views/admin/server/server.ts
+++ b/src/views/admin/server/server.ts
@@ -21,6 +21,7 @@ export default defineComponent({
    const $q = useQuasar()
    const { t } = useI18n()
    const circuitStore = useCircuitStore()
+    const userStore = useUserStore()

    const messages = ref('')
    const input = ref('')
@@ -57,6 +58,84 @@ export default defineComponent({

    const globalStore = useGlobalStore()

+    const selectedApi = ref(<string>'');
+
+    const dnsPageActive = ref(false)
+
+    const optionsApi = ref(<any>[])
+    const arrZones = ref(<any>[])
+    const arrDNS = ref(<any>[])
+    const optZones = ref(<any>[])
+
+    const selected = ref(<any>[])
+    const selZoneId = ref('')
+
+    const columnsZones = [
+      { name: 'id', align: 'right', label: 'ID', field: 'id', visible: true },
+      { name: 'name', required: true, label: 'Nome', align: 'left', field: 'name', sortable: true, visible: true },
+      { name: 'status', align: 'center', label: 'Status', field: 'status', sortable: true, visible: true },
+      { name: 'proxied', align: 'center', label: 'Proxy', field: 'proxied', sortable: true, visible: true },
+      { name: 'type', required: true, label: 'Tipo', align: 'left', field: 'type', sortable: true, visible: true },
+    ];
+
+    const columnsDNS = [
+      { name: 'id', required: false, label: 'Id', align: 'left', field: 'id', sortable: false, visible: false },
+      { name: 'name', required: true, label: 'Nome', align: 'left', field: 'name', sortable: true, visible: true },
+      { name: 'type', required: true, label: 'Tipo', align: 'left', field: 'type', sortable: true, visible: true },
+      { name: 'proxied', required: true, align: 'center', label: 'Proxy', field: 'proxied', sortable: true, visible: true },
+      { name: 'content', required: true, label: 'Valore', align: 'left', field: 'content', sortable: true, visible: true },
+    ];
+
+    const viscolumnsDNS = [
+      { name: 'name', required: true, label: 'Nome', align: 'left', field: 'name', sortable: true, visible: true, editable: true },
+      { name: 'type', required: true, label: 'Tipo', align: 'left', field: 'type', sortable: true, visible: true, editable: true },
+      { name: 'proxied', required: true, align: 'center', label: 'Proxy', field: 'proxied', sortable: true, visible: true, editable: true },
+      { name: 'content', required: true, label: 'Valore', align: 'left', field: 'content', sortable: true, visible: true, editable: true },
+    ];
+
+    const pagination = {
+      rowsPerPage: 10,
+    }
+
+    watch(() => selectedApi.value, async (to: any, from: any) => {
+      if (selectedApi.value) {
+        incaricamento.value = true
+
+        tools.setCookie('CF_API_SEL', selectedApi.value)
+
+        arrZones.value = await globalStore.getCloudFlareTok("getzones", selectedApi.value, "")
+
+        incaricamento.value = false
+
+        selZoneId.value = tools.getCookie('CF_API_ZONE_ID_' + selectedApi.value, '')
+
+        optZones.value = []
+
+        for (let i = 0; i < arrZones.value.length; i++) {
+          optZones.value.push({ label: arrZones.value[i].name, value: arrZones.value[i].id })
+        }
+
+      }
+    })
+
+    watch(() => selZoneId.value, async (to: any, from: any) => {
+      if (selZoneId.value) {
+        incaricamento.value = true
+        arrDNS.value = await globalStore.getCloudFlareTok("getDNS", selectedApi.value, selZoneId.value)
+
+        incaricamento.value = false
+
+        tools.setCookie('CF_API_ZONE_ID_' + selectedApi.value, selZoneId.value)
+
+        /*optDNS.value = []
+
+        for (let i = 0; i < arrZones.value.length; i++) {
+          optDNS.value.push({ label: arrZones.value[i].name, value: arrZones.value[i].id })
+        }*/
+
+      }
+    })
+
    watch(() => mydir.value, async (to: any, from: any) => {
      // ...

@@ -64,9 +143,21 @@ export default defineComponent({

      myarrscript.value = []

-      if (mydir.value)
-        myarrscript.value = await getArrayByScript('ls "admin_scripts/' + mydir.value + '/"', 'sh')
+      dnsPageActive.value = (mydir.value === '2_DNS')

+      incaricamento.value = true
+
+      tools.setCookie('CF_API_DIR', mydir.value)
+
+      if (dnsPageActive.value) {
+        // get the Tokens 
+        optionsApi.value = await globalStore.getCloudFlareTok("gettok", selectedApi.value, "")
+      } else {
+        if (mydir.value)
+          myarrscript.value = await getArrayByScript('ls "admin_scripts/' + mydir.value + '/"', 'sh')
+      }
+
+      incaricamento.value = false
    })

    watch(() => messages.value, async (to: any, from: any) => {
@@ -88,8 +179,12 @@ export default defineComponent({
        withinput
      }

+      incaricamento.value = true
+
      const risfunz = await globalStore.execScript({ mydata })

+      incaricamento.value = false
+
      if (ritornaout) {
        if (listafiles) {
          return risfunz.arrout
@@ -134,6 +229,9 @@ export default defineComponent({

      scrollToBottom()

+      mydir.value = tools.getCookie('CF_API_DIR')
+
+      selectedApi.value = tools.getCookie('CF_API_SEL', '')
    }

    const scrollToBottom = () => {
@@ -237,7 +335,7 @@ export default defineComponent({
        let timenowstr = '<br><span style="font-style: italic; color: gray;">✅ Eseguito alle ' + tools.getstrTimeAll(Date.now()) + ' -> ' + '</span><br>'
        messages.value += timenowstr

-        ws.send(JSON.stringify({ type: 'start_script', scriptName, dir: mydir.value }));
+        ws.send(JSON.stringify({ user_id: userStore.my._id, type: 'start_script', scriptName, dir: mydir.value }));
      }
    };

@@ -250,6 +348,75 @@ export default defineComponent({
      }
    };

+    // get the label of the selectedApi (value)
+    const getLabelSelApi = () => {
+      const myrec = optionsApi.value.find((opt: any) => opt.value === selectedApi.value)
+      return myrec ? myrec.label : ''
+    };
+    const getNameBySelZoneinId = () => {
+      const myrec = arrZones.value.find((zone: any) => zone.id === selZoneId.value)
+      return myrec ? myrec.name : ''
+    };
+
+    const getSelectedString = () => {
+      return selected.value.length === 0 ? '' : `${selected.value[0].name} selezionata.`
+    }
+
+    const toggleSelect = (row: any) => {
+      if (selected.value.length > 0 && selected.value[0].id === row.id) {
+        selected.value = [];
+      } else {
+        selected.value = [row];
+      }
+    }
+
+    const saveContentDNS = async (content: string, initialValue: string) => {
+      console.log('record da salvare su CF:', content)
+
+      if (selected.value && selected.value.length > 0 && selected.value[0].id) {
+        const indrec = arrDNS.value.findIndex((rec: any) => rec.id === selected.value[0].id)
+        arrDNS.value[indrec].content = content
+
+        await saveRecordDNS(arrDNS.value[indrec])
+      }
+    }
+    const saveNameDNS = async (name: string, initialValue: string) => {
+
+      if (selected.value && selected.value.length > 0 && selected.value[0].id) {
+        const indrec = arrDNS.value.findIndex((rec: any) => rec.id === selected.value[0].id)
+        arrDNS.value[indrec].name = name
+
+        await saveRecordDNS(arrDNS.value[indrec])
+      }
+    }
+    const saveTypeDNS = async (type: string, initialValue: string) => {
+
+      if (selected.value && selected.value.length > 0 && selected.value[0].id) {
+        const indrec = arrDNS.value.findIndex((rec: any) => rec.id === selected.value[0].id)
+        arrDNS.value[indrec].type = type
+
+        await saveRecordDNS(arrDNS.value[indrec])
+      }
+    }
+
+    const saveRecordDNS = async (row: any) => {
+
+      console.log('record da salvare su CF:', row)
+
+      const recupdated = await globalStore.getCloudFlareTok("setRecordDNS", selectedApi.value, selZoneId.value, row.id, row)
+
+      if (recupdated) {
+        const indrec = arrDNS.value.findIndex((rec: any) => rec.id === recupdated.id)
+        // update record
+        arrDNS.value[indrec] = recupdated
+
+        tools.showPositiveNotif($q, t('db.recupdated'))
+      } else {
+        tools.showNegativeNotif($q, t('db.recfailed'))
+      }
+
+    }
+
    onMounted(mounted)

    return {
@@ -281,6 +448,26 @@ export default defineComponent({
      inputPrompt,
      statusWs,
      scrollArea,
+      selectedApi,
+      dnsPageActive,
+      optionsApi,
+      arrZones,
+      getLabelSelApi,
+      columnsZones,
+      pagination,
+      selected,
+      getSelectedString,
+      toggleSelect,
+      optZones,
+      selZoneId,
+      arrDNS,
+      columnsDNS,
+      getNameBySelZoneinId,
+      viscolumnsDNS,
+      saveRecordDNS,
+      saveContentDNS,
+      saveNameDNS,
+      saveTypeDNS,
    }
  },
 })
--- a/src/views/admin/server/server.vue
+++ b/src/views/admin/server/server.vue
@@ -27,6 +27,7 @@
      <div class="q-ma-sm button-container">
        <div class="" v-for="(script, index) in myarrscript" :key="index">
          <q-btn
+            v-if="!script.sock"
            class=""
            :label="script.label"
            color="primary"
@@ -38,6 +39,7 @@
          >
          </q-btn>
          <q-btn
+            v-if="script.sock"
            class=""
            :label="'SOCK: ' + script.label"
            color="positive"
@@ -60,7 +62,132 @@
        <br />
      </div>
    </div>
-    <div>
+
+    <div v-if="dnsPageActive" class="">
+      <div>
+        <q-select
+          v-model="selectedApi"
+          :options="optionsApi"
+          label="Seleziona un Token"
+          emit-value
+          map-options
+          filled
+          class="q-ma-md"
+        />
+        <q-select
+          v-if="optZones && optZones.length > 0"
+          v-model="selZoneId"
+          :options="optZones"
+          label="Seleziona un Dominio"
+          emit-value
+          map-options
+          class="q-ma-md"
+        />
+
+        <q-table
+          v-if="arrDNS && selZoneId"
+          :title="`Zona di ${getNameBySelZoneinId()}`"
+          :rows="arrDNS"
+          :columns="columnsDNS"
+          row-key="id"
+          :loading="incaricamento"
+          :pagination="pagination"
+          :selected-rows-label="getSelectedString"
+          selection="single"
+          v-model:selected="selected"
+          :visible-columns="viscolumnsDNS"
+        >
+          <template v-slot:loading>
+            <q-inner-loading showing color="primary" />
+          </template>
+          <template v-slot:body="props">
+            <q-tr
+              :props="props"
+              :class="{ 'selected-row': props.selected }"
+              @click="toggleSelect(props.row)"
+            >
+              <q-td auto-width class="tdclass">
+                <q-checkbox
+                  dense
+                  v-model="props.selected"
+                  @click.stop="toggleSelect(props.row)"
+                ></q-checkbox>
+              </q-td>
+              <q-td v-for="col in viscolumnsDNS" :key="col.name" :props="props">
+                <q-popup-edit
+                  v-if="col.name === 'content'"
+                  v-model="props.row.content"
+                  v-slot="scope"
+                  buttons
+                  transition-show="scale"
+                  transition-hide="scale"
+                  :max-width="200"
+                  @save="saveContentDNS"
+                >
+                  <q-input
+                    type="textarea"
+                    v-model="scope.value"
+                    dense
+                    autofocus
+                    :maxlength="255"
+                    autogrow
+                  />
+                </q-popup-edit>
+                <q-popup-edit
+                  v-if="col.name === 'name'"
+                  v-model="props.row.name"
+                  v-slot="scope"
+                  buttons
+                  @save="saveNameDNS"
+                >
+                  <q-input
+                    type="textarea"
+                    v-model="scope.value"
+                    autofocus
+                    autogrow
+                  />
+                </q-popup-edit>
+
+                <!--<q-popup-edit
+                  v-if="col.name === 'type'"
+                  v-model="props.row.type"
+                  v-slot="scope"
+                  buttons
+                  @save="saveTypeDNS"
+                >
+                  <q-input
+                    type="textarea"
+                    v-model="scope.value"
+                    autofocus
+                    autogrow
+                  />
+                </q-popup-edit>-->
+
+                <q-toggle
+                  v-if="col.name === 'proxied'"
+                  v-model="props.row.proxied"
+                  label="Proxy"
+                  :disable="props.row.proxiable !== true"
+                  @click.stop="
+                    props.row.proxiable === true
+                      ? saveRecordDNS(props.row)
+                      : null
+                  "
+                >
+                </q-toggle>
+                <span v-else>
+                  {{ props.row[col.field] }}
+                </span>
+              </q-td>
+            </q-tr>
+          </template>
+        </q-table>
+
+        <!--<div v-if="selectedApi">Hai selezionato: {{ getLabelSelApi() }}</div>-->
+      </div>
+    </div>
+
+    <div v-if="!dnsPageActive">
      <div :class="statusWs === 'OPEN' ? 'bg-green' : 'bg-red'">
        STATO WS: {{ statusWs }}
      </div>
--- a/src/views/admin/servermysql/index.ts
+++ b/src/views/admin/servermysql/index.ts
@@ -0,0 +1 @@
+export { default as servermysql } from './servermysql.vue'
--- a/src/views/admin/servermysql/servermysql.scss
+++ b/src/views/admin/servermysql/servermysql.scss
@@ -0,0 +1,47 @@
+$button-margin: 5px;
+
+.button-container {
+    margin: $button-margin;
+    text-transform: none;
+}
+
+.container {
+    position: relative;
+    height: 45vh;
+    /* Per riempire tutto lo schermo */
+}
+
+.scroll-area {
+    position: absolute;
+    bottom: 0;
+    /* Posiziona l'area di scorrimento in basso */
+    left: 0;
+    /* Allinea a sinistra */
+    width: 100%;
+    /* Larghezza al 100% */
+    height: 340px;
+    /* Imposta l'altezza desiderata */
+    max-width: 800px;
+    /* Imposta la larghezza massima desiderata */
+    border: 1px solid #ccc;
+    /* Opzionale: per aggiungere un bordo */
+    background: #fff;
+    /* Sfondo bianco */
+    overflow-y: auto;
+    /* Abilita lo scorrimento verticale */
+}
+
+.custom-field {
+    height: 35px;
+    /* Imposta l'altezza fissa a 30px */
+    overflow: hidden;
+    /* Nasconde ciò che esce dai limiti del campo */
+    text-overflow: ellipsis;
+    /* Mostra i puntini di sospensione se il testo è troppo lungo (opzionale) */
+    white-space: nowrap;
+    /* Impedisce il wrapping della riga (opzionale) */
+}
+
+.selected-row {
+    background-color: #e3f2fd !important;
+}
--- a/src/views/admin/servermysql/servermysql.ts
+++ b/src/views/admin/servermysql/servermysql.ts
@@ -0,0 +1,52 @@
+import { defineComponent, onMounted, ref, watch, onUnmounted, nextTick } from 'vue'
+
+import { CTitleBanner } from '../../../components/CTitleBanner'
+import { CDateTime } from '../../../components/CDateTime'
+import { CMyFieldDb } from '../../../components/CMyFieldDb'
+import { useQuasar } from 'quasar'
+import { useI18n } from '@/boot/i18n'
+import { useUserStore } from '@store/UserStore'
+import { useGlobalStore } from '@store/globalStore'
+import { useCircuitStore } from '@store/CircuitStore'
+import { tools } from '@store/Modules/tools'
+import { costanti } from '@costanti'
+import { shared_consts } from '@src/common/shared_vuejs'
+
+
+export default defineComponent({
+  name: 'servermysql',
+  components: { CTitleBanner, CDateTime, CMyFieldDb },
+  props: {},
+  setup() {
+    const $q = useQuasar()
+    const { t } = useI18n()
+    const circuitStore = useCircuitStore()
+    const userStore = useUserStore()
+    const globalStore = useGlobalStore()
+
+    function mounted() {
+
+    }
+
+    const serverData = ref({
+      NameServer: '',
+      IPServer: '',
+      Attivo: false,
+      VersioneServer: '',
+      LastBackupServer: ''
+    });
+
+    async function submitForm() {
+      await globalStore.saveServerMysql(serverData.value)
+    }
+
+    onMounted(mounted)
+
+    return {
+      tools,
+      costanti,
+      serverData,
+      submitForm,
+    }
+  },
+})
--- a/src/views/admin/servermysql/servermysql.vue
+++ b/src/views/admin/servermysql/servermysql.vue
@@ -0,0 +1,38 @@
+<template>
+  <div>
+    <CTitleBanner title="Operazioni sul Server:"></CTitleBanner>
+
+    <q-separator></q-separator>
+
+    <q-form @submit="submitForm">
+      <q-input v-model="serverData.NameServer" label="Nome Server" filled />
+
+      <q-input v-model="serverData.IPServer" label="IP Server" filled />
+
+      <q-toggle v-model="serverData.Attivo" label="Attivo" />
+
+      <q-input
+        v-model="serverData.VersioneServer"
+        label="Versione Server"
+        filled
+      />
+
+      <q-input
+        v-model="serverData.LastBackupServer"
+        label="Ultimo Backup"
+        type="date"
+        filled
+      />
+
+      <q-btn label="Invia" type="submit" color="primary" class="q-mt-md" />
+    </q-form>
+  </div>
+</template>
+    
+  
+<script lang="ts" src="./servermysql.ts">
+</script>
+
+<style lang="scss" scoped>
+@import './servermysql';
+</style>
--- a/src/views/user/myfriends/myfriends.ts
+++ b/src/views/user/myfriends/myfriends.ts
@@ -28,7 +28,7 @@ export default defineComponent({
    const filter = ref(costanti.FIND_PEOPLE)

    function mounted() {
-      console.log('mounted')
+
      searchList.value = [
        {
          label: 'Regione',
				`@@ -0,0 +1 @@`
				`export { default as servermysql } from './servermysql.vue'`