Luca/thetool
1
0
Fork 0
Code Issues 5 Pull Requests 5 Actions Packages Projects Releases Wiki Activity

Updated TheTool Frontend Framework & Table

Browse Source
This commit is contained in:
Luca Haid
2024-05-08 12:54:26 +00:00
parent 1e57d983b7
commit 58e124a461
46 changed files with 1364 additions and 2535 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
Layout/default/VoiceCallActive/Index.php
View File

@@ -16,12 +16,23 @@ $JSGlobals = ["BASE_URL" => self::getUrl("VoiceCallActive"),
"VOICE_CALL_ACTIVE_API_URL" => self::getUrl("VoiceCallActive/api"),
];
$additionalJS = ["plugins/vue/vue.js",
$additionalJS = [
"plugins/vue/vue.js",
"plugins/axios/axios.min.js",
"plugins/vue/tt-components/tt-page-title.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',
];
@@ -30,8 +41,8 @@ include(realpath(dirname(__FILE__) . "/../../$mfLayoutPackage") . "/header.php")
<div id="app">
<tt-page-title :title="window['TT_CONFIG']['PAGE_TITLE']" :path="window['TT_CONFIG']['PATH']"></tt-page-title>
<tt-table :fetch-url="window['TT_CONFIG']['VOICE_CALL_ACTIVE_API_URL'] + '?do=getActiveCalls'" :table-config="VoiceCallActiveTableConfig"
small ref="table">
<tt-table :fetch-url="window['TT_CONFIG']['VOICE_CALL_ACTIVE_API_URL'] + '?do=getActiveCalls'" :config="VoiceCallActiveTableConfig"
small ssr ref="table">
<template v-slot:top-buttons>
<button type="button" class="btn btn-primary" @click="refresh" data-toggle="tooltip" data-placement="bottom" title="Refreshing too often will run into API-Rate limits and will cause errors.">
@@ -57,7 +68,7 @@ include(realpath(dirname(__FILE__) . "/../../$mfLayoutPackage") . "/header.php")
</template>
<template v-slot:answer_time="{ row }">
{{ !isNaN(new Date(row.answer_time)) ? new Date(row.answer_time).toLocaleString() : 'Call is not running' }}
{{ !isNaN(new Date(row.answer_time)) ? window.moment(row.answer_time, 'YYYY-MM-DD HH:mm:ss Z').format('DD.MM.YYYY HH:mm:ss') : 'Call is not running' }}
</template>
<template v-slot:status="{ row }">
@@ -71,15 +82,6 @@ include(realpath(dirname(__FILE__) . "/../../$mfLayoutPackage") . "/header.php")
</tt-table>
</div>
<!-- TODO: download from cdn to local -->
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<style>
.voice-green {
background-color: #6CAE75 !important
@@ -114,15 +116,15 @@ include(realpath(dirname(__FILE__) . "/../../$mfLayoutPackage") . "/header.php")
}
},
headers: [
{text: 'Call ID', key: 'id', filter: false},
{text: 'Status', key: 'status', filter: false},
{text: 'Answer Time', key: 'answer_time', filter: false},
{text: 'Duration', key: 'duration', filter: false},
{text: 'Source', key: 'src', filter: false},
{text: 'Device Type', key: 'device_type', filter: false},
{text: 'Destination', key: 'localized_dst', filter: false},
{text: 'Destination User', key: 'dst_user', filter: false},
{text: 'Destination Device Extension', key: 'dst_device_extension', filter: false},
{text: 'Call ID', key: 'id', filter: false, sortable: false},
{text: 'Status', key: 'status', filter: false, sortable: false},
{text: 'Answer Time', key: 'answer_time', filter: false, sortable: false},
{text: 'Duration', key: 'duration', filter: false, sortable: false},
{text: 'Source', key: 'src', filter: false, sortable: false},
{text: 'Device Type', key: 'device_type', filter: false, sortable: false},
{text: 'Destination', key: 'localized_dst', filter: false, sortable: false},
{text: 'Destination User', key: 'dst_user', filter: false, sortable: false},
{text: 'Destination Device Extension', key: 'dst_device_extension', filter: false, sortable: false},
],
tableHeader: 'Active Voice Calls',
},
@@ -130,6 +132,7 @@ include(realpath(dirname(__FILE__) . "/../../$mfLayoutPackage") . "/header.php")
autoRefresh: null,
},
mounted() {
//TODO: create vue tooltip component
$('[data-toggle="tooltip"]').tooltip();
const _this = this;