This commit is contained in:
MaxKey 2022-05-03 17:01:12 +08:00
parent 3e080d568f
commit daad22a00e
7 changed files with 105 additions and 34 deletions

View File

@ -14,7 +14,6 @@
* limitations under the License. * limitations under the License.
*/ */
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { SettingsService, User } from '@delon/theme'; import { SettingsService, User } from '@delon/theme';
import { environment } from '@env/environment'; import { environment } from '@env/environment';
@ -38,10 +37,10 @@ import { LayoutDefaultOptions } from '../../theme/layout-default';
<a href="#"> <a href="#">
<img src="../assets/logo.jpg" alt="logo" style="height: 50px;height: 50px;float: left;" /> <img src="../assets/logo.jpg" alt="logo" style="height: 50px;height: 50px;float: left;" />
<div <div
class="alain-default__nav-item_title"
style="letter-spacing: 2px; style="letter-spacing: 2px;
font-size: 20px; font-size: 20px;
font-weight: bolder; font-weight: bolder;
color:white;
width: 450px; width: 450px;
margin-top: 12px;" margin-top: 12px;"
> >

View File

@ -3,7 +3,7 @@
<nz-card [nzBordered]="false"> <nz-card [nzBordered]="false">
<form nz-form [nzLayout]="'inline'" (ngSubmit)="onSearch()" class="search__form"> <form nz-form [nzLayout]="'inline'" (ngSubmit)="onSearch()" class="search__form">
<div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 8, lg: 24, xl: 48, xxl: 48 }"> <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 8, lg: 24, xl: 48, xxl: 48 }">
<div nz-col nzMd="10" nzSm="24"> <div nz-col nzMd="8" nzSm="24">
<nz-form-item> <nz-form-item>
<nz-form-label nzFor="name">{{ 'mxk.accounts.username' | i18n }}</nz-form-label> <nz-form-label nzFor="name">{{ 'mxk.accounts.username' | i18n }}</nz-form-label>
<nz-form-control> <nz-form-control>
@ -11,24 +11,30 @@
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
<div nz-col nzMd="10" nzSm="24"> <div nz-col nzMd="8" nzSm="24">
<nz-form-item> <nz-form-item>
<nz-form-label nzFor="appName">{{ 'mxk.accounts.appName' | i18n }}</nz-form-label> <nz-form-label nzFor="appName">{{ 'mxk.accounts.appName' | i18n }}</nz-form-label>
<nz-form-control> <nz-form-control>
<input <nz-input-group nzSearch [nzAddOnAfter]="suffixButton">
nz-input <input
[(ngModel)]="query.params.appName" nz-input
[ngModelOptions]="{ standalone: true }" [(ngModel)]="query.params.appName"
name="appName" [ngModelOptions]="{ standalone: true }"
placeholder="" name="appName"
id="appName" readonly
/> placeholder=""
id="appName"
/>
</nz-input-group>
<ng-template #suffixButton>
<button nz-button nzType="primary" (click)="onSelect($event)" nzSearch>{{ 'mxk.text.select' | i18n }}</button>
</ng-template>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
<div nz-col [nzSpan]="query.expandForm ? 24 : 4" [class.text-right]="query.expandForm"> <div nz-col [nzSpan]="query.expandForm ? 24 : 8" [class.text-right]="query.expandForm">
<button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button> <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
<button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' | i18n }}</button> <button nz-button type="reset" (click)="onReset()" class="mx-sm">{{ 'mxk.text.reset' | i18n }}</button>
<button nz-button (click)="query.expandForm = !query.expandForm" class="mx-sm" style="display: none"> <button nz-button (click)="query.expandForm = !query.expandForm" class="mx-sm" style="display: none">
{{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
> >

View File

@ -14,7 +14,6 @@
* limitations under the License. * limitations under the License.
*/ */
import { ChangeDetectionStrategy, ViewContainerRef, ChangeDetectorRef, Component, OnInit } from '@angular/core'; import { ChangeDetectionStrategy, ViewContainerRef, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { _HttpClient } from '@delon/theme'; import { _HttpClient } from '@delon/theme';
@ -26,6 +25,7 @@ import { NzTableQueryParams } from 'ng-zorro-antd/table';
import { AccountsService } from '../../service/accounts.service'; import { AccountsService } from '../../service/accounts.service';
import { set2String } from '../../shared/index'; import { set2String } from '../../shared/index';
import { SelectAppsComponent } from '../apps/select-apps/select-apps.component';
import { AccountEditerComponent } from './account-editer/account-editer.component'; import { AccountEditerComponent } from './account-editer/account-editer.component';
@Component({ @Component({
@ -109,6 +109,26 @@ export class AccountsComponent implements OnInit {
onReset(): void { } onReset(): void { }
onSelect(e: MouseEvent): void {
e.preventDefault();
const modal = this.modalService.create({
nzContent: SelectAppsComponent,
nzViewContainerRef: this.viewContainerRef,
nzComponentParams: {},
nzWidth: 700,
nzOnOk: () => new Promise(resolve => setTimeout(resolve, 1000))
});
// Return a result when closed
modal.afterClose.subscribe(result => {
if (result.refresh) {
this.query.params.appName = result.data.name;
//this.query.params.appId = result.data.id;
console.log(result);
this.fetch();
}
});
}
onBatchDelete(e: MouseEvent): void { onBatchDelete(e: MouseEvent): void {
e.preventDefault(); e.preventDefault();
this.accountsService.delete(set2String(this.query.tableCheckedId)).subscribe(res => { this.accountsService.delete(set2String(this.query.tableCheckedId)).subscribe(res => {

View File

@ -14,7 +14,6 @@
* limitations under the License. * limitations under the License.
*/ */
import { ChangeDetectionStrategy, ViewContainerRef, ChangeDetectorRef, Component, OnInit } from '@angular/core'; import { ChangeDetectionStrategy, ViewContainerRef, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { _HttpClient } from '@delon/theme'; import { _HttpClient } from '@delon/theme';

View File

@ -14,7 +14,6 @@
* limitations under the License. * limitations under the License.
*/ */
export const CONSTS = { export const CONSTS = {
CONGRESS: 'congress', CONGRESS: 'congress',
REDIRECT_URI: 'redirect_uri', REDIRECT_URI: 'redirect_uri',

View File

@ -64,11 +64,7 @@
<ng-template [ngTemplateOutlet]="tree" [ngTemplateOutletContext]="{ $implicit: group.children }"></ng-template> <ng-template [ngTemplateOutlet]="tree" [ngTemplateOutletContext]="{ $implicit: group.children }"></ng-template>
</ng-container> </ng-container>
<li> <li>
<div <div class="alain-default__nav-item alain-default__nav-item--collapse alain-default__nav-item_collapsed" (click)="toggleCollapsed()">
class="alain-default__nav-item alain-default__nav-item--collapse"
(click)="toggleCollapsed()"
style="background-color: aliceblue; color: #000"
>
<i nz-icon [nzType]="collapsedIcon"></i> <i nz-icon [nzType]="collapsedIcon"></i>
</div> </div>
</li> </li>

View File

@ -7,3 +7,55 @@
// ==========The following is the custom theme variable area========== // ==========The following is the custom theme variable area==========
// The theme paraments can be generated at https://ng-alain.github.io/ng-alain/ // The theme paraments can be generated at https://ng-alain.github.io/ng-alain/
// @primary-color: #f50; // @primary-color: #f50;
@alain-default-header-hg: 52px;
@alain-default-header-bg: #fff;
.alain-default__nav-item, .alain-default__nav nz-badge {
color: #212529;
}
.alain-default__nav-item_title{
color: #212529;
}
.alain-default__nav-item:hover {
color: #212529;
background-color: rgb(255 255 255 / 20%) !important;
}
@alain-default-aside-bg: #212529;
.alain-default__aside-user-info{
color: #fff;
}
@alain-default-aside-nav-text-color:#fff;
@alain-default-aside-nav-text-hover-color: #fff;
@alain-default-aside-nav-selected-text-color: #fff;
.sidebar-nav .sidebar-nav__selected{
color: #fff;
background: @primary-color
}
.sidebar-nav__sub .sidebar-nav__item{
color: #000000a6;
}
.sidebar-nav__open > .sidebar-nav__sub {
background-color: #212529;
}
.sidebar-nav__sub .sidebar-nav__item:hover{
background: rgb(214 26 26 / 4%);
}
.sidebar-nav__item-link:hover {
color: #fff;
background-color: @primary-color
}
.alain-default__nav-item_collapsed{
color: white;
/** background-color: aliceblue */
}