Skip to content

C
check
Commit da4f0e9c by NGUYEN THI MY DUYEN
Options

index design change

parent 462e03ac
Showing with 422 additions and 181 deletions
abvw/common/category-modal.html 0 → 100644
<div class="modal fade" id="category-modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable overflow-auto" 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="list-menu">
<ul>
<li>
<label>
<input type="radio" name="category" checked>
<span>すべて</span>
</label>
</li>
</ul>
<li class="accordion" id="accordion1">
<div id="heading1">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1" aria-expanded="true" aria-controls="collapse1">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>全社</span>
</label>
</a>
</div>
<div id="collapse1" class="collapse" aria-labelledby="heading1" data-parent="#accordion1">
<ul>
<li>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</li>
<li>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</li>
<li>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</li>
<li>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</li>
<li>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</li>
<li>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</li>
<li>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</li>
<li>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</li>
<li class="accordion" id="accordion1-1">
<div id="heading1-1">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1-1" aria-expanded="true" aria-controls="collapse1-1">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</a>
</div>
<div id="collapse1-1" class="collapse" aria-labelledby="heading1-1" data-parent="#accordion1-1">
<ul>
<li class="accordion" id="accordion1-2">
<div id="heading1-2">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1-2" aria-expanded="true" aria-controls="collapse1-2">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</a>
</div>
<div id="collapse1-2" class="collapse" aria-labelledby="heading1-2" data-parent="#accordion1-2">
<ul>
<li class="accordion" id="accordion1-3">
<div id="heading1-3">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1-3" aria-expanded="true" aria-controls="collapse1-3">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</a>
</div>
<div id="collapse1-3" class="collapse" aria-labelledby="heading1-3" data-parent="#accordion1-3">
<ul>
<li class="accordion" id="accordion1-4">
<div id="heading1-4">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1-4" aria-expanded="true" aria-controls="collapse1-4">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</a>
</div>
<div id="collapse1-4" class="collapse" aria-labelledby="heading1-4" data-parent="#accordion1-4">
<ul>
<li class="accordion" id="accordion1-5">
<div id="heading1-5">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1-5" aria-expanded="true" aria-controls="collapse1-5">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</a>
</div>
<div id="collapse1-5" class="collapse" aria-labelledby="heading1-5" data-parent="#accordion1-5">
<ul>
<li class="accordion" id="accordion1-6">
<div id="heading1-6">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1-6" aria-expanded="true" aria-controls="collapse1-6">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</a>
</div>
<div id="collapse1-6" class="collapse" aria-labelledby="heading1-6" data-parent="#accordion1-6">
<ul>
<li class="accordion" id="accordion1-7">
<div id="heading1-7">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1-7" aria-expanded="true" aria-controls="collapse1-7">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</a>
</div>
<div id="collapse1-7" class="collapse" aria-labelledby="heading1-7" data-parent="#accordion1-7">
<ul>
<li class="accordion" id="accordion1-8">
<div id="heading1-8">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1-8" aria-expanded="true" aria-controls="collapse1-8">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</a>
</div>
<div id="collapse1-8" class="collapse" aria-labelledby="heading1-8" data-parent="#accordion1-8">
<ul>
<li class="accordion" id="accordion1-9">
<div id="heading1-9">
<a href="#" class="list-menu-link">
<button type="button" class="collapsed" data-toggle="collapse" data-target="#collapse1-9" aria-expanded="true" aria-controls="collapse1-9">
<div class="arrow-icon"></div>
</button>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</a>
</div>
<div id="collapse1-9" class="collapse" aria-labelledby="heading1-9" data-parent="#accordion1-9">
<ul>
<li>
<label>
<input type="radio" name="category">
<span>カテゴリー</span>
</label>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</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>
\ No newline at end of file
abvw/common/header.html
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
</a> </a>
</li> </li>
<li class="nav-link"> <li class="nav-link">
<a href="task-list.html" class="d-block text-center text-decoration-none"> <a href="index.html" class="d-block text-center text-decoration-none">
<img src="../common/img/nav_icon_task.svg" type="image" alt="" class="p-sm-1 p-0 img-fluid lang" lang="workList"> <img src="../common/img/nav_icon_task.svg" type="image" alt="" class="p-sm-1 p-0 img-fluid lang" lang="workList">
<div class="fs-7 d-sm-block d-none lang" lang="workList"></div> <div class="fs-7 d-sm-block d-none lang" lang="workList"></div>
</a> </a>
......
abvw/common/js/header.js
...@@ -26,11 +26,7 @@ HEADER.goToHomePage = function (pageId) { ...@@ -26,11 +26,7 @@ HEADER.goToHomePage = function (pageId) {
* Go page of operationList * Go page of operationList
*/ */
HEADER.goOperationList = function () { HEADER.goOperationList = function () {
$('#footer').load(CONSTANT.PAGE_NAME.FOOTER, function () { OL.init();
sessionStorage.activeTab = CONSTANT.PAGE_TAB.OPERATION_LIST;
HEADER.activeInitBottomNav('operationListBottomNav');
TOP.showPage(CONSTANT.PAGE_NAME.OPERATION_LIST);
});
}; };
/** /**
......
abvw/html/index.html
...@@ -3,189 +3,144 @@ ...@@ -3,189 +3,144 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title calss="multi-lang" data-msg="operationListTitle"></title>
<meta name="robots" content="index, follow">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"> <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<meta name="description" content="A Book Check"> <!-- favicons -->
<link href="../common/img/favicon.ico" rel="icon">
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/header.css"> <link href="../common/img/apple-touch-icon.png" rel="apple-touch-icon">
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/footer.css"> <!-- main css -->
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/style.css"> <link rel="stylesheet" type="text/css" href="../common/css/newdash/app.css">
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/app.css"> <link rel="stylesheet" type="text/css" href="../common/css/newdash/header.css">
<link rel="stylesheet" type="text/css" href="/abvw/common/css/appCommon/fontawesome_relative_path.css"> <link rel="stylesheet" type="text/css" href="../common/css/newdash/style.css">
<!-- vender css -->
<script src="/abvw/common/js/jquery/jquery-3.6.0.min.js?__UPDATEID__"></script> <link rel="stylesheet" type="text/css" href="../common/css/newdash/fontawesome_relative_path.css">
<script src="/abvw/common/js/jquery/jquery-ui.min.js?__UPDATEID__"></script>
<!-- <script src="/abvw/common/js/web/common.js?__UPDATEID__"></script> <script type="text/javascript" src="/abvw/common/js/jquery/jquery-3.6.0.min.js?__UPDATEID__"></script>
<script src="/abvw/common/js/web/avweb.js?__UPDATEID__"></script> --> <script type="text/javascript" src="/abvw/common/js/jquery/jquery-ui.min.js?__UPDATEID__"></script>
<script src="/abvw/common/js/constant.js?__UPDATEID__"></script> <script type="text/javascript" src="/abvw/common/js/web/i18n.js?__UPDATEID__"></script>
<script src="/abvw/common/js/common.js?__UPDATEID__"></script>
<script src="/abvw/js/operationList/operationList.js?__UPDATEID__"></script> <script src="../common/js/constant.js?__UPDATEID__"></script>
<script src="/abvw/js/dashboardSetting/dashboard-setting.js?__UPDATEID__"></script> <script src="../common/js/common.js?__UPDATEID__"></script>
<script src="/abvw/js/dashboard/dashboard.js?__UPDATEID__"></script> <script src="../common/js/header.js?__UPDATEID__"></script>
<script src="/abvw/common/js/header.js?__UPDATEID__"></script>
<script src="/abvw/js/topPage/topPage.js?__UPDATEID__"></script> <script type="text/javascript" src="../js/dashboardSetting/dashboard-setting.js"></script>
<script src="/abvw/common/js/app.js?__UPDATEID__" defer></script> <script type="text/javascript" src="../js/template/template.js"></script>
<script type="text/javascript" src="../js/dashboard/dashboard.js"></script>
<script type="text/javascript" src="../js/topPage/topPage.js"></script>
<script type="text/javascript" src="../js/operationList/operationList.js"></script>
<script src="../common/js/app.js?__UPDATEID__" defer></script>
</head> </head>
<body style="position: relative; margin-top: 53px;"> <body>
<!--作業一覧画面--> <!-- header -->
<section id="operationList" class="page-content" style="display: none;"> <div id="includedHeader"></div>
<!--ヘッダー--> <!-- title -->
<header style="position: fixed; width: 100%; top: 0px; left: 0; z-index: 999;"> <div id="main-ttl">
<nav class="navbar navbar-dark bg-primary"> <div class="container">
<div> <!-- title -->
<a class="navbar-brand category-btn lht-0 d-none" onclick="OL.openCategory();" id="operationGroupMasterButton"> <h1 class="fs-14 font-weight-bold pt-4 pb-3 mb-0">作業一覧</h1>
<i class="fa fa-folder fs-12 p-1" id="category-toggle-button"></i>
<span class="d-none d-md-inline fs-10 multi-lang" data-msg="buttonCategory"></span>
</a>
</div> </div>
<h1 class="fs-10 font-weight-bold mb-0 text-white multi-lang alignCenter_header" data-msg="operationListHeaderTitle"></h1>
</nav>
</header>
<!--カテゴリ-->
<section class="category-menu">
<div id="overlayDiv" class="overlay"></div>
<nav id="category-menu" class="drawer-menu">
<div class="d-flex justifyfont-weight-bold fs-13 p-3 mb-0 multi-lang" data-msg="buttonCategory"></h2>
<a class="category-content-between border-bottom">
<h2 class="text-nowrap -btn p-3" onclick="OL.openCategory();" href="#"><i class="fa fa-times"></i></a>
</div> </div>
</nav>
</section>
<section class="container-fluid main-section"> <!-- task list -->
<main> <main>
<div class="container">
<!--パンくずリスト--> <!-- search condition -->
<nav aria-label="breadcrumb"> <nav aria-label="search" class="search search-condition">
<ol class="breadcrumb border-bottom px-0" id="groupMasterPath"> <div class="d-flex align-items-center">
</ol> <div class="search-form mr-1">
</nav> <input type="text" class="form-control" placeholder="作業名" id="searchTaskName">
<a href="#" class="search-form-btn" >
<!--検索欄--> <img src="../common/img/icon_search.svg" alt="検索アイコン" onclick="OL.search();">
<nav aria-label="search"> </a>
<div class="row">
<div class="col-7 col-md-5 col-lg-4">
<div class="form-group has-search input-group">
<input type="text" class="form-control multi-lang" data-msg="placeholderOperationName" placeholder="placeholderOperationName" id="searchTaskName">
<div class="input-group-append">
<i class="fas fa-search input-group-text" onclick="OL.search();"></i>
</div>
</div>
</div> </div>
<a href="#" class="mx-1" data-toggle="modal" data-target="#category-modal">
<!--カレンダー--> <img class="serarch-icon" src="../common/img/icon_folder.svg" alt="カテゴリー" data-toggle="tooltip" data-placement="bottom" title="カテゴリー" onclick="OL.openCategory();">
<div class="col-1 col-md-2 duration-area"> </a>
<a href="#" class="d-inline-block text-decoration-none py-2 lht-0" data-toggle="modal" data-target="#exampleModal"> <div class="c-dropdown">
<img class="icon" src="/abvw/img/operationList/icon_calendar.svg"> <a href="#" class="mx-1">
<span class="d-none d-md-inline text-black fs-10 align-middle multi-lang" data-msg="labelPeriod"></span> <img class="serarch-icon c-dropdown-trigger" id="dropdown-term" src="../common/img/icon_calendar.svg" alt="期間" data-toggle="tooltip" data-placement="bottom" title="期間">
</a> </a>
<div class="modal modal-duration fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="c-dropdown-menu dropdown-menu-right" data-animation="true" data-target="dropdown-term">
<div class="modal-dialog"> <div class="form-group p-2 mb-0">
<div class="modal-content"> <label>開始日</label>
<div class="modal-body">
<!--開始日付-->
<div class="form-group">
<label class="multi-lang" data-msg="labelStartDate"></label>
<div class="input-group date" id="datetimepicker1" data-target-input="nearest"> <div class="input-group date" id="datetimepicker1" data-target-input="nearest">
<input type="search" name="start" class="form-control form-control-sm datetimepicker-input multi-lang" data-msg="placeholderSelect" data-target="#datetimepicker1" placeholder="placeholderSelect" inputmode="none" id="searchStartDate"> <input type="text" name="start" class="form-control form-control-sm datetimepicker-input" data-target="#datetimepicker1" placeholder="選択" id="searchStartDate">
<div class="input-group-append" data-target="#datetimepicker1" data-toggle="datetimepicker"> <div class="input-group-append" data-target="#datetimepicker1" data-toggle="datetimepicker">
<div class="input-group-text"><i class="far fa-calendar"></i></div> <div class="input-group-text py-1 px-2">
<img src="../common/img/icon_calendar.svg" alt="カレンダー" class="calendar-icon">
</div> </div>
</div> </div>
</div> </div>
</div>
<!--終了日付--> <div class="form-group p-2 mb-0">
<div class="form-group"> <label>終了日</label>
<label class="multi-lang" data-msg="labelEndDate"></label>
<div class="input-group date" id="datetimepicker2" data-target-input="nearest"> <div class="input-group date" id="datetimepicker2" data-target-input="nearest">
<input type="search" name="end" class="form-control form-control-sm datetimepicker-input multi-lang" data-msg="placeholderSelect" data-target="#datetimepicker2" placeholder="placeholderSelect" inputmode="none" id="searchEndDate"> <input type="text" name="end" class="form-control form-control-sm datetimepicker-input" data-target="#datetimepicker2" placeholder="選択" id="searchEndDate">
<div class="input-group-append" data-target="#datetimepicker2" data-toggle="datetimepicker"> <div class="input-group-append" data-target="#datetimepicker2" data-toggle="datetimepicker">
<div class="input-group-text"><i class="far fa-calendar"></i></div> <div class="input-group-text py-1 px-2">
<img src="../common/img/icon_calendar.svg" alt="カレンダー" class="calendar-icon">
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="mask hide"></div>
</div> </div>
<div class="dropdown">
<a href="#" class="mx-1" id="dropdown-term" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-offset="-120, 0">
<img class="serarch-icon" src="../common/img/icon_swap.svg" alt="並び替え" data-toggle="tooltip" data-placement="bottom" title="並び替え">
</a>
<div class="dropdown-menu dropdown-menu-right sort" data-animation="true" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#" data-sort="0" onclick="OL.changeSortType(this);">作業名順</a>
<a class="dropdown-item active" href="#" data-sort="1" id="defaultSort" onclick="OL.changeSortType(this);">新しい順</a>
<a class="dropdown-item" href="#" data-sort="2" onclick="OL.changeSortType(this);">古い順</a>
<a class="dropdown-item" href="#" data-sort="4" onclick="OL.changeSortType(this);">閲覧日順</a>
</div> </div>
</div> </div>
<a href="javascript:OL.resetSearch();" class="mx-1">
<!--ソート--> <img class="serarch-icon" src="../common/img/icon_close.svg" alt="クリア" data-toggle="tooltip" data-placement="bottom" title="検索条件をクリア">
<div class="col-4 col-md-5 col-lg-6 text-right">
<a href="#" class="text-decoration-none py-2 lht-0" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-offset="-120, 0">
<img class="icon" src="/abvw/img/operationList/icon_swap.svg">
<span class="d-none d-md-inline text-dark fs-10 align-middle multi-lang" data-msg="labelSort"></span>
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item sort-type multi-lang" data-msg="labelSortName" data-sort="0" onclick="OL.changeSortType(this);"></a>
<a class="dropdown-item sort-type active multi-lang" data-msg="labelSortNew" data-sort="1" id="defaultSort" onclick="OL.changeSortType(this);"></a>
<a class="dropdown-item sort-type multi-lang" data-msg="labelSortOld" data-sort="2" onclick="OL.changeSortType(this);"></a>
<a class="dropdown-item sort-type multi-lang" data-msg="labelSortOpen" data-sort="4" onclick="OL.changeSortType(this);"></a>
</div>
<a href="javascript:OL.resetSearch();" class="text-decoration-none py-2 lht-0 d-inline-block ml-3">
<img class="icon" src="/abvw/img/operationList/icon_clear.svg">
<span class="d-none d-md-inline text-dark fs-10 align-middle multi-lang" data-msg="labelReset" lnag="labelReset"></span>
</a> </a>
</div> </div>
</div>
</nav> </nav>
<!--一覧表示--> <!-- category -->
<section> <nav aria-label="breadcrumb">
<table class="table"> <ol class="breadcrumb px-0 pb-0 mb-0" id="groupMasterPath">
<thead> </ol>
<tr> </nav>
<th class="multi-lang" data-msg="headerItemName"></th>
<th class="d-none d-md-table-cell multi-lang" data-msg="headerStartDate"></th> <!-- view menu -->
<th class="d-none d-md-table-cell multi-lang" data-msg="headerEndDate"></th> <nav aria-label="view" class="view-menu mt-2">
</tr> <div class="d-flex justify-content-between align-items-center">
</thead> <div class="fs-9">3<span>件表示</span></div>
<tbody id="operationTable"> <div class="view">
</tbody> <a href="#" class="text-decoration-none view-btn view-list-btn">
</table> <img src="../common/img/icon_view_list.svg" alt="リスト表示" class="list-block-icon mx-1" data-toggle="tooltip" data-placement="bottom" title="リスト表示">
</section> </a>
</main> <a href="#" class="text-decoration-none view-btn view-block-btn active">
</section> <img src="../common/img/icon_view_block.svg" alt="グリッド表示" class="list-block-icon mx-1" data-toggle="tooltip" data-placement="bottom" title="グリッド表示">
</section>
<section id="dashboard" class="page-content" style="display: none;">
<header>
<nav class="navbar navbar-dark bg-primary position-fixed fixed-top w-100">
<div></div>
<h1 class="fs-10 font-weight-bold mb-0 text-white multi-lang alignCenter_header" data-msg="dashboardHeaderTitle"></h1>
<div class="d-flex align-items-center">
<a href="javascript:CHK.goUrlWithCurrentParams('dashboard-setting.html');" class="nav-link text-white lht-0 p-1 mr-2">
<img class="icon" src="/abvw/img/dashboard/icon_dashboard_setting.svg" alt="">
<span class="d-none d-md-inline fs-10 align-middle multi-lang" data-msg="buttonDashboardSetting"></span>
</a> </a>
</div> </div>
</div>
</nav> </nav>
</header>
<!-- dashboard --> <!-- task list -->
<section class="container-fluid main-section"> <ul class="p-0 mt-3 card-list task-list view-content view-block" id="operationTable">
<main> </ul>
<!--ピックアップエリア-->
<h2 id="pickupHeader" class="fs-8 font-weight-bold mt-4 pb-2 border-bottom text-dark multi-lang" data-msg="pickupHeaderTitle"></h2>
<div class="item-wrap" id="pickupItems">
</div>
<!--コミュニケーションのエリア-->
<h2 class="fs-8 font-weight-bold mt-4 pb-2 border-bottom text-dark multi-lang" data-msg="communicationHeaderTitle"></h2>
<div class="item-wrap" id="communicationItems">
</div> </div>
</main> </main>
</section>
</section>
<!--フッター--> <!-- category modal -->
<div id="footer"></div> <div id="includedCategoryModal"></div>
<!-- confirm -->
<div id="includedConfirmModal"></div>
<!--アラート--> <!--アラート-->
<div class="alert-overlay d-none"></div> <div class="alert-overlay d-none"></div>
...@@ -197,7 +152,9 @@ ...@@ -197,7 +152,9 @@
<!--ローディング--> <!--ローディング-->
<div id="check_loading" style="display:none; position: relative; overflow:hidden;"> <div id="check_loading" style="display:none; position: relative; overflow:hidden;">
<p id="checkLoadingMessage"></p> <p id="checkLoadingMessage"></p>
<div id="checkLoadingImage"><img src='/abvw/img/loading.svg' /></div> <div id="checkLoadingImage"><img src='######' /></div>
</div> </div>
</body> </body>
</html> </html>
\ No newline at end of file
abvw/js/operationList/operationList.js
...@@ -14,6 +14,13 @@ OL.isOperationGroupMaster = 0; //0: category(operationGroupMaster) not exist 1: ...@@ -14,6 +14,13 @@ OL.isOperationGroupMaster = 0; //0: category(operationGroupMaster) not exist 1:
OL.sortIndex; OL.sortIndex;
OL.operationGroupMasterId; OL.operationGroupMasterId;
OL.REPORT_TYPE = {
REPORTONLY: 0, //report only
INSPECT: 1, //rountine
WITHREPLY: 2, // report answer
WORKFLOW: 3 // continuous
}
/** /**
* process on page load. * process on page load.
* 1.get all data. * 1.get all data.
...@@ -23,6 +30,10 @@ OL.operationGroupMasterId; ...@@ -23,6 +30,10 @@ OL.operationGroupMasterId;
OL.init = function () { OL.init = function () {
console.log('OperationList start'); console.log('OperationList start');
TEMPLATE.loadHearder("#includedHeader");
TEMPLATE.loadConfirmModal("#includedConfirmModal");
TEMPLATE.loadCategoryModal("#includedCategoryModal");
//get all data of operation list scene //get all data of operation list scene
OL.getAllDataWeb(sessionStorage.OL_searchKeyWord, sessionStorage.OL_sortIndex, sessionStorage.OL_searchStartDate, sessionStorage.OL_searchEndDate, sessionStorage.OL_operationGroupMasterId); OL.getAllDataWeb(sessionStorage.OL_searchKeyWord, sessionStorage.OL_sortIndex, sessionStorage.OL_searchStartDate, sessionStorage.OL_searchEndDate, sessionStorage.OL_operationGroupMasterId);
...@@ -137,35 +148,51 @@ OL.createOperationList = function (operationList) { ...@@ -137,35 +148,51 @@ OL.createOperationList = function (operationList) {
//create & show //create & show
for (let i = 0; i < operationList.length; i++) { for (let i = 0; i < operationList.length; i++) {
let operationTR = $('<tr/>'); let classIcon ;
switch (operationList[i].reportType)
const operationNameTd = $( {
"<td class='operationId_" + case OL.REPORT_TYPE.REPORTONLY:
operationList[i].operationId + classIcon = "report";
"'><a href=\"javascript:OL.sendOperation('" + break;
operationList[i].operationId + case OL.REPORT_TYPE.INSPECT:
"', '" + classIcon = "inspection";
operationList[i].operationType + break;
"', '" + case OL.REPORT_TYPE.WITHREPLY:
operationList[i].reportType + classIcon = "questionary";
"', '" + break;
operationList[i].enableAddReport + case OL.REPORT_TYPE.WORKFLOW:
"');\" class='d-block text-black text-decoration-none mb-1'>" + classIcon = "proccess";
operationList[i].operationName + break;
"</a><div class='fa-sm mobile_operation_date'><i class='far fa-clock fa-blue' style='color:blue;margin-right:10px'></i>" + }
OL.setOperationDate(operationList[i].operationStartDate) + let messageli = $("<li class='card mb-2' name = 'operationId_" + operationList[i].operationId + "' ></li>");
' ~ ' + let ahrefRequiredFlg = $("<a href=\"javascript:OL.sendOperation('"
OL.setOperationDate(operationList[i].operationEndDate) + + operationList[i].operationId
'</div></td>', + "', '"
); + operationList[i].operationType
const operationStartDateTd = $('<td/>', { class: 'operationStartDate' }).text(OL.setOperationDate(operationList[i].operationStartDate)); + "', '"
const operationEndDateTd = $('<td/>', { class: 'operationEndDate' }).text(OL.setOperationDate(operationList[i].operationEndDate)); + operationList[i].reportType
+ "', '"
operationTR.append(operationNameTd); + operationList[i].enableAddReport
operationTR.append(operationStartDateTd); + "');\" class='h-100 d-block px-3 py-2 text-decoration-none text-dark position-relative'></a>");
operationTR.append(operationEndDateTd); let divIcon = $("<div class='position-absolute translate-middle top-50 left-0 ml-3'>"
+ "<div class='type-icon'>"
$('.table tbody').append(operationTR); + "<span class='" + classIcon + "'></span>"
+ "</div></div>")
let divText = $("<div class='pl-5 h-100 d-flex align-items-center'>"
+ "<div class='w-100'>"
+ "<div class='fs-12 text-truncate'>" + operationList[i].operationName + "</div>"
+ "</div></div>");
let divDate = $("<div class='fs-8 text-secondary text-truncate'>"
+ OL.setOperationDate(operationList[i].operationStartDate)
+ ' ~ '
+ OL.setOperationDate(operationList[i].operationEndDate)
+ "</div>");
ahrefRequiredFlg.append(divIcon);
ahrefRequiredFlg.append(divText);
messageli.append(ahrefRequiredFlg);
$('#operationTable').append(messageli);
} }
}; };
......
abvw/js/template/template.js
...@@ -30,6 +30,13 @@ TEMPLATE.loadConfirmModal = function(elmentId) { ...@@ -30,6 +30,13 @@ TEMPLATE.loadConfirmModal = function(elmentId) {
}); });
} }
/** Template load category model */
TEMPLATE.loadCategoryModal = function(elmentId) {
$(elmentId).load("../common/category-modal.html", function() {
I18N.initi18n();
});
}
/** Template load operation select */ /** Template load operation select */
TEMPLATE.loadOperationSelect = function(elmentId, selectCallback) { TEMPLATE.loadOperationSelect = function(elmentId, selectCallback) {
$(elmentId).load("operation-select.html", function() { $(elmentId).load("operation-select.html", function() {
......
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