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";
-?>
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ 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";
-?>
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ 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"); ?>
-
-
-
-
-
-
-
- Neues Device anlegen
-
-
-
-
-
-
-
-
-
- {{ parseInt(row.power) }} Watt
-
-
-
- {{ parseInt(row.price) }} €
-
-
-
-
-
-
-
-
-
-
-
-
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
- "> Geräte Hersteller
- "> Geräte Typen
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: `
+
-
-
-
- Device hinzufügen
-
-
+
+
+
+ Device hinzufügen
+
+
-
- {{row.name}}
-
+
+ {{row.name}}
+
-
- {{row.locationText}}
-
-
-
-
-
-
+
+ {{row.locationText}}
+
-
-
- `,
+
+
+
+
+
+ `,
+ 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: `
+
+
+
+
+ Hersteller hinzufügen
+
+
+
+
+
+
+
+
+
+ `,
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: `
+
+
+
+
+ Device Type hinzufügen
+
+
+
+
+
+
+
+
+
+ `,
+ 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)"
>
-
+
-
`, props: {
fetchUrl: String,
+ data: Array,
striped: {type: Boolean, default: true},
bordered: {type: Boolean, default: true},
hover: {type: Boolean, default: true},
@@ -293,13 +295,17 @@ Vue.component('tt-table', {
* @async
*/
async fetchData(page = 0) {
+ console.log('Fetching data...');
this.expandedRows = {};
try {
if (this.ssr === false) {
- const response = await axios.get(this.fetchUrl);
- this.rawRows = response.data
-
+ if (this.data) {
+ this.rawRows = this.data;
+ } else {
+ const response = await axios.get(this.fetchUrl);
+ this.rawRows = response.data
+ }
this.pagination = {
page: page++,
@@ -673,7 +679,8 @@ Vue.component('tt-table', {
} else if (header.filter === 'date') {
if (!filterValue.from || !filterValue.to) continue;
- let rowDate = new Date(row[header.key]).getTime() / 1000;
+ const dateInt = row[header.key].length === 10 ? parseInt(row[header.key]) * 1000 : parseInt(row[header.key]);
+ let rowDate = new Date(dateInt).getTime() / 1000;
if (rowDate < filterValue.from || rowDate > filterValue.to) {
match = false;
@@ -698,8 +705,13 @@ Vue.component('tt-table', {
output.sort((a, b) => {
- let valueA = isDateColumn ? new Date(a[this.order.key]).getTime() : a[this.order.key];
- let valueB = isDateColumn ? new Date(b[this.order.key]).getTime() : b[this.order.key];
+
+ let valueA = isDateColumn ?
+ new Date(a[this.order.key].length === 10 ? parseInt(a[this.order.key]) * 1000 : parseInt(a[this.order.key])).getTime() :
+ a[this.order.key];
+ let valueB = isDateColumn ?
+ new Date(b[this.order.key].length === 10 ? parseInt(b[this.order.key]) * 1000 : parseInt(b[this.order.key])).getTime() :
+ b[this.order.key];
if (valueA === valueB) return 0;