Skip to content

C
check
Commit e9171048 by NGUYEN HOANG SON
Options

#50282 implement message list html

parent 17d151f1
Showing with 155 additions and 0 deletions
abvw/html/push-message-list.html 0 → 100755
<!DOCTYPE html>
<html lang="ja-JP">
<head>
<meta charset="utf-8">
<title>プッシュメッセージ一覧</title>
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/app.css">
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/fontawesome_relative_path.css">
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/header.css">
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/footer.css">
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/style.css">
<script src="/abvw/common/js/jquery/jquery-3.6.0.min.js?__UPDATEID__"></script>
<script src="/abvw/common/js/jquery/jquery-ui.min.js?__UPDATEID__"></script>
<script src="/abvw/common/js/constant.js?__UPDATEID__"></script>
<script src="/abvw/common/js/common.js?__UPDATEID__"></script>
<script src="/abvw/common/js/footer.js"></script>
<script src="/abvw/js/pushMessageList/push-message-list.js"></script>
</head>
<body id="messageList" onload="PushMessageList.init();">
<header>
<nav class="navbar navbar-dark bg-primary position-fixed fixed-top w-100">
<a href="javascript:PushMessageList.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">
戻る
</span>
</a>
<h1 class="fs-10 font-weight-bold mb-0 text-white multi-lang" data-msg="messageListTopTitle">プッシュメッセージ一覧</h1>
<a href="javascript:PushMessageList.refresh();" class="nav-link text-white lht-0 p-1">
<img class="icon" src="img/icon_update.svg" alt="更新">
<span class="d-none d-md-inline fs-10 align-middle multi-lang" data-msg="buttonRefresh">
更新
</span>
</a>
</nav>
</header>
<!-- setting -->
<section class="container-fluid main-section">
<main>
<h2 class="fs-8 font-weight-bold mt-4 pb-2 border-bottom text-dark multi-lang" data-msg="messageListHeaderTitle">メッセージ一覧</h2>
<div class="not-found text-dark mb-1 p-3 d-none">
<img src="img/icon_not_found.svg" class="mb-3" alt="メッセージがありません。">
<div class="fs-9 text-secondary font-weight-bold multi-lang" data-msg="messageListEmptyTitle">メッセージがありません。</div>
</div>
<ul class="task-list p-0 mt-3" id="messageTable">
<!-- <li class="item list-unstyled rounded border mb-2 unread">
<a href="message-detail.html" class="d-block px-3 py-2 text-decoration-none text-dark">
<div class="title">メッセージ内容が入ります。</div>
<div class="sub-title-wrap">
<div class="fs-8 text-secondary mr-2"><div class="data">2022/07/06 14:14</div></div>
<div class="sub-title">作業名が入ります。</div>
</div>
<i class="fas fa-chevron-right fs-12"></i>
</a>
</li> -->
</ul>
</main>
</section>
<div id="footer"></div>
</body>
</html>
abvw/js/pushMessageList/push-message-list.js 0 → 100644
var PushMessageList = {};
//msgMap.messageListTopTitle = {ja:"プッシュメッセージ一覧", ko:"푸시 메시지 일람", en:"Push Message List"};
//msgMap.messageListHeaderTitle = {ja:"メッセージ一覧", ko:"메시지 일람", en:"Message List"};
//msgMap.messageListEmptyTitle = {ja:"メッセージがありません。", ko:"메시지가 없습니다.", en:"No Messages"};
PushMessageList.init = function() {
FOOTER.initFooter();
PushMessageList.createMessageList(PushMessageList.dummyMessageList());
}
PushMessageList.initPushMessageListCallback = function(pushMessageList) {
PushMessageList.createMessageList(pushMessageList);
}
PushMessageList.goBack = function() {
FOOTER.goDashboard();
}
PushMessageList.refresh = function() {
}
PushMessageList.clickMessage = function(pushMessageId) {
$("#pushMessageId_" + pushMessageId).removeClass('unread');
COMMON.goUrlWithCurrentParams('message-detail.html', {pushMessageId: pushMessageId});
}
PushMessageList.createMessageList = function(messageList) {
$('#messageTable').empty();
if (typeof messageList === 'undefined' || messageList.length < 1) {
$('#messageList .not-found').removeClass('d-none');
return;
}
$('#messageList .not-found').addClass('d-none');
for (var i = 0; i < messageList.length; i++) {
let message = messageList[i];
var messageId = message.pushMessageId;
var mTitle = message.pushMessage;
var mDate = message.pushSendDate;
var mSubtitle = message.operationName;
var unread = !message.readingFlg;
var messageLi = $('<li class="item list-unstyled rounded border mb-2" id="pushMessageId_' + messageId + '"/>');
if (unread) {
messageLi.addClass('unread');
}
var messageA = $('<a class="d-block px-3 py-2 text-decoration-none text-dark"/>');
messageA.attr('href', "javascript:CHK_MessageList.clickMessage('" + messageId +"');");
var titleDiv = $('<div class="title">' + mTitle + '</div>');
var subTitleMainDiv = $('<div class="sub-title-wrap"></div>');
var dateDiv = $('<div class="fs-8 text-secondary mr-2"><div class="data">' + mDate + '</div></div>');
var subTitleDiv = $('<div class="sub-title">' + mSubtitle + '</div>');
subTitleMainDiv.append(dateDiv);
subTitleMainDiv.append(subTitleDiv);
var infoI = $('<i class="fas fa-chevron-right fs-12"></i>');
messageA.append(titleDiv);
messageA.append(subTitleMainDiv);
messageA.append(infoI);
messageLi.append(messageA);
$('#messageTable').append(messageLi);
}
};
//dummy messages
PushMessageList.dummyMessageList = function() {
var messes = [];
messes.push({
pushMessageId: 1,
pushMessage: 'メッセージ内容が入ります。',
startDate: '2022/07/06 14:14',
operationName: '作業名が入ります。',
readingFlg: false,
});
messes.push({
pushMessageId: 2,
pushMessage: 'メッセージ内容が入ります。メッセージ内容が入ります。メッセージ内容が入ります。メッセージ内容が入ります。メッセージ内容が入ります。メッセージ内容が入ります。メッセージ内容が入ります。',
pushSendDate: 'xxxxxxxxxxxxxxxxxxxxxxxxxx',
operationName: '作業名が入ります。作業名が入ります。作業名が入ります。作業名が入ります。作業名が入ります。作業名が入ります。作業名が入ります。作業名が入ります。',
readingFlg: true,
});
messes.push({
pushMessageId: 3,
pushMessage: 'メッセージ内容が入ります。',
pushSendDate: '2022/07/07 14:14',
operationName: '作業名が入ります。',
readingFlg: false,
});
return messes;
}
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