Skip to content

D
design
Commit 07c72174 by NGUYEN HOANG SON
Options

implement dashboard setting data, action

parent a7bcc9a6
Showing with 87 additions and 41 deletions
app/dashboard-setting.html
......@@ -18,9 +18,10 @@
<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-setting.js"></script>
</head>
<body id="dashboard">
<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">
......@@ -29,7 +30,7 @@
戻る
</span>
</a>
<h1 class="fs-10 font-weight-bold mb-0 text-white">ダッシュボード設定</h1>
<h1 class="fs-10 font-weight-bold mb-0 text-white multi-lang" data-msg="dashboardSettingHeaderTitle">ダッシュボード設定</h1>
<div></div>
</nav>
</header>
......@@ -37,34 +38,16 @@
<!-- setting -->
<section class="container-fluid main-section">
<main>
<h2 class="fs-8 font-weight-bold mt-4 pb-2 border-bottom text-dark">表示切替</h2>
<h2 class="fs-8 font-weight-bold mt-4 pb-2 border-bottom text-dark multi-lang" data-msg="dashboardSettingDisplayHeader">表示切替</h2>
<div class="setting-table-wrap">
<table>
<table id="displayItems">
<tbody>
<tr>
<th><div class="font-weight-normal text-dark">新規報告</div></th>
<!-- <tr>
<th><div class="font-weight-normal text-dark multi-lang" data-msg="dashboardSettingNewRegistrationTitle">新規報告</div></th>
<td>
<div class="toggle"><input type="checkbox" name="chk-new" /></div>
</td>
</tr>
<tr>
<th><div class="font-weight-normal text-dark">工程作業</div></th>
<td>
<div class="toggle"><input type="checkbox" name="chk-proccess" /></div>
</td>
</tr>
<tr>
<th><div class="font-weight-normal text-dark">警告を含む作業</div></th>
<td>
<div class="toggle"><input type="checkbox" name="chk-alert" /></div>
</td>
</tr>
<tr>
<th><div class="font-weight-normal text-dark">ダッシュボードをホーム画面にする</div></th>
<td>
<div class="toggle"><input type="checkbox" name="chk-home" /></div>
</td>
</tr>
</tr> -->
</tbody>
</table>
</div>
......@@ -72,19 +55,4 @@
</section>
<div id="footer"></div>
</body>
<script>
$(document).ready(function() {
$("#footer").load("main-footer.html");
});
$(".toggle").on("click", function() {
$(this).toggleClass("checked");
if(!$('input[name="check"]').prop("checked")) {
$(".toggle input").prop("checked", true);
} else {
$(".toggle input").prop("checked", false);
}
});
</script>
</html>
\ No newline at end of file
app/script/check-dashboard-setting.js 0 → 100644
var CHK_DashboardSetting = {};
CHK_DashboardSetting.displayItems = [
{ id:'dashboardSettingNewReport', name: 'chk-new', enabled: true, title:'新規報告', msg: 'dashboardSettingNewRegistrationTitle'},
{ id:'dashboardSettingContinousWork', name: 'chk-proccess', enabled: true, title:'工程作業', msg: 'dashboardSettingContinousWorkTitle'},
{ id:'dashboardSettingReportWarning', name: 'chk-alert', enabled: true, title:'警告を含む作業', msg: 'dashboardSettingReportWarningTitle'},
{ id:'dashboardSettingDashboardHome', name: 'chk-home', enabled: false, title:'ダッシュボードをホーム画面にする', msg: 'dashboardSettingDashboardHomeTitle'},
];
CHK_DashboardSetting.loadLocalSettings = function() {
CHK_DashboardSetting.displayItems.forEach(function(item) {
let enabled = CHK_DashboardSetting.isSettingEnabled(item.id);
if (enabled == true || enabled == false) {
item.enabled = enabled;
}
});
}
CHK_DashboardSetting.saveLocalSetting = function(key, value) {
localStorage.setItem(key, value);
}
CHK_DashboardSetting.isSettingEnabled = function(key) {
var setting = localStorage.getItem(key);
if (setting == '1') {
return true;
} else if (setting == '0') {
return false;
}
return setting;
}
CHK_DashboardSetting.initDisplays = function() {
$("#displayItems tbody").empty();
CHK_DashboardSetting.displayItems.forEach(function(item) {
var html = CHK_DashboardSetting.initHtmlItem(item);
$("#displayItems tbody").append(html);
});
}
CHK_DashboardSetting.initHtmlItem = function(item) {
var titleDiv = '<div class="font-weight-normal text-dark multi-lang" data-msg="' + item.msg + '">' + item.title +'</div>';
var toggleClass = 'toggle';
if (item.enabled) {
toggleClass += ' checked';
}
var toggleDiv = '<div id="' + item.id + '" class="' + toggleClass + '"><input type="checkbox" name="' + item.name + '" /></div>';
var html = $('<tr>'
+ '<th>' + titleDiv + '</th>'
+ '<td>' + toggleDiv + '</td>'
+ '</tr>');
return html;
}
CHK_DashboardSetting.bindToggleClick = function() {
$(".toggle").on("click", function() {
$(this).toggleClass("checked");
var id = $(this).attr('id');
if ($(this).hasClass('checked')) {
CHK_DashboardSetting.saveLocalSetting(id, '1');
} else {
CHK_DashboardSetting.saveLocalSetting(id, '0');
}
});
}
CHK_DashboardSetting.init = function() {
CHK_DashboardSetting.loadLocalSettings();
CHK_DashboardSetting.initDisplays();
$("#footer").load("main-footer.html");
CHK_DashboardSetting.bindToggleClick();
}
\ No newline at end of file
app/script/check.js
......@@ -102,6 +102,13 @@ var msgMap = { // velocity?
sendMessageTitle: { ja: "メッセージ送信", ko: "Send Message", en: "Send Message" },
distanceSupportTitle: { ja: "遠隔支援", ko: "Distance Support", en: "Distance Support" },
chatTitle: { ja: "チャット", ko: "Chat", en: "Chat" },
//dashboard setting screen
dashboardSettingHeaderTitle: { ja: "ダッシュボード設定", ko: "Dashboard Settings", en: "Dashboard Settings" },
dashboardSettingDisplayHeader: { ja: "表示切替", ko: "Display", en: "Display"},
dashboardSettingNewRegistrationTitle: { ja: "新規報告", ko: "New Registration", en: "New Registration"},
dashboardSettingContinousWorkTitle: { ja: "工程作業", ko: "Continous Work", en: "Continous Work"},
dashboardSettingReportWarningTitle: { ja: "警告を含む作業", ko: "Report Warning", en: "Report Warning"},
dashboardSettingDashboardHomeTitle: { ja: "ダッシュボードをホーム画面にする", ko: "Dashboard Home", en: "Dashboard Home"},
};
// 言語取得
......
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