Skip to content

C
check
Commit e3ff6916 by Takumi Imai
Options

#49764　作業一覧画面のhtmlとcss,jsの追加

parent fd28dd4d
Showing with 632 additions and 21 deletions
abvw/common/css/footer.css 0 → 100644
@charset "UTF-8";
footer img {
width: 30px;
}
\ No newline at end of file
abvw/common/css/header.css 0 → 100644
@charset "UTF-8";
header nav{
height: 53px;
}
header .icon {
width: 22px;
max-height: 22px;
}
\ No newline at end of file
abvw/common/css/style.css 0 → 100644
@charset "UTF-8";
.main-section {
margin-top: 76px;
}
/* ダッシュボード */
#dashboard .item-wrap {
display: grid;
grid-template-columns: repeat(3,1fr);
}
#dashboard .item-wrap img {
width: 40px;
margin-bottom: 6px;
}
#dashboard .item-wrap .item {
position: relative;
text-align: center;
margin: 5px;
background: aliceblue;
border-radius: 3px;
}
#dashboard .item-wrap .item .count {
position: absolute;
top: 5px;
right: 10px;
min-width: 22px;
background: var(--red);
color: var(--white);
padding: 2px 6px;
border-radius: 11px;
}
@media screen and (min-width: 768px) {
#dashboard .item-wrap {
display: flex;
flex-wrap: wrap;
}
#dashboard .item-wrap .item {
width: 150px;
}
}
@media screen and (max-width: 413px) {
#dashboard .item-wrap {
grid-template-columns: repeat(2,1fr);
}
}
/* ダッシュボード設定 */
.setting-table-wrap table {
width: 100%;
}
.setting-table-wrap th {
padding: 0.8rem;
}
.setting-table-wrap td {
width: 80px;
padding: 0.8rem;
}
/* 共通 */
.toggle {
position: relative;
width: 52px;
height: 30px;
border-radius: 50px;
overflow: hidden;
cursor: pointer;
}
.toggle input[type=checkbox] {
display: none;
}
.toggle:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: block;
background: #e9e9eb;
-webkit-transition: 0.2s ease-out;
transition: 0.2s ease-out;
}
.toggle:after {
content: "";
position: absolute;
top: 3px;
left: 3px;
width: 24px;
height: 24px;
display: block;
border-radius: 50px;
background: #fff;
box-shadow: 0 9px 28px -6px rgba(0, 0, 0, 0.3);
-webkit-transition: 0.2s ease-out;
transition: 0.2s ease-out;
}
.toggle.checked:before {
background: #35c759;
}
.toggle.checked:after {
left: 25px;
box-shadow: 0 9px 28px -6px rgba(0, 0, 0, 0.5);
}
/* リスト */
.task-list .item {
position: relative;
}
.task-list .item a{
padding-right: 40px!important;
}
.task-list .sub-title-wrap {
display: flex;
flex-direction: row;
align-items: center;
}
.task-list .title,
.task-list .sub-title{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 16px;
}
.task-list .fas.fa-chevron-right {
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
color: #E9E9E9;
}
.sub-title-wrap .data {
max-width: 140px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.task-list .item .tag{
width: fit-content;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* メッセージ一覧 */
.task-list .unread {
background: var(--lightblue);
border: 2px solid var(--blue)!important;
}
.task-list .unread .title,
.task-list .unread .sub-title {
font-weight: bold!important;
}
.task-list .unread .fas.fa-chevron-right {
color: var(--white);
}
/* メッセージ詳細 */
.messege-detail th {
width: 70px;
}
.messege-detail td {
word-break: break-all;
}
#messageDetail #message {
white-space: pre-line;
}
/* ピックアップ */
#pickup .main-section {
margin-top: 60px;
}
#pickup .not-found {
height: calc(100vh - 230px);
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
#pickup .not-found img{
width: 100px;
}
.not-found {
height: calc(100vh - 230px);
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.not-found img {
width: 100px;
}
/* 切り替えタブ */
/* tab */
.tab-menu {
position: relative;
width: 100%;
display: flex;
margin-bottom: 0;
overflow: auto;
overflow-y: clip;
}
.tab-label {
position: relative;
font-weight: bold;
padding: 10px;
order: -1;
z-index: 2;
cursor: pointer;
margin-bottom: 0;
width: 100%;
text-align: center;
color: var(--secondary);
min-width: 130px;
}
.tab-label label:after {
content: "";
background: var(--black);
opacity: .1;
width: 100%;
height: 4px;
position: absolute;
left: 0;
bottom: 0;
}
.tab-label:after {
background: var(--blue);
bottom: 0;
content: '';
display: block;
height: 4px;
left: 0;
opacity: 0;
pointer-events: none;
position: absolute;
transform: translateX(100%);
transition: cubic-bezier(0.4, 0, 0.2, 1) .2s 80ms;
width: 100%;
z-index: 1;
}
.tab-label.on ~ .tab-label:after {
transform: translateX(-100%);
}
.tab-label.on:after {
opacity: 1;
transform: translateX(0);
}
.tab-label label {
cursor: pointer;
white-space: nowrap;
margin-bottom: 0;
}
.tab-label label .task-cnt{
font-weight: normal;
color: var(--secondary);
}
.tab-content-area {
width: 100%;
}
.tab-content {
width: 100%;
display: none;
margin-top: 20px;
animation: show .3s linear 0s;
}
.tab-label.on {
color: var(--blue);
}
.tab-label.on .task-cnt{
font-weight: normal;
color: var(--secondary);
}
.tab-content.on{
display: block;
animation: show .3s linear 0s;
}
.tab-switch {
display: none;
}
/* keyframe */
@keyframes show{
from{
opacity: 0;
}
to{
opacity: 1;
}
}
/* .tab-wrap{
background: White;
box-shadow: 0 0 5px rgba(0,0,0,.1);
display: flex;
flex-wrap: wrap;
overflow: hidden;
padding: 0 0 20px;
}
.tab-label {
color: Gray;
cursor: pointer;
flex: 1;
font-weight: bold;
order: -1;
padding: 12px 24px;
position: relative;
text-align: center;
transition: cubic-bezier(0.4, 0, 0.2, 1) .2s;
user-select: none;
white-space: nowrap;
-webkit-tap-highlight-color: transparent;
}
.tab-label:hover {
background: rgba(0, 191, 255,.1);
}
.tab-switch:checked + .tab-label {
color: DeepSkyBlue;
}
.tab-label::after {
background: DeepSkyBlue;
bottom: 0;
content: '';
display: block;
height: 3px;
left: 0;
opacity: 0;
pointer-events: none;
position: absolute;
transform: translateX(100%);
transition: cubic-bezier(0.4, 0, 0.2, 1) .2s 80ms;
width: 100%;
z-index: 1;
}
.tab-switch:checked ~ .tab-label::after {
transform: translateX(-100%);
}
.tab-switch:checked + .tab-label::after {
opacity: 1;
transform: translateX(0);
}
.tab-content {
height:0;
opacity:0;
padding: 0 20px;
pointer-events:none;
transform: translateX(-30%);
transition: transform .3s 80ms, opacity .3s 80ms;
width: 100%;
}
.tab-switch:checked ~ .tab-content {
transform: translateX(30%);
}
.tab-switch:checked + .tab-label + .tab-content {
height: auto;
opacity: 1;
order: 1;
pointer-events:auto;
transform: translateX(0);
}
.tab-wrap::after {
content: '';
height: 20px;
order: -1;
width: 100%;
}
.tab-switch {
display: none;
} */
\ No newline at end of file
abvw/common/json/lang/lang-en.json
......@@ -178,5 +178,6 @@
"sortReportType": "By report type",
"sortMostViewDateFirst": "By newest viewing date",
"operationListScreenName": "Home",
"settingScreenName": "Setting"
"settingScreenName": "Setting",
"operationListPageTitle": "Working List"
}
abvw/common/json/lang/lang-ja.json
......@@ -178,5 +178,6 @@
"sortReportType": "報告タイプ順",
"sortMostViewDateFirst": "閲覧日が新しい順",
"operationListScreenName": "ホーム",
"settingScreenName": "設定"
"settingScreenName": "設定",
"operationListPageTitle": "作業一覧"
}
abvw/common/json/lang/lang-ko.json
......@@ -175,5 +175,6 @@
"sortReportType": "보고타입순",
"sortMostViewDateFirst": "열람순",
"operationListScreenName": "홈",
"settingScreenName": "설정"
"settingScreenName": "설정",
"operationListPageTitle": "작업 목록"
}
abvw/css/operationList/app.css
......@@ -10265,6 +10265,7 @@ input[type=button].btn-block,input[type=reset].btn-block,input[type=submit].btn-
}
.navbar,.navbar .container,.navbar .container-fluid,.navbar .container-lg,.navbar .container-md,.navbar .container-sm,.navbar .container-xl {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between
......@@ -20363,3 +20364,11 @@ button {
margin-left: -2px
}
}
.alignCenter_header {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
margin: auto;
}
abvw/css/operationList/fontawesome_relative_path.css
......@@ -3,12 +3,12 @@
font-style:normal;
font-weight:400;
font-display:block;
src:url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.eot);
src:url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.eot)
format("embedded-opentype"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.woff2)
format("woff2"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.woff)
format("woff"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.ttf)
format("truetype"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.svg#fontawesome)
src:url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.eot);
src:url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.eot)
format("embedded-opentype"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.woff2)
format("woff2"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.woff)
format("woff"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.ttf)
format("truetype"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.svg#fontawesome)
format("svg")}.fab{font-family:"Font Awesome 5 Brands"}
@font-face{
......@@ -16,12 +16,12 @@
font-style:normal;
font-weight:400;
font-display:block;
src:url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.eot);
src:url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.eot)
format("embedded-opentype"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.woff2)
format("woff2"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.woff)
format("woff"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.ttf)
format("truetype"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.svg#fontawesome)
src:url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.eot);
src:url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.eot)
format("embedded-opentype"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.woff2)
format("woff2"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.woff)
format("woff"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.ttf)
format("truetype"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.svg#fontawesome)
format("svg")}.fab,.far{font-weight:400}
@font-face{
......@@ -29,10 +29,10 @@
font-style:normal;
font-weight:900;
font-display:block;
src:url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.eot);
src:url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.eot)
format("embedded-opentype"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.woff2)
format("woff2"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.woff)
format("woff"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.ttf)
format("truetype"),url(../../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.svg#fontawesome)
src:url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.eot);
src:url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.eot)
format("embedded-opentype"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.woff2)
format("woff2"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.woff)
format("woff"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.ttf)
format("truetype"),url(../fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.svg#fontawesome)
format("svg")}.fa,.far,.fas{font-family:"Font Awesome 5 Free"}.fa,.fas{font-weight:900}
\ No newline at end of file
abvw/js/dashboard/check-dashboard-setting.js 0 → 100644
var CHK_DashboardSetting = {};
CHK_DashboardSetting.displayItems = [
{ id:'newReport', name: 'chk-new', enabled: true, title:'新規報告', msg: 'dashboardSettingNewRegistrationTitle'},
{ id:'continousWork', name: 'chk-proccess', enabled: true, title:'工程作業', msg: 'dashboardSettingContinousWorkTitle'},
{ id:'reportWarning', name: 'chk-alert', enabled: true, title:'警告を含む作業', msg: 'dashboardSettingReportWarningTitle'},
{ id:'dashboardHome', name: 'chk-home', enabled: false, title:'ダッシュボードをホーム画面にする', msg: 'dashboardSettingDashboardHomeTitle'},
];
CHK_DashboardSetting.loadSettings = function() {
CHK_DashboardSetting.displayItems.forEach(function(item) {
let enabled = CHK.dashboardSetting[item.id];
if (typeof enabled !== 'undefined') {
item.enabled = enabled;
let itemElement = $('#' + item.id);
if (item.enabled) {
itemElement.addClass('checked');
} else {
itemElement.removeClass('checked');
}
}
});
}
CHK_DashboardSetting.saveSetting = function(key, enabled) {
CHK_DashboardSetting.displayItems.forEach(function(item) {
if (item.id == key) {
item.enabled = enabled;
}
});
CHK.saveDashboardSetting(key, enabled);
}
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');
var enabled = false;
if ($(this).hasClass('checked')) {
enabled = true;
}
CHK_DashboardSetting.saveSetting(id, enabled);
});
}
CHK_DashboardSetting.init = function() {
CHK.initCommon();
$("#footer").load("main-footer.html", function() {
CHK_Footer.activeDashboardBottomNav();
});
CHK.loadDashboardSetting(function() {
CHK_DashboardSetting.loadSettings();
CHK_DashboardSetting.initDisplays();
CHK_DashboardSetting.bindToggleClick();
});
}
CHK_DashboardSetting.goBack = function() {
CHK_Footer.goDashboard();
}
abvw/js/dashboard/check-dashboard.js 0 → 100644
var CHK_Dashboard = {};
CHK_Dashboard.pickupItems = [
{id: 'newReport', href: "javascript:CHK_Dashboard.goPickup('newReport');", count: 0, enabled: true, img: {src: 'img/icon_new.svg'}, msg: 'newRegistrationTitle'},
{id: 'continousWork', href: "javascript:CHK_Dashboard.goPickup('continousWork');", count: 0, enabled: true, img: {src: 'img/icon_proccess.svg'}, msg: 'continousWorkTitle'},
{id: 'reportWarning', href: "javascript:CHK_Dashboard.goPickup('reportWarning');", count: 0, enabled: true, img: {src: 'img/icon_alert.svg'}, msg: 'reportWarningTitle'},
];
CHK_Dashboard.communicationItems = [
{id: 'messageList', href: "javascript:CHK_Dashboard.goMessageList();", count: 0, enabled: true, img: {src: 'img/icon_message_lsit.svg'}, msg: 'messageListTitle'},
{id: 'sendMessage', href: "javascript:CHK.sendAppCommand('goSendMessage');", count: 0, enabled: true, img: {src: 'img/icon_send_message.svg'}, msg: 'sendMessageTitle'},
{id: 'distanceSupport', href: "javascript:CHK.sendAppCommand('goDistanceSupport');", count: 0, enabled: true, img: {src: 'img/icon_remote.svg'}, msg: 'distanceSupportTitle'},
{id: 'chat', href: "javascript:CHK.sendAppCommand('goChat');", count: 0, enabled: false, img: {src: 'img/icon_chat.svg'}, msg: 'chatTitle'},
];
CHK_Dashboard.initPickups = function() {
$("#pickupItems").empty();
CHK_Dashboard.pickupItems.forEach(function(item) {
if (item.enabled == true) {
var html = CHK_Dashboard.initHtmlItem(item);
$("#pickupItems").append(html);
}
});
//pickup empty
if ($("#pickupItems").children().length > 0) {
$("#pickupHeader").removeClass('d-none');
} else {
$("#pickupHeader").addClass('d-none');
}
}
CHK_Dashboard.initCommunications = function() {
$("#communicationItems").empty();
CHK_Dashboard.communicationItems.forEach(function(item) {
if (item.enabled == true) {
var html = CHK_Dashboard.initHtmlItem(item);
$("#communicationItems").append(html);
}
});
}
CHK_Dashboard.initHtmlItem = function(item) {
var countText = '' + item.count;
if (item.count >= 100) {
countText = '99+';
}
var countDClass = '';
if (typeof item.count == 'undefined' || item.count < 1) {
countDClass = ' d-none';
}
var countSpan = '<span class="count fs-7' + countDClass + '">' + countText + '</span>';
var html = $('<div class="item" id="' + item.id + '">'
+ '<a href="' + item.href + '" class="d-block text-dark text-decoration-none mb-1 p-3">'
+ '<img src="' + item.img.src + '">'
+ '<div class="fs-8 multi-lang" data-msg="' + item.msg + '">' + getMsg(item.msg) + '</div>'
+ countSpan
+ '</a>'
+ '</div>');
return html;
}
CHK_Dashboard.init = function() {
CHK_Dashboard.updateDataPickups();
CHK_Dashboard.initPickups();
CHK_Dashboard.updateDataCommunications();
CHK_Dashboard.initCommunications();
}
CHK_Dashboard.updateDataPickups = function() {
CHK_Dashboard.pickupItems.forEach(function(item) {
let enabled = CHK.dashboardSetting[item.id];
if (enabled == true || enabled == false) {
item.enabled = enabled;
}
item.count = 0;
if (CHK.dashboardBatch[item.id]) {
item.count = CHK.dashboardBatch[item.id];
}
});
}
CHK_Dashboard.updateDataCommunications = function() {
CHK_Dashboard.communicationItems.forEach(function(item) {
if (item.id == 'messageList') {
item.count = 0;
if (typeof CHK.pushMessageList !== 'undefined') {
CHK.pushMessageList.forEach(function(message) {
if (!message.readingFlg) {
item.count += 1;
}
});
}
} else if (item.id == 'chat') {
item.enabled = CHK.isChat;
}
});
}
CHK_Dashboard.goPickup = function(pickupId) {
CHK.goUrlWithCurrentParams('pickup.html', {pickupActive: pickupId});
}
CHK_Dashboard.goMessageList = function() {
CHK.goUrlWithCurrentParams('message-list.html', {});
}
\ No newline at end of file
abvw/js/operationList/constant.js 0 → 100644
var CHK_CONSTANT = {};
CHK_CONSTANT.SORT_TYPE = {
NAME: 0,
START_DATE_DESC: 1,
START_DATE_ASC: 2,
TYPE: 3,
LAST_EDIT_DATE: 4,
};
\ 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