Skip to content

Commit d0e506a

Browse files
MikiraSoraMikiraSora
committed
feat(maimai2): add circle.isAllowAnyoneJoin and refactory dialog for create/modify circle
1 parent 234dec7 commit d0e506a

File tree

3 files changed

+101
-109
lines changed

3 files changed

+101
-109
lines changed

‎src/app/sega/maimai2/maimai2-circle/maimai2-circle.component.html‎

Lines changed: 79 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,74 @@
11
<h1 class="page-heading">{{ "Maimai2.CirclePage.Title" | translate }}</h1>
22

3+
<ng-template #content let-modal>
4+
<div class="modal-header">
5+
<h4 class="modal-title" id="modal-basic-title">
6+
{{ isModify ? "编辑" : "新建" }}Circle
7+
</h4>
8+
<button
9+
type="button"
10+
class="btn-close"
11+
aria-label="Close"
12+
(click)="modal.dismiss('Cross click')"
13+
></button>
14+
</div>
15+
16+
<div class="modal-body">
17+
<label for="userInput" class="form-label">Circle名称:</label>
18+
<input
19+
id="userInput"
20+
type="text"
21+
class="form-control"
22+
[(ngModel)]="tmpUserCircle.circleName"
23+
/>
24+
<label for="userInput" class="form-label mt-2">Comment:</label>
25+
<textarea
26+
id="userInput"
27+
type="text"
28+
rows="5"
29+
class="form-control multi-line-ellipsis"
30+
[(ngModel)]="tmpUserCircle.comment"
31+
></textarea>
32+
<div class="form-check mt-2">
33+
<input
34+
class="form-check-input"
35+
type="checkbox"
36+
[(ngModel)]="tmpUserCircle.isPublic"
37+
id="checkDefault"
38+
/>
39+
<label class="form-check-label" for="checkDefault"> 是否公开 </label>
40+
</div>
41+
<div class="form-check mt-2">
42+
<input
43+
class="form-check-input"
44+
type="checkbox"
45+
[(ngModel)]="tmpUserCircle.isAllowAnyoneJoin"
46+
id="checkDefault2"
47+
/>
48+
<label class="form-check-label" for="checkDefault2">
49+
允许任何人直接加入
50+
</label>
51+
</div>
52+
</div>
53+
54+
<div class="modal-footer">
55+
<button
56+
type="button"
57+
class="btn btn-secondary"
58+
(click)="modal.close('cancel')"
59+
>
60+
取消
61+
</button>
62+
<button
63+
type="button"
64+
class="btn btn-success"
65+
(click)="processComfirmButton(); modal.close('ok')"
66+
>
67+
提交
68+
</button>
69+
</div>
70+
</ng-template>
71+
372
<h3 class="page-heading">已加入的Circle信息</h3>
473
<div class="alert alert-info" *ngIf="!userCircleInfo?.joinedCircle">
574
你目前还没有加入任何Circle, 或者你可以新建Circle
@@ -35,6 +104,10 @@ <h3 class="text-nowrap mb-2 fw-bold m-0">
35104
<span class="fw-bold fs-8 me-2">是否公开:</span>
36105
<span>{{ userCircleInfo?.joinedCircle?.isPublic }}</span>
37106
</div>
107+
<div class="d-flex mb-1 align-items-baseline">
108+
<span class="fw-bold fs-8 me-2">允许任何人直接加入:</span>
109+
<span>{{ userCircleInfo?.joinedCircle?.isAllowAnyoneJoin }}</span>
110+
</div>
38111
<div class="d-flex mb-3 align-items-baseline">
39112
<span class="fw-bold fs-8 me-2">PlaceId:</span>
40113
<span>{{ userCircleInfo?.joinedCircle?.placeId }}</span>
@@ -104,46 +177,20 @@ <h3 class="page-heading">管理你的Circle</h3>
104177
<div class="d-flex mb-2">
105178
<div class="align-items-center d-flex">
106179
<button
107-
class="btn btn-danger btn-sm horizon-margin"
108-
(click)="dissolveCircle()"
109-
>
110-
解散此Circle圈子
111-
</button>
112-
</div>
113-
<div class="align-items-center d-flex">
114-
<button
115-
class="btn btn-warning btn-sm horizon-margin"
116-
(click)="setIsPublic(true)"
117-
*ngIf="!userCircleInfo?.joinedCircle?.isPublic"
180+
class="btn-sm btn btn-primary"
181+
(click)="openModifyCircleDialog(content)"
118182
>
119-
公开此Circle圈子
183+
修改Circle
120184
</button>
121185
<button
122-
class="btn btn-warning btn-sm horizon-margin"
123-
(click)="setIsPublic(false)"
124-
*ngIf="userCircleInfo?.joinedCircle?.isPublic"
186+
class="btn btn-danger btn-sm horizon-margin"
187+
(click)="dissolveCircle()"
125188
>
126-
隐藏此Circle圈子
189+
解散此Circle圈子
127190
</button>
128191
</div>
129192
</div>
130193
<div *ngIf="userCircleInfo?.joinedCircle">
131-
<textarea
132-
type="text"
133-
class="form-control mb-2 mt-2 multi-line-ellipsis"
134-
placeholder="comment"
135-
rows="5"
136-
[(ngModel)]="updateCommentStr"
137-
>
138-
</textarea>
139-
<button
140-
type="button"
141-
class="btn btn-primary btn-sm horizon-margin"
142-
(click)="updateComment()"
143-
>
144-
更新Comment
145-
</button>
146-
147194
<h5 class="page-heading mt-5">Circle成员列表</h5>
148195

149196
<table class="table table-striped">
@@ -289,62 +336,6 @@ <h5 class="page-heading mt-5">申请加入Circle列表</h5>
289336
</div>
290337
</div>
291338

292-
<ng-template #content let-modal>
293-
<div class="modal-header">
294-
<h4 class="modal-title" id="modal-basic-title">新建Circle</h4>
295-
<button
296-
type="button"
297-
class="btn-close"
298-
aria-label="Close"
299-
(click)="modal.dismiss('Cross click')"
300-
></button>
301-
</div>
302-
303-
<div class="modal-body">
304-
<label for="userInput" class="form-label">Circle名称:</label>
305-
<input
306-
id="userInput"
307-
type="text"
308-
class="form-control"
309-
[(ngModel)]="createUserCircle.circleName"
310-
/>
311-
<label for="userInput" class="form-label mt-2">Comment:</label>
312-
<textarea
313-
id="userInput"
314-
type="text"
315-
rows="5"
316-
class="form-control multi-line-ellipsis"
317-
[(ngModel)]="createUserCircle.comment"
318-
></textarea>
319-
<div class="form-check mt-2">
320-
<input
321-
class="form-check-input"
322-
type="checkbox"
323-
[(ngModel)]="createUserCircle.isPublic"
324-
id="checkDefault"
325-
/>
326-
<label class="form-check-label" for="checkDefault"> 是否公开 </label>
327-
</div>
328-
</div>
329-
330-
<div class="modal-footer">
331-
<button
332-
type="button"
333-
class="btn btn-secondary"
334-
(click)="modal.close('cancel')"
335-
>
336-
取消
337-
</button>
338-
<button
339-
type="button"
340-
class="btn btn-success"
341-
(click)="createCircle(); modal.close('ok')"
342-
>
343-
提交
344-
</button>
345-
</div>
346-
</ng-template>
347-
348339
<h3 class="page-heading mt-4">公开的用户Circle列表</h3>
349340
<button
350341
class="btn-sm btn btn-primary mb-4"

‎src/app/sega/maimai2/maimai2-circle/maimai2-circle.component.ts‎

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,8 @@ export class Maimai2CircleComponent implements OnInit {
6060

6161
pageSize: number = 10
6262

63-
createUserCircle: Maimai2Circle;
63+
isModify = false;
64+
tmpUserCircle: Maimai2Circle;
6465

6566
ngOnInit() {
6667
this.aimeId = String(this.userService.currentUser.defaultCard.extId);
@@ -270,24 +271,10 @@ export class Maimai2CircleComponent implements OnInit {
270271
}
271272
);
272273
}
273-
274-
setIsPublic(isPublic: boolean) {
275-
let copyCircle: Maimai2Circle = JSON.parse(JSON.stringify(this.userCircleInfo.joinedCircle));
276-
copyCircle.isPublic = isPublic;
277-
278-
this.updateCircle(copyCircle);
279-
}
280-
281-
async updateComment() {
282-
let copyCircle: Maimai2Circle = JSON.parse(JSON.stringify(this.userCircleInfo.joinedCircle));
283-
copyCircle.comment = this.updateCommentStr;
284-
285-
this.updateCircle(copyCircle);
286-
}
287-
288-
updateCircle(circle: Maimai2Circle) {
274+
275+
updateCircle() {
289276
const param = new HttpParams().set('aimeId', this.aimeId);
290-
this.api.post('api/game/maimai2/updateCircle', circle, param).pipe().subscribe(
277+
this.api.post('api/game/maimai2/updateCircle', this.tmpUserCircle, param).pipe().subscribe(
291278
(data: ApiResponse<boolean>) => {
292279
if (data.data) {
293280
this.messageService.toastService.show("更新Circle信息成功");
@@ -306,14 +293,27 @@ export class Maimai2CircleComponent implements OnInit {
306293
}
307294

308295
openCreateCircleDialog(content: any) {
309-
if (!this.createUserCircle)
310-
this.createUserCircle = {} as any;
296+
this.isModify = false;
297+
this.tmpUserCircle = {} as any;
298+
this.modalService.open(content, { ariaLabelledBy: 'modal-basic-title' });
299+
}
300+
301+
openModifyCircleDialog(content: any) {
302+
this.isModify = true;
303+
this.tmpUserCircle = JSON.parse(JSON.stringify(this.userCircleInfo.joinedCircle));
311304
this.modalService.open(content, { ariaLabelledBy: 'modal-basic-title' });
312305
}
313306

307+
processComfirmButton() {
308+
if (this.isModify)
309+
this.updateCircle();
310+
else
311+
this.createCircle();
312+
}
313+
314314
createCircle() {
315315
const param = new HttpParams().set('aimeId', this.aimeId);
316-
this.api.post('api/game/maimai2/createCircle', this.createUserCircle, param).pipe().subscribe(
316+
this.api.post('api/game/maimai2/createCircle', this.tmpUserCircle, param).pipe().subscribe(
317317
(data: ApiResponse<boolean>) => {
318318
if (data.data) {
319319
this.messageService.toastService.show("新建Circle成功");

‎src/app/sega/maimai2/model/Maimai2Circle.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,4 +8,5 @@ export interface Maimai2Circle {
88
aggrDate: string;
99
circleCode: string;
1010
comment: string;
11+
isAllowAnyoneJoin: boolean;
1112
}

0 commit comments

Comments
 (0)