helpdesk.magico: Zmiany w okienku podglądu numeru

This commit is contained in:
2022-04-19 11:44:25 +02:00
parent e2a8d70b99
commit e64c53512d
3 changed files with 516 additions and 78 deletions

View File

@@ -17,6 +17,7 @@
<!-- CSS Implementing Plugins --> <!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [.] --> <!-- bundlecss:vendor [.] -->
<link rel="stylesheet" href="./node_modules/bootstrap-icons/font/bootstrap-icons.css"> <link rel="stylesheet" href="./node_modules/bootstrap-icons/font/bootstrap-icons.css">
<link rel="stylesheet" href="./node_modules/tom-select/dist/css/tom-select.bootstrap5.css">
<!-- CSS Front Template --> <!-- CSS Front Template -->
<!-- bundlecss:theme [.] ?v=1.0 --> <!-- bundlecss:theme [.] ?v=1.0 -->
@@ -124,7 +125,7 @@
</script> </script>
</head> </head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl footer-offset magico-h-100"> <body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl magico-h-100">
<script src="./assets/js/hs.theme-appearance.js"></script> <script src="./assets/js/hs.theme-appearance.js"></script>
@@ -191,7 +192,7 @@
<div class="nav-item"> <div class="nav-item">
<a class="nav-link " href="./api-keys.html" data-placement="left"> <a class="nav-link " href="./api-keys.html" data-placement="left">
<i class="bi-building nav-icon"></i> <i class="bi-building nav-icon"></i>
<span class="nav-link-title">Działy firmy</span> <span class="nav-link-title">Grupy telefonów</span>
</a> </a>
</div> </div>
@@ -293,9 +294,32 @@
<!-- Page Header --> <!-- Page Header -->
<div class="page-header"> <div class="page-header">
<div class="row align-items-end"> <div class="row align-items-end">
<div class="col-sm mb-2 mb-sm-0 d-flex align-items-center"> <div class="col-sm mb-2 mb-sm-0 ">
<div class="d-flex align-items-center">
<h1 class="page-header-title">Kokpit konsultanta</h1> <h1 class="page-header-title">Kokpit konsultanta</h1>
<span class="badge bg-soft-dark text-dark ms-2">Marketing</span> <!-- Dział firmy --> <span class="badge bg-soft-dark text-dark ms-2">Marketing</span> <!-- Grupy telefonów -->
</div>
<div class="row align-items-center"> <!-- BOX dla Managera i właściciela, pozwala przełączyć się na kokpit konsultanta jednego z pracowników i podejrzeć jego prace -->
<div class="col-auto">
<!-- Select -->
<div class="tom-select-custom">
<select class="js-select form-select form-select-sm form-select-borderless tom-select-form-select-ps-0" id="ownerLabel" autocomplete="on"
data-hs-tom-select-options='{
"searchInDropdown": true,
"hideSearch": false,
"dropdownWidth": "12rem"
}'>
<option value="owner1" selected data-option-template='<span class="d-flex align-items-center"><img class="avatar avatar-xss avatar-circle" src="./assets/img/160x160/img6.jpg" alt="Avatar" /><span class="flex-grow-1 ms-2">Mark Williams</span></span>'>Mark Williams</option>
<option value="owner2" data-option-template='<span class="d-flex align-items-center"><img class="avatar avatar-xss avatar-circle" src="./assets/img/160x160/img10.jpg" alt="Avatar" /><span class="flex-grow-1 ms-2">Amanda Harvey</span></span>'>Amanda Harvey</option>
<option value="owner3" data-option-template='<span class="d-flex align-items-center"><i class="bi-person text-body"></i><span class="flex-grow-1 ms-2">Assign to owner</span></span>'>Assign to owner</option>
</select>
</div>
<!-- End Select -->
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div> </div>
<!-- End Col --> <!-- End Col -->
@@ -349,7 +373,7 @@
<div class="card-body magico-scroll overflow-auto"> <div class="card-body magico-scroll overflow-auto">
<ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered"> <ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered">
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center list-group-item-action border-danger" href="#"> <a class="d-flex align-items-center list-group-item-action border-danger" href="#">
<div class="d-flex align-items-center me-2" > <div class="d-flex align-items-center me-2" >
<div class="flex-grow-1 ms-3"> <div class="flex-grow-1 ms-3">
@@ -447,7 +471,7 @@
<div class="card-body magico-scroll overflow-auto"> <div class="card-body magico-scroll overflow-auto">
<ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered"> <ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered">
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center list-group-item-action border-danger" href="#"> <a class="d-flex align-items-center list-group-item-action border-danger" href="#">
<div class="d-flex align-items-center me-2" > <div class="d-flex align-items-center me-2" >
<div class="flex-grow-1 ms-3"> <div class="flex-grow-1 ms-3">
@@ -548,7 +572,7 @@
<div class="card-body magico-scroll overflow-auto"> <div class="card-body magico-scroll overflow-auto">
<ul class="list-unstyled list-py-3 mb-0 "> <ul class="list-unstyled list-py-3 mb-0 ">
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center " href="#"> <a class="d-flex align-items-center " href="#">
<div class="fs-2 text-danger"> <div class="fs-2 text-danger">
<i class="bi bi-telephone-x"></i> <i class="bi bi-telephone-x"></i>
@@ -572,7 +596,7 @@
<!-- End Item --> <!-- End Item -->
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center " href="#"> <a class="d-flex align-items-center " href="#">
<div class="fs-2 text-primary"> <div class="fs-2 text-primary">
<i class="bi bi-telephone-outbound"></i> <i class="bi bi-telephone-outbound"></i>
@@ -596,7 +620,151 @@
<!-- End Item --> <!-- End Item -->
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#"> <a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary"> <div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i> <i class="bi bi-telephone-inbound"></i>
@@ -1684,13 +1852,44 @@
<!-- Body --> <!-- Body -->
<div class="modal-body"> <div class="modal-body">
<div class="row"> <div class="row mb-5">
<div class="col-12 col-md-8"> <div class="col-12 col-md-6">
<div class="mb-5">
<button type="button" class="btn btn-primary">Zadzwoń</button> <button type="button" class="btn btn-primary">Zadzwoń</button>
<button type="button" class="btn btn-light">Wyślij SMS</button> </div>
<div class="col-12 col-md-6 text-end">
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Skomentuj">
<i class="bi bi-chat-left-text"></i>
</button>
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Zaplanuj połączenie">
<i class="bi bi-clock"></i>
</button>
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Wyślij SMS">
<i class="bi bi-send"></i>
</button>
<div class="btn-group" role="group">
<button type="button" class="btn btn-primary" data-bs-toggle="dropdown" data-bs-target="uploadGroupDropdown">
<i class="bi-telephone-fill me-1"></i> W KOLEJCE
</button>
<div class="btn-group">
<button type="button" class="btn btn-primary dropdown-toggle" id="uploadGroupDropdown" data-bs-toggle="dropdown" aria-expanded="false"></button>
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="uploadGroupDropdown" style="">
<a class="dropdown-item text-success" href="#">
<h2><span class="badge bg-success d-block">GOTOWE</span></h2>
</a>
</div>
</div>
</div>
</div>
</div> </div>
<div class="row">
<div class="col-12 col-md-8">
<div class="magico-scroll" style="overflow-y: auto; overflow-x: hidden; height: 35rem;"> <div class="magico-scroll" style="overflow-y: auto; overflow-x: hidden; height: 35rem;">
<!-- Step --> <!-- Step -->
@@ -1789,7 +1988,9 @@
<!-- Step Item --> <!-- Step Item -->
<li class="step-item"> <li class="step-item">
<div class="step-content-wrapper"> <div class="step-content-wrapper">
<span class="step-icon step-icon-soft-info">D</span> <span class="step-icon step-icon-soft-info">
<i class="bi bi-chat-left-text"></i>
</span>
<div class="step-content"> <div class="step-content">
<div class="d-flex justify-content-between"> <div class="d-flex justify-content-between">
@@ -1803,6 +2004,26 @@
</li> </li>
<!-- End Step Item --> <!-- End Step Item -->
<!-- Step Item -->
<li class="step-item">
<div class="step-content-wrapper">
<span class="step-icon step-icon-soft-info">
<i class="bi bi-send"></i>
</span>
<div class="step-content">
<div class="d-flex justify-content-between">
<h5 class="mb-1">Wysłano SMS</h5>
<p class="fs-5 mb-1 pe-3">wczoraj 17:30</p>
</div>
<p class="fs-5 mb-1">Lorem ipsum, dolor, sit amet consectetur adipisicing elit. Maxime, accusantium praesentium obcaecati sed pariatur ipsa aperiam cupiditate labore non tempora rem ut aspernatur reprehenderit corrupti veritatis rerum, odio quo excepturi.</p>
</div>
</div>
</li>
<!-- End Step Item -->
</ul> </ul>
<!-- End Step --> <!-- End Step -->
@@ -1819,29 +2040,6 @@
</div> </div>
<div class="col-12 col-md-4"> <div class="col-12 col-md-4">
<div class="text-end mb-4">
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Zaplanuj połączenie">
<i class="bi bi-clock"></i>
</button>
<div class="btn-group" role="group">
<button type="button" class="btn btn-primary" data-bs-toggle="dropdown" data-bs-target="uploadGroupDropdown">
<i class="bi-telephone-fill me-1"></i> W KOLEJCE
</button>
<div class="btn-group">
<button type="button" class="btn btn-primary dropdown-toggle" id="uploadGroupDropdown" data-bs-toggle="dropdown" aria-expanded="false"></button>
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="uploadGroupDropdown" style="">
<a class="dropdown-item text-success" href="#">
<h2><span class="badge bg-success d-block">GOTOWE</span></h2>
</a>
</div>
</div>
</div>
</div>
<!-- Pokazujemy po kliknięciu na ikonę planowania terminu rozmowy <!-- Pokazujemy po kliknięciu na ikonę planowania terminu rozmowy
dla pola daty robimy ładnego datepickera | czas ograniczamy do godzin i minut, z interwałem co 15 minut --> dla pola daty robimy ładnego datepickera | czas ograniczamy do godzin i minut, z interwałem co 15 minut -->
@@ -1903,15 +2101,22 @@
<!-- bundlejs:vendor [.] --> <!-- bundlejs:vendor [.] -->
<script src="./assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script> <script src="./assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="./assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script> <script src="./assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<script src="./assets/vendor/hs-nav-scroller/dist/hs-nav-scroller.min.js"></script>
<script src="./node_modules/tom-select/dist/js/tom-select.complete.min.js"></script>
<script src="./node_modules/flatpickr/dist/flatpickr.min.js"></script>
<script src="./node_modules/daterangepicker/moment.min.js"></script>
<script src="./node_modules/daterangepicker/daterangepicker.js"></script>
<!-- JS Front --> <!-- JS Front -->
<!-- bundlejs:theme [.] --> <!-- bundlejs:theme [.] -->
<script src="./assets/js/hs.core.js"></script> <script src="./assets/js/hs.core.js"></script>
<script src="./assets/js/hs.bs-dropdown.js"></script> <script src="./assets/js/hs.bs-dropdown.js"></script>
<script src="./assets/js/hs.tom-select.js"></script>
<!-- JS Plugins Init. --> <!-- JS Plugins Init. -->
<script> <script>
(function() { (function() {
window.onload = function () {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE // INITIALIZATION OF NAVBAR VERTICAL ASIDE
// ======================================================= // =======================================================
new HSSideNav('.js-navbar-vertical-aside').init() new HSSideNav('.js-navbar-vertical-aside').init()
@@ -1925,6 +2130,20 @@
// INITIALIZATION OF FORM SEARCH // INITIALIZATION OF FORM SEARCH
// ======================================================= // =======================================================
new HSFormSearch('.js-form-search') new HSFormSearch('.js-form-search')
// INITIALIZATION OF NAV SCROLLER
// =======================================================
new HsNavScroller('.js-nav-scroller')
// INITIALIZATION OF SELECT
// =======================================================
HSCore.components.HSTomSelect.init('.js-select')
}
})() })()
</script> </script>

View File

@@ -17,6 +17,7 @@
<!-- CSS Implementing Plugins --> <!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] --> <!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css"> <link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<link rel="stylesheet" href="@@autopath/node_modules/tom-select/dist/css/tom-select.bootstrap5.css">
<!-- CSS Front Template --> <!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version --> <!-- bundlecss:theme [@@autopath] @@vars.version -->
@@ -42,7 +43,7 @@
<script src="https://company.magico.pro/assets/public/js/magico-toolbar.min.js?v=1" defer></script> <script src="https://company.magico.pro/assets/public/js/magico-toolbar.min.js?v=1" defer></script>
</head> </head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl footer-offset magico-h-100"> <body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl magico-h-100">
@@if(layoutBuilder.extend.switcherSupport === true) { @@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script> <script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
} }
@@ -86,9 +87,32 @@
<!-- Page Header --> <!-- Page Header -->
<div class="page-header"> <div class="page-header">
<div class="row align-items-end"> <div class="row align-items-end">
<div class="col-sm mb-2 mb-sm-0 d-flex align-items-center"> <div class="col-sm mb-2 mb-sm-0 ">
<div class="d-flex align-items-center">
<h1 class="page-header-title">Kokpit konsultanta</h1> <h1 class="page-header-title">Kokpit konsultanta</h1>
<span class="badge bg-soft-dark text-dark ms-2">Marketing</span> <!-- Dział firmy --> <span class="badge bg-soft-dark text-dark ms-2">Marketing</span> <!-- Grupy telefonów -->
</div>
<div class="row align-items-center"> <!-- BOX dla Managera i właściciela, pozwala przełączyć się na kokpit konsultanta jednego z pracowników i podejrzeć jego prace -->
<div class="col-auto">
<!-- Select -->
<div class="tom-select-custom">
<select class="js-select form-select form-select-sm form-select-borderless tom-select-form-select-ps-0" id="ownerLabel" autocomplete="on"
data-hs-tom-select-options='{
"searchInDropdown": true,
"hideSearch": false,
"dropdownWidth": "12rem"
}'>
<option value="owner1" selected data-option-template='<span class="d-flex align-items-center"><img class="avatar avatar-xss avatar-circle" src="@@autopath/assets/img/160x160/img6.jpg" alt="Avatar" /><span class="flex-grow-1 ms-2">Mark Williams</span></span>'>Mark Williams</option>
<option value="owner2" data-option-template='<span class="d-flex align-items-center"><img class="avatar avatar-xss avatar-circle" src="@@autopath/assets/img/160x160/img10.jpg" alt="Avatar" /><span class="flex-grow-1 ms-2">Amanda Harvey</span></span>'>Amanda Harvey</option>
<option value="owner3" data-option-template='<span class="d-flex align-items-center"><i class="bi-person text-body"></i><span class="flex-grow-1 ms-2">Assign to owner</span></span>'>Assign to owner</option>
</select>
</div>
<!-- End Select -->
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div> </div>
<!-- End Col --> <!-- End Col -->
@@ -142,7 +166,7 @@
<div class="card-body magico-scroll overflow-auto"> <div class="card-body magico-scroll overflow-auto">
<ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered"> <ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered">
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center list-group-item-action border-danger" href="#"> <a class="d-flex align-items-center list-group-item-action border-danger" href="#">
<div class="d-flex align-items-center me-2" > <div class="d-flex align-items-center me-2" >
<div class="flex-grow-1 ms-3"> <div class="flex-grow-1 ms-3">
@@ -240,7 +264,7 @@
<div class="card-body magico-scroll overflow-auto"> <div class="card-body magico-scroll overflow-auto">
<ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered"> <ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered">
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center list-group-item-action border-danger" href="#"> <a class="d-flex align-items-center list-group-item-action border-danger" href="#">
<div class="d-flex align-items-center me-2" > <div class="d-flex align-items-center me-2" >
<div class="flex-grow-1 ms-3"> <div class="flex-grow-1 ms-3">
@@ -341,7 +365,7 @@
<div class="card-body magico-scroll overflow-auto"> <div class="card-body magico-scroll overflow-auto">
<ul class="list-unstyled list-py-3 mb-0 "> <ul class="list-unstyled list-py-3 mb-0 ">
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center " href="#"> <a class="d-flex align-items-center " href="#">
<div class="fs-2 text-danger"> <div class="fs-2 text-danger">
<i class="bi bi-telephone-x"></i> <i class="bi bi-telephone-x"></i>
@@ -365,7 +389,7 @@
<!-- End Item --> <!-- End Item -->
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center " href="#"> <a class="d-flex align-items-center " href="#">
<div class="fs-2 text-primary"> <div class="fs-2 text-primary">
<i class="bi bi-telephone-outbound"></i> <i class="bi bi-telephone-outbound"></i>
@@ -389,7 +413,151 @@
<!-- End Item --> <!-- End Item -->
<!-- Item --> <!-- Item -->
<li class=""> <li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i>
</div>
<div class="d-flex align-items-center me-2">
<div class="flex-grow-1 ms-3">
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
<span class="fs-6 text-body">dziś 7:40</span>
</div>
</div>
<div class="ms-auto">
<span class="fs-6 text-body"></span>
</div>
<div class="ms-3">
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
<span class="avatar-initials">BB</span>
</div>
</div>
</a>
</li>
<!-- End Item -->
<!-- Item -->
<li>
<a class="d-flex align-items-center " href="#"> <a class="d-flex align-items-center " href="#">
<div class="fs-2 text-secondary"> <div class="fs-2 text-secondary">
<i class="bi bi-telephone-inbound"></i> <i class="bi bi-telephone-inbound"></i>
@@ -507,13 +675,44 @@
<!-- Body --> <!-- Body -->
<div class="modal-body"> <div class="modal-body">
<div class="row"> <div class="row mb-5">
<div class="col-12 col-md-8"> <div class="col-12 col-md-6">
<div class="mb-5">
<button type="button" class="btn btn-primary">Zadzwoń</button> <button type="button" class="btn btn-primary">Zadzwoń</button>
<button type="button" class="btn btn-light">Wyślij SMS</button> </div>
<div class="col-12 col-md-6 text-end">
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Skomentuj">
<i class="bi bi-chat-left-text"></i>
</button>
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Zaplanuj połączenie">
<i class="bi bi-clock"></i>
</button>
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Wyślij SMS">
<i class="bi bi-send"></i>
</button>
<div class="btn-group" role="group">
<button type="button" class="btn btn-primary" data-bs-toggle="dropdown" data-bs-target="uploadGroupDropdown">
<i class="bi-telephone-fill me-1"></i> W KOLEJCE
</button>
<div class="btn-group">
<button type="button" class="btn btn-primary dropdown-toggle" id="uploadGroupDropdown" data-bs-toggle="dropdown" aria-expanded="false"></button>
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="uploadGroupDropdown" style="">
<a class="dropdown-item text-success" href="#">
<h2><span class="badge bg-success d-block">GOTOWE</span></h2>
</a>
</div>
</div>
</div>
</div>
</div> </div>
<div class="row">
<div class="col-12 col-md-8">
<div class="magico-scroll" style="overflow-y: auto; overflow-x: hidden; height: 35rem;"> <div class="magico-scroll" style="overflow-y: auto; overflow-x: hidden; height: 35rem;">
<!-- Step --> <!-- Step -->
@@ -612,7 +811,9 @@
<!-- Step Item --> <!-- Step Item -->
<li class="step-item"> <li class="step-item">
<div class="step-content-wrapper"> <div class="step-content-wrapper">
<span class="step-icon step-icon-soft-info">D</span> <span class="step-icon step-icon-soft-info">
<i class="bi bi-chat-left-text"></i>
</span>
<div class="step-content"> <div class="step-content">
<div class="d-flex justify-content-between"> <div class="d-flex justify-content-between">
@@ -626,6 +827,26 @@
</li> </li>
<!-- End Step Item --> <!-- End Step Item -->
<!-- Step Item -->
<li class="step-item">
<div class="step-content-wrapper">
<span class="step-icon step-icon-soft-info">
<i class="bi bi-send"></i>
</span>
<div class="step-content">
<div class="d-flex justify-content-between">
<h5 class="mb-1">Wysłano SMS</h5>
<p class="fs-5 mb-1 pe-3">wczoraj 17:30</p>
</div>
<p class="fs-5 mb-1">Lorem ipsum, dolor, sit amet consectetur adipisicing elit. Maxime, accusantium praesentium obcaecati sed pariatur ipsa aperiam cupiditate labore non tempora rem ut aspernatur reprehenderit corrupti veritatis rerum, odio quo excepturi.</p>
</div>
</div>
</li>
<!-- End Step Item -->
</ul> </ul>
<!-- End Step --> <!-- End Step -->
@@ -642,29 +863,6 @@
</div> </div>
<div class="col-12 col-md-4"> <div class="col-12 col-md-4">
<div class="text-end mb-4">
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Zaplanuj połączenie">
<i class="bi bi-clock"></i>
</button>
<div class="btn-group" role="group">
<button type="button" class="btn btn-primary" data-bs-toggle="dropdown" data-bs-target="uploadGroupDropdown">
<i class="bi-telephone-fill me-1"></i> W KOLEJCE
</button>
<div class="btn-group">
<button type="button" class="btn btn-primary dropdown-toggle" id="uploadGroupDropdown" data-bs-toggle="dropdown" aria-expanded="false"></button>
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="uploadGroupDropdown" style="">
<a class="dropdown-item text-success" href="#">
<h2><span class="badge bg-success d-block">GOTOWE</span></h2>
</a>
</div>
</div>
</div>
</div>
<!-- Pokazujemy po kliknięciu na ikonę planowania terminu rozmowy <!-- Pokazujemy po kliknięciu na ikonę planowania terminu rozmowy
dla pola daty robimy ładnego datepickera | czas ograniczamy do godzin i minut, z interwałem co 15 minut --> dla pola daty robimy ładnego datepickera | czas ograniczamy do godzin i minut, z interwałem co 15 minut -->
@@ -726,15 +924,22 @@
<!-- bundlejs:vendor [@@autopath] --> <!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script> <script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script> <script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<script src="@@autopath/assets/vendor/hs-nav-scroller/dist/hs-nav-scroller.min.js"></script>
<script src="@@autopath/node_modules/tom-select/dist/js/tom-select.complete.min.js"></script>
<script src="@@autopath/node_modules/flatpickr/dist/flatpickr.min.js"></script>
<script src="@@autopath/node_modules/daterangepicker/moment.min.js"></script>
<script src="@@autopath/node_modules/daterangepicker/daterangepicker.js"></script>
<!-- JS Front --> <!-- JS Front -->
<!-- bundlejs:theme [@@autopath] --> <!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script> <script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script> <script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<script src="@@autopath/assets/js/hs.tom-select.js"></script>
<!-- JS Plugins Init. --> <!-- JS Plugins Init. -->
<script> <script>
(function() { (function() {
window.onload = function () {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE // INITIALIZATION OF NAVBAR VERTICAL ASIDE
// ======================================================= // =======================================================
new HSSideNav('.js-navbar-vertical-aside').init() new HSSideNav('.js-navbar-vertical-aside').init()
@@ -748,6 +953,20 @@
// INITIALIZATION OF FORM SEARCH // INITIALIZATION OF FORM SEARCH
// ======================================================= // =======================================================
new HSFormSearch('.js-form-search') new HSFormSearch('.js-form-search')
// INITIALIZATION OF NAV SCROLLER
// =======================================================
new HsNavScroller('.js-nav-scroller')
// INITIALIZATION OF SELECT
// =======================================================
HSCore.components.HSTomSelect.init('.js-select')
}
})() })()
</script> </script>

View File

@@ -19,7 +19,7 @@
<div class="nav-item"> <div class="nav-item">
<a class="nav-link @@if(link=='api-keys.html'){active}" href="@@autopath/api-keys.html" data-placement="left"> <a class="nav-link @@if(link=='api-keys.html'){active}" href="@@autopath/api-keys.html" data-placement="left">
<i class="bi-building nav-icon"></i> <i class="bi-building nav-icon"></i>
<span class="nav-link-title">Działy firmy</span> <span class="nav-link-title">Grupy telefonów</span>
</a> </a>
</div> </div>