From e1cf5d5d9e0de48d433f4be59f5208be79a8725a Mon Sep 17 00:00:00 2001 From: Luca Haid Date: Tue, 28 May 2024 09:12:13 +0200 Subject: [PATCH] Reworked Device Module and Vue Components --- Layout/default/Devicemanufactor/Index.php | 94 ------- Layout/default/Devicetype/Index.php | 110 -------- .../default/DocumentationCheck/DeviceTest.php | 101 ------- Layout/default/VueViews/Vue.php | 9 +- Layout/default/menu.php | 2 - application/Device/DeviceController.php | 21 +- .../DevicemanufactorController.php | 27 +- .../Devicetype/DevicetypeController.php | 25 +- public/assets/css/thetool.css | 5 + public/bundler.php | 1 + public/js/pages/Device/Device.js | 255 ++++++++++++++---- public/js/pages/Domain/Domain.js | 12 +- .../js/pages/HistoricTicket/HistoricTicket.js | 5 +- public/js/pages/IpNetwork/IpNetwork.js | 6 +- .../pages/VoiceCallActive/VoiceCallActive.js | 5 +- .../VoiceCallHistory/VoiceCallHistory.js | 5 +- .../vue/tt-components/css/tt-table.css | 20 +- .../vue/tt-components/tt-autocomplete.js | 2 - public/plugins/vue/tt-components/tt-card.js | 16 ++ .../vue/tt-components/tt-datepicker.js | 1 + public/plugins/vue/tt-components/tt-table.js | 38 ++- 21 files changed, 321 insertions(+), 439 deletions(-) delete mode 100644 Layout/default/Devicemanufactor/Index.php delete mode 100644 Layout/default/Devicetype/Index.php delete mode 100644 Layout/default/DocumentationCheck/DeviceTest.php create mode 100644 public/plugins/vue/tt-components/tt-card.js diff --git a/Layout/default/Devicemanufactor/Index.php b/Layout/default/Devicemanufactor/Index.php deleted file mode 100644 index c0687a36f..000000000 --- a/Layout/default/Devicemanufactor/Index.php +++ /dev/null @@ -1,94 +0,0 @@ -getUrl($Mod, "Index"); -$pagination_baseurl_params = ["filter" => $filter]; -$pagination_entity_name = "Devicemanufactor"; -?> - - - -
-
-
-
-
    -
  1. "> -
    2. -
  2. Gerätehersteller
    3. -
-
-

Gerätehersteller

-
-
-
- - -
-
-
-
-
-

Liste aller Gerätehersteller

-
-
- "> Neuen Gerätehersteller anlegen -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
NameErstellt von
name ?>creator->name ?> - (create) ?>) - - $devicemanufactor->id]) ?>"> - $devicemanufactor->id]) ?>" - onclick="if(!confirm('Gerätehersteller wirklich löschen?')) return false;" - class="text-danger" title="Löschen"> -
-
-
- - - - - - - - - - \ No newline at end of file diff --git a/Layout/default/Devicetype/Index.php b/Layout/default/Devicetype/Index.php deleted file mode 100644 index 88f7861bb..000000000 --- a/Layout/default/Devicetype/Index.php +++ /dev/null @@ -1,110 +0,0 @@ -getUrl($Mod, "Index"); -$pagination_baseurl_params = ["filter" => $filter]; -$pagination_entity_name = "Devicetype"; -?> - - - -
-
-
-
-
    -
  1. "> -
    2. -
  2. Gerätetyp
    3. -
-
-

Gerätetyp

-
-
-
- - - -
-
-
-
-
-

Liste aller Gerätetypen

-
-
- "> Neuen Gerätetyp anlegen -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
NameHerstellerPreismax. Leistungerstellt von
NameHerstellerPreis
name ?>devicemanufactor->name ?>price ?> €power ?> Wattcreator->name ?> - (create) ?>) - - $devicetype->id]) ?>"> - $devicetype->id]) ?>" - onclick="if(!confirm('Gerätetyp wirklich löschen?')) return false;" class="text-danger" - title="Löschen"> -
- - - - - -
-
- - - - - - - - - - \ No newline at end of file diff --git a/Layout/default/DocumentationCheck/DeviceTest.php b/Layout/default/DocumentationCheck/DeviceTest.php deleted file mode 100644 index aa79087db..000000000 --- a/Layout/default/DocumentationCheck/DeviceTest.php +++ /dev/null @@ -1,101 +0,0 @@ - self::getUrl("Domain"), - "DASHBOARD_URL" => self::getUrl("Dashboard"), - "MFAPPNAME" => MFAPPNAME_SLUG, - "PAGE_TITLE" => "Domains", - "PATH" => [ - ["text" => MFAPPNAME_SLUG, "href" => self::getUrl("Dashboard")], - ["text" => "Voice Calls History", "href" => self::getUrl("VoiceCallHistory")] - ], - "DEVICE_API_URL" => self::getUrl("Device/api"), -]; - -$additionalJS = [ - "plugins/vue/vue.js", - "plugins/axios/axios.min.js", - "plugins/moment/moment.min.js", - "plugins/daterangepicker/daterangepicker.js", - "plugins/xlsx/xlsx.min.js", - "plugins/vue/tt-components/tt-table.js", - "plugins/vue/tt-components/tt-page-title.js", - "plugins/vue/tt-components/tt-select.js", - "plugins/vue/tt-components/tt-datepicker.js", - "plugins/vue/tt-components/tt-input.js", - "plugins/vue/tt-components/tt-autocomplete.js", - "plugins/vue/tt-components/tt-icon-select.js", - "plugins/vue/tt-components/tt-number-range.js", -]; -$additionalCSS = [ - "plugins/daterangepicker/daterangepicker.css", - 'plugins/vue/tt-components/css/tt-table.css', -]; - -include(realpath(dirname(__FILE__) . "/../../$mfLayoutPackage") . "/header.php"); ?> - -
- - - - - - - - - - - - - - -
- - - - diff --git a/Layout/default/VueViews/Vue.php b/Layout/default/VueViews/Vue.php index 7233d5a9d..d6011f604 100644 --- a/Layout/default/VueViews/Vue.php +++ b/Layout/default/VueViews/Vue.php @@ -40,10 +40,17 @@ include(realpath(dirname(__FILE__) . "/../../$mfLayoutPackage") . "/vueHeader.ph
+ + + + <>>
\ No newline at end of file diff --git a/Layout/default/menu.php b/Layout/default/menu.php index 2efe0f355..376821e31 100644 --- a/Layout/default/menu.php +++ b/Layout/default/menu.php @@ -64,8 +64,6 @@
  • "> Netzgebiete
  • "> Pops
    • -
  • "> Geräte Hersteller
    • -
  • "> Geräte Typen
  • "> Devices
  • "> Benutzer
  • Grundstammdaten
    • diff --git a/application/Device/DeviceController.php b/application/Device/DeviceController.php index 09a4829a1..161aced15 100644 --- a/application/Device/DeviceController.php +++ b/application/Device/DeviceController.php @@ -17,21 +17,28 @@ class DeviceController extends mfBaseController protected function indexAction() { - $deviceManufacturers = array_map(function($manufacturer) { + $deviceManufacturers = array_map(function($deviceManufacturer) { return [ - "text" => $manufacturer->name, - "value" => $manufacturer->name, + "id" => $deviceManufacturer->id, + "name" => $deviceManufacturer->name, + "creator" => $deviceManufacturer->creator->name, + "created" => $deviceManufacturer->create, ]; }, DevicemanufactorModel::getAll()); $deviceTypes = array_map(function($deviceType) { return [ - "text" => $deviceType->name, - "value" => $deviceType->name, + "id" => $deviceType->id, + "name" => $deviceType->name, + "manufacturer" => $deviceType->devicemanufactor->name, + "price" => $deviceType->price, + "power" => $deviceType->power, + "creator" => $deviceType->creator->name, + "created" => $deviceType->create, ]; }, DevicetypeModel::getAll()); - $JSGlobals = ["BASE_URL" => self::getUrl("Device"), + $JSGlobals = ["BASE_URL" => self::getUrl(""), "DASHBOARD_URL" => self::getUrl("Dashboard"), "MFAPPNAME" => MFAPPNAME_SLUG, "PAGE_TITLE" => "Devices", @@ -41,7 +48,7 @@ class DeviceController extends mfBaseController ], "DEVICE_MANUFACTURERS" => $deviceManufacturers, "DEVICE_TYPES" => $deviceTypes, - "DEVICE_API_URL" => self::getUrl("Device/api"), + "DEVICES" => $this->getDevices(), ]; $this->layout()->set("vueViewName", "Device"); diff --git a/application/Devicemanufactor/DevicemanufactorController.php b/application/Devicemanufactor/DevicemanufactorController.php index 69be65c01..9b244b901 100644 --- a/application/Devicemanufactor/DevicemanufactorController.php +++ b/application/Devicemanufactor/DevicemanufactorController.php @@ -17,11 +17,7 @@ class DevicemanufactorController extends mfBaseController protected function indexAction() { - - $this->layout()->setTemplate("Devicemanufactor/Index"); - $devicemanufactors = DevicemanufactorModel::getAll(); - $this->layout()->set("devicemanufactors", $devicemanufactors); - + $this->redirect("Device"); } protected function addAction() @@ -36,17 +32,17 @@ class DevicemanufactorController extends mfBaseController if (!is_numeric($id) || !$id) { $this->layout()->setFlash("Gerätehersteller nicht gefunden", "error"); - $this->redirect("Devicemanufactor"); + $this->redirect("Device"); } $devicemanufactors = new Devicemanufactor($id); if ($devicemanufactors->id != $id) { $this->layout()->setFlash("Gerätehersteller nicht gefunden", "error"); - $this->redirect("Devicemanufactor"); + $this->redirect("Device"); } $this->layout()->set("devicemanufactors", $devicemanufactors); - return $this->addAction(); + $this->addAction(); } protected function saveAction() @@ -59,7 +55,7 @@ class DevicemanufactorController extends mfBaseController $devicemanufactor = new Devicemanufactor($id); if (!$devicemanufactor->id) { $this->layout()->setFlash("Gerätehersteller nicht gefunden", "error"); - $this->redirect("Devicemanufactor"); + $this->redirect("Device");; } } else { $mode = "add"; @@ -72,7 +68,7 @@ class DevicemanufactorController extends mfBaseController if (!$data['name']) { $this->layout()->setFlash("Name darf nicht leer sein", "error"); - $this->redirect("Devicemanufactor"); + $this->redirect("Device");; } @@ -93,9 +89,9 @@ class DevicemanufactorController extends mfBaseController if (!$id) { $this->layout()->setFlash("Gerätehersteller konnte nicht angelegt werden", "error"); - $this->redirect("Devicemanufactor"); + $this->redirect("Device"); } - if ($fsh) { + if (isset($fsh) && $fsh) { $fsh->save(); } if ($mode == "edit") { @@ -103,7 +99,7 @@ class DevicemanufactorController extends mfBaseController } else if ($mode = "add") { $this->layout()->setFlash("Gerätehersteller erfolgreich angelegt", "success"); } - $this->redirect("Devicemanufactor"); + $this->redirect("Device"); } protected function deleteAction() @@ -112,11 +108,12 @@ class DevicemanufactorController extends mfBaseController $devicemanufactor = new Devicemanufactor($id); if (!$devicemanufactor->id || $devicemanufactor->id != $id) { $this->layout()->setFlash("Gerätehersteller nicht gefunden.", "error"); - $this->redirect("Devicemanufactor"); + $this->redirect("Device"); } $devicemanufactor->delete(); - $this->redirect("Devicemanufactor"); + $this->layout()->setFlash("Gerätehersteller erfolgreich gelöscht", "success"); + $this->redirect("Device"); } } \ No newline at end of file diff --git a/application/Devicetype/DevicetypeController.php b/application/Devicetype/DevicetypeController.php index 170cf65e3..7950de6d3 100644 --- a/application/Devicetype/DevicetypeController.php +++ b/application/Devicetype/DevicetypeController.php @@ -18,11 +18,7 @@ class DevicetypeController extends mfBaseController protected function indexAction() { - - $this->layout()->setTemplate("Devicetype/Index"); - $devicetypes = DevicetypeModel::getAll(); - $this->layout()->set("devicetypes", $devicetypes); - + $this->redirect("Device"); } protected function addAction() @@ -38,17 +34,17 @@ class DevicetypeController extends mfBaseController if (!is_numeric($id) || !$id) { $this->layout()->setFlash("Gerätetyp nicht gefunden", "error"); - $this->redirect("Devicetype"); + $this->redirect("Device"); } $devicetypes = new Devicetype($id); if ($devicetypes->id != $id) { $this->layout()->setFlash("Gerätetyp nicht gefunden", "error"); - $this->redirect("Devicetype"); + $this->redirect("Device"); } $this->layout()->set("devicetypes", $devicetypes); - return $this->addAction(); + $this->addAction(); } protected function saveAction() @@ -61,7 +57,7 @@ class DevicetypeController extends mfBaseController $devicetype = new Devicetype($id); if (!$devicetype->id) { $this->layout()->setFlash("Gerätetyp nicht gefunden", "error"); - $this->redirect("Devicetype"); + $this->redirect("Device"); } } else { $mode = "add"; @@ -95,7 +91,7 @@ class DevicetypeController extends mfBaseController if (!$data['name']) { $this->layout()->setFlash("Name darf nicht leer sein", "error"); - $this->redirect("Devicetype"); + $this->redirect("Device"); } @@ -116,7 +112,7 @@ class DevicetypeController extends mfBaseController if (!$id) { $this->layout()->setFlash("Gerätetyp konnte nicht angelegt werden", "error"); - $this->redirect("Devicetype"); + $this->redirect("Device"); } if ($mode == "edit") { @@ -124,7 +120,7 @@ class DevicetypeController extends mfBaseController } else if ($mode = "add") { $this->layout()->setFlash("Gerätetyp erfolgreich angelegt", "success"); } - $this->redirect("Devicetype"); + $this->redirect("Device"); } @@ -134,11 +130,12 @@ class DevicetypeController extends mfBaseController $devicetype = new Devicetype($id); if (!$devicetype->id || $devicetype->id != $id) { $this->layout()->setFlash("Gerätetyp nicht gefunden.", "error"); - $this->redirect("Devicetype"); + $this->redirect("Device"); } $devicetype->delete(); - $this->redirect("Devicetype"); + $this->layout()->setFlash("Gerätetyp erfolgreich gelöscht", "success"); + $this->redirect("Device"); } } \ No newline at end of file diff --git a/public/assets/css/thetool.css b/public/assets/css/thetool.css index 861beff97..1671581df 100644 --- a/public/assets/css/thetool.css +++ b/public/assets/css/thetool.css @@ -1,5 +1,9 @@ /* Overrides */ +html { + overflow-y: scroll; +} + body { color: #323a36; background-color: #e7e7e7 !important; @@ -161,6 +165,7 @@ h1, h2, h3, h4, h5, h6 { /* allow icons in custom-file label */ .custom-file-label::before { + /*noinspection CssNoGenericFontName*/ font-family: "Font Awesome 6 Pro"; content: "\f56f"; padding-right: 6px; diff --git a/public/bundler.php b/public/bundler.php index 1773a60d1..86e68d4b3 100644 --- a/public/bundler.php +++ b/public/bundler.php @@ -30,6 +30,7 @@ $jsFiles = [ "plugins/moment/moment.min.js", "plugins/daterangepicker/daterangepicker.js", "plugins/vue/" . (isset($_GET['VUE_DEBUG']) || $_SERVER['HTTP_HOST'] === "localhost" ? "vue.js" : "vue.min.js"), + "plugins/vue/tt-components/tt-card.js", "plugins/vue/tt-components/tt-table.js", "plugins/vue/tt-components/tt-page-title.js", "plugins/vue/tt-components/tt-loader.js", diff --git a/public/js/pages/Device/Device.js b/public/js/pages/Device/Device.js index 435685be6..d55e5a7bb 100644 --- a/public/js/pages/Device/Device.js +++ b/public/js/pages/Device/Device.js @@ -1,72 +1,219 @@ -Vue.component('Device', { +const deviceManufacturerFilterOptions = window?.TT_CONFIG?.DEVICE_MANUFACTURERS.map(manufacturer => ({ + value: manufacturer.name, + text: manufacturer.name, +})); + +const deviceTypeFilterOptions = window?.TT_CONFIG?.DEVICE_TYPES.map(type => ({ + value: type.name, + text: type.name, +})); + +Vue.component('device-view-switch', { //language=Vue template: ` -
    - +
    +
    + + + +
    +
    +
    + +
    + Devices + Hersteller + Geräte Typen +
    +
    +
    +
    + `, + props: ['value'], + data() { + return { + isOverflowing: false, + showDropdown: false, + }; + }, + mounted() { + this.checkOverflow(); + window.addEventListener('resize', this.checkOverflow); + }, + beforeDestroy() { + window.removeEventListener('resize', this.checkOverflow); + }, + methods: { + checkOverflow() { + this.isOverflowing = window.innerWidth < 650 + }, + }, +}) - +Vue.component('DeviceTable', { + //language=Vue + template: ` + - + - + - - - + - -
    - `, + + + `, + data() { + return { + window: window, + DeviceTableConfig: { + key: 'DeviceTable', + tableHeader: 'Device-Liste', + defaultPageSize: 25, + headers: [ + { text: 'Device Name', key: 'name', sortable: true, class: 'text-nowrap', priority: 10 }, + { text: 'Hersteller', key: 'devicemanufactor', filter: 'select',class: 'text-nowrap text-center', filterOptions: deviceManufacturerFilterOptions }, + { text: 'Geräte Typ', key: 'devicetype', filter: 'autocomplete', class: 'text-nowrap text-center', filterOptions: deviceTypeFilterOptions , priority: 7}, + { text: 'Pop/Adresse', key: 'locationText', filter: 'search' , class: 'text-nowrap text-center'}, + { text: 'IP-Adresse', key: 'ip', filter: 'search',class: 'text-center', priority: 8}, + { text: 'Mac-Adresse', key: 'mac', filter: 'search',class: 'text-center' }, + { text: 'Seriennummer', key: 'serial', filter: 'search',class: 'text-center' }, + { text: 'Preis', key: 'price', filter: 'numberRange',class: 'text-center', suffix: ' €' }, + { text: 'max. Leistung', key: 'power', filter: 'numberRange',class: 'text-center', suffix: ' W' }, + { + text: 'Backup', + key: 'backup', + filter: 'iconSelect', + filterOptions: [ + { value: 'ok', text: 'Configbackup aktuell', icon: 'fa-regular fa-circle-check text-success' }, + { value: 'auto', text: 'Configbackup aktuell', icon: 'fa-regular fa-circle-a text-success' }, + { value: 'aged', text: 'Letztes Configbackup älter als 48 Stunden', icon: 'fa-regular fa-circle-xmark' }, + { value: 'na', text: 'N/A', icon: 'fa-regular fa-ban text-warning' } + ], + priority: 6, + sortable: false, + }, + {text: 'Aktionen', key: 'actions', class: 'text-center', sortable: false, filter: false, priority: 9}, + ], + }, + } + } +}); + +Vue.component('DeviceManufacturer', { + //language=Vue + template: ` + + + + + + + + `, data() { return { window: window, - DeviceTableConfig: { - key: 'DeviceTable', - tableHeader: 'Device-Liste', + DeviceManufacturerConfig: { + key: 'DeviceManufacturer', + tableHeader: 'Hersteller', defaultPageSize: 25, headers: [ - { text: 'Device Name', key: 'name', sortable: true, class: 'text-nowrap', priority: 10 }, - { text: 'Hersteller', key: 'devicemanufactor', filter: 'select',class: 'text-nowrap text-center', filterOptions: window.TT_CONFIG["DEVICE_MANUFACTURERS"] }, - { text: 'Geräte Typ', key: 'devicetype', filter: 'autocomplete', class: 'text-nowrap text-center', filterOptions: window.TT_CONFIG["DEVICE_TYPES"] , priority: 7}, - { text: 'Pop/Adresse', key: 'locationText', filter: 'search' , class: 'text-nowrap text-center'}, - { text: 'IP-Adresse', key: 'ip', filter: 'search',class: 'text-center', priority: 8}, - { text: 'Mac-Adresse', key: 'mac', filter: 'search',class: 'text-center' }, - { text: 'Seriennummer', key: 'serial', filter: 'search',class: 'text-center' }, - { text: 'Preis', key: 'price', filter: 'numberRange',class: 'text-center', suffix: ' €' }, - { text: 'max. Leistung', key: 'power', filter: 'numberRange',class: 'text-center', suffix: ' W' }, - { - text: 'Backup', - key: 'backup', - filter: 'iconSelect', - filterOptions: [ - { value: 'ok', text: 'Configbackup aktuell', icon: 'fa-regular fa-circle-check text-success' }, - { value: 'auto', text: 'Configbackup aktuell', icon: 'fa-regular fa-circle-a text-success' }, - { value: 'aged', text: 'Letztes Configbackup älter als 48 Stunden', icon: 'fa-regular fa-circle-xmark' }, - { value: 'na', text: 'N/A', icon: 'fa-regular fa-ban text-warning' } - ], - priority: 6, - sortable: false, - }, - {text: 'Aktionen', key: 'actions', class: 'text-center', sortable: false, filter: false, priority: 9}, + { text: 'Name', key: 'name', sortable: true, class: 'text-nowrap', priority: 10 }, + { text: 'Erstellungsdatum', key: 'created', filter: 'date', class: 'text-center'}, + { text: 'Erstellt von', key: 'creator', filter: 'search', class: 'text-center'}, + { text: 'Aktionen', key: 'actions', class: 'text-center', sortable: false, filter: false, priority: 9}, ], }, + } + } +}); + +Vue.component('DeviceType', { + //language=Vue + template: ` + + + + + + + + `, + data() { + return { + window: window, + DeviceTypeConfig: { + key: 'DeviceType', + tableHeader: 'Gerätetypen', + defaultPageSize: 25, + headers: [ + { text: 'Name', key: 'name', sortable: true, class: 'text-nowrap', priority: 10 }, + { text: 'Hersteller', key: 'manufacturer', filter: 'search', class: 'text-center'}, + { text: 'Preis', key: 'price', filter: 'numberRange', class: 'text-center', suffix: ' €' }, + { text: 'max. Leistung', key: 'power', filter: 'numberRange', class: 'text-center', suffix: ' W' }, + { text: 'Erstellungsdatum', key: 'created', filter: 'date', class: 'text-center'}, + { text: 'Erstellt von', key: 'creator', filter: 'search', class: 'text-center'}, + { text: 'Aktionen', key: 'actions', class: 'text-center', sortable: false, filter: false, priority: 9}, + ], + }, + } + } +}) + +Vue.component('Device', { + //language=Vue + template: ` + + + + + + `, + data() { + return { + window: window, + currentView: 'DeviceTable', }; }, + beforeMount() { + const storedView = window.localStorage.getItem('tt-device-view'); + if (storedView) { + this.currentView = storedView; + } + }, + watch: { + currentView() { + window.localStorage.setItem('tt-device-view', this.currentView); + } + }, }); diff --git a/public/js/pages/Domain/Domain.js b/public/js/pages/Domain/Domain.js index 8e3377f38..8b99c0926 100644 --- a/public/js/pages/Domain/Domain.js +++ b/public/js/pages/Domain/Domain.js @@ -1,10 +1,7 @@ Vue.component('Domain', { //language=Vue template: ` -
    - - - + @@ -99,7 +96,7 @@ Vue.component('Domain', {
    - + `, data() { return { @@ -119,7 +116,7 @@ Vue.component('Domain', { }, computed: { domainsTableConfig() { const base = { - headers: [{text: "DNS", key: "inwxRoId", filter: false, sortable: false}, { + headers: [{ text: "Domain", key: "domain" }, { @@ -157,7 +154,8 @@ Vue.component('Domain', { text: "Tech ID", key: "tech", sortable: false - }, {text: "Billing ID", key: "billing", sortable: false}, {text: "Name Servers", key: "ns"}], + }, {text: "Billing ID", key: "billing", sortable: false}, {text: "Name Servers", key: "ns"}, + {text: "DNS", key: "inwxRoId", filter: false, sortable: false, priority: 1}], tableHeader: 'Domains', key: 'Domain' } diff --git a/public/js/pages/HistoricTicket/HistoricTicket.js b/public/js/pages/HistoricTicket/HistoricTicket.js index ee07537dd..187346d6b 100644 --- a/public/js/pages/HistoricTicket/HistoricTicket.js +++ b/public/js/pages/HistoricTicket/HistoricTicket.js @@ -1,8 +1,7 @@ Vue.component('HistoricTicket', { //language=Vue template: ` -
    - +
    - + `, data() { return { window: window, diff --git a/public/js/pages/IpNetwork/IpNetwork.js b/public/js/pages/IpNetwork/IpNetwork.js index 9d057823f..cd9ec1205 100644 --- a/public/js/pages/IpNetwork/IpNetwork.js +++ b/public/js/pages/IpNetwork/IpNetwork.js @@ -1,9 +1,7 @@ Vue.component('IpNetwork', { //language=Vue template: ` -
    - +
    - + `, data() { return { diff --git a/public/js/pages/VoiceCallActive/VoiceCallActive.js b/public/js/pages/VoiceCallActive/VoiceCallActive.js index 4a2c3e801..0797c74ef 100644 --- a/public/js/pages/VoiceCallActive/VoiceCallActive.js +++ b/public/js/pages/VoiceCallActive/VoiceCallActive.js @@ -1,8 +1,7 @@ Vue.component('VoiceCallActive', { //language=Vue template: ` -
    - + -
    + `, data() { return { diff --git a/public/js/pages/VoiceCallHistory/VoiceCallHistory.js b/public/js/pages/VoiceCallHistory/VoiceCallHistory.js index 52e238f23..30e599784 100644 --- a/public/js/pages/VoiceCallHistory/VoiceCallHistory.js +++ b/public/js/pages/VoiceCallHistory/VoiceCallHistory.js @@ -1,8 +1,7 @@ Vue.component('VoiceCallHistory', { //language=Vue template: ` -
    - + -
    + `, data() { return { window: window, diff --git a/public/plugins/vue/tt-components/css/tt-table.css b/public/plugins/vue/tt-components/css/tt-table.css index 5676ec1eb..36c332ee0 100644 --- a/public/plugins/vue/tt-components/css/tt-table.css +++ b/public/plugins/vue/tt-components/css/tt-table.css @@ -21,11 +21,7 @@ } -.tt-table-card { - /*overflow: auto;*/ -} - -.tt-table-card .page-link { +.tt-table-container .page-link { padding: 5px .75rem !important; } @@ -112,12 +108,24 @@ input[type=number]::-webkit-outer-spin-button { .tt-table-top-pagination-container { display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: auto auto; padding-bottom: 8px; align-items: center; justify-content: space-between } +.tt-table-top-buttons-container { + display: grid; + grid-template-columns: auto auto auto auto auto; + grid-gap: 8px; + padding-bottom: 8px +} + +.tt-table-top-buttons-container > button > i { + font-size: 17px; + margin-right: 4px; +} + @media (max-width: 486px) { .tt-table-top-pagination-container { grid-template-columns: 1fr; diff --git a/public/plugins/vue/tt-components/tt-autocomplete.js b/public/plugins/vue/tt-components/tt-autocomplete.js index a6dccb445..37cee43e4 100644 --- a/public/plugins/vue/tt-components/tt-autocomplete.js +++ b/public/plugins/vue/tt-components/tt-autocomplete.js @@ -72,8 +72,6 @@ Vue.component('tt-autocomplete', { this.displayValue = selectedItem ? selectedItem.text : ''; } - console.log(this.$slots.append ? 'append' : 'no append'); - }, data() { return { diff --git a/public/plugins/vue/tt-components/tt-card.js b/public/plugins/vue/tt-components/tt-card.js new file mode 100644 index 000000000..ac2132932 --- /dev/null +++ b/public/plugins/vue/tt-components/tt-card.js @@ -0,0 +1,16 @@ +Vue.component('tt-card', { + //language=Vue + template: ` +
    +
    + +
    +
    + +
    +
    + +
    +
    + `, +}) \ No newline at end of file diff --git a/public/plugins/vue/tt-components/tt-datepicker.js b/public/plugins/vue/tt-components/tt-datepicker.js index f1d98fd2a..1075f0ab8 100644 --- a/public/plugins/vue/tt-components/tt-datepicker.js +++ b/public/plugins/vue/tt-components/tt-datepicker.js @@ -99,5 +99,6 @@ Vue.component('tt-date-picker', { }, beforeDestroy() { $(this.$refs.input).off('apply.daterangepicker'); + $('.daterangepicker').remove(); }, }) diff --git a/public/plugins/vue/tt-components/tt-table.js b/public/plugins/vue/tt-components/tt-table.js index 8edfb7dae..62ff35600 100644 --- a/public/plugins/vue/tt-components/tt-table.js +++ b/public/plugins/vue/tt-components/tt-table.js @@ -109,11 +109,9 @@ Vue.component('tt-table-pagination', { Vue.component('tt-table', { template: ` -
    -
    +
    -
    +
    @@ -142,7 +140,10 @@ Vue.component('tt-table', { + :style="'vertical-align: top; text-align: center;' + + (column.filter === 'dateRange' ? 'min-width: 260px;' : '') + + (originalColumnWidths[column.key] ? 'width: ' + originalColumnWidths[column.key] + 'px;' : '')" + >
    @@ -180,7 +181,8 @@ Vue.component('tt-table', { @click="$emit('row-click', row)" >