Skip to content

C
check
Commit 7ead4d21 by Takumi Imai
Options

Merge branch 'feature/1.0_check_web_dev_duyen' into 'feature/1.0_check_web_dev' 

Feature/1.0 check web dev duyen

See merge request !41
parents ac475e82 1e8bc0f0
Showing with 384 additions and 270 deletions
abweb/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 lang" lang="categorySelection"></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" id="categoryListMenu">
<!-- <ul>
<li>
<label>
<input type="radio" name="category" checked>
<span class="lang" lang="categoryAll"></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 class="lang" lang="">全社</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 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>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li> -->
</ul>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary lang" lang="selection" onclick="OL.onClickCategorySelection();"></button>
<button type="button" class="btn btn-tertiary lang" lang="dspCancel" data-dismiss="modal"></button>
</div>
</div>
</div>
</div>
abweb/common/img/type_icon_questionary.svg deleted 100644 → 0
<?xml version="1.0" encoding="UTF-8"?><svg id="_レイヤー_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 119.14 125"><defs><style>.cls-1{fill:#a5d6a7;}</style></defs><g id="_レイヤー_1-2"><g><path class="cls-1" d="M48.17,121.12H9.29c-2.48,0-4.65-.93-6.5-2.79-1.86-1.86-2.79-4.03-2.79-6.5V21.68c0-2.48,.8-4.65,2.4-6.5,1.6-1.86,2.97-2.79,4.1-2.79h31.29c.72-3.61,2.5-6.58,5.34-8.91C45.97,1.16,49.25,0,52.97,0c3.72,0,7,1.16,9.83,3.48,2.84,2.32,4.62,5.29,5.34,8.91h31.29c2.48,0,4.65,.93,6.5,2.79,1.86,1.86,2.79,4.03,2.79,6.5v31.44h-9.29V21.68h-16.42v10.84c0,2.58-.9,4.78-2.71,6.58-1.81,1.81-4,2.71-6.58,2.71H35c-2.58,0-4.78-.9-6.58-2.71-1.81-1.81-2.71-4-2.71-6.58v-10.84H9.29V111.82H48.17v9.29Zm-13.4-55.34l16.51-16.51c.45-.45,.98-.67,1.59-.64,.61,.03,1.14,.27,1.59,.72s.68,1,.68,1.63-.23,1.17-.68,1.63l-18.1,18.1c-.45,.45-.98,.68-1.59,.68s-1.14-.23-1.59-.68l-8.94-8.94c-.45-.45-.67-1-.64-1.63,.03-.63,.27-1.17,.72-1.63,.45-.45,1-.68,1.63-.68,.63,0,1.17,.23,1.63,.68l7.2,7.27Zm0,26l16.51-16.51c.45-.45,.98-.67,1.59-.64,.61,.03,1.14,.27,1.59,.72s.68,1,.68,1.63-.23,1.17-.68,1.63l-18.1,18.1c-.45,.45-.98,.68-1.59,.68s-1.14-.23-1.59-.68l-8.94-8.94c-.45-.45-.67-1-.64-1.63,.03-.63,.27-1.17,.72-1.63,.45-.45,1-.68,1.63-.68,.63,0,1.17,.23,1.63,.68l7.2,7.27ZM55.76,21.06c1.76,0,3.23-.59,4.41-1.78,1.19-1.19,1.78-2.66,1.78-4.41s-.59-3.23-1.78-4.41c-1.19-1.19-2.66-1.78-4.41-1.78s-3.23,.59-4.41,1.78c-1.19,1.19-1.78,2.66-1.78,4.41s.59,3.23,1.78,4.41c1.19,1.19,2.66,1.78,4.41,1.78Z"/><g><path class="cls-1" d="M113.09,82.66l-11.61-11.61,4.74-4.74c.87-.87,2.02-1.31,3.43-1.31s2.56,.44,3.43,1.31l4.74,4.74c.87,.87,1.31,2.02,1.31,3.43s-.44,2.56-1.31,3.43l-4.74,4.74Z"/><path class="cls-1" d="M59.14,122.55v-7.19c0-.65,.11-1.25,.33-1.8,.22-.54,.6-1.09,1.14-1.63l33.84-33.84,11.61,11.61-33.84,33.84c-.54,.54-1.09,.93-1.63,1.14-.54,.22-1.14,.33-1.8,.33h-7.19c-.65,0-1.23-.25-1.72-.74-.49-.49-.74-1.06-.74-1.72Z"/></g></g></g></svg>
\ No newline at end of file
abweb/common/js/header.js
...@@ -28,12 +28,7 @@ ...@@ -28,12 +28,7 @@
* Go page of operationList * Go page of operationList
*/ */
HEADER.goOperationList = function () { HEADER.goOperationList = function () {
sessionStorage.activeHomePage = CONSTANT.PAGE_TAB.OPERATION_LIST; OL.init();
$('#footer').load(CONSTANT.PAGE_NAME.FOOTER, function () {
sessionStorage.activeTab = CONSTANT.PAGE_TAB.OPERATION_LIST;
HEADER.activeInitBottomNav('operationListBottomNav');
TOP.showPage(CONSTANT.PAGE_NAME.OPERATION_LIST);
});
}; };
/** /**
......
abweb/common/json/lang/lang-en.json
...@@ -98,6 +98,21 @@ ...@@ -98,6 +98,21 @@
"logo":"logo", "logo":"logo",
"listDisplay":"List display", "listDisplay":"List display",
"gridDisplay":"Grid display", "gridDisplay":"Grid display",
"operationListSearchPlacehoder":"Operation Name",
"searchIcon":"Search Icon",
"category":"Category",
"term":"Term",
"searchClear":"Search Clear",
"calendar":"Calendar",
"startDate":"Start Date",
"endDate":"End Date",
"sortBy":"Sort By",
"sortByName":"Name",
"sortByStartDate":"Start Date",
"sortByEndDate":"End Date",
"sortByLastEdit":"Last Edit",
"categorySelection":"Category Selection",
"categoryAll":"All",
"reportForm": "Report", "reportForm": "Report",
"periodicInspectionPeriod": "Periodic Inspection Period" "periodicInspectionPeriod": "Periodic Inspection Period"
} }
\ No newline at end of file
abweb/common/json/lang/lang-ja.json
...@@ -96,6 +96,21 @@ ...@@ -96,6 +96,21 @@
"logo":"ロゴ", "logo":"ロゴ",
"listDisplay":"リスト表示", "listDisplay":"リスト表示",
"gridDisplay":"グリッド表示", "gridDisplay":"グリッド表示",
"operationListSearchPlacehoder":"作業名",
"searchIcon":"検索アイコン",
"category":"カテゴリー",
"term":"期間",
"searchClear":"検索条件をクリア",
"calendar":"カレンダー",
"startDate":"開始日",
"endDate":"終了日",
"sortBy":"並び替え",
"sortByName":"作業名順",
"sortByStartDate":"新しい順",
"sortByEndDate":"古い順",
"sortByLastEdit":"閲覧日順",
"categorySelection":"カテゴリー選択",
"categoryAll":"すべて",
"reportForm": "報告", "reportForm": "報告",
"periodicInspectionPeriod": "定期点検期間" "periodicInspectionPeriod": "定期点検期間"
} }
\ No newline at end of file
abweb/common/json/lang/lang-ko.json
...@@ -95,6 +95,21 @@ ...@@ -95,6 +95,21 @@
"logo":"logo", "logo":"logo",
"listDisplay":"list display", "listDisplay":"list display",
"gridDisplay":"Grid display", "gridDisplay":"Grid display",
"operationListSearchPlacehoder":"Operation Name",
"searchIcon":"Search Icon",
"category":"Category",
"term":"Term",
"searchClear":"Search Clear",
"calendar":"Calendar",
"startDate":"Start Date",
"endDate":"End Date",
"sortBy":"Sort By",
"sortByName":"Name",
"sortByStartDate":"Start Date",
"sortByEndDate":"End Date",
"sortByLastEdit":"Last Edit",
"categorySelection":"Category Selection",
"categoryAll":"All",
"reportForm": "보고서", "reportForm": "보고서",
"periodicInspectionPeriod": "정기점검기간" "periodicInspectionPeriod": "정기점검기간"
} }
\ No newline at end of file
abweb/html/common/header.html 100644 → 100755
<header> <header>
<nav class="navbar navbar-dark shadow-sm px-sm-auto px-0"> <nav class="navbar navbar-dark shadow-sm px-sm-auto px-0">
<div class="container-wrap"> <div class="container-wrap">
...@@ -12,7 +13,7 @@ ...@@ -12,7 +13,7 @@
</a> </a>
</li> </li>
<li class="nav-link" id="iconHomeWorkList"> <li class="nav-link" id="iconHomeWorkList">
<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>
...@@ -38,3 +39,4 @@ ...@@ -38,3 +39,4 @@
</div> </div>
</nav> </nav>
</header> </header>
abweb/html/index.html
...@@ -3,25 +3,31 @@ ...@@ -3,25 +3,31 @@
<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="description" content="A Book Check">
<link rel="stylesheet" type="text/css" href="../common/css/appCommon/header.css">
<link rel="stylesheet" type="text/css" href="../common/css/appCommon/footer.css"> <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link rel="stylesheet" type="text/css" href="../common/css/appCommon/style.css"> <!-- favicons -->
<link rel="stylesheet" type="text/css" href="../common/css/appCommon/app.css"> <link href="../common/img/favicon.ico" rel="icon">
<link rel="stylesheet" type="text/css" href="../common/css/appCommon/fontawesome_relative_path.css"> <link href="../common/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- main css -->
<link rel="stylesheet" type="text/css" href="../common/css/newdash/app.css">
<link rel="stylesheet" type="text/css" href="../common/css/newdash/header.css">
<link rel="stylesheet" type="text/css" href="../common/css/newdash/style.css">
<!-- vender css -->
<link rel="stylesheet" type="text/css" href="../common/css/newdash/fontawesome_relative_path.css">
<script src="../common/js/jquery/jquery-3.6.0.min.js?__UPDATEID__"></script> <script src="../common/js/jquery/jquery-3.6.0.min.js?__UPDATEID__"></script>
<script src="../common/js/jquery/jquery-ui.min.js?__UPDATEID__"></script> <script src="../common/js/jquery/jquery-ui.min.js?__UPDATEID__"></script>
<script src="../common/js/web/i18n.js?__UPDATEID__"></script>
<!-- <script src="../common/js/web/common.js?__UPDATEID__"></script>
<script src="../common/js/web/avweb.js?__UPDATEID__"></script> -->
<script src="../common/js/constant.js?__UPDATEID__"></script> <script src="../common/js/constant.js?__UPDATEID__"></script>
<script src="../common/js/common.js?__UPDATEID__"></script> <script src="../common/js/common.js?__UPDATEID__"></script>
<script src="../js/operationList/operationList.js?__UPDATEID__"></script> <script src="../js/operationList/operationList.js?__UPDATEID__"></script>
<script src="../js/dashboardSetting/dashboardSetting.js?__UPDATEID__"></script> <script src="../js/dashboardSetting/dashboardSetting.js?__UPDATEID__"></script>
<script src="../js/dashboard/dashboard.js?__UPDATEID__"></script> <script src="../js/dashboard/dashboard.js?__UPDATEID__"></script>
<script src="../common/js/header.js?__UPDATEID__"></script> <script src="../common/js/header.js?__UPDATEID__"></script>
<script src="../js/template/template.js?__UPDATEID__"></script>
<script src="../js/topPage/topPage.js?__UPDATEID__"></script> <script src="../js/topPage/topPage.js?__UPDATEID__"></script>
<script src="../common/js/app.js?__UPDATEID__" defer></script> <script src="../common/js/app.js?__UPDATEID__" defer></script>
<script src="../js/reportForm/reportForm.js?__UPDATEID__" defer></script> <script src="../js/reportForm/reportForm.js?__UPDATEID__" defer></script>
...@@ -30,163 +36,106 @@ ...@@ -30,163 +36,106 @@
</head> </head>
<body style="position: relative; margin-top: 53px;"> <body>
<!--作業一覧画面-->
<section id="operationList" class="page-content" style="display: none;">
<!--ヘッダー-->
<header style="position: fixed; width: 100%; top: 0px; left: 0; z-index: 999;">
<nav class="navbar navbar-dark bg-primary">
<div>
<a class="navbar-brand category-btn lht-0 d-none" onclick="OL.openCategory();" id="operationGroupMasterButton">
<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>
<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>
</nav>
</section>
<section class="container-fluid main-section"> <!-- header -->
<div id="includedHeader"></div>
<div id="includedMainTitle"></div>
<!-- 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 lang" lang="operationListSearchPlacehoder" placeholder="" id="searchTaskName">
<a href="#" class="search-form-btn" >
<!--検索欄--> <img src="../common/img/icon_search.svg" type="image" alt="" class="lang" lang="searchIcon" 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 d-none" id="operationGroupMasterButton" data-toggle="modal" data-target="#category-modal">
<!--カレンダー--> <img class="serarch-icon lang" lang="category" src="../common/img/icon_folder.svg" type="image" alt="" data-toggle="tooltip" data-placement="bottom" title="" onclick="OL.openCategory();">
<div class="col-1 col-md-2 duration-area">
<a href="#" class="d-inline-block text-decoration-none py-2 lht-0" data-toggle="modal" data-target="#exampleModal">
<img class="icon" src="../img/operationList/icon_calendar.svg">
<span class="d-none d-md-inline text-black fs-10 align-middle multi-lang" data-msg="labelPeriod"></span>
</a> </a>
<div class="modal modal-duration fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="c-dropdown">
<div class="modal-dialog"> <a href="#" class="mx-1">
<div class="modal-content"> <img class="serarch-icon c-dropdown-trigger lang" lang="term" id="dropdown-term" src="../common/img/icon_calendar.svg" type="image" alt="" data-toggle="tooltip" data-placement="bottom" title="">
<div class="modal-body"> </a>
<div class="c-dropdown-menu dropdown-menu-right" data-animation="true" data-target="dropdown-term">
<!--開始日付--> <div class="form-group p-2 mb-0">
<div class="form-group"> <label class="lang" lang="startDate"></label>
<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" type="image" alt="" class="calendar-icon lang" lang="calendar">
</div> </div>
</div> </div>
</div> </div>
</div>
<!--終了日付--> <div class="form-group p-2 mb-0">
<div class="form-group"> <label class="lang" lang="endDate"></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" type="image" alt="" class="calendar-icon lang" lang="calendar">
</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 lang" lang="sortBy" src="../common/img/icon_swap.svg" type="image" 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 sort-type lang" lang="sortByName" href="#" data-sort="0" onclick="OL.changeSortType(this);"></a>
<a class="dropdown-item sort-type lang active" lang="sortByStartDate" href="#" data-sort="1" id="defaultSort" onclick="OL.changeSortType(this);"></a>
<a class="dropdown-item sort-type lang" lang="sortByEndDate" href="#" data-sort="2" onclick="OL.changeSortType(this);"></a>
<a class="dropdown-item sort-type lang" lang="sortByLastEdit" 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 lang" lang="searchClear" src="../common/img/icon_close.svg" type="image" 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="../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="../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"><span id="operationCount">0</span><span class="lang" lang="display"></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" type="image" alt="" class="list-block-icon mx-1 lang" lang="listDisplay" 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" type="image" alt="" class="list-block-icon mx-1 lang" lang="gridDisplay" 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('dashboardSetting.html');" class="nav-link text-white lht-0 p-1 mr-2">
<img class="icon" src="../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>
...@@ -198,7 +147,10 @@ ...@@ -198,7 +147,10 @@
<!--ローディング--> <!--ローディング-->
<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='/abweb/img/loading.svg' /></div> <div id="checkLoadingImage"><img src='######' /></div>
</div> </div>
<script type="text/javascript" src="../common/js/newdash/common.js?__UPDATEID__"></script>
</body> </body>
</html> </html>
abweb/js/operationList/operationList.js
...@@ -5,15 +5,22 @@ ...@@ -5,15 +5,22 @@
* @since cms:1.4.3.2&1.4.3.3 web:1.0 * @since cms:1.4.3.2&1.4.3.3 web:1.0
*/ */
var OL = {}; var OL = {};
OL.operationList; //Operation json data OL.operationList; //Operation json data
OL.operationGroupMaster; //category(operationGroupMaster) json data OL.operationGroupMaster; //category(operationGroupMaster) json data
OL.isOperationGroupMaster = 0; //0: category(operationGroupMaster) not exist 1: category(operationGroupMaster) exist OL.isOperationGroupMaster = 0; //0: category(operationGroupMaster) not exist 1: category(operationGroupMaster) exist
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.
...@@ -22,7 +29,11 @@ OL.operationGroupMasterId; ...@@ -22,7 +29,11 @@ OL.operationGroupMasterId;
*/ */
OL.init = function () { OL.init = function () {
console.log('OperationList start'); console.log('OperationList start');
COMMON.showLoading();
TEMPLATE.loadHearder("#includedHeader");
TEMPLATE.loadMainNavsTitle('#includedMainTitle', 'workList', null, null);
TEMPLATE.loadConfirmModal("#includedConfirmModal");
//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);
...@@ -30,8 +41,10 @@ OL.init = function () { ...@@ -30,8 +41,10 @@ OL.init = function () {
OL.createOperationList(OL.operationList); OL.createOperationList(OL.operationList);
//show category(operationGroupMaster) //show category(operationGroupMaster)
$("#includedCategoryModal").load("../common/category-modal.html", function() {
OL.createCategory(); OL.createCategory();
COMMON.closeLoading(); I18N.initi18n();
});
}; };
/** /**
...@@ -131,42 +144,61 @@ OL.createOperationList = function (operationList) { ...@@ -131,42 +144,61 @@ OL.createOperationList = function (operationList) {
//Initialization //Initialization
OL.initActiveSortIndex(); OL.initActiveSortIndex();
$('#operationTable').empty(); $('#operationTable').empty();
$('#operationCount').text(0);
if (!operationList) { if (!operationList) {
return; return;
} }
$('#operationCount').text(operationList.length);
//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 divDate = "<div class='fs-8 text-secondary text-truncate'>"
+ OL.setOperationDate(operationList[i].operationStartDate)
+ ' ~ '
+ OL.setOperationDate(operationList[i].operationEndDate)
+ "</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>"
+ divDate
+ "</div></div>");
ahrefRequiredFlg.append(divIcon);
ahrefRequiredFlg.append(divText);
messageli.append(ahrefRequiredFlg);
$('#operationTable').append(messageli);
} }
}; };
...@@ -207,11 +239,9 @@ OL.createCategory = function () { ...@@ -207,11 +239,9 @@ OL.createCategory = function () {
if (!OL.isOperationGroupMaster) { if (!OL.isOperationGroupMaster) {
return; return;
} }
OL.initCategory(); OL.initCategory();
OL.createBreadcrumbList(); OL.createBreadcrumbList();
OL.createCategoryList(); OL.createCategoryList();
OL.acdMenu();
}; };
/** /**
...@@ -221,22 +251,7 @@ OL.initCategory = function () { ...@@ -221,22 +251,7 @@ OL.initCategory = function () {
if (!OL.isOperationGroupMaster) { if (!OL.isOperationGroupMaster) {
return; return;
} }
$('#operationGroupMasterButton').removeClass('d-none'); $('#operationGroupMasterButton').removeClass('d-none');
OL.setCategoryHeight();
$(window).resize(function () {
OL.setCategoryHeight();
});
};
/**
* change height category(operationGroupMaster)
*/
OL.setCategoryHeight = function () {
const CATEGORY_HEIGHT = $('footer').offset().top - $('#category-menu').offset().top;
$('#category-menu').css('overflow', 'scroll');
$('#category-menu').height(CATEGORY_HEIGHT);
$('#overlayDiv').height(CATEGORY_HEIGHT);
}; };
/** /**
...@@ -249,18 +264,26 @@ OL.createBreadcrumbList = function () { ...@@ -249,18 +264,26 @@ OL.createBreadcrumbList = function () {
$('#groupMasterPath').empty(); $('#groupMasterPath').empty();
if (typeof OL.operationGroupMasterId === 'undefined' || OL.operationGroupMasterId == 0) { if (typeof OL.operationGroupMasterId === 'undefined' || OL.operationGroupMasterId == 0) {
$('#groupMasterPath').append('<li class="breadcrumb-item"><a href="#" class="text-decoration-none text-dark">' + COMMON.getMsg('all') + '</a></li>'); $('#groupMasterPath').append('<li class="breadcrumb-item"><a href="#" class="text-decoration-none text-underline">' + I18N.i18nText('categoryAll') + '</a></li>');
} else { } else {
let treeList = []; let treeList = [];
OL.createBreadcrumbTree(treeList, OL.operationGroupMasterId); OL.createBreadcrumbTree(treeList, OL.operationGroupMasterId);
treeList.forEach(function (operationGroupMaster) { treeList.forEach(function (operationGroupMaster) {
if (operationGroupMaster.operationGroupMasterId != OL.operationGroupMasterId) {
$('#groupMasterPath').append( $('#groupMasterPath').append(
'<li class="breadcrumb-item"><a onclick="OL.changeOperationGroupMaster(' + '<li class="breadcrumb-item"><a onclick="OL.changeOperationGroupMaster(' +
operationGroupMaster.operationGroupMasterId + operationGroupMaster.operationGroupMasterId +
');" class="text-decoration-none text-dark">' + ');" class="text-decoration-none text-underline">' +
operationGroupMaster.operationGroupMasterName + operationGroupMaster.operationGroupMasterName +
'</a></li>', '</a></li>',
); );
} else {
$('#groupMasterPath').append(
'<li class="breadcrumb-item active" aria-current="page"><span>' +
operationGroupMaster.operationGroupMasterName +
'</span></li>',
);
}
}); });
} }
}; };
...@@ -290,87 +313,81 @@ OL.createCategoryList = function () { ...@@ -290,87 +313,81 @@ OL.createCategoryList = function () {
if (!OL.isOperationGroupMaster) { if (!OL.isOperationGroupMaster) {
return; return;
} }
//Create a side menu category structure //Create a side menu category structure
$('.group-category-list').remove(); var categoryListElement = $('#categoryListMenu');
categoryListElement.empty();
OL.operationGroupMaster.sort(function (a, b) { OL.operationGroupMaster.sort(function (a, b) {
if (a.operationGroupMasterLevel < b.operationGroupMasterLevel) return -1; if (a.operationGroupMasterLevel < b.operationGroupMasterLevel) return -1;
if (a.operationGroupMasterLevel > b.operationGroupMasterLevel) return 1; if (a.operationGroupMasterLevel > b.operationGroupMasterLevel) return 1;
return 1; return 1;
}); });
//common let allChecked = '';
const noCategory = $("<dl id='groupMasterId_0' class='group-category-list'><dt><a onclick='OL.changeOperationGroupMaster(0);'>" + COMMON.getMsg('all') + '</a></dt></dl>'); if (typeof OL.operationGroupMasterId === 'undefined' || OL.operationGroupMasterId == 0) {
allChecked = ' checked';
$('#category-menu').append(noCategory); }
const allCategory = $('<ul><li><label><input type="radio" name="category" value="0"' +
allChecked +
'><span class="lang" lang="categoryAll">' + I18N.i18nText('categoryAll') + '</span></label></li></ul>');
categoryListElement.append(allCategory);
//create category(operationGroupMaster) structure //create category(operationGroupMaster) structure
for (let i = 0; i < OL.operationGroupMaster.length; i++) { for (let i = 0; i < OL.operationGroupMaster.length; i++) {
if (OL.operationGroupMaster[i].operationGroupMasterLevel == 0) { const item = OL.operationGroupMaster[i];
const categoryParent = $( console.log(item);
'<dl id=groupMasterId_' + let inputLabel = $('<label>');
OL.operationGroupMaster[i].operationGroupMasterId + let inputRadio = $('<input type="radio" name="category">');
" class='group-category-list' style='overflow-x:auto;'><dt class='menu-ttl'><a onclick='OL.changeOperationGroupMaster(" + inputRadio.val(item.operationGroupMasterId);
OL.operationGroupMaster[i].operationGroupMasterId + if (OL.operationGroupMasterId && OL.operationGroupMasterId == item.operationGroupMasterId) {
");'>" + inputRadio.prop('checked', true);
OL.operationGroupMaster[i].operationGroupMasterName + }
'</a></dt></dl>', let groupSpan = $('<span>' + item.operationGroupMasterName + '</span>');
); inputLabel.append(inputRadio);
$('#category-menu').append(categoryParent); inputLabel.append(groupSpan);
if (item.operationGroupMasterLevel == 0) {
const accordionId = 'accordion' + item.operationGroupMasterId;
const headingId = 'heading' + item.operationGroupMasterId;
const collapseId = 'collapse' + item.operationGroupMasterId;
let categoryParentElm = $('<li class="accordion" id="' + accordionId + '" />');
let headingDiv = $('<div id="' + headingId + '" />');
let linkA = $('<a class="list-menu-link" />');
let collapseButton = $('<button type="button" class="collapsed" data-toggle="collapse" aria-expanded="true" />');
collapseButton.attr('data-target', '#' + collapseId);
collapseButton.attr('aria-controls', collapseId);
collapseButton.append('<div class="arrow-icon"></div>');
linkA.append(collapseButton);
linkA.append(inputLabel);
headingDiv.append(linkA);
categoryParentElm.append(headingDiv);
categoryListElement.append(categoryParentElm);
} else { } else {
if ($('#groupMasterId_' + OL.operationGroupMaster[i].parentOperationGroupMasterId + '>ul').length > 0) { let li = $('<li>');
const categoryChild = $( li.append(inputLabel);
"<li id='groupMasterId_" + let parentElm = $('#collapse' + item.parentOperationGroupMasterId + ' > ul');
OL.operationGroupMaster[i].operationGroupMasterId + if (typeof parentElm === 'undefined' || !parentElm || parentElm.length < 1) {
"' class=''><p class='category-li group-level-" + const accordionParentId = 'accordion' + item.parentOperationGroupMasterId;
OL.operationGroupMaster[i].operationGroupMasterLevel + const headingParentId = 'heading' + item.parentOperationGroupMasterId;
"'><a class='category-a' onclick='OL.changeOperationGroupMaster(" + const collapseParentId = 'collapse' + item.parentOperationGroupMasterId;
OL.operationGroupMaster[i].operationGroupMasterId + parentElm = $('<div id="' + collapseParentId + '" class="collapse">');
");'>" + parentElm.attr('data-parent', '#' + accordionParentId);
OL.operationGroupMaster[i].operationGroupMasterName + parentElm.attr('aria-labelledby', headingParentId);
'</a></p></li>', let ul = $('<ul>');
); ul.append(li);
$('#groupMasterId_' + OL.operationGroupMaster[i].parentOperationGroupMasterId + ' >ul').append(categoryChild); parentElm.append(ul);
$('#' + accordionParentId).append(parentElm);
} else { } else {
const groupParents = '#groupMasterId_' + OL.operationGroupMaster[i].parentOperationGroupMasterId; parentElm.append(li);
$(groupParents + ' > p').addClass('sub-menu-ttl');
const categoryChild = $(
"<ul style='display:none;' class=''><li class='' id='groupMasterId_" +
OL.operationGroupMaster[i].operationGroupMasterId +
"' class=''><p class='category-li group-level-" +
OL.operationGroupMaster[i].operationGroupMasterLevel +
"'><a class='category-a' onclick='OL.changeOperationGroupMaster(" +
OL.operationGroupMaster[i].operationGroupMasterId +
");'>" +
OL.operationGroupMaster[i].operationGroupMasterName +
'</a></p></li></ul>',
);
$('#groupMasterId_' + OL.operationGroupMaster[i].parentOperationGroupMasterId).append(categoryChild);
} }
} }
} }
}; };
/** /**
* Open/close category(operationGroupMaster) drawer menu * Handle onclick category selection button
*/ */
OL.acdMenu = function () { OL.onClickCategorySelection = function() {
//Hide accordion contents by default const operationGroupMasterId = $('input[name="category"]:checked').val();
$('.drawer-menu dd').css('display', 'none'); $('#category-modal .close').click();
$('.drawer-menu2 ul').css('display', 'none'); OL.changeOperationGroupMaster(operationGroupMasterId);
//second accordion
$('.drawer-menu dt').on('click', function () {
$('.sub-menu-ttl').removeClass('openAcd').next().slideUp('fast');
$('.drawer-menu dt').not(this).removeClass('open').next().slideUp('fast');
$(this).toggleClass('open').next().slideToggle('fast');
});
//third accordion
$('.sub-menu-ttl').on('click', function () {
$('.sub-menu-ttl').not($(this)).not($(this).parents().siblings('p')).removeClass('openAcd').next().slideUp('fast');
$(this).toggleClass('openAcd').next().slideToggle('fast');
});
}; };
/** /**
...@@ -395,6 +412,9 @@ OL.changeSortType = function (sortType) { ...@@ -395,6 +412,9 @@ OL.changeSortType = function (sortType) {
*/ */
OL.sortOperationList = function (sortNumber) { OL.sortOperationList = function (sortNumber) {
if (!OL.operationList) {
return;
}
switch (sortNumber) { switch (sortNumber) {
case CONSTANT.SORT_TYPE.NAME: case CONSTANT.SORT_TYPE.NAME:
OL.operationList.sort(function (a, b) { OL.operationList.sort(function (a, b) {
...@@ -480,12 +500,6 @@ OL.changeOperationGroupMaster = function (operationGroupMasterId) { ...@@ -480,12 +500,6 @@ OL.changeOperationGroupMaster = function (operationGroupMasterId) {
* open the category(OperationGroupMaster) * open the category(OperationGroupMaster)
*/ */
OL.openCategory = function () { OL.openCategory = function () {
window.scrollTo(0, 0);
if ($('#category-menu').hasClass('open')) {
$('body').css('overflow', 'visible');
} else {
$('body').css('overflow', 'hidden');
}
}; };
/** /**
...@@ -550,3 +564,4 @@ OL.createUrlOfOperation = function (enableAddReport, reportType) { ...@@ -550,3 +564,4 @@ OL.createUrlOfOperation = function (enableAddReport, reportType) {
return baseUrl + CONSTANT.URL.CMS.HTML.LIST_REPORT_FORM; return baseUrl + CONSTANT.URL.CMS.HTML.LIST_REPORT_FORM;
} }
}; };
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