Skip to content

D
design
Commit 0e078919 by NGUYEN HOANG SON
Options

#49161 Implement top screen action

parent c5cf8c5d
Showing with 107 additions and 69 deletions
app/dashboard-setting.html
......@@ -18,13 +18,15 @@
<script src="script/check-list.js?__UPDATEID__"></script>
<script src="script/check-foriOS.js"></script>
<script src="script/constant.js?__UPDATEID__"></script>
<script src="script/check-dashboard.js"></script>
<script src="script/check-footer.js"></script>
<script src="script/check-dashboard-setting.js"></script>
</head>
<body id="dashboard" onload="CHK_DashboardSetting.init();">
<header>
<nav class="navbar navbar-dark bg-primary position-fixed fixed-top w-100">
<a href="index.html" class="navbar-brand category-btn lht-0">
<a href="javascript:CHK_DashboardSetting.goBack();" class="navbar-brand category-btn lht-0">
<i class="fas fa-chevron-left fs-12 p-1"></i>
<span class="d-none d-md-inline fs-10">
戻る
......
app/index.html
......@@ -20,6 +20,7 @@
<script src="script/constant.js?__UPDATEID__"></script>
<script src="script/check-dashboard-setting.js"></script>
<script src="script/check-dashboard.js"></script>
<script src="script/check-footer.js"></script>
</head>
<body onload="CHK_L.init();" style="position: relative; margin-top: 53px;">
......@@ -192,36 +193,8 @@
</section>
</section>
<footer class="fixed-bottom bg-light">
<div id="footer"></div>
<nav class="d-flex justify-content-around">
<a class="d-block w-100 text-center py-2 text-decoration-none text-secondary bottom-nav" onclick="CHK_Dashboard.clickBottomNav('dashboard', this);">
<img src="img/icon_dashboard_inactive.svg" data-inactive-src="img/icon_dashboard_inactive.svg" data-src="img/icon_dashboard.svg" alt="ダッシュボード" class="p-1">
<div class="fs-7 multi-lang" data-msg="buttonDashboard">ダッシュボード</div>
</a>
<a class="d-block w-100 text-center py-2 text-decoration-none text-primary bottom-nav" onclick="CHK_Dashboard.clickBottomNav('operationList', this);">
<i class="fas fa-tasks fs-14 p-1"></i>
<div class="fs-7 multi-lang" data-msg="buttonOperationList">作業一覧</div>
</a>
<a class="d-block w-100 text-center py-2 text-decoration-none text-secondary" href="javascript:CHK_L.sendAppCommand('goRelationContent');">
<i class="fas fa-folder fs-14 p-1"></i>
<div class="fs-7 multi-lang" data-msg="buttonRelatedContent">関連資料</div>
</a>
<!-- <a class="d-block w-100 text-center py-2 text-decoration-none text-secondary" href="javascript:CHK_L.sendAppCommand('goCommunication');">
<i class="fas fa-comment-dots fs-14 p-1"></i>
<div class="fs-7 multi-lang" data-msg="buttonCommunication">コミュニケーション</div>
</a> -->
<!--<a class="d-block w-100 text-center py-2 text-decoration-none text-secondary">
<i class="fas fa-clipboard-list fs-14 p-1"></i>
<div class="fs-7">帳票確認</div>
</a>-->
<a class="d-block w-100 text-center py-2 text-decoration-none text-secondary" href="javascript:CHK_L.sendAppCommand('goSetting');">
<i class="fas fa-cog fs-14 p-1"></i>
<div class="fs-7 multi-lang" data-msg="buttonSetting">設定</div>
</a>
</nav>
</footer>
<div class="scan-overlay d-none"></div>
<div class="alert-overlay d-none"></div>
<div class="scan-area d-none">
......@@ -237,35 +210,14 @@
</body>
<script>
CHK_Dashboard.clickBottomNav = function(pageId, elm) {
var i, pages, navs;
pages = document.getElementsByClassName("page-content");
for (i = 0; i < pages.length; i++) {
if (pages[i].id == pageId) {
pages[i].style.display = "block";
$(document).ready(function() {
$("#footer").load("main-footer.html", function() {
if (CHK_DashboardSetting.isSettingEnabled(CHK_Dashboard.settingKey.dashboardHome)) {
CHK_Footer.goDashboard();
} else {
pages[i].style.display = "none";
CHK_Footer.goOperationList();
}
}
//disbale all bottom nav item
navs = document.getElementsByClassName("bottom-nav");
for (i = 0; i < navs.length; i++) {
navs[i].className = navs[i].className.replace("text-primary", "text-secondary");
var img = navs[i].querySelector("img");
if (img && img.getAttribute('data-inactive-src')) {
img.src = img.getAttribute('data-inactive-src');
}
}
//enable selected item
elm.className = elm.className.replace("text-secondary", "text-primary");
var img = elm.querySelector("img");
if (img && img.getAttribute("data-src")) {
img.src = img.getAttribute("data-src");
}
if (pageId == 'dashboard') {
CHK_Dashboard.init();
}
}
});
});
</script>
</html>
\ No newline at end of file
app/main-footer.html
<footer class="fixed-bottom bg-light">
<nav class="d-flex justify-content-around">
<a class="d-block w-100 text-center py-2 text-decoration-none text-secondary bottom-nav" onclick="clickBottomNav('dashboard', this);">
<a id="dashboardBottomNav" class="d-block w-100 text-center py-2 text-decoration-none text-secondary bottom-nav" onclick="CHK_Footer.goDashboard();">
<img src="img/icon_dashboard_inactive.svg" data-inactive-src="img/icon_dashboard_inactive.svg" data-src="img/icon_dashboard.svg" alt="ダッシュボード" class="p-1">
<div class="fs-7 multi-lang" data-msg="buttonDashboard">ダッシュボード</div>
</a>
<a class="d-block w-100 text-center py-2 text-decoration-none text-primary bottom-nav" onclick="clickBottomNav('operationList', this);">
<a id="operationListBottomNav" class="d-block w-100 text-center py-2 text-decoration-none text-secondary bottom-nav" onclick="CHK_Footer.goOperationList();">
<i class="fas fa-tasks fs-14 p-1"></i>
<div class="fs-7 multi-lang" data-msg="buttonOperationList">作業一覧</div>
</a>
......
app/script/check-dashboard-setting.js
......@@ -66,6 +66,12 @@ CHK_DashboardSetting.bindToggleClick = function() {
CHK_DashboardSetting.init = function() {
CHK_DashboardSetting.loadLocalSettings();
CHK_DashboardSetting.initDisplays();
$("#footer").load("main-footer.html");
$("#footer").load("main-footer.html", function() {
CHK_Footer.activeDashboardBottomNav();
});
CHK_DashboardSetting.bindToggleClick();
}
\ No newline at end of file
}
CHK_DashboardSetting.goBack = function() {
history.back();
}
app/script/check-dashboard.js
......@@ -6,13 +6,13 @@ CHK_Dashboard.pickupItems = [
{id: 'reportWarning', href: 'pickup.html', count: 0, enabled: true, img: {src: 'img/icon_alert.svg'}, msg: 'reportWarningTitle'},
];
CHK_Dashboard.communicationItems = [
{id: 'messageList', href: 'message-list.html', count: 0, enabled: true, img: {src: 'img/icon_message_lsit.svg'}, msg: 'messageListTitle'},
{id: 'sendMessage', href: '', count: 0, enabled: true, img: {src: 'img/icon_send_message.svg'}, msg: 'sendMessageTitle'},
{id: 'distanceSupport', href: '', count: 0, enabled: true, img: {src: 'img/icon_remote.svg'}, msg: 'distanceSupportTitle'},
{id: 'chat', href: '', count: 0, enabled: true, img: {src: 'img/icon_chat.svg'}, msg: 'chatTitle'},
{id: 'messageList', href: "javascript:CHK_L.sendAppCommand('goMessageList');", count: 0, enabled: true, img: {src: 'img/icon_message_lsit.svg'}, msg: 'messageListTitle'},
{id: 'sendMessage', href: "javascript:CHK_L.sendAppCommand('goSendMessage');", count: 0, enabled: true, img: {src: 'img/icon_send_message.svg'}, msg: 'sendMessageTitle'},
{id: 'distanceSupport', href: "javascript:CHK_L.sendAppCommand('goDistanceSupport');", count: 0, enabled: true, img: {src: 'img/icon_remote.svg'}, msg: 'distanceSupportTitle'},
{id: 'chat', href: "javascript:CHK_L.sendAppCommand('goChat');", count: 0, enabled: true, img: {src: 'img/icon_chat.svg'}, msg: 'chatTitle'},
];
CHK_Dashboard.pickupSettingMap = {
CHK_Dashboard.settingKey = {
newReport: "dashboardSettingNewReport",
continousWork: "dashboardSettingContinousWork",
reportWarning: "dashboardSettingReportWarning",
......@@ -67,7 +67,7 @@ CHK_Dashboard.init = function() {
CHK_Dashboard.updateDataPickups = function() {
CHK_Dashboard.pickupItems.forEach(function(item) {
let enabled = CHK_DashboardSetting.isSettingEnabled(CHK_Dashboard.pickupSettingMap[item.id]);
let enabled = CHK_DashboardSetting.isSettingEnabled(CHK_Dashboard.settingKey[item.id]);
if (enabled == true || enabled == false) {
item.enabled = enabled;
}
......
app/script/check-footer.js 0 → 100644
var CHK_Footer = {};
CHK_Footer.showPage = function(pageId) {
var i, pages;
pages = document.getElementsByClassName("page-content");
for (i = 0; i < pages.length; i++) {
if (pages[i].id == pageId) {
pages[i].style.display = "block";
} else {
pages[i].style.display = "none";
}
}
if (pageId == 'dashboard') {
CHK_Dashboard.init();
}
}
CHK_Footer.activeBottomNav = function(bottomNavId) {
var elm = $("#" + bottomNavId);
if (typeof elm !== 'object') {
console.log('CHK_Footer.activeBottomNav:elm !== object:' + bottomNavId);
return;
}
elm.removeClass('text-secondary');
elm.addClass("text-primary");
let img = elm.find("img")[0];
if (img && img.getAttribute("data-src")) {
img.src = img.getAttribute("data-src");
}
}
CHK_Footer.inactiveAllBottomNav = function() {
let navs = document.getElementsByClassName("bottom-nav");
for (i = 0; i < navs.length; i++) {
navs[i].className = navs[i].className.replace("text-primary", "text-secondary");
var img = navs[i].querySelector("img");
if (img && img.getAttribute('data-inactive-src')) {
img.src = img.getAttribute('data-inactive-src');
}
}
}
CHK_Footer.isIndexPage = function() {
if (typeof location === 'object' && typeof location.pathname === 'string') {
if (location.pathname.includes('index.html') == true) {
return true;
}
}
return false;
}
CHK_Footer.goIndexPage = function() {
location.href = 'index.html';
}
CHK_Footer.activeDashboardBottomNav = function() {
CHK_Footer.inactiveAllBottomNav();
CHK_Footer.activeBottomNav('dashboardBottomNav');
}
CHK_Footer.goDashboard = function() {
CHK_Footer.activeDashboardBottomNav();
if (CHK_Footer.isIndexPage()) {
CHK_Footer.showPage('dashboard');
return;
}
CHK_Footer.goIndexPage();
}
CHK_Footer.goOperationList = function() {
CHK_Footer.inactiveAllBottomNav();
CHK_Footer.activeBottomNav('operationListBottomNav');
if (CHK_Footer.isIndexPage()) {
CHK_Footer.showPage('operationList');
return;
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment