Skip to content

インデックス公開ロック　レビュ２回目 #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
sei-nakamura wants to merge 4 commits into
base: feature/indexlock
Choose a base branch
from
Open

インデックス公開ロック　レビュ２回目 #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
23577b8
インデックス公開ロック　レビュ２回目
ivis-nakagawa Aug 5, 2024
a24ea45
インデックス公開ロック　最終修正版
ivis-nakagawa Aug 5, 2024
d11aa5e
インデックス公開ロック　2024/8/6誤字修正
ivis-nakagawa Aug 6, 2024
3375195
インデックス公開ロック　不要ボタン削除
ivis-nakagawa Aug 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
114 changes: 82 additions & 32 deletions app-tree-index-edit/src/app/tree-list2/tree-list2.component.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,40 +13,90 @@
}

/* モーダルウィンドウのスタイル */
/* パネルのスタイル */
.panel {
border: 1px solid #ddd;
border-radius: 4px;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
.Mymodal {
display: none; /* デフォルトでは非表示 */
position: fixed; /* 固定位置 */
z-index: 1050; /* 他のコンテンツの上に表示 */
left: 0;
top: 0;
width: 100%; /* フルスクリーン */
height: 100%; /* フルスクリーン */
overflow: auto; /* 必要に応じてスクロール */
background-color: rgba(0, 0, 0, 0.5); /* 背面を薄暗くする */
}

.panel-body {
padding: 15px;
.modal-content {
background-color: #fefefe;
margin: 15% auto; /* 上下のマージンと中央寄せ */
padding: 20px;
border: 1px solid #888;
width: 60%; /* 幅 */
z-index: 1060; /* モーダルコンテンツをさらに前面に */
}

.modal-header, .modal-footer {
padding: 10px;
border-bottom: 1px solid #e5e5e5;
}

.row {
margin-left: -15px;
margin-right: -15px;
.modal-header {
border-bottom: 1px solid #e5e5e5;
}

.col-sm-2, .col-md-2, .col-sm-10, .col-md-10 {
position: relative;
min-height: 1px;
padding-left: 15px;
padding-right: 15px;
.modal-footer {
border-top: 1px solid #e5e5e5;
text-align: right; /* ボタンを右寄せ */
}

.checkbox {
margin-top: 10px;
margin-bottom: 10px;
.close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
}

.text-danger {
color: #a94442;
.close:hover,
.close:focus {
color: black;
text-decoration: none;
cursor: pointer;
}

/* モーダルウィンドウのスタイル */
.Mymodal {
.enable_button:disabled {
background-color: #ccc; /* 非活性時の背景色 */
cursor: not-allowed; /* 非活性時のカーソル */
}

.enable_button {
background-color: #5bc0de; /* 活性時の背景色 */
color: white;
border: none;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 4px;
}

.cancel-button {
background-color: #d9534f; /* キャンセルボタンの背景色 */
color: white;
border: none;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 4px;
}

/* 新しいモーダル用のCSS */
#ConfirmModalComponent2 {
display: none; /* デフォルトでは非表示 */
position: fixed; /* 固定位置 */
z-index: 1050; /* 他のコンテンツの上に表示 */
Expand All @@ -58,7 +108,7 @@
background-color: rgba(0, 0, 0, 0.5); /* 背面を薄暗くする */
}

.modal-content {
#ConfirmModalComponent2 .modal-content {
background-color: #fefefe;
margin: 15% auto; /* 上下のマージンと中央寄せ */
padding: 20px;
Expand All @@ -67,40 +117,40 @@
z-index: 1060; /* モーダルコンテンツをさらに前面に */
}

.modal-header, .modal-footer {
#ConfirmModalComponent2 .modal-header, #ConfirmModalComponent2 .modal-footer {
padding: 10px;
border-bottom: 1px solid #e5e5e5;
}

.modal-header {
#ConfirmModalComponent2 .modal-header {
border-bottom: 1px solid #e5e5e5;
}

.modal-footer {
#ConfirmModalComponent2 .modal-footer {
border-top: 1px solid #e5e5e5;
text-align: right; /* ボタンを右寄せ */
}

.close {
#ConfirmModalComponent2 .close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
}

.close:hover,
.close:focus {
#ConfirmModalComponent2 .close:hover,
#ConfirmModalComponent2 .close:focus {
color: black;
text-decoration: none;
cursor: pointer;
}

.enable_button:disabled {
#ConfirmModalComponent2 .enable_button:disabled {
background-color: #ccc; /* 非活性時の背景色 */
cursor: not-allowed; /* 非活性時のカーソル */
}

.enable_button {
#ConfirmModalComponent2 .enable_button {
background-color: #5bc0de; /* 活性時の背景色 */
color: white;
border: none;
Expand All @@ -114,7 +164,7 @@
border-radius: 4px;
}

.cancel-button {
#ConfirmModalComponent2 .cancel-button {
background-color: #d9534f; /* キャンセルボタンの背景色 */
color: white;
border: none;
Expand Down
65 changes: 47 additions & 18 deletions app-tree-index-edit/src/app/tree-list2/tree-list2.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -129,6 +129,7 @@ <h3 class="panel-title">{{langJson.Index_Edit[1]}}</h3>
</div>
<!-- 0611 add start -->
<!-- 公開 -->
<!--インデックス公開ロック機能追加-->
<div class="panel panel-default">
<div class="panel-body">
<div class="row">
Expand All @@ -138,21 +139,52 @@ <h3 class="panel-title">{{langJson.Index_Edit[1]}}</h3>
{{langJson.Publish[1]}}
</div>
<div class="col-sm-10 col-md-10">
<input type="checkbox" id="rss_display" [(ngModel)]="detailData.public_state">{{langJson.Open_To_Public[1]}}
<input type="checkbox" id="rss_display" [(ngModel)]="detailData.public_state" (change)="onCheckboxChange2($event)">{{langJson.Open_To_Public[1]}}
<p>
<div *ngIf="detailData.public_state" class="input-group">
<span class="input-group-addon">
<!-- {{langJson.Japanese[1]}} -->
{{langJson.Date[1]}}：
</span>
<input type="text" class="form-control" id="datepicker" placeholder="例：20180628" [(ngModel)]="detailData.public_date">
</div>
<p>
<div *ngIf="detailData.public_state">
<input type="checkbox" id="rss_display" [(ngModel)]="detailData.recursive_public_state">{{langJson.Set_Publish_Date_Recursively[1]}}
</div>
<div *ngIf="detailData.public_state" class="input-group">
<span class="input-group-addon">
<!-- {{langJson.Japanese[1]}} -->
{{langJson.Date[1]}}：
</span>
<input type="text" class="form-control" id="datepicker" [placeholder]="langJson.example" [(ngModel)]="detailData.public_date">
</div>
<p>
<div *ngIf="detailData.public_state">
<input type="checkbox" id="rss_display" [(ngModel)]="detailData.recursive_public_state">{{langJson.Set_Publish_Date_Recursively[1]}}
</div>
</div>
</div>
</div>
</div>
<!-- 新しい公開用モーダルの追加 -->
<div class="Mymodal" id="ConfirmModalComponent2" [style.display]="modalAberto2.status">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel2">
WARNING
</h4>
</div>
<div class="modal-body">
<p>
<span class="glyphicon glyphicon-warning-sign"></span>
</p>
{{langJson.Harvest_check_message[1]}}
<div>
<!--モーダル内チェックボックス-->
<input type="checkbox" id="modalCheckbox2" (change)="onModalCheckboxChange2($event)">
<label for="modalCheckbox2">{{langJson.Harvest_checkbox[1]}}</label>
</div>
</div>
<div class="modal-footer modFooter">
<!--変更(OK)ボタン-->
<button type="button" class="btn btn-info enable_button" data-dismiss="modal" (click)="enable2()" [disabled]="!isCheckboxChecked2">
{{langJson.btn_message_enable[1]}}
</button>
<!--閉じるボタン-->
<button type="button" class="btn btn-info cancel-button" data-dismiss="modal" (click)="cancel2()">
{{langJson.btn_message_close[1]}}
</button>
</div>
</div>
</div>
<!-- index link -->
Expand Down Expand Up @@ -289,11 +321,8 @@ <h3 class="panel-title">{{langJson.Index_Edit[1]}}</h3>
<div class="Mymodal" id="CofirmModalComponent" [style.display]="modalAberto.status">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" (click)="closeModal()">
&times;
</button>
<h4 class="modal-title" id="myModalLabel">
WARNNIG
WARNING
</h4>
</div>
<div class="modal-body">
Expand All @@ -309,11 +338,11 @@ <h4 class="modal-title" id="myModalLabel">
</div>
<div class="modal-footer modFooter">
<!--変更(OK)ボタン-->
<button type="button" class="btn btn-info enable_button" data-dismiss="modal" (click)="Enable()" [disabled]="!isCheckboxChecked">
<button type="button" class="btn btn-info enable_button" data-dismiss="modal" (click)="enable()" [disabled]="!isCheckboxChecked">
{{langJson.btn_message_enable[1]}}
</button>
<!--閉じるボタン-->
<button type="button" class="btn btn-info cancel-button" data-dismiss="modal" (click)="Cancel()">
<button type="button" class="btn btn-info cancel-button" data-dismiss="modal" (click)="cancel()">
{{langJson.btn_message_close[1]}}
</button>
</div>
Expand Down
Loading