Skip to content

C
check
Commit 0ed1067c by NGUYEN HOANG SON
Options

#50293 implement check validation when click send button

parent ca5f31c0
Showing with 53 additions and 106 deletions
abvw/html/send-message.html
......@@ -20,6 +20,7 @@
<script type="text/javascript" src="/abvw/common/js/web/i18n.js?__UPDATEID__"></script>
<script type="text/javascript" src="../common/js/newdash/app.js"></script>
<script type="text/javascript" src="../common/js/newdash/common.js"></script>
<script type="text/javascript" src="/abvw/common/js/validation.js?__UPDATEID__"></script>
<script src="../common/js/constant.js?__UPDATEID__"></script>
<script src="../common/js/common.js?__UPDATEID__"></script>
......@@ -57,17 +58,17 @@
<button type="button" class="btn btn-sm btn-tertiary lang" lang="buttonOperationSelect" data-toggle="modal" data-target="#task-list-modal"></button>
</div>
<div class="col-lg-11 col-md-10 col-9">
<div id="operationName"></div>
<div id="operationSelected" data-operation-id=""></div>
</div>
</div>
<div class="form-group form-row">
<label for="address" class="col-lg-1 col-md-2 col-3 control-label lang" lang="labelSendTypeTitle"></label>
<div class="col-lg-11 col-md-10 col-9">
<div class="btn-group btn-group-toggle" data-toggle="buttons">
<label class="btn btn-sm btn-primary custom active lang" lang="labelSendTypeGroup">
<input type="radio" name="options" id="option1" autocomplete="off" checked></label>
<label class="btn btn-sm btn-primary custom lang" lang="labelSendTypeAll">
<input type="radio" name="options" id="option2" autocomplete="off"></label>
<label class="btn btn-sm btn-primary custom active" for="sendTypeGroup">
<input type="radio" name="sendType" id="sendTypeGroup" value="0" autocomplete="off" checked></label>
<label class="btn btn-sm btn-primary custom" for="sendTypeAll">
<input type="radio" name="sendType" id="sendTypeAll" value="1" autocomplete="off"></label>
</div>
</div>
</div>
......@@ -89,106 +90,11 @@
</main>
<!-- task list modal -->
<div class="modal fade" id="task-list-modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
<div class="modal-content">
<div class="modal-header bg-dark10">
<h5 class="modal-title">作業選択</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<ul class="card-list select-card-list">
<li class="card mb-2 selected">
<a href="#" class="d-block px-5 py-3 text-decoration-none select-label">
<div class="fs-12 text-truncate d-block">作業名が入ります。</div>
</a>
</li>
<li class="card mb-2">
<a href="#" class="d-block px-5 py-3 text-decoration-none select-label">
<div class="fs-12 text-truncate d-block">作業名が入ります。</div>
</a>
</li>
<li class="card mb-2">
<a href="#" class="d-block px-5 py-3 text-decoration-none select-label">
<div class="fs-12 text-truncate d-block">作業名が入ります。</div>
</a>
</li>
</ul>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary">選択</button>
<button type="button" class="btn btn-tertiary" data-dismiss="modal">キャンセル</button>
</div>
</div>
</div>
</div>
<div id="includeOperationSelect"></div>
<!-- select template modal -->
<div class="modal fade" id="select-template-modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
<div class="modal-content">
<div class="modal-header bg-dark10">
<h5 class="modal-title">作業選択</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<ul class="card-list select-card-list">
<li class="accordion" id="accordion1">
<div class="card mb-2 selected" id="heading1">
<a href="#" class="d-flex text-decoration-none">
<div class="pl-5 py-3 h-100 w-100 align-self-center select-label">
タイトルテキスト
</div>
<div class="flex-shrink-1 mx-3 align-self-center">
<button class="btn btn-link border collapsed" type="button" data-toggle="collapse" data-target="#collapse1" aria-expanded="true" aria-controls="collapse1">
<div class="arrow-icon"></div>
</button>
</div>
</a>
</div>
<div id="collapse1" class="collapse" aria-labelledby="heading1" data-parent="#accordion1">
<div class="card-body">
テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入りま
す。テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入
ります。テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入ります。
</div>
</div>
</li>
<li class="accordion" id="accordion2">
<div class="card mb-2" id="heading2">
<a href="#" class="d-flex text-decoration-none">
<div class="pl-5 py-3 h-100 w-100 align-self-center select-label">
タイトルテキスト
</div>
<div class="flex-shrink-1 mx-3 align-self-center">
<button class="btn btn-link border collapsed" type="button" data-toggle="collapse" data-target="#collapse2" aria-expanded="true" aria-controls="collapse2">
<div class="arrow-icon"></div>
</button>
</div>
</a>
</div>
<div id="collapse2" class="collapse" aria-labelledby="heading2" data-parent="#accordion2">
<div class="card-body">
テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入りま
す。テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入
ります。テンプレートの内容が入ります。テンプレートの内容が入ります。テンプレートの内容が入ります。
</div>
</div>
</li>
</ul>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary">選択</button>
<button type="button" class="btn btn-tertiary" data-dismiss="modal">キャンセル</button>
</div>
</div>
</div>
</div>
<div id="includeTemplateModal"></div>
</body>
</html>
\ No newline at end of file
abvw/js/sendMessage/send-message.js
......@@ -14,13 +14,47 @@ SendMessage.baseApiUrl = CONSTANT.URL.CMS.BASE + ClientData.userInfo_accountPath
}
SendMessage.getCurrentMessageContent = function() {
return $('#messageContent').val();
}
SendMessage.getCurrentOperationId = function() {
return $('#operationSelected').attr('data-operation-id');
}
SendMessage.getCurrentSendType = function() {
return $('input[name="sendType"]:checked').val();
}
SendMessage.checkValidation = function() {
const message = SendMessage.getCurrentMessageContent();
if (!ValidationUtil.CheckRequiredForText(message)) {
console.log('message invalidation');
return false;
}
const operationId = SendMessage.getCurrentOperationId();
if (!ValidationUtil.IsNumber(operationId)) {
console.log('operationId invalidation');
return false;
}
const sendType = SendMessage.getCurrentSendType();
if (!ValidationUtil.IsNumber(sendType)) {
console.log('sendType invalidation');
return false;
}
return true;
};
/**
* handle click event of send button
*/
SendMessage.onClickSend = function() {
const message = $('#messageContent').val();
const operationId = 1;
const sendType = 0;
if (!SendMessage.checkValidation()) {
return;
}
const message = SendMessage.getCurrentMessageContent();
const operationId = SendMessage.getCurrentOperationId();
const sendType = SendMessage.getCurrentSendType();
SendMessage.postMessage(message, operationId, sendType);
};
......@@ -50,5 +84,10 @@ SendMessage.postMessage = function(message, operationId, sendType) {
* init data, action when screen onload
*/
SendMessage.init = function () {
I18N.initi18n();
TEMPLATE.loadHearder();
//load lang for elements none class lang
document.title = I18N.i18nText('sendMessageTitle');
$("label[for='sendTypeGroup']").append(I18N.i18nText('labelSendTypeGroup'));
$("label[for='sendTypeAll']").append(I18N.i18nText('labelSendTypeAll'));
};
\ 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