Compare commits
13 Commits
develop
...
login-page
| Author | SHA1 | Date | |
|---|---|---|---|
| e13b7669f2 | |||
| b8fd0cd28f | |||
| 6ed11186d4 | |||
| f8c82f6f13 | |||
| 889023bbb1 | |||
| be97d820bd | |||
| 9e306ab949 | |||
| aed0d157f1 | |||
| b7ab261549 | |||
| 3a822d7d33 | |||
| f8cb159203 | |||
| e33c956306 | |||
| 9ae46c9957 |
1
.gitignore
vendored
1
.gitignore
vendored
@ -25,7 +25,6 @@ scripts/var.less
|
|||||||
|
|
||||||
# IDE - VSCode
|
# IDE - VSCode
|
||||||
.vscode/*
|
.vscode/*
|
||||||
.vscode
|
|
||||||
!.vscode/settings.json
|
!.vscode/settings.json
|
||||||
!.vscode/tasks.json
|
!.vscode/tasks.json
|
||||||
!.vscode/launch.json
|
!.vscode/launch.json
|
||||||
|
|||||||
@ -1,30 +0,0 @@
|
|||||||
#!/bin/sh
|
|
||||||
if [ -z "$husky_skip_init" ]; then
|
|
||||||
debug () {
|
|
||||||
[ "$HUSKY_DEBUG" = "1" ] && echo "husky (debug) - $1"
|
|
||||||
}
|
|
||||||
|
|
||||||
readonly hook_name="$(basename "$0")"
|
|
||||||
debug "starting $hook_name..."
|
|
||||||
|
|
||||||
if [ "$HUSKY" = "0" ]; then
|
|
||||||
debug "HUSKY env variable is set to 0, skipping hook"
|
|
||||||
exit 0
|
|
||||||
fi
|
|
||||||
|
|
||||||
if [ -f ~/.huskyrc ]; then
|
|
||||||
debug "sourcing ~/.huskyrc"
|
|
||||||
. ~/.huskyrc
|
|
||||||
fi
|
|
||||||
|
|
||||||
export readonly husky_skip_init=1
|
|
||||||
sh -e "$0" "$@"
|
|
||||||
exitCode="$?"
|
|
||||||
|
|
||||||
if [ $exitCode != 0 ]; then
|
|
||||||
echo "husky - $hook_name hook exited with code $exitCode (error)"
|
|
||||||
exit $exitCode
|
|
||||||
fi
|
|
||||||
|
|
||||||
exit 0
|
|
||||||
fi
|
|
||||||
3
.vscode/settings.json
vendored
3
.vscode/settings.json
vendored
@ -1,3 +0,0 @@
|
|||||||
{
|
|
||||||
"compile-hero.disable-compile-files-on-did-save-code": true
|
|
||||||
}
|
|
||||||
15
angular.json
15
angular.json
@ -34,6 +34,7 @@
|
|||||||
],
|
],
|
||||||
"styles": [
|
"styles": [
|
||||||
"node_modules/perfect-scrollbar/css/perfect-scrollbar.css",
|
"node_modules/perfect-scrollbar/css/perfect-scrollbar.css",
|
||||||
|
"node_modules/quill/dist/quill.snow.css",
|
||||||
"src/styles.less",
|
"src/styles.less",
|
||||||
{
|
{
|
||||||
"input": "src/styles/default.less",
|
"input": "src/styles/default.less",
|
||||||
@ -48,6 +49,7 @@
|
|||||||
],
|
],
|
||||||
|
|
||||||
"scripts": [
|
"scripts": [
|
||||||
|
"node_modules/quill/dist/quill.min.js",
|
||||||
"node_modules/perfect-scrollbar/dist/perfect-scrollbar.js",
|
"node_modules/perfect-scrollbar/dist/perfect-scrollbar.js",
|
||||||
"node_modules/qrious/dist/qrious.min.js"
|
"node_modules/qrious/dist/qrious.min.js"
|
||||||
],
|
],
|
||||||
@ -81,18 +83,6 @@
|
|||||||
"maximumError": "10mb"
|
"maximumError": "10mb"
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
"test": {
|
|
||||||
"fileReplacements": [{
|
|
||||||
"replace": "src/environments/environment.ts",
|
|
||||||
"with": "src/environments/eascs/environment.test.ts"
|
|
||||||
}],
|
|
||||||
"outputHashing": "all",
|
|
||||||
"budgets": [{
|
|
||||||
"type": "initial",
|
|
||||||
"maximumWarning": "4mb",
|
|
||||||
"maximumError": "10mb"
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
"development": {
|
"development": {
|
||||||
"buildOptimizer": false,
|
"buildOptimizer": false,
|
||||||
"optimization": false,
|
"optimization": false,
|
||||||
@ -137,6 +127,7 @@
|
|||||||
"karmaConfig": "karma.conf.js",
|
"karmaConfig": "karma.conf.js",
|
||||||
"tsConfig": "tsconfig.spec.json",
|
"tsConfig": "tsconfig.spec.json",
|
||||||
"scripts": [
|
"scripts": [
|
||||||
|
"node_modules/quill/dist/quill.min.js",
|
||||||
"node_modules/perfect-scrollbar/dist/perfect-scrollbar.js"
|
"node_modules/perfect-scrollbar/dist/perfect-scrollbar.js"
|
||||||
],
|
],
|
||||||
"styles": [],
|
"styles": [],
|
||||||
|
|||||||
4665
package-lock.json
generated
4665
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
59
package.json
59
package.json
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "tms-obc-web",
|
"name": "tms-obc-web",
|
||||||
"version": "1.2.0",
|
"version": "0.0.0",
|
||||||
"description": "运营后台-WEB",
|
"description": "运营后台-WEB",
|
||||||
"author": "cipchk <cipchk@qq.com>",
|
"author": "cipchk <cipchk@qq.com>",
|
||||||
"repository": {
|
"repository": {
|
||||||
@ -16,7 +16,6 @@
|
|||||||
"hmr": "ng s -o --hmr",
|
"hmr": "ng s -o --hmr",
|
||||||
"build": "npm run ng-high-memory build --",
|
"build": "npm run ng-high-memory build --",
|
||||||
"build:dev": "npm run build -- -c dev",
|
"build:dev": "npm run build -- -c dev",
|
||||||
"build:test": "npm run build -- -c test",
|
|
||||||
"analyze": "npm run ng-high-memory build -- --source-map",
|
"analyze": "npm run ng-high-memory build -- --source-map",
|
||||||
"analyze:view": "source-map-explorer dist/**/*.js",
|
"analyze:view": "source-map-explorer dist/**/*.js",
|
||||||
"lint": "npm run lint:ts && npm run lint:style",
|
"lint": "npm run lint:ts && npm run lint:style",
|
||||||
@ -67,6 +66,8 @@
|
|||||||
"ngx-trend": "^7.0.0",
|
"ngx-trend": "^7.0.0",
|
||||||
"perfect-scrollbar": "^1.5.2",
|
"perfect-scrollbar": "^1.5.2",
|
||||||
"qrious": "^4.0.2",
|
"qrious": "^4.0.2",
|
||||||
|
"quill": "^1.3.7",
|
||||||
|
"quill-image-resize-module": "^3.0.0",
|
||||||
"rxjs": "~6.6.0",
|
"rxjs": "~6.6.0",
|
||||||
"screenfull": "^5.1.0",
|
"screenfull": "^5.1.0",
|
||||||
"tslib": "^2.3.0",
|
"tslib": "^2.3.0",
|
||||||
@ -74,22 +75,22 @@
|
|||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@angular-devkit/build-angular": "~12.2.0",
|
"@angular-devkit/build-angular": "~12.2.0",
|
||||||
|
"@angular/cli": "~12.2.0",
|
||||||
|
"@angular/compiler-cli": "~12.2.0",
|
||||||
|
"@types/jasmine": "~3.8.0",
|
||||||
|
"@types/node": "^12.11.1",
|
||||||
|
"jasmine-core": "~3.8.0",
|
||||||
|
"karma": "~6.3.0",
|
||||||
|
"karma-chrome-launcher": "~3.1.0",
|
||||||
|
"karma-coverage": "~2.0.3",
|
||||||
|
"karma-jasmine": "~4.0.0",
|
||||||
|
"karma-jasmine-html-reporter": "~1.7.0",
|
||||||
|
"typescript": "~4.3.5",
|
||||||
"@angular-eslint/builder": "~12.3.1",
|
"@angular-eslint/builder": "~12.3.1",
|
||||||
"@angular-eslint/eslint-plugin": "~12.3.1",
|
"@angular-eslint/eslint-plugin": "~12.3.1",
|
||||||
"@angular-eslint/eslint-plugin-template": "~12.3.1",
|
"@angular-eslint/eslint-plugin-template": "~12.3.1",
|
||||||
"@angular-eslint/schematics": "~12.3.1",
|
"@angular-eslint/schematics": "~12.3.1",
|
||||||
"@angular-eslint/template-parser": "~12.3.1",
|
"@angular-eslint/template-parser": "~12.3.1",
|
||||||
"@angular/cli": "~12.2.0",
|
|
||||||
"@angular/compiler-cli": "~12.2.0",
|
|
||||||
"@angular/language-service": "~12.2.0",
|
|
||||||
"@delon/testing": "^12.3.0",
|
|
||||||
"@types/d3-geo": "^3.0.2",
|
|
||||||
"@types/d3-sankey": "^0.11.2",
|
|
||||||
"@types/file-saver": "^2.0.3",
|
|
||||||
"@types/jasmine": "~3.8.0",
|
|
||||||
"@types/jasminewd2": "~2.0.3",
|
|
||||||
"@types/js-base64": "^3.0.0",
|
|
||||||
"@types/node": "^12.11.1",
|
|
||||||
"@typescript-eslint/eslint-plugin": "~4.29.2",
|
"@typescript-eslint/eslint-plugin": "~4.29.2",
|
||||||
"@typescript-eslint/parser": "~4.29.2",
|
"@typescript-eslint/parser": "~4.29.2",
|
||||||
"eslint": "^7.32.0",
|
"eslint": "^7.32.0",
|
||||||
@ -98,31 +99,29 @@
|
|||||||
"eslint-plugin-jsdoc": "~36.0.7",
|
"eslint-plugin-jsdoc": "~36.0.7",
|
||||||
"eslint-plugin-prefer-arrow": "~1.2.3",
|
"eslint-plugin-prefer-arrow": "~1.2.3",
|
||||||
"eslint-plugin-prettier": "~3.4.1",
|
"eslint-plugin-prettier": "~3.4.1",
|
||||||
"husky": "^6.0.0",
|
"@angular/language-service": "~12.2.0",
|
||||||
"jasmine-core": "~3.8.0",
|
|
||||||
"jasmine-spec-reporter": "~5.0.0",
|
|
||||||
"karma": "~6.3.0",
|
|
||||||
"karma-chrome-launcher": "~3.1.0",
|
|
||||||
"karma-coverage": "~2.0.3",
|
|
||||||
"karma-coverage-istanbul-reporter": "~3.0.2",
|
|
||||||
"karma-jasmine": "~4.0.0",
|
|
||||||
"karma-jasmine-html-reporter": "~1.7.0",
|
|
||||||
"lint-staged": "^11.1.2",
|
|
||||||
"ng-alain": "^12.3.0",
|
|
||||||
"ng-alain-plugin-theme": "^12.0.0",
|
|
||||||
"ng-alain-sts": "^0.0.1",
|
|
||||||
"node-fetch": "^2.6.1",
|
|
||||||
"prettier": "^2.2.1",
|
|
||||||
"protractor": "~7.0.0",
|
|
||||||
"source-map-explorer": "^2.5.2",
|
"source-map-explorer": "^2.5.2",
|
||||||
|
"prettier": "^2.2.1",
|
||||||
"stylelint": "^13.13.1",
|
"stylelint": "^13.13.1",
|
||||||
"stylelint-config-prettier": "^8.0.2",
|
"stylelint-config-prettier": "^8.0.2",
|
||||||
"stylelint-config-rational-order": "^0.1.2",
|
"stylelint-config-rational-order": "^0.1.2",
|
||||||
"stylelint-config-standard": "^22.0.0",
|
"stylelint-config-standard": "^22.0.0",
|
||||||
"stylelint-declaration-block-no-ignored-properties": "^2.4.0",
|
"stylelint-declaration-block-no-ignored-properties": "^2.4.0",
|
||||||
"stylelint-order": "^4.1.0",
|
"stylelint-order": "^4.1.0",
|
||||||
|
"@delon/testing": "^12.3.0",
|
||||||
|
"ng-alain": "^12.3.0",
|
||||||
|
"ng-alain-plugin-theme": "^12.0.0",
|
||||||
|
"ng-alain-sts": "^0.0.1",
|
||||||
|
"@types/jasminewd2": "~2.0.3",
|
||||||
|
"jasmine-spec-reporter": "~5.0.0",
|
||||||
|
"karma-coverage-istanbul-reporter": "~3.0.2",
|
||||||
|
"protractor": "~7.0.0",
|
||||||
"ts-node": "~8.3.0",
|
"ts-node": "~8.3.0",
|
||||||
"typescript": "~4.3.5"
|
"node-fetch": "^2.6.1",
|
||||||
|
"husky": "^6.0.0",
|
||||||
|
"lint-staged": "^11.1.2",
|
||||||
|
"@types/file-saver": "^2.0.3",
|
||||||
|
"@types/js-base64": "^3.0.0"
|
||||||
},
|
},
|
||||||
"lint-staged": {
|
"lint-staged": {
|
||||||
"(src)/**/*.{html,ts}": [
|
"(src)/**/*.{html,ts}": [
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
* @Author : Shiming
|
* @Author : Shiming
|
||||||
* @Date : 2022-01-18 09:51:21
|
* @Date : 2022-01-18 09:51:21
|
||||||
* @LastEditors : Shiming
|
* @LastEditors : Shiming
|
||||||
* @LastEditTime : 2022-05-16 17:27:31
|
* @LastEditTime : 2022-03-23 15:21:39
|
||||||
* @FilePath : \\tms-obc-web\\proxy.conf.js
|
* @FilePath : \\tms-obc-web\\proxy.conf.js
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
||||||
*/
|
*/
|
||||||
@ -18,19 +18,9 @@ module.exports = {
|
|||||||
// secure: false, // Ignore invalid SSL certificates
|
// secure: false, // Ignore invalid SSL certificates
|
||||||
// changeOrigin: true
|
// changeOrigin: true
|
||||||
// }
|
// }
|
||||||
// '//api': {
|
|
||||||
// target: {
|
|
||||||
// host: 'tms-api.yunduoxing.com',
|
|
||||||
// protocol: 'https:',
|
|
||||||
// port: 443
|
|
||||||
// },
|
|
||||||
// secure: false,
|
|
||||||
// changeOrigin: true,
|
|
||||||
// logLevel: 'debug'
|
|
||||||
// },
|
|
||||||
'//api': {
|
'//api': {
|
||||||
target: {
|
target: {
|
||||||
host: 'tms-api-dev.eascs.com',
|
host: 'tms-api-test.eascs.com',
|
||||||
protocol: 'https:',
|
protocol: 'https:',
|
||||||
port: 443
|
port: 443
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,19 +1,23 @@
|
|||||||
/* eslint-disable import/order */
|
/* eslint-disable import/order */
|
||||||
/* eslint-disable import/no-duplicates */
|
/* eslint-disable import/no-duplicates */
|
||||||
import { APP_INITIALIZER, DEFAULT_CURRENCY_CODE, NgModule, Type } from '@angular/core';
|
import { HttpClientModule } from '@angular/common/http';
|
||||||
|
import { default as ngLang } from '@angular/common/locales/zh';
|
||||||
|
import { APP_INITIALIZER, DEFAULT_CURRENCY_CODE, LOCALE_ID, NgModule, Type } from '@angular/core';
|
||||||
import { BrowserModule } from '@angular/platform-browser';
|
import { BrowserModule } from '@angular/platform-browser';
|
||||||
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
||||||
import { SimpleInterceptor } from '@delon/auth';
|
import { SimpleInterceptor } from '@delon/auth';
|
||||||
|
import { NzNotificationModule } from 'ng-zorro-antd/notification';
|
||||||
import zh from '@angular/common/locales/zh';
|
import zh from '@angular/common/locales/zh';
|
||||||
registerLocaleData(zh);
|
registerLocaleData(zh);
|
||||||
// #region global third module
|
// #region global third module
|
||||||
|
|
||||||
const GLOBAL_THIRD_MODULES: Array<Type<any>> = [];
|
import { BidiModule } from '@angular/cdk/bidi';
|
||||||
|
const GLOBAL_THIRD_MODULES: Array<Type<any>> = [BidiModule];
|
||||||
|
|
||||||
// #endregion
|
// #endregion
|
||||||
|
|
||||||
// #region Http Interceptors
|
// #region Http Interceptors
|
||||||
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
|
import { HTTP_INTERCEPTORS } from '@angular/common/http';
|
||||||
|
|
||||||
import { BusinessInterceptor, DefaultInterceptor } from '@core';
|
import { BusinessInterceptor, DefaultInterceptor } from '@core';
|
||||||
|
|
||||||
@ -38,20 +42,35 @@ const APPINIT_PROVIDES = [
|
|||||||
multi: true
|
multi: true
|
||||||
},
|
},
|
||||||
{ provide: DEFAULT_CURRENCY_CODE, useValue: '¥' },
|
{ provide: DEFAULT_CURRENCY_CODE, useValue: '¥' },
|
||||||
{ provide: RouteReuseStrategy, useClass: ReuseTabStrategy, deps: [ReuseTabService] }
|
AuthGuard
|
||||||
];
|
];
|
||||||
// #endregion
|
// #endregion
|
||||||
|
|
||||||
import { AppComponent } from './app.component';
|
import { AppComponent } from './app.component';
|
||||||
import { CoreModule } from './core/core.module';
|
import { CoreModule } from './core/core.module';
|
||||||
|
import { GlobalConfigModule } from './global-config.module';
|
||||||
|
import { LayoutModule } from './layout/layout.module';
|
||||||
import { RoutesModule } from './routes/routes.module';
|
import { RoutesModule } from './routes/routes.module';
|
||||||
|
import { SharedModule } from './shared/shared.module';
|
||||||
|
import { STWidgetModule } from './shared/widget/st-widget.module';
|
||||||
import { registerLocaleData } from '@angular/common';
|
import { registerLocaleData } from '@angular/common';
|
||||||
import { RouteReuseStrategy, RouterModule } from '@angular/router';
|
import { AuthGuard } from './core/guards/auth.guard';
|
||||||
import { ReuseTabService, ReuseTabStrategy } from '@delon/abc/reuse-tab';
|
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [AppComponent],
|
declarations: [AppComponent],
|
||||||
imports: [BrowserModule, BrowserAnimationsModule, HttpClientModule, CoreModule, RoutesModule, RouterModule, ...GLOBAL_THIRD_MODULES],
|
imports: [
|
||||||
|
BrowserModule,
|
||||||
|
BrowserAnimationsModule,
|
||||||
|
HttpClientModule,
|
||||||
|
GlobalConfigModule.forRoot(),
|
||||||
|
CoreModule,
|
||||||
|
SharedModule,
|
||||||
|
LayoutModule,
|
||||||
|
RoutesModule,
|
||||||
|
STWidgetModule,
|
||||||
|
NzNotificationModule,
|
||||||
|
...GLOBAL_THIRD_MODULES
|
||||||
|
],
|
||||||
providers: [...INTERCEPTOR_PROVIDES, ...APPINIT_PROVIDES],
|
providers: [...INTERCEPTOR_PROVIDES, ...APPINIT_PROVIDES],
|
||||||
bootstrap: [AppComponent]
|
bootstrap: [AppComponent]
|
||||||
})
|
})
|
||||||
|
|||||||
@ -1,11 +1,10 @@
|
|||||||
import { NgModule, Optional, SkipSelf } from '@angular/core';
|
import { NgModule, Optional, SkipSelf } from '@angular/core';
|
||||||
import { AuthGuard } from './guards/auth.guard';
|
|
||||||
import { EATokenGuard } from './guards/token.guard';
|
import { EATokenGuard } from './guards/token.guard';
|
||||||
|
|
||||||
import { throwIfAlreadyLoaded } from './module-import-guard';
|
import { throwIfAlreadyLoaded } from './module-import-guard';
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
providers: [AuthGuard, EATokenGuard]
|
providers: [EATokenGuard]
|
||||||
})
|
})
|
||||||
export class CoreModule {
|
export class CoreModule {
|
||||||
constructor(@Optional() @SkipSelf() parentModule: CoreModule) {
|
constructor(@Optional() @SkipSelf() parentModule: CoreModule) {
|
||||||
|
|||||||
@ -4,13 +4,10 @@ import { cacheConf } from '@conf/cache.conf';
|
|||||||
import { sysConf } from '@conf/sys.conf';
|
import { sysConf } from '@conf/sys.conf';
|
||||||
import { ACLService } from '@delon/acl';
|
import { ACLService } from '@delon/acl';
|
||||||
import { MenuService, SettingsService, TitleService, _HttpClient } from '@delon/theme';
|
import { MenuService, SettingsService, TitleService, _HttpClient } from '@delon/theme';
|
||||||
import { AlainConfigService } from '@delon/util';
|
|
||||||
import { environment } from '@env/environment';
|
import { environment } from '@env/environment';
|
||||||
import { AmapService, EACacheService, EAUserService } from '@shared';
|
import { AmapService, EACacheService, EAUserService } from '@shared';
|
||||||
import { NzSafeAny } from 'ng-zorro-antd/core/types';
|
import { NzSafeAny } from 'ng-zorro-antd/core/types';
|
||||||
import { NzIconService } from 'ng-zorro-antd/icon';
|
import { NzIconService } from 'ng-zorro-antd/icon';
|
||||||
import { NzImageService } from 'ng-zorro-antd/image';
|
|
||||||
import { NzUploadFile } from 'ng-zorro-antd/upload';
|
|
||||||
import { Observable, zip } from 'rxjs';
|
import { Observable, zip } from 'rxjs';
|
||||||
import { catchError, map } from 'rxjs/operators';
|
import { catchError, map } from 'rxjs/operators';
|
||||||
|
|
||||||
@ -34,22 +31,10 @@ export class StartupService {
|
|||||||
private userSrv: EAUserService,
|
private userSrv: EAUserService,
|
||||||
private amapService: AmapService,
|
private amapService: AmapService,
|
||||||
public cacheSrv: EACacheService,
|
public cacheSrv: EACacheService,
|
||||||
private coreSrv: CoreService,
|
private coreSrv: CoreService
|
||||||
private nzImageService: NzImageService,
|
|
||||||
private alainConfigService: AlainConfigService
|
|
||||||
) {
|
) {
|
||||||
iconSrv.addIcon(...ICONS_AUTO, ...ICONS);
|
iconSrv.addIcon(...ICONS_AUTO, ...ICONS);
|
||||||
this.settingService.setLayout('fixSiderbar', true);
|
this.settingService.setLayout('fixSiderbar', true);
|
||||||
// 全局修改sf图片预览方式
|
|
||||||
alainConfigService.set('sf', {
|
|
||||||
ui: {
|
|
||||||
preview: (file: NzUploadFile) => {
|
|
||||||
if (file.url) {
|
|
||||||
this.nzImageService.preview([{ src: file.url }]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// TODO: 退出登录时需要清理用户信息
|
// TODO: 退出登录时需要清理用户信息
|
||||||
|
|||||||
@ -12,14 +12,12 @@ import { environment } from '@env/environment';
|
|||||||
|
|
||||||
const alainConfig: AlainConfig = {
|
const alainConfig: AlainConfig = {
|
||||||
st: {
|
st: {
|
||||||
bordered: true,
|
|
||||||
req: { method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' } },
|
req: { method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' } },
|
||||||
res: { reName: { list: 'data.records', total: 'data.total' } },
|
res: { reName: { list: 'data.records', total: 'data.total' } },
|
||||||
page: { show: true, showSize: true, pageSizes: [10, 20, 30, 50, 100, 200, 300, 500, 1000], toTop: false },
|
page: { show: true, showSize: true, pageSizes: [10, 20, 30, 50, 100, 200, 300, 500, 1000], toTop: false },
|
||||||
modal: { size: 'lg' },
|
modal: { size: 'lg' }
|
||||||
ps: 20
|
|
||||||
},
|
},
|
||||||
sf: { button: { search: '查询' } },
|
sf: { button: { search: '查询' }, ui: { placeholder: '请输入' } },
|
||||||
pageHeader: { homeI18n: 'home', recursiveBreadcrumb: true },
|
pageHeader: { homeI18n: 'home', recursiveBreadcrumb: true },
|
||||||
auth: { login_url: '/passport/login' },
|
auth: { login_url: '/passport/login' },
|
||||||
acl: { guard_url: '/exception/403' },
|
acl: { guard_url: '/exception/403' },
|
||||||
|
|||||||
@ -27,7 +27,6 @@ import { NzToolTipModule } from 'ng-zorro-antd/tooltip';
|
|||||||
import { NzGridModule } from 'ng-zorro-antd/grid';
|
import { NzGridModule } from 'ng-zorro-antd/grid';
|
||||||
import { LayoutPassportComponent } from './passport/passport.component';
|
import { LayoutPassportComponent } from './passport/passport.component';
|
||||||
import { PRO_COMPONENTS } from './pro/index';
|
import { PRO_COMPONENTS } from './pro/index';
|
||||||
import { SearchDrawerModule } from '../shared/components/search-drawer/search-drawer.module';
|
|
||||||
|
|
||||||
const COMPONENTS: Array<Type<any>> = [...PRO_COMPONENTS, LayoutPassportComponent];
|
const COMPONENTS: Array<Type<any>> = [...PRO_COMPONENTS, LayoutPassportComponent];
|
||||||
|
|
||||||
@ -58,8 +57,7 @@ const COMPONENTS: Array<Type<any>> = [...PRO_COMPONENTS, LayoutPassportComponent
|
|||||||
ThemeBtnModule,
|
ThemeBtnModule,
|
||||||
ScrollbarModule,
|
ScrollbarModule,
|
||||||
NzGridModule,
|
NzGridModule,
|
||||||
NzMessageModule,
|
NzMessageModule
|
||||||
SearchDrawerModule
|
|
||||||
],
|
],
|
||||||
declarations: COMPONENTS,
|
declarations: COMPONENTS,
|
||||||
exports: COMPONENTS
|
exports: COMPONENTS
|
||||||
|
|||||||
126
src/app/layout/passport/a.scss
Normal file
126
src/app/layout/passport/a.scss
Normal file
@ -0,0 +1,126 @@
|
|||||||
|
body {
|
||||||
|
background : radial-gradient(ellipse at bottom, #1b2735 0%, #090a0f 100%);
|
||||||
|
height : 100vh;
|
||||||
|
overflow : hidden;
|
||||||
|
display : flex;
|
||||||
|
font-family : 'Anton', sans-serif;
|
||||||
|
justify-content: center;
|
||||||
|
align-items : center;
|
||||||
|
}
|
||||||
|
|
||||||
|
$shooting-time: 3000ms;
|
||||||
|
|
||||||
|
.night {
|
||||||
|
position : relative;
|
||||||
|
width : 100%;
|
||||||
|
height : 100%;
|
||||||
|
transform : rotateZ(45deg);
|
||||||
|
// animation: sky 200000ms linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shooting_star {
|
||||||
|
position : absolute;
|
||||||
|
left : 50%;
|
||||||
|
top : 50%;
|
||||||
|
// width: 100px;
|
||||||
|
height : 2px;
|
||||||
|
background : linear-gradient(-45deg, rgba(95, 145, 255, 1), rgba(0, 0, 255, 0));
|
||||||
|
border-radius: 999px;
|
||||||
|
filter : drop-shadow(0 0 6px rgba(105, 155, 255, 1));
|
||||||
|
animation :
|
||||||
|
tail $shooting-time ease-in-out infinite,
|
||||||
|
shooting $shooting-time ease-in-out infinite;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content : '';
|
||||||
|
position : absolute;
|
||||||
|
top : calc(50% - 1px);
|
||||||
|
right : 0;
|
||||||
|
// width: 30px;
|
||||||
|
height : 2px;
|
||||||
|
background : linear-gradient(-45deg, rgba(0, 0, 255, 0), rgba(95, 145, 255, 1), rgba(0, 0, 255, 0));
|
||||||
|
transform : translateX(50%) rotateZ(45deg);
|
||||||
|
border-radius: 100%;
|
||||||
|
animation : shining $shooting-time ease-in-out infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
// CodePen Error
|
||||||
|
// @extend .shooting_star::before;
|
||||||
|
|
||||||
|
content : '';
|
||||||
|
position : absolute;
|
||||||
|
top : calc(50% - 1px);
|
||||||
|
right : 0;
|
||||||
|
// width: 30px;
|
||||||
|
height : 2px;
|
||||||
|
background : linear-gradient(-45deg, rgba(0, 0, 255, 0), rgba(95, 145, 255, 1), rgba(0, 0, 255, 0));
|
||||||
|
transform : translateX(50%) rotateZ(45deg);
|
||||||
|
border-radius: 100%;
|
||||||
|
animation : shining $shooting-time ease-in-out infinite;
|
||||||
|
transform : translateX(50%) rotateZ(-45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
@for $i from 1 through 20 {
|
||||||
|
&:nth-child(#{$i}) {
|
||||||
|
$delay : random(9999) + 0ms;
|
||||||
|
top : calc(50% - #{random(400) - 200px});
|
||||||
|
left : calc(50% - #{random(300) + 0px});
|
||||||
|
// animation-delay: $delay;
|
||||||
|
// opacity: random(50) / 100 + 0.5;
|
||||||
|
|
||||||
|
&::before,
|
||||||
|
&::after {
|
||||||
|
// animation-delay: $delay;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes tail {
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
30% {
|
||||||
|
width: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes shining {
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
width: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes shooting {
|
||||||
|
0% {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateX(300px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes sky {
|
||||||
|
0% {
|
||||||
|
transform: rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: rotate(45 + 360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
64
src/app/layout/passport/d.scss
Normal file
64
src/app/layout/passport/d.scss
Normal file
@ -0,0 +1,64 @@
|
|||||||
|
$n: 20; // 流星數量
|
||||||
|
|
||||||
|
|
||||||
|
$shadow: ();
|
||||||
|
|
||||||
|
|
||||||
|
@for $i from 1 through $n {
|
||||||
|
$v: random(90) + 9; // left
|
||||||
|
$h: random(150) + 10; // top
|
||||||
|
$d: random(70)/10 + 12; // 秒數
|
||||||
|
|
||||||
|
.meteor-#{$i} {
|
||||||
|
position : fixed;
|
||||||
|
top : $h + px;
|
||||||
|
left : $v*1%;
|
||||||
|
width : 130px;
|
||||||
|
height : 1px;
|
||||||
|
transform : rotate(-45deg);
|
||||||
|
background-image: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
|
||||||
|
animation : meteor $d+s linear infinite;
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
content : "";
|
||||||
|
position : fixed;
|
||||||
|
width : 4px;
|
||||||
|
height : 5px;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-top : -2px;
|
||||||
|
background : rgba(#fff, .7);
|
||||||
|
box-shadow : 0 0 15px 3px #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes meteor {
|
||||||
|
0% {
|
||||||
|
opacity : 1;
|
||||||
|
margin-top : -300px;
|
||||||
|
margin-right: -300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
12% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
13% {
|
||||||
|
margin-top : 600px;
|
||||||
|
margin-left : -900px;
|
||||||
|
opacity : 0.6;
|
||||||
|
animation-delay: 2000ms;
|
||||||
|
}
|
||||||
|
|
||||||
|
15% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
100% {
|
||||||
|
margin-top : 700px;
|
||||||
|
margin-left: -900px;
|
||||||
|
opacity : 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
325
src/app/layout/passport/particle.ts
Normal file
325
src/app/layout/passport/particle.ts
Normal file
@ -0,0 +1,325 @@
|
|||||||
|
export default class Particle {
|
||||||
|
getLimitedRandom = function (min: number, max: number, roundToInteger?: any) {
|
||||||
|
var number = Math.random() * (max - min) + min;
|
||||||
|
if (roundToInteger) {
|
||||||
|
number = Math.round(number);
|
||||||
|
}
|
||||||
|
return number;
|
||||||
|
};
|
||||||
|
|
||||||
|
returnRandomArrayitem = function (array: string | any[]) {
|
||||||
|
return array[Math.floor(Math.random() * array.length)];
|
||||||
|
};
|
||||||
|
|
||||||
|
constructor() {}
|
||||||
|
|
||||||
|
init() {
|
||||||
|
var ParticleNetworkAnimation: any, PNA: any;
|
||||||
|
ParticleNetworkAnimation = PNA = function () {};
|
||||||
|
|
||||||
|
PNA.prototype.init = function (element: any) {
|
||||||
|
console.log(this);
|
||||||
|
this.$el = document.getElementsByClassName(element);
|
||||||
|
|
||||||
|
this.container = element;
|
||||||
|
this.canvas = document.createElement('canvas');
|
||||||
|
this.sizeCanvas();
|
||||||
|
this.container.appendChild(this.canvas);
|
||||||
|
this.ctx = this.canvas.getContext('2d');
|
||||||
|
this.particleNetwork = new ParticleNetwork(this);
|
||||||
|
|
||||||
|
this.bindUiActions();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
};
|
||||||
|
|
||||||
|
PNA.prototype.bindUiActions = function () {
|
||||||
|
(window as any).on('resize', () => {
|
||||||
|
// this.sizeContainer();
|
||||||
|
this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
||||||
|
this.sizeCanvas();
|
||||||
|
this.particleNetwork.createParticles();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
PNA.prototype.sizeCanvas = function () {
|
||||||
|
this.canvas.width = this.container.offsetWidth;
|
||||||
|
this.canvas.height = this.container.offsetHeight;
|
||||||
|
};
|
||||||
|
|
||||||
|
console.log(PNA);
|
||||||
|
|
||||||
|
const Particle: any = function (parent: any, x?: any, y?: any) {
|
||||||
|
// this.network = parent;
|
||||||
|
// this.canvas = parent.canvas;
|
||||||
|
// this.ctx = parent.ctx;
|
||||||
|
// this.particleColor = ;
|
||||||
|
// this.radius = ;
|
||||||
|
// this.opacity = 0;
|
||||||
|
// this.x = x || Math.random() * this.canvas.width;
|
||||||
|
// this.y = y || Math.random() * this.canvas.height;
|
||||||
|
// this.velocity = {
|
||||||
|
// x: (Math.random() - 0.5) * parent.options.velocity,
|
||||||
|
// y: (Math.random() - 0.5) * parent.options.velocity
|
||||||
|
// };
|
||||||
|
return {
|
||||||
|
network: parent,
|
||||||
|
canvas: parent.canvas,
|
||||||
|
ctx: parent.ctx,
|
||||||
|
// particleColor: this.returnRandomArrayitem(parent.options.particleColors),
|
||||||
|
// radius: this.getLimitedRandom(1.5, 2.5),
|
||||||
|
opacity: 0,
|
||||||
|
x: x || Math.random() * parent.canvas.width,
|
||||||
|
y: y || Math.random() * parent.canvas.height,
|
||||||
|
velocity: {
|
||||||
|
x: (Math.random() - 0.5) * parent.options.velocity,
|
||||||
|
y: (Math.random() - 0.5) * parent.options.velocity
|
||||||
|
}
|
||||||
|
};
|
||||||
|
};
|
||||||
|
console.log(new Particle(this));
|
||||||
|
|
||||||
|
Particle.prototype.update = function () {
|
||||||
|
if (this.opacity < 1) {
|
||||||
|
this.opacity += 0.01;
|
||||||
|
} else {
|
||||||
|
this.opacity = 1;
|
||||||
|
}
|
||||||
|
// Change dir if outside map
|
||||||
|
if (this.x > this.canvas.width + 100 || this.x < -100) {
|
||||||
|
this.velocity.x = -this.velocity.x;
|
||||||
|
}
|
||||||
|
if (this.y > this.canvas.height + 100 || this.y < -100) {
|
||||||
|
this.velocity.y = -this.velocity.y;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update position
|
||||||
|
this.x += this.velocity.x;
|
||||||
|
this.y += this.velocity.y;
|
||||||
|
};
|
||||||
|
|
||||||
|
Particle.prototype.draw = function () {
|
||||||
|
// Draw particle
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.fillStyle = this.particleColor;
|
||||||
|
this.ctx.globalAlpha = this.opacity;
|
||||||
|
this.ctx.arc(this.x, this.y, this.radius, 0, 2 * Math.PI);
|
||||||
|
this.ctx.fill();
|
||||||
|
};
|
||||||
|
|
||||||
|
var ParticleNetwork: any = function (this: any, parent: { canvas: any; ctx: any }) {
|
||||||
|
this.options = {
|
||||||
|
velocity: 1, // the higher the faster
|
||||||
|
density: 15000, // the lower the denser
|
||||||
|
netLineDistance: 200,
|
||||||
|
netLineColor: '#929292',
|
||||||
|
particleColors: ['#aaa'] // ['#6D4E5C', '#aaa', '#FFC458' ]
|
||||||
|
};
|
||||||
|
this.canvas = parent.canvas;
|
||||||
|
this.ctx = parent.ctx;
|
||||||
|
|
||||||
|
this.init();
|
||||||
|
};
|
||||||
|
|
||||||
|
ParticleNetwork.prototype.init = function () {
|
||||||
|
// Create particle objects
|
||||||
|
this.createParticles(true);
|
||||||
|
|
||||||
|
// Update canvas
|
||||||
|
this.animationFrame = requestAnimationFrame(this.update.bind(this));
|
||||||
|
|
||||||
|
this.bindUiActions();
|
||||||
|
};
|
||||||
|
|
||||||
|
ParticleNetwork.prototype.createParticles = function (isInitial: any) {
|
||||||
|
// Initialise / reset particles
|
||||||
|
var me = this;
|
||||||
|
this.particles = [];
|
||||||
|
var quantity = (this.canvas.width * this.canvas.height) / this.options.density;
|
||||||
|
|
||||||
|
if (isInitial) {
|
||||||
|
var counter = 0;
|
||||||
|
clearInterval(this.createIntervalId);
|
||||||
|
this.createIntervalId = setInterval(() => {
|
||||||
|
if (counter < quantity - 1) {
|
||||||
|
// Create particle object
|
||||||
|
this.particles.push(new Particle(this));
|
||||||
|
} else {
|
||||||
|
clearInterval(me.createIntervalId);
|
||||||
|
}
|
||||||
|
counter++;
|
||||||
|
}, 50);
|
||||||
|
} else {
|
||||||
|
// Create particle objects
|
||||||
|
for (var i = 0; i < quantity; i++) {
|
||||||
|
this.particles.push(new Particle(this));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
ParticleNetwork.prototype.createInteractionParticle = function () {
|
||||||
|
// Add interaction particle
|
||||||
|
this.interactionParticle = new Particle(this);
|
||||||
|
this.interactionParticle.velocity = {
|
||||||
|
x: 0,
|
||||||
|
y: 0
|
||||||
|
};
|
||||||
|
this.particles.push(this.interactionParticle);
|
||||||
|
return this.interactionParticle;
|
||||||
|
};
|
||||||
|
|
||||||
|
ParticleNetwork.prototype.removeInteractionParticle = function () {
|
||||||
|
// Find it
|
||||||
|
var index = this.particles.indexOf(this.interactionParticle);
|
||||||
|
if (index > -1) {
|
||||||
|
// Remove it
|
||||||
|
this.interactionParticle = undefined;
|
||||||
|
this.particles.splice(index, 1);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
ParticleNetwork.prototype.update = function () {
|
||||||
|
if (this.canvas) {
|
||||||
|
this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
||||||
|
this.ctx.globalAlpha = 1;
|
||||||
|
|
||||||
|
// Draw connections
|
||||||
|
for (var i = 0; i < this.particles.length; i++) {
|
||||||
|
for (var j = this.particles.length - 1; j > i; j--) {
|
||||||
|
var distance,
|
||||||
|
p1 = this.particles[i],
|
||||||
|
p2 = this.particles[j];
|
||||||
|
|
||||||
|
// check very simply if the two points are even a candidate for further measurements
|
||||||
|
distance = Math.min(Math.abs(p1.x - p2.x), Math.abs(p1.y - p2.y));
|
||||||
|
if (distance > this.options.netLineDistance) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
// the two points seem close enough, now let's measure precisely
|
||||||
|
distance = Math.sqrt(Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2));
|
||||||
|
if (distance > this.options.netLineDistance) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.strokeStyle = this.options.netLineColor;
|
||||||
|
this.ctx.globalAlpha = ((this.options.netLineDistance - distance) / this.options.netLineDistance) * p1.opacity * p2.opacity;
|
||||||
|
this.ctx.lineWidth = 0.7;
|
||||||
|
this.ctx.moveTo(p1.x, p1.y);
|
||||||
|
this.ctx.lineTo(p2.x, p2.y);
|
||||||
|
this.ctx.stroke();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Draw particles
|
||||||
|
for (var i = 0; i < this.particles.length; i++) {
|
||||||
|
this.particles[i].update();
|
||||||
|
this.particles[i].draw();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.options.velocity !== 0) {
|
||||||
|
this.animationFrame = requestAnimationFrame(this.update.bind(this));
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
cancelAnimationFrame(this.animationFrame);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
ParticleNetwork.prototype.bindUiActions = function () {
|
||||||
|
// Mouse / touch event handling
|
||||||
|
this.spawnQuantity = 3;
|
||||||
|
this.mouseIsDown = false;
|
||||||
|
this.touchIsMoving = false;
|
||||||
|
|
||||||
|
this.onMouseMove = (e: { offsetX: any; offsetY: any }) => {
|
||||||
|
if (!this.interactionParticle) {
|
||||||
|
this.createInteractionParticle();
|
||||||
|
}
|
||||||
|
this.interactionParticle.x = e.offsetX;
|
||||||
|
this.interactionParticle.y = e.offsetY;
|
||||||
|
};
|
||||||
|
|
||||||
|
this.onTouchMove = (e: { preventDefault: () => void; changedTouches: { clientX: any; clientY: any }[] }) => {
|
||||||
|
e.preventDefault();
|
||||||
|
this.touchIsMoving = true;
|
||||||
|
if (!this.interactionParticle) {
|
||||||
|
this.createInteractionParticle();
|
||||||
|
}
|
||||||
|
this.interactionParticle.x = e.changedTouches[0].clientX;
|
||||||
|
this.interactionParticle.y = e.changedTouches[0].clientY;
|
||||||
|
};
|
||||||
|
|
||||||
|
this.onMouseDown = () => {
|
||||||
|
this.mouseIsDown = true;
|
||||||
|
var counter = 0;
|
||||||
|
var quantity = this.spawnQuantity;
|
||||||
|
var intervalId = setInterval(() => {
|
||||||
|
if (this.mouseIsDown) {
|
||||||
|
if (counter === 1) {
|
||||||
|
quantity = 1;
|
||||||
|
}
|
||||||
|
for (var i = 0; i < quantity; i++) {
|
||||||
|
if (this.interactionParticle) {
|
||||||
|
this.particles.push(new Particle(this, this.interactionParticle.x, this.interactionParticle.y));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
clearInterval(intervalId);
|
||||||
|
}
|
||||||
|
counter++;
|
||||||
|
}, 50);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.onTouchStart = (e: { preventDefault: () => void; changedTouches: { clientX: any; clientY: any }[] }) => {
|
||||||
|
e.preventDefault();
|
||||||
|
setTimeout(() => {
|
||||||
|
if (!this.touchIsMoving) {
|
||||||
|
for (var i = 0; i < this.spawnQuantity; i++) {
|
||||||
|
this.particles.push(new Particle(this, e.changedTouches[0].clientX, e.changedTouches[0].clientY));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, 200);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.onMouseUp = () => {
|
||||||
|
this.mouseIsDown = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
this.onMouseOut = function () {
|
||||||
|
this.removeInteractionParticle();
|
||||||
|
};
|
||||||
|
|
||||||
|
this.onTouchEnd = function (e: { preventDefault: () => void }) {
|
||||||
|
e.preventDefault();
|
||||||
|
this.touchIsMoving = false;
|
||||||
|
this.removeInteractionParticle();
|
||||||
|
};
|
||||||
|
|
||||||
|
// this.canvas.addEventListener('mousemove', this.onMouseMove);
|
||||||
|
// this.canvas.addEventListener('touchmove', this.onTouchMove);
|
||||||
|
// this.canvas.addEventListener('mousedown', this.onMouseDown);
|
||||||
|
// this.canvas.addEventListener('touchstart', this.onTouchStart);
|
||||||
|
// this.canvas.addEventListener('mouseup', this.onMouseUp);
|
||||||
|
// this.canvas.addEventListener('mouseout', this.onMouseOut);
|
||||||
|
// this.canvas.addEventListener('touchend', this.onTouchEnd);
|
||||||
|
};
|
||||||
|
|
||||||
|
ParticleNetwork.prototype.unbindUiActions = function () {
|
||||||
|
if (this.canvas) {
|
||||||
|
// this.canvas.removeEventListener('mousemove', this.onMouseMove);
|
||||||
|
// this.canvas.removeEventListener('touchmove', this.onTouchMove);
|
||||||
|
// this.canvas.removeEventListener('mousedown', this.onMouseDown);
|
||||||
|
// this.canvas.removeEventListener('touchstart', this.onTouchStart);
|
||||||
|
// this.canvas.removeEventListener('mouseup', this.onMouseUp);
|
||||||
|
// this.canvas.removeEventListener('mouseout', this.onMouseOut);
|
||||||
|
// this.canvas.removeEventListener('touchend', this.onTouchEnd);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const pna = new PNA();
|
||||||
|
console.log(pna);
|
||||||
|
|
||||||
|
pna.init(document.getElementsByClassName('particle-network-animation')[0]);
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,15 +1,67 @@
|
|||||||
<nz-layout class="layout">
|
<nz-layout class="layout">
|
||||||
<nz-header>
|
<!-- <nz-header style="z-index: 999;">
|
||||||
<div nz-row>
|
<div nz-row>
|
||||||
<div nz-col nzSpan="24" style="display: flex;align-items: center;">
|
<div nz-col nzSpan="24" style="display: flex;align-items: center;">
|
||||||
<img width="32" height="32" src="./assets/images/user/logo.svg" [routerLink]="['/']" />
|
<img width="32" height="32" src="./assets/images/user/logo.svg" [routerLink]="['/']" />
|
||||||
<label class="title ml-sm">运多星网络货运管理平台</label>
|
<label class="title ml-sm">运多星网络货运管理平台</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nz-header>
|
</nz-header> -->
|
||||||
<nz-content class="content">
|
<nz-content class="content" id="content">
|
||||||
<div class="inner-content">
|
<nz-row>
|
||||||
<router-outlet></router-outlet>
|
<nz-col nzXs="0" nzSm="0" nzMd="0" nzLg="14" nzXl="14" nzXXl="14" style="z-index: 9999;">
|
||||||
|
<div style="width: 100%;height: 100%;display: flex;align-items: center;padding: 60px;">
|
||||||
|
<div class="earth-box">
|
||||||
|
<div class="earth" style="width: 100%;height: 100%;"></div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
</nz-col>
|
||||||
|
<nz-col nzXs="24" nzSm="24" nzMd="24" nzLg="9" nzXl="8" nzXXl="7" style="z-index: 9999; ">
|
||||||
|
<router-outlet></router-outlet>
|
||||||
|
</nz-col>
|
||||||
|
</nz-row>
|
||||||
|
<div class="meteor-1"></div>
|
||||||
|
<div class="meteor-2"></div>
|
||||||
|
<div class="meteor-3"></div>
|
||||||
|
<div class="meteor-4"></div>
|
||||||
|
<div class="meteor-5"></div>
|
||||||
|
<div class="meteor-6"></div>
|
||||||
|
<div class="meteor-7"></div>
|
||||||
|
<div class="meteor-8"></div>
|
||||||
|
<div class="meteor-9"></div>
|
||||||
|
<div class="meteor-10"></div>
|
||||||
|
<div class="meteor-11"></div>
|
||||||
|
<div class="meteor-12"></div>
|
||||||
|
<div class="meteor-13"></div>
|
||||||
|
<div class="meteor-14"></div>
|
||||||
|
<div class="meteor-15"></div>
|
||||||
|
<div class="meteor-16"></div>
|
||||||
|
<div class="meteor-17"></div>
|
||||||
|
<div class="meteor-18"></div>
|
||||||
|
<div class="meteor-19"></div>
|
||||||
|
<div class="meteor-20"></div>
|
||||||
|
<div class=" particle-network-animation"></div>
|
||||||
|
<!-- <div class="night">
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
<div class="shooting_star"></div>
|
||||||
|
</div> -->
|
||||||
</nz-content>
|
</nz-content>
|
||||||
</nz-layout>
|
</nz-layout>
|
||||||
@ -7,10 +7,70 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ant-layout-header {
|
.ant-layout-header {
|
||||||
background: #ffffff;
|
background : #ffffff;
|
||||||
box-shadow: 0px 5px 5px #d1d1d1;
|
// box-shadow: 0px 5px 5px #d1d1d1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
nz-content {
|
||||||
|
background : url('../../../assets/images/login/login-bg.jpg') 100% 100% no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
// overflow : auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
passport-login {
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.earth-box {
|
||||||
|
background : url('../../../assets/images/login/4-界面背景.png') 100% 100% no-repeat;
|
||||||
|
background-size : cover;
|
||||||
|
background-position: center;
|
||||||
|
// overflow : hidden;
|
||||||
|
width : 100%;
|
||||||
|
height : 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.earth {
|
||||||
|
// animation : eatthAnimation 60s linear infinite;
|
||||||
|
// -webkit-animation: eatthAnimation 60s linear infinite;
|
||||||
|
max-width : 100%;
|
||||||
|
height : 100%;
|
||||||
|
// margin-top : -50px;
|
||||||
|
// max-height : calc(100% - 64px);
|
||||||
|
// border-radius : 40%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
position: absolute;
|
||||||
|
left : calc(50% - 82px);
|
||||||
|
width : 164px;
|
||||||
|
top : calc(50% - 82px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.earth:hover {
|
||||||
|
animation-play-state : paused;
|
||||||
|
-webkit-animation-play-state: paused;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes eatthAnimation {
|
||||||
|
0% {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes eatthAnimation {
|
||||||
|
0% {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,15 +1,35 @@
|
|||||||
import { Component, Inject, OnInit } from '@angular/core';
|
import { Component, Inject, OnInit } from '@angular/core';
|
||||||
import { DA_SERVICE_TOKEN, ITokenService } from '@delon/auth';
|
import { DA_SERVICE_TOKEN, ITokenService } from '@delon/auth';
|
||||||
|
import Particle from './particle';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'layout-passport',
|
selector: 'layout-passport',
|
||||||
templateUrl: './passport.component.html',
|
templateUrl: './passport.component.html',
|
||||||
styleUrls: ['./passport.component.less']
|
styleUrls: ['./passport.component.less', './d.scss']
|
||||||
})
|
})
|
||||||
export class LayoutPassportComponent implements OnInit {
|
export class LayoutPassportComponent implements OnInit {
|
||||||
constructor() {}
|
constructor() {}
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
// this.tokenService.clear();
|
// this.tokenService.clear();
|
||||||
|
// this.loadJS();
|
||||||
|
|
||||||
|
const particle = new Particle();
|
||||||
|
particle.init();
|
||||||
|
}
|
||||||
|
|
||||||
|
loadJS() {
|
||||||
|
var script = document.createElement('script');
|
||||||
|
script.type = 'text/javascript';
|
||||||
|
script.src = './assets/login/js/script.js';
|
||||||
|
script.id = 'particle';
|
||||||
|
document.getElementsByTagName('head')[0].appendChild(script);
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
var content = document.getElementById('content');
|
||||||
|
if (content) {
|
||||||
|
content.style.overflow = 'auto';
|
||||||
|
}
|
||||||
|
}, 100);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -14,7 +14,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
<ng-template #subLink let-i>
|
<ng-template #subLink let-i>
|
||||||
<a *ngIf="!i.externalLink" (click)="routeTo(i.link)" [target]="i.target">{{ i.text }} </a>
|
<a *ngIf="!i.externalLink" [routerLink]="i.link" [target]="i.target">{{ i.text }} </a>
|
||||||
<a *ngIf="i.externalLink" [attr.href]="i.externalLink" [attr.target]="i.target">{{ i.text }} </a>
|
<a *ngIf="i.externalLink" [attr.href]="i.externalLink" [attr.target]="i.target">{{ i.text }} </a>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
<ul *ngIf="menus" nz-menu [nzMode]="mode" [nzTheme]="pro.theme"
|
<ul *ngIf="menus" nz-menu [nzMode]="mode" [nzTheme]="pro.theme"
|
||||||
@ -22,7 +22,7 @@
|
|||||||
<ng-container *ngFor="let l1 of menus">
|
<ng-container *ngFor="let l1 of menus">
|
||||||
<li *ngIf="l1.children!.length === 0" nz-menu-item class="alain-pro__menu-item"
|
<li *ngIf="l1.children!.length === 0" nz-menu-item class="alain-pro__menu-item"
|
||||||
[class.alain-pro__menu-item--disabled]="l1.disabled" [nzSelected]="l1._selected" [nzDisabled]="l1.disabled">
|
[class.alain-pro__menu-item--disabled]="l1.disabled" [nzSelected]="l1._selected" [nzDisabled]="l1.disabled">
|
||||||
<a *ngIf="!l1.externalLink" (click)="routeTo(l1.link);closeCollapsed()" class="alain-pro__menu-title">
|
<a *ngIf="!l1.externalLink" [routerLink]="l1.link" (click)="closeCollapsed()" class="alain-pro__menu-title">
|
||||||
<ng-template [ngTemplateOutlet]="mainLink" [ngTemplateOutletContext]="{ $implicit: l1 }"></ng-template>
|
<ng-template [ngTemplateOutlet]="mainLink" [ngTemplateOutletContext]="{ $implicit: l1 }"></ng-template>
|
||||||
</a>
|
</a>
|
||||||
<a *ngIf="l1.externalLink" [attr.href]="l1.externalLink" [attr.target]="l1.target" (click)="closeCollapsed()"
|
<a *ngIf="l1.externalLink" [attr.href]="l1.externalLink" [attr.target]="l1.target" (click)="closeCollapsed()"
|
||||||
|
|||||||
@ -1,9 +1,7 @@
|
|||||||
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnDestroy, OnInit } from '@angular/core';
|
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnDestroy, OnInit } from '@angular/core';
|
||||||
import { NavigationEnd, Router } from '@angular/router';
|
import { NavigationEnd, Router } from '@angular/router';
|
||||||
import { ReuseTabService } from '@delon/abc/reuse-tab';
|
|
||||||
import { MenuService } from '@delon/theme';
|
import { MenuService } from '@delon/theme';
|
||||||
import { InputBoolean } from '@delon/util';
|
import { InputBoolean } from '@delon/util';
|
||||||
import { SearchDrawerService } from '@shared';
|
|
||||||
import { NzMenuModeType } from 'ng-zorro-antd/menu';
|
import { NzMenuModeType } from 'ng-zorro-antd/menu';
|
||||||
import { Subject } from 'rxjs';
|
import { Subject } from 'rxjs';
|
||||||
import { filter, takeUntil } from 'rxjs/operators';
|
import { filter, takeUntil } from 'rxjs/operators';
|
||||||
@ -27,14 +25,7 @@ export class LayoutProMenuComponent implements OnInit, OnDestroy {
|
|||||||
@Input() @InputBoolean() disabledAcl = false;
|
@Input() @InputBoolean() disabledAcl = false;
|
||||||
@Input() mode: NzMenuModeType = 'inline';
|
@Input() mode: NzMenuModeType = 'inline';
|
||||||
|
|
||||||
constructor(
|
constructor(private menuSrv: MenuService, private router: Router, public pro: BrandService, private cdr: ChangeDetectorRef) {}
|
||||||
private menuSrv: MenuService,
|
|
||||||
private router: Router,
|
|
||||||
public pro: BrandService,
|
|
||||||
private cdr: ChangeDetectorRef,
|
|
||||||
private reuseService: ReuseTabService,
|
|
||||||
private searchDrawerService: SearchDrawerService
|
|
||||||
) {}
|
|
||||||
|
|
||||||
private cd(): void {
|
private cd(): void {
|
||||||
this.cdr.markForCheck();
|
this.cdr.markForCheck();
|
||||||
@ -130,12 +121,4 @@ export class LayoutProMenuComponent implements OnInit, OnDestroy {
|
|||||||
unsubscribe$.next();
|
unsubscribe$.next();
|
||||||
unsubscribe$.complete();
|
unsubscribe$.complete();
|
||||||
}
|
}
|
||||||
|
|
||||||
routeTo(link: string | undefined) {
|
|
||||||
if (link) {
|
|
||||||
this.reuseService.clear();
|
|
||||||
this.searchDrawerService.unsubscribe();
|
|
||||||
this.router.navigate([link]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,4 +1,3 @@
|
|||||||
<span class="mr-md">客服电话:0755-88393483</span>
|
|
||||||
<!--Search-->
|
<!--Search-->
|
||||||
<layout-pro-search class="hidden-xs"></layout-pro-search>
|
<layout-pro-search class="hidden-xs"></layout-pro-search>
|
||||||
<!--Link-->
|
<!--Link-->
|
||||||
|
|||||||
@ -38,4 +38,3 @@
|
|||||||
</div>
|
</div>
|
||||||
<ng-template #settingHost></ng-template>
|
<ng-template #settingHost></ng-template>
|
||||||
<theme-btn></theme-btn>
|
<theme-btn></theme-btn>
|
||||||
<app-search-drawer></app-search-drawer>
|
|
||||||
@ -1,33 +1,26 @@
|
|||||||
@{alain-pro-prefix} {
|
@{alain-pro-prefix} {
|
||||||
&__menu {
|
&__menu {
|
||||||
display: block;
|
display: block;
|
||||||
|
|
||||||
&-item {
|
&-item {
|
||||||
&--disabled {
|
&--disabled {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&-only-icon {
|
&-only-icon {
|
||||||
@{alain-pro-prefix}__menu-item {
|
@{alain-pro-prefix}__menu-item {
|
||||||
padding-right: 8px !important;
|
padding-right: 8px !important;
|
||||||
padding-left: 8px !important;
|
padding-left: 8px !important;
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@{alain-pro-prefix}__menu-icon {
|
@{alain-pro-prefix}__menu-icon {
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
font-size: @alain-pro-top-nav-only-icon-fs;
|
font-size: @alain-pro-top-nav-only-icon-fs;
|
||||||
min-width: 14px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&-title {
|
&-title {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
&-badge {
|
&-badge {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@ -38,34 +31,27 @@
|
|||||||
line-height: 18px;
|
line-height: 18px;
|
||||||
background: @alain-pro-header-title-badge-bg;
|
background: @alain-pro-header-title-badge-bg;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
|
> em {
|
||||||
>em {
|
|
||||||
color: @alain-pro-header-title-badge-color;
|
color: @alain-pro-header-title-badge-color;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&-img {
|
&-img {
|
||||||
width: @alain-pro-sider-menu-img-wh !important;
|
width: @alain-pro-sider-menu-img-wh !important;
|
||||||
height: @alain-pro-sider-menu-img-wh !important;
|
height: @alain-pro-sider-menu-img-wh !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&__side-nav {
|
&__side-nav {
|
||||||
@{alain-pro-prefix}__menu {
|
@{alain-pro-prefix}__menu {
|
||||||
&-title {
|
&-title {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
&-text {
|
&-text {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
// opacity: 0;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.@{ant-prefix}-menu-inline-collapsed {
|
.@{ant-prefix}-menu-inline-collapsed {
|
||||||
@{alain-pro-prefix}__menu-title-badge {
|
@{alain-pro-prefix}__menu-title-badge {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -73,28 +59,10 @@
|
|||||||
right: -16px;
|
right: -16px;
|
||||||
width: 8px;
|
width: 8px;
|
||||||
height: 8px;
|
height: 8px;
|
||||||
|
> em {
|
||||||
>em {
|
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@{aside-collapsed-prefix} {
|
|
||||||
@{alain-pro-prefix} {
|
|
||||||
&__menu {
|
|
||||||
&-icon {
|
|
||||||
overflow: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-title {
|
|
||||||
&-text {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|||||||
@ -12,7 +12,6 @@
|
|||||||
import { NgModule } from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
import { RouterModule, Routes } from '@angular/router';
|
import { RouterModule, Routes } from '@angular/router';
|
||||||
import { AccountComponentsCenterComponent } from './components/center/center.component';
|
import { AccountComponentsCenterComponent } from './components/center/center.component';
|
||||||
import { AccountComponentsEditPayPasswordComponent } from './components/edit-paypassword/edit-paypassword.component'
|
|
||||||
|
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
{ path: '', redirectTo: 'center', pathMatch: 'full' },
|
{ path: '', redirectTo: 'center', pathMatch: 'full' },
|
||||||
@ -22,16 +21,7 @@ const routes: Routes = [
|
|||||||
data: {
|
data: {
|
||||||
title: '账户中心'
|
title: '账户中心'
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
{
|
|
||||||
path: 'edit-paypassword',
|
|
||||||
component: AccountComponentsEditPayPasswordComponent,
|
|
||||||
data: {
|
|
||||||
title: '修改支付密码',
|
|
||||||
titleI18n: 'app.my.edit.paypassword',
|
|
||||||
// guard: {ability: ['accountcenter-editpaypassword']}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
];
|
];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
|
|||||||
@ -15,13 +15,11 @@ import { AccountRoutingModule } from './account-routing.module';
|
|||||||
import { AccountComponentsCenterComponent } from './components/center/center.component';
|
import { AccountComponentsCenterComponent } from './components/center/center.component';
|
||||||
import { AccountComponentsEditNameComponent } from './components/edit-name/edit-name.component';
|
import { AccountComponentsEditNameComponent } from './components/edit-name/edit-name.component';
|
||||||
import { AccountComponentsCenterEditComponent } from './components/edit-password/edit-password.component';
|
import { AccountComponentsCenterEditComponent } from './components/edit-password/edit-password.component';
|
||||||
import { AccountComponentsEditPayPasswordComponent } from './components/edit-paypassword/edit-paypassword.component'
|
|
||||||
|
|
||||||
const COMPONENTS = [
|
const COMPONENTS = [
|
||||||
AccountComponentsCenterComponent,
|
AccountComponentsCenterComponent,
|
||||||
AccountComponentsEditNameComponent,
|
AccountComponentsEditNameComponent,
|
||||||
AccountComponentsCenterEditComponent,
|
AccountComponentsCenterEditComponent
|
||||||
AccountComponentsEditPayPasswordComponent
|
|
||||||
];
|
];
|
||||||
const COMPONENTS_NOROUNT = [AccountComponentsEditNameComponent];
|
const COMPONENTS_NOROUNT = [AccountComponentsEditNameComponent];
|
||||||
|
|
||||||
|
|||||||
@ -30,44 +30,18 @@
|
|||||||
</div>
|
</div>
|
||||||
<div nz-col [nzSpan]="10">定期更换密码有助于账号安全</div>
|
<div nz-col [nzSpan]="10">定期更换密码有助于账号安全</div>
|
||||||
<div nz-col [nzSpan]="10">
|
<div nz-col [nzSpan]="10">
|
||||||
<span *ngIf="infoData.isPwd; else elsePwd"><i nz-icon [nzType]="'check-circle'" [nzTheme]="'fill'"
|
<span *ngIf="infoData.isPwd; else elsePwd"
|
||||||
style="color: #52c41a"></i> 已设置</span>
|
><i nz-icon [nzType]="'check-circle'" [nzTheme]="'fill'" style="color: #52c41a"></i> 已设置</span
|
||||||
<ng-template #elsePwd><i nz-icon [nzType]="'question-circle'" [nzTheme]="'fill'"
|
>
|
||||||
style="color: #ccc"></i> 未设置</ng-template>
|
<ng-template #elsePwd
|
||||||
|
><i nz-icon [nzType]="'question-circle'" [nzTheme]="'fill'" style="color: #ccc"></i> 未设置</ng-template
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nz-list-item-meta-title>
|
</nz-list-item-meta-title>
|
||||||
</nz-list-item-meta>
|
</nz-list-item-meta>
|
||||||
<div class="item-btn"><a (click)="edit('password')">修改</a></div>
|
<div class="item-btn"><a (click)="edit('password')">修改</a></div>
|
||||||
</nz-list-item>
|
</nz-list-item>
|
||||||
<!-- <nz-list-item *ngIf="defaultCompany.enterpriseId"> -->
|
|
||||||
<nz-list-item>
|
|
||||||
<nz-list-item-meta>
|
|
||||||
<nz-list-item-meta-title>
|
|
||||||
<div nz-row [nzGutter]="16">
|
|
||||||
<div nz-col [nzSpan]="4" class="li-label">
|
|
||||||
<!-- <svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" version="1.1"
|
|
||||||
width="19px" height="23px">
|
|
||||||
<g transform="matrix(1 0 0 1 -345 -324 )">
|
|
||||||
<path
|
|
||||||
d="M 15.6123766269722 8.00244105491571 C 15.6119034283768 8.00244105491571 15.6114302297875 8.00244117202714 15.61095703125 8.00244140625 L 15.197197265625 8.00244140625 C 15.1815563889208 8.00244140625 15.168876953125 7.98976197045419 15.168876953125 7.97412109375 L 15.168876953125 5.885498046875 C 15.1737779288544 4.39846216264915 14.595081789561 2.96885593837806 13.55716796875 1.9039453125 C 12.7321123508105 1.05143460529325 11.655620403345 0.485695706108903 10.485546875 0.2896875 C 6.987421875 -0.313818359375 3.801953125 2.4227734375 3.801953125 5.97130859375 L 3.801953125 7.97412109375 C 3.801953125 7.98976197045419 3.78927368920419 8.00244140625 3.7736328125 8.00244140625 L 3.407451171875 8.00244140625 C 1.80531036111513 8.00259780422134 0.50660155486636 9.3014334003565 0.506601562499998 10.90357421875 L 0.506601562499998 19.88734375 C 0.506601562499998 21.489282355869 1.80522937670661 22.7879101700756 3.40716796875 22.7879101700756 L 15.579521484375 22.78791015625 C 17.1817432795434 22.7879101700756 18.48037109375 21.489282355869 18.48037109375 19.8873437638256 L 18.48037109375 10.874970703125 C 18.4803734804811 10.8734601705268 18.4803746738472 10.8719496362745 18.4803746738472 10.8704391017907 C 18.4803746738472 9.28648751795714 17.1963282108058 8.00244105491571 15.6123766269722 8.00244105491571 Z M 5.165859375 7.97412109375 L 5.16416015625 5.885498046875 C 5.16416015625 3.28484375 6.8866015625 1.56580078125 9.484140625 1.56580078125 C 10.7585546875 1.56580078125 11.718046875 1.963984375 12.583798828125 2.85494140625 C 13.430859375 3.72720703125 13.8035546875 4.66234375 13.8035546875 5.88521484375 L 13.8035546875 7.97412109375 C 13.8035546875 7.98976197045419 13.7908752517042 8.00244140625 13.775234375 8.00244140625 L 5.1941796875 8.00244140625 C 5.17853881079581 8.00244140625 5.165859375 7.98976197045419 5.165859375 7.97412109375 Z M 17.1215625 19.9156640625 L 17.1249609375 19.9156640625 C 17.1249609375 20.926982421875 16.622275390625 21.429384765625 15.61095703125 21 L 3.4111328125 21 C 2.55948707595672 21.429384765625 1.869091796875 20.7389894865433 1.869091796875 19.88734375 L 1.869091796875 11.115126953125 C 1.869091796875 10.1483643640389 2.65280772341387 9.3646484375 3.6195703125 9.3646484375 L 15.579521484375 9.3646484375 C 16.4311672209183 9.3646484375 17.1215625 10.0550437165817 17.1215625 10.906689453125 L 17.1215625 19.9156640625 Z "
|
|
||||||
fill-rule="nonzero" fill="#3370ff" stroke="none" transform="matrix(1 0 0 1 345 324 )" />
|
|
||||||
</g>
|
|
||||||
</svg> -->
|
|
||||||
<span class="icon iconfont icon-mima" style="color: #aaa"></span> 支付密码
|
|
||||||
</div>
|
|
||||||
<div nz-col [nzSpan]="10">定期更换支付密码有助于账号安全</div>
|
|
||||||
<div nz-col [nzSpan]="10">
|
|
||||||
<span *ngIf="ifHasPayPw; else elsePwd"><i nz-icon [nzType]="'check-circle'" [nzTheme]="'fill'"
|
|
||||||
style="color: #52c41a"></i> 已设置</span>
|
|
||||||
<ng-template #elsePwd><i nz-icon [nzType]="'question-circle'" [nzTheme]="'fill'"
|
|
||||||
style="color: #ccc"></i> 未设置</ng-template>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</nz-list-item-meta-title>
|
|
||||||
</nz-list-item-meta>
|
|
||||||
<div class="item-btn"><a (click)="edit('payPassword')">设置</a></div>
|
|
||||||
</nz-list-item>
|
|
||||||
</nz-list>
|
</nz-list>
|
||||||
|
|
||||||
</nz-card>
|
</nz-card>
|
||||||
|
|||||||
@ -17,7 +17,7 @@
|
|||||||
right: 20px;
|
right: 20px;
|
||||||
}
|
}
|
||||||
.item-btn {
|
.item-btn {
|
||||||
width: 36px;
|
width: 28px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.li-label {
|
.li-label {
|
||||||
|
|||||||
@ -53,8 +53,6 @@ export class AccountComponentsCenterComponent implements OnInit {
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
idx: any = 0;
|
idx: any = 0;
|
||||||
defaultCompany: any = {};
|
|
||||||
ifHasPayPw = false;
|
|
||||||
constructor(public service: AccountService, private modal: ModalHelper, private http: _HttpClient, private router: Router, private modalService: NzModalService,) {}
|
constructor(public service: AccountService, private modal: ModalHelper, private http: _HttpClient, private router: Router, private modalService: NzModalService,) {}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
@ -138,32 +136,9 @@ export class AccountComponentsCenterComponent implements OnInit {
|
|||||||
getInfo() {
|
getInfo() {
|
||||||
this.service.http.post(this.service.$api_get_current_user_info).subscribe((res) => {
|
this.service.http.post(this.service.$api_get_current_user_info).subscribe((res) => {
|
||||||
this.infoData = res.data;
|
this.infoData = res.data;
|
||||||
// this.getDeafaultCompany();
|
|
||||||
this.getPayPw();
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
getDeafaultCompany() {
|
|
||||||
this.service.request(this.service.$api_getUserDefaultEnterpriseProject).subscribe(res => {
|
|
||||||
if (res === null) {
|
|
||||||
this.router.navigate(['/changeproject']);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.defaultCompany = res
|
|
||||||
if (res.projectId) {
|
|
||||||
this.getPayPw()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
getPayPw() {
|
|
||||||
this.service.request(this.service.$api_isUserVerifyPassword, {}).subscribe(res => {
|
|
||||||
this.ifHasPayPw = res
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
edit(tpye: string) {
|
edit(tpye: string) {
|
||||||
if (tpye === 'phone') {
|
if (tpye === 'phone') {
|
||||||
const modalRef = this.modalService.create({
|
const modalRef = this.modalService.create({
|
||||||
@ -195,10 +170,6 @@ export class AccountComponentsCenterComponent implements OnInit {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
if (tpye === 'payPassword') {
|
|
||||||
this.router.navigate(['/account/edit-paypassword']);
|
|
||||||
}
|
|
||||||
// if (tpye === 'info') {
|
// if (tpye === 'info') {
|
||||||
// this.router.navigate(['/account/editInfo'], {
|
// this.router.navigate(['/account/editInfo'], {
|
||||||
// queryParams: { realName: this.infoData.realName, certificateNumber: this.infoData.certificateNumber },
|
// queryParams: { realName: this.infoData.realName, certificateNumber: this.infoData.certificateNumber },
|
||||||
|
|||||||
@ -227,7 +227,7 @@ export class AccountComponentsEditNameComponent implements OnInit, AfterViewInit
|
|||||||
}
|
}
|
||||||
submitForm() {
|
submitForm() {
|
||||||
const params = {
|
const params = {
|
||||||
smsVerifyCode: this.sf?.value.smsVerifyCode,
|
smsVerifyCode: this.sf.value.smsVerifyCode,
|
||||||
};
|
};
|
||||||
|
|
||||||
this.service.http.post(this.service.$api_get_verifyPhone, params).subscribe((res) => {
|
this.service.http.post(this.service.$api_get_verifyPhone, params).subscribe((res) => {
|
||||||
|
|||||||
@ -9,11 +9,14 @@
|
|||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import { Component, Inject, OnInit } from '@angular/core';
|
import { Component, Inject, OnInit, ViewChild } from '@angular/core';
|
||||||
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
|
import { FormBuilder, FormControl, FormGroup, ValidatorFn, Validators } from '@angular/forms';
|
||||||
import { Router } from '@angular/router';
|
import { ActivatedRoute, Router } from '@angular/router';
|
||||||
|
import { STChange, STColumn, STComponent, STData, STRequestOptions } from '@delon/abc/st';
|
||||||
import { DA_SERVICE_TOKEN, ITokenService } from '@delon/auth';
|
import { DA_SERVICE_TOKEN, ITokenService } from '@delon/auth';
|
||||||
|
|
||||||
|
import { SFComponent, SFSchema, SFSelectWidgetSchema, SFUISchema } from '@delon/form';
|
||||||
|
import { NzDrawerRef, NzDrawerService } from 'ng-zorro-antd/drawer';
|
||||||
import { NzFormTooltipIcon } from 'ng-zorro-antd/form';
|
import { NzFormTooltipIcon } from 'ng-zorro-antd/form';
|
||||||
import { NzModalRef } from 'ng-zorro-antd/modal';
|
import { NzModalRef } from 'ng-zorro-antd/modal';
|
||||||
import { AccountService } from '../../services/account.service';
|
import { AccountService } from '../../services/account.service';
|
||||||
@ -27,13 +30,14 @@ export class AccountComponentsCenterEditComponent implements OnInit {
|
|||||||
record: any;
|
record: any;
|
||||||
count = 0;
|
count = 0;
|
||||||
type = 'create';
|
type = 'create';
|
||||||
isVisibleView = false;
|
isVisibleView = false
|
||||||
passwordVisible = false;
|
passwordVisible = false;
|
||||||
passwordVisible2 = false;
|
passwordVisible2 = false;
|
||||||
password: any;
|
password: any;
|
||||||
password2: any;
|
password2: any;
|
||||||
interval$: any;
|
interval$: any;
|
||||||
confirmationValidator = (control: FormControl): { [s: string]: boolean } => {
|
confirmationValidator =
|
||||||
|
(control: FormControl): { [s: string]: boolean } => {
|
||||||
if (!control.value) {
|
if (!control.value) {
|
||||||
return { required: true };
|
return { required: true };
|
||||||
} else if (control?.value !== this.validateForm?.value?.passWord) {
|
} else if (control?.value !== this.validateForm?.value?.passWord) {
|
||||||
@ -47,6 +51,7 @@ export class AccountComponentsCenterEditComponent implements OnInit {
|
|||||||
};
|
};
|
||||||
constructor(
|
constructor(
|
||||||
public router: Router,
|
public router: Router,
|
||||||
|
public ar: ActivatedRoute,
|
||||||
private modalRef: NzModalRef,
|
private modalRef: NzModalRef,
|
||||||
private fb: FormBuilder,
|
private fb: FormBuilder,
|
||||||
public service: AccountService,
|
public service: AccountService,
|
||||||
@ -56,21 +61,19 @@ export class AccountComponentsCenterEditComponent implements OnInit {
|
|||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.initForm();
|
this.initForm();
|
||||||
}
|
}
|
||||||
initForm() {
|
initForm () {
|
||||||
this.validateForm = this.fb.group({
|
this.validateForm = this.fb.group({
|
||||||
passWord: [
|
passWord: [null,
|
||||||
null,
|
|
||||||
[
|
[
|
||||||
Validators.required,
|
Validators.required,
|
||||||
Validators.maxLength(16),
|
Validators.maxLength(16),
|
||||||
Validators.minLength(8),
|
Validators.minLength(8),
|
||||||
Validators.pattern('^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z-_]{8,16}$')
|
Validators.pattern('^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z-_]{8,16}$')
|
||||||
]
|
]],
|
||||||
],
|
passWordTo: [null, [ Validators.required, Validators.maxLength(16), Validators.minLength(8), this.confirmationValidator,]],
|
||||||
passWordTo: [null, [Validators.required, Validators.maxLength(16), Validators.minLength(8), this.confirmationValidator]],
|
smsVerifyCode: [null, [Validators.required]],
|
||||||
smsVerifyCode: [null, [Validators.required]]
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
destroyModal(): void {
|
destroyModal(): void {
|
||||||
this.modalRef.destroy();
|
this.modalRef.destroy();
|
||||||
}
|
}
|
||||||
@ -81,28 +84,28 @@ export class AccountComponentsCenterEditComponent implements OnInit {
|
|||||||
this.service.msgSrv.success('发送成功');
|
this.service.msgSrv.success('发送成功');
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
this.codeCountDown();
|
this.codeCountDown();
|
||||||
} else {
|
}else {
|
||||||
this.service.msgSrv.success(res.msg);
|
this.service.msgSrv.success(res.msg);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
save() {
|
save() {
|
||||||
if (!this.validateForm.valid) {
|
if(!this.validateForm.valid) {
|
||||||
this.service.msgSrv.warning('必填项为空或格式错误,请检查!');
|
this.service.msgSrv.warning('必填项为空或格式错误,请检查!')
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const params = {
|
const params = {
|
||||||
...this.validateForm.value
|
...this.validateForm.value
|
||||||
};
|
};
|
||||||
this.service.request(this.service.$api_set_phoneUpdatePassword, params).subscribe(res => {
|
this.service.request(this.service.$api_set_phoneUpdatePassword, params).subscribe((res) => {
|
||||||
if (res) {
|
if (res) {
|
||||||
this.service.msgSrv.success('修改密码成功!');
|
this.service.msgSrv.success('修改密码成功!');
|
||||||
this.isVisibleView = true;
|
this.isVisibleView = true;
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.tokenService.clear();
|
this.tokenService.clear();
|
||||||
this.router.navigate(['/passport/login']);
|
this.router.navigate(['/passport/login'])
|
||||||
this.modalRef.close();
|
this.modalRef.close()
|
||||||
}, 3000);
|
}, 3000)
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -117,11 +120,11 @@ export class AccountComponentsCenterEditComponent implements OnInit {
|
|||||||
}, 1000);
|
}, 1000);
|
||||||
}
|
}
|
||||||
handleCancel() {
|
handleCancel() {
|
||||||
this.isVisibleView = false;
|
this.isVisibleView = false
|
||||||
}
|
}
|
||||||
handleOK() {
|
handleOK() {
|
||||||
this.modalRef.close();
|
this.modalRef.close()
|
||||||
this.tokenService.clear();
|
this.tokenService.clear();
|
||||||
this.router.navigate(['/passport/login']);
|
this.router.navigate(['/passport/login'])
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,171 +0,0 @@
|
|||||||
<page-header-wrapper [title]="''" [logo]="logo">
|
|
||||||
<ng-template #logo>
|
|
||||||
<button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()">
|
|
||||||
<i nz-icon nzType="left" nzTheme="outline"></i>
|
|
||||||
</button>
|
|
||||||
</ng-template>
|
|
||||||
</page-header-wrapper>
|
|
||||||
<nz-card>
|
|
||||||
<div class="container">
|
|
||||||
<div>
|
|
||||||
<div style="display: flex; align-items: center; min-height: 150px">
|
|
||||||
<nz-steps [nzCurrent]="step" style="display: contents" [nzProgressDot]="progressTemplate">
|
|
||||||
<nz-step nzTitle="安全验证"></nz-step>
|
|
||||||
<nz-step nzTitle="重设密码"></nz-step>
|
|
||||||
<nz-step nzTitle="完成"></nz-step>
|
|
||||||
</nz-steps>
|
|
||||||
<ng-template #progressTemplate let-dot let-status="status" let-index="index">
|
|
||||||
<ng-container *ngIf="status === 'finish'; else finshTemplate">
|
|
||||||
<i nz-icon nzType="check" nzTheme="outline" style="color: #fff"></i>
|
|
||||||
</ng-container>
|
|
||||||
<ng-template #finshTemplate>
|
|
||||||
{{ index + 1 }}
|
|
||||||
</ng-template>
|
|
||||||
</ng-template>
|
|
||||||
</div>
|
|
||||||
<nz-card [nzBordered]="false">
|
|
||||||
<div style="width: 480px; margin: 0 auto" [ngSwitch]="step.toString()">
|
|
||||||
<div *ngSwitchCase="0">
|
|
||||||
<sf #step1sf *ngIf="step1Schema" [schema]="step1Schema" button="none" [layout]="'horizontal'">
|
|
||||||
<ng-template sf-template="smsVerifyCode" let-smsVerifyCode let-ui="ui" let-schema="schema">
|
|
||||||
<nz-input-group [nzSuffix]="suffixTemplateInfo">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
maxlength="6"
|
|
||||||
nz-input
|
|
||||||
placeholder="请输入验证码"
|
|
||||||
[ngModel]="smsVerifyCode.formProperty.value"
|
|
||||||
(ngModelChange)="smsVerifyCode.setValue($event)"
|
|
||||||
/>
|
|
||||||
</nz-input-group>
|
|
||||||
</ng-template>
|
|
||||||
<div nz-col [nzPush]="5">
|
|
||||||
<button
|
|
||||||
nz-button
|
|
||||||
type="submit"
|
|
||||||
nzType="primary"
|
|
||||||
(click)="nextStep()"
|
|
||||||
[disabled]="!step1sf.valid"
|
|
||||||
[nzLoading]="service.http.loading"
|
|
||||||
>
|
|
||||||
下一步
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</sf>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div *ngSwitchCase="1">
|
|
||||||
<form nz-form [formGroup]="formGroup3" class="myForm">
|
|
||||||
<nz-form-item>
|
|
||||||
<nz-form-label nzSpan="6" nzRequired nzFor="passWord">设置支付密码</nz-form-label>
|
|
||||||
<nz-form-control nzSpan="18" [nzErrorTip]="passwordErrorTpl">
|
|
||||||
<nz-input-group [nzSuffix]="pwdIconEye">
|
|
||||||
<input
|
|
||||||
nz-input
|
|
||||||
[type]="isShowPwd ? 'text' : 'password'"
|
|
||||||
formControlName="passWord"
|
|
||||||
minlength="6"
|
|
||||||
maxlength="6"
|
|
||||||
(ngModelChange)="validateConfirmPassword()"
|
|
||||||
placeholder="请输入支付密码"
|
|
||||||
/>
|
|
||||||
</nz-input-group>
|
|
||||||
<ng-template #pwdIconEye>
|
|
||||||
<span (click)="isShowPwd = !isShowPwd">
|
|
||||||
<ng-container *ngIf="isShowPwd; else showPwdTempalte">
|
|
||||||
<i nz-icon nzType="eye" nzTheme="outline"></i>
|
|
||||||
</ng-container>
|
|
||||||
<ng-template #showPwdTempalte>
|
|
||||||
<i nz-icon nzType="eye-invisible" nzTheme="outline"></i>
|
|
||||||
</ng-template>
|
|
||||||
</span>
|
|
||||||
</ng-template>
|
|
||||||
<ng-template #passwordErrorTpl let-control>
|
|
||||||
<ng-container *ngIf="control.hasError('required')"> 请输入支付密码! </ng-container>
|
|
||||||
<ng-container *ngIf="control.hasError('minlength') || control.hasError('pattern') || control.hasError('confirm')">
|
|
||||||
6位数字,不能为连续数字或者相同数字(如123456、111111)
|
|
||||||
</ng-container>
|
|
||||||
</ng-template>
|
|
||||||
</nz-form-control>
|
|
||||||
</nz-form-item>
|
|
||||||
<nz-form-item>
|
|
||||||
<nz-form-label nzSpan="6" nzRequired nzFor="passWordTo">重复支付密码</nz-form-label>
|
|
||||||
<nz-form-control nzSpan="18" nzDisableAutoTips [nzErrorTip]="confirmPasswordErrorTpl">
|
|
||||||
<nz-input-group [nzSuffix]="confirmPwdIconEye">
|
|
||||||
<input
|
|
||||||
nz-input
|
|
||||||
[type]="isShowConfirmPwd ? 'text' : 'password'"
|
|
||||||
formControlName="passWordTo"
|
|
||||||
minlength="6"
|
|
||||||
maxlength="6"
|
|
||||||
(ngModelChange)="validateConfirmPassword()"
|
|
||||||
placeholder="请输入支付密码"
|
|
||||||
/>
|
|
||||||
</nz-input-group>
|
|
||||||
<ng-template #confirmPwdIconEye>
|
|
||||||
<span (click)="isShowConfirmPwd = !isShowConfirmPwd">
|
|
||||||
<ng-container *ngIf="isShowConfirmPwd; else showConfirmPwdTempalte">
|
|
||||||
<i nz-icon nzType="eye" nzTheme="outline"></i>
|
|
||||||
</ng-container>
|
|
||||||
<ng-template #showConfirmPwdTempalte>
|
|
||||||
<i nz-icon nzType="eye-invisible" nzTheme="outline"></i>
|
|
||||||
</ng-template>
|
|
||||||
</span>
|
|
||||||
</ng-template>
|
|
||||||
<ng-template #confirmPasswordErrorTpl let-control>
|
|
||||||
<ng-container *ngIf="control.hasError('required')"> 请输入确认密码! </ng-container>
|
|
||||||
<ng-container *ngIf="control.hasError('passWordTo')"> 两次输入的密码不一致! </ng-container>
|
|
||||||
</ng-template>
|
|
||||||
</nz-form-control>
|
|
||||||
</nz-form-item>
|
|
||||||
<nz-form-item>
|
|
||||||
<nz-form-control nzSpan="18" nzOffset="6">
|
|
||||||
<button
|
|
||||||
[disabled]="!formGroup3.valid"
|
|
||||||
[nzLoading]="service.http.loading"
|
|
||||||
nz-button
|
|
||||||
nzType="primary"
|
|
||||||
(click)="formSubmit()"
|
|
||||||
style="width: 74px"
|
|
||||||
>
|
|
||||||
确认
|
|
||||||
</button>
|
|
||||||
</nz-form-control>
|
|
||||||
</nz-form-item>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<div *ngSwitchCase="2" class="success-card">
|
|
||||||
<div class="card-icon">
|
|
||||||
<i nz-icon nzType="check" nzTheme="outline" style="color: #fff; font-size: 20px"></i>
|
|
||||||
</div>
|
|
||||||
<p class="card-title">密码设置成功</p>
|
|
||||||
<p class="card-descr">请牢记您的新支付密码,3秒后自动跳转至个人中心...</p>
|
|
||||||
<!-- <button
|
|
||||||
nz-button
|
|
||||||
type="button"
|
|
||||||
nzType="primary"
|
|
||||||
nzSize="large"
|
|
||||||
class="mt-lg"
|
|
||||||
style="font-size: 14px"
|
|
||||||
[routerLink]="['/passport/login']"
|
|
||||||
>
|
|
||||||
立即登录
|
|
||||||
</button> -->
|
|
||||||
</div>
|
|
||||||
<div *ngSwitchDefault></div>
|
|
||||||
</div>
|
|
||||||
</nz-card>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</nz-card>
|
|
||||||
|
|
||||||
<ng-template #suffixTemplateInfo>
|
|
||||||
<ng-container *ngIf="count < 1; else intervalTemplate">
|
|
||||||
<span class="msg-btn" style="color: #3370ff; cursor: pointer" (click)="getMsgCode()">获取验证码</span>
|
|
||||||
</ng-container>
|
|
||||||
<ng-template #intervalTemplate>
|
|
||||||
<!-- {{ count > 0 ? '请等待' + count + 's' : ('app.register.get-verification-code' | translate) }} -->
|
|
||||||
{{ count > 0 ? '请等待' + count + 's' : ('app.register.get-verification-code') }}
|
|
||||||
</ng-template>
|
|
||||||
</ng-template>
|
|
||||||
<app-captcha #dun [phone]="phone" (done)="captchaDone($event)"></app-captcha>
|
|
||||||
@ -1,93 +0,0 @@
|
|||||||
:host {
|
|
||||||
::ng-deep {
|
|
||||||
page-grid {
|
|
||||||
background-color: #f0f3f7;
|
|
||||||
|
|
||||||
div.container {
|
|
||||||
width: 80%;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 30px 1rem 1rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-steps-item-process .ant-steps-item-icon {
|
|
||||||
background-color: #3370ff;
|
|
||||||
border-color: #3370ff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-icon {
|
|
||||||
background: #3370ff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-steps-dot .ant-steps-item-icon,
|
|
||||||
.ant-steps-dot.ant-steps-small .ant-steps-item-icon {
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
margin-left: 55px;
|
|
||||||
line-height: 32px;
|
|
||||||
border: 1px solid rgba(0, 0, 0, 0.25);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 文本
|
|
||||||
.ant-steps-item-wait .ant-steps-item-icon > .ant-steps-icon {
|
|
||||||
color: #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 连接线
|
|
||||||
.ant-steps-dot .ant-steps-item-tail,
|
|
||||||
.ant-steps-dot.ant-steps-small .ant-steps-item-tail {
|
|
||||||
top: 12px;
|
|
||||||
margin: 0 0 0 90px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-tail::after {
|
|
||||||
background-color: rgba(0, 0, 0, 0.25);
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-steps-dot .ant-steps-item-process .ant-steps-item-icon,
|
|
||||||
.ant-steps-dot.ant-steps-small .ant-steps-item-process .ant-steps-item-icon {
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
line-height: 32px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-tail::after {
|
|
||||||
background-color: rgba(0, 0, 0, 0.25);
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-steps-dot .ant-steps-item-tail::after,
|
|
||||||
.ant-steps-dot.ant-steps-small .ant-steps-item-tail::after {
|
|
||||||
width: calc(100% - 62px);
|
|
||||||
height: 1.5px;
|
|
||||||
margin-left: 12px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.success-card {
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
.card-icon {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
width: 36px;
|
|
||||||
height: 36px;
|
|
||||||
margin: auto;
|
|
||||||
background-color: #52c41a;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-title {
|
|
||||||
margin: 14px 0 0;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 16px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-descr {
|
|
||||||
margin: 8px 0 0;
|
|
||||||
font-size: 14px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
import { AccountComponentsEditPayPasswordComponent } from './edit-paypassword.component';
|
|
||||||
|
|
||||||
describe('AccountComponentsEditPayPasswordComponent', () => {
|
|
||||||
let component: AccountComponentsEditPayPasswordComponent;
|
|
||||||
let fixture: ComponentFixture<AccountComponentsEditPayPasswordComponent>;
|
|
||||||
|
|
||||||
beforeEach(async(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [AccountComponentsEditPayPasswordComponent],
|
|
||||||
}).compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(AccountComponentsEditPayPasswordComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,237 +0,0 @@
|
|||||||
import { AfterViewInit, Component, Inject, OnInit, Optional, ViewChild } from '@angular/core';
|
|
||||||
import { FormBuilder, FormControl, FormGroup, ValidatorFn, Validators } from '@angular/forms';
|
|
||||||
import { ActivatedRoute, Router } from '@angular/router';
|
|
||||||
import { ReuseTabService } from '@delon/abc/reuse-tab';
|
|
||||||
import { DA_SERVICE_TOKEN, ITokenService } from '@delon/auth';
|
|
||||||
import { SFComponent, SFSchema, SFTextareaWidgetSchema, SFTextWidgetSchema, SFUISchema } from '@delon/form';
|
|
||||||
import { SettingsService } from '@delon/theme';
|
|
||||||
import { CaptchaComponent } from 'src/app/shared/components/captcha';
|
|
||||||
|
|
||||||
import { AccountService } from '../../services/account.service';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-account-components-edit-password',
|
|
||||||
templateUrl: './edit-paypassword.component.html',
|
|
||||||
styleUrls: ['./edit-paypassword.component.less'],
|
|
||||||
})
|
|
||||||
export class AccountComponentsEditPayPasswordComponent implements OnInit, AfterViewInit {
|
|
||||||
@ViewChild('dun', { static: false })
|
|
||||||
private dun!: CaptchaComponent;
|
|
||||||
|
|
||||||
step: 0 | 1 | 2 = 0;
|
|
||||||
|
|
||||||
step1Schema!: SFSchema;
|
|
||||||
ui!: SFUISchema;
|
|
||||||
@ViewChild('step1sf', { static: false })
|
|
||||||
step1sf!: SFComponent;
|
|
||||||
|
|
||||||
phone: string;
|
|
||||||
|
|
||||||
formGroup3!: FormGroup;
|
|
||||||
confirmPasswordValidator!: ValidatorFn;
|
|
||||||
|
|
||||||
isShowPwd = false;
|
|
||||||
isShowConfirmPwd = false;
|
|
||||||
|
|
||||||
count = 0;
|
|
||||||
interval$: any;
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private fb: FormBuilder,
|
|
||||||
public service: AccountService,
|
|
||||||
private route: ActivatedRoute,
|
|
||||||
private settingService: SettingsService,
|
|
||||||
private router: Router,
|
|
||||||
@Inject(ReuseTabService)
|
|
||||||
private reuseTabService: ReuseTabService,
|
|
||||||
@Optional()
|
|
||||||
@Inject(DA_SERVICE_TOKEN)
|
|
||||||
private tokenService: ITokenService,
|
|
||||||
) {
|
|
||||||
this.phone = route.snapshot.queryParams.phone;
|
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterViewInit(): void {
|
|
||||||
this.dun.init();
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
if (this.phone) {
|
|
||||||
this.initStep1SF();
|
|
||||||
} else {
|
|
||||||
this.service.http.post(this.service.$api_get_current_user_info).subscribe((res) => {
|
|
||||||
if (res) {
|
|
||||||
this.phone = res.data?.phone;
|
|
||||||
this.initStep1SF();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
this.confirmPasswordValidator = (control) => {
|
|
||||||
if (!control.value) {
|
|
||||||
return { error: true, required: true };
|
|
||||||
} else if (control.value !== this.formGroup3.controls.passWord.value) {
|
|
||||||
return { passWordTo: true, error: true };
|
|
||||||
}
|
|
||||||
return {};
|
|
||||||
};
|
|
||||||
|
|
||||||
this.formGroup3 = this.fb.group({
|
|
||||||
passWord: [
|
|
||||||
null,
|
|
||||||
[
|
|
||||||
Validators.required,
|
|
||||||
Validators.maxLength(6),
|
|
||||||
Validators.minLength(6),
|
|
||||||
Validators.pattern('([\\d]){6,6}'),
|
|
||||||
this.blurTestPw
|
|
||||||
|
|
||||||
],
|
|
||||||
],
|
|
||||||
passWordTo: [null, [this.confirmPasswordValidator, Validators.required, Validators.maxLength(6), Validators.minLength(6)]],
|
|
||||||
voucher: [null, [Validators.required]],
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
initStep1SF() {
|
|
||||||
this.step1Schema = {
|
|
||||||
properties: {
|
|
||||||
phone: {
|
|
||||||
title: '手机号',
|
|
||||||
type: 'string',
|
|
||||||
ui: {
|
|
||||||
widget: 'text',
|
|
||||||
defaultText: this.phone.toString(),
|
|
||||||
} as SFTextWidgetSchema,
|
|
||||||
},
|
|
||||||
smsVerifyCode: {
|
|
||||||
type: 'string',
|
|
||||||
title: '验证码',
|
|
||||||
ui: {
|
|
||||||
widget: 'custom',
|
|
||||||
errors: {
|
|
||||||
required: '请输入验证码',
|
|
||||||
},
|
|
||||||
} as SFTextareaWidgetSchema,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
required: ['smsVerifyCode'],
|
|
||||||
};
|
|
||||||
|
|
||||||
this.ui = {
|
|
||||||
'*': { spanLabelFixed: 90, grid: { span: 16, gutter: 4 } },
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
nextStep() {
|
|
||||||
if (this.step1sf.valid) {
|
|
||||||
this.service.request(this.service.$api_get_verifyPhone, this.step1sf.value).subscribe((res) => {
|
|
||||||
if (res) {
|
|
||||||
this.formGroup3.patchValue(res, { onlySelf: true });
|
|
||||||
this.step = 1;
|
|
||||||
this.count = 0;
|
|
||||||
clearInterval(this.interval$);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
formSubmit() {
|
|
||||||
for (const i in this.formGroup3.controls) {
|
|
||||||
if (true) {
|
|
||||||
this.formGroup3.controls[i].markAsDirty();
|
|
||||||
this.formGroup3.controls[i].updateValueAndValidity();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (this.formGroup3.valid) {
|
|
||||||
const param = Object.assign({}, this.formGroup3.value);
|
|
||||||
this.service.http.post(this.service.$api_voucherUpdatePayPassword, param).subscribe((res) => {
|
|
||||||
if (res.success === true) {
|
|
||||||
this.step++;
|
|
||||||
setTimeout(() => {
|
|
||||||
// this.settingService.setUser({});
|
|
||||||
// // 清空路由复用信息
|
|
||||||
// this.reuseTabService.clear();
|
|
||||||
// // 设置用户Token信息
|
|
||||||
// this.tokenService.clear();
|
|
||||||
this.router.navigate(['/account/center']);
|
|
||||||
}, 3000);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
getMsgCode() {
|
|
||||||
if (this.phone) {
|
|
||||||
this.getCode(`${this.service.$api_get_msg_code}`);
|
|
||||||
} else {
|
|
||||||
this.service.request(this.service.$api_get_current_user_info).subscribe((res) => {
|
|
||||||
this.phone = res.phone;
|
|
||||||
this.getCode(`${this.service.$api_get_msg_code}`);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
goBack() {
|
|
||||||
window.history.go(-1);
|
|
||||||
}
|
|
||||||
getCode(url: string, params?: any) {
|
|
||||||
this.service.http.post(url, null, params).subscribe((res) => {
|
|
||||||
// code==503046 弹出网易盾
|
|
||||||
if (res.success && res.data.code === '1') {
|
|
||||||
this.service.msgSrv.success('发送成功');
|
|
||||||
this.codeCountDown();
|
|
||||||
} else if (res.data.code === '503046') {
|
|
||||||
this.dun.popUp();
|
|
||||||
} else {
|
|
||||||
this.service.msgSrv.success(res.sendResult);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
/* code倒计时 */
|
|
||||||
codeCountDown() {
|
|
||||||
this.count = 59;
|
|
||||||
this.interval$ = setInterval(() => {
|
|
||||||
this.count -= 1;
|
|
||||||
if (this.count <= 0) {
|
|
||||||
clearInterval(this.interval$);
|
|
||||||
}
|
|
||||||
}, 1000);
|
|
||||||
}
|
|
||||||
/* 网易盾验证通过 */
|
|
||||||
captchaDone(validate: any) {
|
|
||||||
this.codeCountDown();
|
|
||||||
}
|
|
||||||
|
|
||||||
validateConfirmPassword(): void {
|
|
||||||
|
|
||||||
setTimeout(() => this.formGroup3.controls.passWordTo.updateValueAndValidity());
|
|
||||||
}
|
|
||||||
// blurTestPw(){
|
|
||||||
// const reg = /[^\d]/g
|
|
||||||
// const val: any = this.formGroup3.controls.passWord.value
|
|
||||||
// if(val.length === 6) {
|
|
||||||
// const pattern = /([\d])\1{2,}/g
|
|
||||||
// const pattern2 = /(?:(?:0(?=1)|1(?=2)|2(?=3)|3(?=4)|4(?=5)|5(?=6)|6(?=7)|7(?=8)|8(?=9)){5}|(?:9(?=8)|8(?=7)|7(?=6)|6(?=5)|5(?=4)|4(?=3)|3(?=2)|2(?=1)|1(?=0)){5})\d/g
|
|
||||||
// if(pattern.test(val) || pattern2.test(val)){
|
|
||||||
// return false
|
|
||||||
// } else {
|
|
||||||
// return true
|
|
||||||
// }
|
|
||||||
// } else {
|
|
||||||
// return false
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
blurTestPw = (control: FormControl): { [s: string]: boolean } => {
|
|
||||||
if (!control.value) {
|
|
||||||
return { required: true };
|
|
||||||
} else if (control.value.length === 6) {
|
|
||||||
const pattern = /([\d])\1{2,}/g
|
|
||||||
const pattern2 = /(?:(?:0(?=1)|1(?=2)|2(?=3)|3(?=4)|4(?=5)|5(?=6)|6(?=7)|7(?=8)|8(?=9)){5}|(?:9(?=8)|8(?=7)|7(?=6)|6(?=5)|5(?=4)|4(?=3)|3(?=2)|2(?=1)|1(?=0)){5})\d/g
|
|
||||||
if(pattern.test(control.value) || pattern2.test(control.value)){
|
|
||||||
return { confirm: true, error: true };
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return {};
|
|
||||||
};
|
|
||||||
}
|
|
||||||
@ -36,15 +36,6 @@ export class AccountService extends BaseService {
|
|||||||
$api_set_voucherUpdatePhone = `/api/mdc/cuc/userBasicInfo/forgetPassword/voucherUpdatePhone`;
|
$api_set_voucherUpdatePhone = `/api/mdc/cuc/userBasicInfo/forgetPassword/voucherUpdatePhone`;
|
||||||
// 凭证修改密码
|
// 凭证修改密码
|
||||||
$api_set_phoneUpdatePassword = `/api/mdc/cuc/userBasicInfo/phoneUpdatePassword`;
|
$api_set_phoneUpdatePassword = `/api/mdc/cuc/userBasicInfo/phoneUpdatePassword`;
|
||||||
// 凭证修改设置身份密码
|
|
||||||
$api_voucherUpdatePayPassword = '/api/mdc/cuc/userVerify/forgetPassword/voucherUpdatePassword';
|
|
||||||
// 根据当前登录用户绑定的手机号码获取短信验证码
|
|
||||||
public $api_get_msg_code = `/api/mdc/pbc/smsSend/getSmVerificationCodeByToken`;
|
|
||||||
// 用户下默认企业项目
|
|
||||||
$api_getUserDefaultEnterpriseProject = '/api/mdc/cuc/enterpriseProject/getUserDefaultEnterpriseProject';
|
|
||||||
// 当前登录用户是否设置用户验证密码
|
|
||||||
$api_isUserVerifyPassword = '/api/mdc/cuc/userVerify/isUserVerifyPassword';
|
|
||||||
|
|
||||||
constructor(public injector: Injector) {
|
constructor(public injector: Injector) {
|
||||||
super(injector);
|
super(injector);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,43 +1,14 @@
|
|||||||
import { AfterViewInit, Component, OnDestroy, OnInit } from '@angular/core';
|
import { AfterViewInit, Component, OnInit } from '@angular/core';
|
||||||
import { OnReuseDestroy, OnReuseInit, ReuseHookOnReuseInitType } from '@delon/abc/reuse-tab';
|
import { fromEvent } from 'rxjs';
|
||||||
import { SFComponent, SFSchema } from '@delon/form';
|
|
||||||
import { SearchDrawerService } from '@shared';
|
|
||||||
import { fromEvent, Subscription } from 'rxjs';
|
|
||||||
import { debounceTime } from 'rxjs/operators';
|
import { debounceTime } from 'rxjs/operators';
|
||||||
|
|
||||||
/**
|
|
||||||
* 列表基础组件
|
|
||||||
* 功能:
|
|
||||||
* 1、计算列表滚动高度(scrollY)
|
|
||||||
* 实现:
|
|
||||||
* 1、列表组件需继承BasicTableComponent,并且提供SearchDrawerService派生类
|
|
||||||
* 2、引入commom-table.less 样式文件
|
|
||||||
* 3、列表使用table-box class包裹。组件会自动减去layout-pro-header、page-header-wrapper和nz-tabs-nav标签的高度,以及header_box和height_box class的高度,最后减去deviationHeight的偏移高度
|
|
||||||
* 2、提供筛选抽屉,并返回sf实例(sf)
|
|
||||||
* 实现:
|
|
||||||
* 1、列表组件需继承BasicTableComponent,并且提供SearchDrawerService派生类
|
|
||||||
* 2、实例化schema,及给schema赋值sf配置
|
|
||||||
* 3、重写search()方法。当筛选抽屉触发查询时会调用这个方法
|
|
||||||
* 提供:
|
|
||||||
* 1、抽屉的sf实例
|
|
||||||
* 2、sf.value的数据=>sfValue
|
|
||||||
*/
|
|
||||||
@Component({
|
@Component({
|
||||||
template: ''
|
template: ''
|
||||||
})
|
})
|
||||||
export class BasicTableComponent implements AfterViewInit, OnDestroy, OnReuseDestroy, OnReuseInit {
|
export class BasicTableComponent implements AfterViewInit {
|
||||||
scrollY = '400px';
|
scrollY = '400px';
|
||||||
|
|
||||||
sf!: SFComponent;
|
constructor() {}
|
||||||
sfValue: Record<string, any> = {};
|
|
||||||
schema: SFSchema = {};
|
|
||||||
|
|
||||||
deviationHeight = 0;
|
|
||||||
|
|
||||||
constructor(public searchDrawerService: SearchDrawerService) {}
|
|
||||||
_onReuseInit(type?: ReuseHookOnReuseInitType): void {
|
|
||||||
this.search();
|
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterViewInit(): void {
|
ngAfterViewInit(): void {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
@ -50,82 +21,20 @@ export class BasicTableComponent implements AfterViewInit, OnDestroy, OnReuseDes
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
_onReuseDestroy(): void {
|
|
||||||
// this.drawer.forEach(sub => sub.unsubscribe());
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnDestroy(): void {
|
|
||||||
this.searchDrawerService.unsubscribe();
|
|
||||||
}
|
|
||||||
|
|
||||||
openDrawer() {
|
|
||||||
if (this.searchDrawerService.drawer?.length > 0) {
|
|
||||||
this.searchDrawerService.create(this.sfValue, this.schema);
|
|
||||||
} else {
|
|
||||||
const drawer = this.searchDrawerService.create(this.sfValue, this.schema);
|
|
||||||
this.searchDrawerService.drawer.push(
|
|
||||||
drawer.initEvent.subscribe((sf: SFComponent) => {
|
|
||||||
if (sf) {
|
|
||||||
this.sf = sf;
|
|
||||||
}
|
|
||||||
})
|
|
||||||
);
|
|
||||||
this.searchDrawerService.drawer.push(
|
|
||||||
drawer.closeEvent.subscribe((res: Record<string, any>) => {
|
|
||||||
this.sfValue = res;
|
|
||||||
if (res) {
|
|
||||||
this.search();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
getScrollY() {
|
getScrollY() {
|
||||||
const windowHeight = window.innerHeight || Math.max(document.documentElement.clientHeight, document.body.clientHeight);
|
const windowHeight = window.innerHeight || Math.max(document.documentElement.clientHeight, document.body.clientHeight);
|
||||||
const header = document.getElementsByTagName('layout-pro-header')?.[0];
|
const header = document.getElementsByTagName('layout-pro-header')?.[0];
|
||||||
if (windowHeight && header) {
|
if (windowHeight && header) {
|
||||||
let scrollY = windowHeight - header.clientHeight - 35 - 49;
|
let scrollY = windowHeight - header.clientHeight - 35 - 49;
|
||||||
// 剔除页头高度
|
|
||||||
const headerWrapper = document.getElementsByTagName('page-header-wrapper')?.[0];
|
const headerWrapper = document.getElementsByTagName('page-header-wrapper')?.[0];
|
||||||
if (headerWrapper) {
|
if (headerWrapper) {
|
||||||
scrollY -= headerWrapper.clientHeight;
|
scrollY -= headerWrapper.clientHeight;
|
||||||
}
|
}
|
||||||
// 计算所有tabs高度
|
const tabset = document.getElementsByTagName('nz-tabset')?.[0];
|
||||||
const tabset = document.getElementsByTagName('nz-tabs-nav');
|
|
||||||
let tabsetHeight = 0;
|
|
||||||
for (let index = 0; index < tabset.length; index++) {
|
|
||||||
tabsetHeight += tabset[index].clientHeight;
|
|
||||||
}
|
|
||||||
if (tabset) {
|
if (tabset) {
|
||||||
scrollY -= tabsetHeight;
|
scrollY -= tabset.clientHeight;
|
||||||
}
|
|
||||||
// 剔除高度容器
|
|
||||||
const headerBox = document.getElementsByClassName('header_box');
|
|
||||||
let headerBoxHeight = 0;
|
|
||||||
for (let index = 0; index < headerBox.length; index++) {
|
|
||||||
headerBoxHeight += headerBox[index].clientHeight;
|
|
||||||
}
|
|
||||||
if (headerBox) {
|
|
||||||
scrollY -= headerBoxHeight;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 剔除高度容器
|
|
||||||
const heightBox = document.getElementsByClassName('height_box');
|
|
||||||
let heightBoxHeight = 0;
|
|
||||||
for (let index = 0; index < heightBox.length; index++) {
|
|
||||||
heightBoxHeight += heightBox[index].clientHeight;
|
|
||||||
}
|
|
||||||
if (heightBox) {
|
|
||||||
scrollY -= heightBoxHeight;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (typeof this.deviationHeight === 'number') {
|
|
||||||
scrollY -= this.deviationHeight;
|
|
||||||
}
|
}
|
||||||
this.scrollY = scrollY + 'px';
|
this.scrollY = scrollY + 'px';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
search() {}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1 +0,0 @@
|
|||||||
export * from './components/basic-table/basic-table.component';
|
|
||||||
@ -9,7 +9,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ant-tabs-tab {
|
.ant-tabs-tab {
|
||||||
margin : 0 0 0 16px;
|
margin: 0 0 0 16px;
|
||||||
padding: 12px 0;
|
padding: 12px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -21,77 +21,31 @@
|
|||||||
.ant-card-body {
|
.ant-card-body {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tab_header {
|
|
||||||
display : flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.page_title {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size : 17px;
|
|
||||||
|
|
||||||
.driver {
|
|
||||||
color : #ff4d4f;
|
|
||||||
margin-left : 17px;
|
|
||||||
margin-right: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
nz-tabset {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.double_tabset_box {
|
|
||||||
margin : -24px -24px 0;
|
|
||||||
background: #ffffff;
|
|
||||||
|
|
||||||
.tab_header {
|
|
||||||
.page_title {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size : 17px;
|
|
||||||
|
|
||||||
.driver {
|
|
||||||
color : #ff4d4f;
|
|
||||||
margin-left : 17px;
|
|
||||||
margin-right: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.header_tab {
|
|
||||||
|
|
||||||
nz-tabs-nav {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-table-pagination.ant-pagination {
|
.ant-table-pagination.ant-pagination {
|
||||||
margin: 8px;
|
margin: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-table-thead>tr>th,
|
.ant-table-thead > tr > th,
|
||||||
.ant-table-tbody>tr>td,
|
.ant-table-tbody > tr > td,
|
||||||
.ant-table tfoot>tr>th,
|
.ant-table tfoot > tr > th,
|
||||||
.ant-table tfoot>tr>td {
|
.ant-table tfoot > tr > td {
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-table.ant-table-bordered>.ant-table-container {
|
.ant-table.ant-table-bordered > .ant-table-container {
|
||||||
border-top: 0;
|
border-top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-pagination-item {
|
.ant-pagination-item {
|
||||||
min-width : 24px;
|
min-width: 24px;
|
||||||
height : 24px;
|
height: 24px;
|
||||||
line-height: 21px;
|
line-height: 21px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-pagination-total-text {
|
.ant-pagination-total-text {
|
||||||
height : 24px;
|
height: 24px;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -99,8 +53,8 @@
|
|||||||
.ant-pagination-next,
|
.ant-pagination-next,
|
||||||
.ant-pagination-jump-prev,
|
.ant-pagination-jump-prev,
|
||||||
.ant-pagination-jump-next {
|
.ant-pagination-jump-next {
|
||||||
min-width : 24px;
|
min-width: 24px;
|
||||||
height : 24px;
|
height: 24px;
|
||||||
line-height: 21px;
|
line-height: 21px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -112,42 +66,5 @@
|
|||||||
.ant-select-single .ant-select-selector .ant-select-selection-placeholder {
|
.ant-select-single .ant-select-selector .ant-select-selection-placeholder {
|
||||||
line-height: 21px;
|
line-height: 21px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-truncate {
|
|
||||||
white-space: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 强制头部居中
|
|
||||||
.ant-table-container table>thead>tr>.options {
|
|
||||||
text-align: center !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.header_box {
|
|
||||||
display : flex;
|
|
||||||
align-items : center;
|
|
||||||
justify-content: space-between;
|
|
||||||
min-height : 47px;
|
|
||||||
|
|
||||||
.page_title {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size : 17px;
|
|
||||||
|
|
||||||
.driver {
|
|
||||||
color : #ff4d4f;
|
|
||||||
margin-left : 17px;
|
|
||||||
margin-right: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.height_box {}
|
|
||||||
|
|
||||||
.filter-box {
|
|
||||||
.com-input {
|
|
||||||
width : 150px;
|
|
||||||
height: 32PX;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -1,17 +0,0 @@
|
|||||||
:host::ng-deep {
|
|
||||||
nz-card {
|
|
||||||
margin: -8px -8px 0 !important
|
|
||||||
}
|
|
||||||
|
|
||||||
.height_box {
|
|
||||||
margin-bottom: 18px !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.total-footer {
|
|
||||||
position : absolute;
|
|
||||||
bottom : 0px;
|
|
||||||
height : 32px;
|
|
||||||
margin : 4px 8px;
|
|
||||||
line-height: 32px;
|
|
||||||
}
|
|
||||||
@ -1,48 +0,0 @@
|
|||||||
:host::ng-deep {
|
|
||||||
.text-truncate {
|
|
||||||
white-space: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.map_st {
|
|
||||||
max-height: 350px;
|
|
||||||
max-width : 360px;
|
|
||||||
position : absolute;
|
|
||||||
top : 20px;
|
|
||||||
right : 49px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.map_radio {
|
|
||||||
position : absolute;
|
|
||||||
top : 20px;
|
|
||||||
left : 20px;
|
|
||||||
background : #F4F4F5;
|
|
||||||
box-shadow : 0px 2px 8px 1px rgb(0 0 0 / 10%);
|
|
||||||
border-radius: 4px 4px 4px 4px;
|
|
||||||
|
|
||||||
.ant-radio-button-wrapper {
|
|
||||||
background: #F4F4F5;
|
|
||||||
border : unset;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-radio-button-wrapper-checked {
|
|
||||||
color : #CF3834;
|
|
||||||
background: #ffffff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)::before {
|
|
||||||
background-color: #d9d9d9;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.detail_title {
|
|
||||||
font-size : 16px;
|
|
||||||
font-weight: 500;
|
|
||||||
color : #252A3D;
|
|
||||||
line-height: 24px;
|
|
||||||
|
|
||||||
span {
|
|
||||||
color : #E60012;
|
|
||||||
font-weight: 700;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -22,8 +22,11 @@ import { ContractManagementService } from '../../services/contract-management.se
|
|||||||
})
|
})
|
||||||
export class ContractManagementDetailComponent implements OnInit {
|
export class ContractManagementDetailComponent implements OnInit {
|
||||||
constructor(
|
constructor(
|
||||||
|
private nzModalService: NzModalService,
|
||||||
public service: ContractManagementService,
|
public service: ContractManagementService,
|
||||||
public route: ActivatedRoute
|
public route: ActivatedRoute,
|
||||||
|
private datePipe: DatePipe,
|
||||||
|
private router: Router
|
||||||
) {}
|
) {}
|
||||||
textStatus = '合同详情';
|
textStatus = '合同详情';
|
||||||
name: any;
|
name: any;
|
||||||
|
|||||||
@ -41,7 +41,7 @@
|
|||||||
nz-button
|
nz-button
|
||||||
nzType="primary"
|
nzType="primary"
|
||||||
[disabled]="!sf.valid"
|
[disabled]="!sf.valid"
|
||||||
[nzLoading]="isLoading && st.loading"
|
[nzLoading]="false"
|
||||||
(click)="st?.load(1)"
|
(click)="st?.load(1)"
|
||||||
acl
|
acl
|
||||||
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
||||||
@ -75,13 +75,12 @@
|
|||||||
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
||||||
[res]="{ reName: { list: 'data.records', total: 'data.total' } }"
|
[res]="{ reName: { list: 'data.records', total: 'data.total' } }"
|
||||||
[page]="{ show: true, showSize: true, pageSizes: [10, 20, 30, 50, 100, 200, 300, 500, 1000] }"
|
[page]="{ show: true, showSize: true, pageSizes: [10, 20, 30, 50, 100, 200, 300, 500, 1000] }"
|
||||||
[loading]="service.http.loading"
|
[loading]="false"
|
||||||
[scroll]="{ x: '1200px', y: '370px' }"
|
[scroll]="{ x: '1200px', y: '370px' }"
|
||||||
(change)="stChange($event)"
|
(change)="stChange($event)"
|
||||||
>
|
>
|
||||||
<ng-template st-row="contractCode" let-item let-index="index">
|
<ng-template st-row="contractCode" let-item let-index="index">
|
||||||
<a *ngIf="item.esignFlowStatus == '2'" (click)="service.openURL(item?.contractFilePath)">{{ item?.contractCode }}</a>
|
<a [routerLink]="'/contract-management/index/detail/' + item.id">{{ item?.contractCode }}</a>
|
||||||
<a *ngIf="item.esignFlowStatus !== '2'" [routerLink]="'/contract-management/index/detail/' + item.id">{{ item?.contractCode }}</a>
|
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</st>
|
</st>
|
||||||
</nz-card>
|
</nz-card>
|
||||||
|
|||||||
@ -26,13 +26,12 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
ui: SFUISchema = {};
|
ui: SFUISchema = {};
|
||||||
_$expand = false;
|
_$expand = false;
|
||||||
selectedRows: any[] = [];
|
selectedRows: any[] = [];
|
||||||
isLoading: boolean = false;
|
|
||||||
constructor(
|
constructor(
|
||||||
public service: ContractManagementService,
|
public service: ContractManagementService,
|
||||||
private nzModalService: NzModalService,
|
private nzModalService: NzModalService,
|
||||||
private router: Router,
|
private router: Router,
|
||||||
public shipperservice: ShipperBaseService,
|
public shipperservice: ShipperBaseService,
|
||||||
private datePipe: DatePipe
|
private datePipe: DatePipe,
|
||||||
) {}
|
) {}
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
@ -44,27 +43,21 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
*/
|
*/
|
||||||
get reqParams() {
|
get reqParams() {
|
||||||
const params = {
|
const params = {
|
||||||
...this.sf?.value
|
...this.sf?.value,
|
||||||
};
|
}
|
||||||
delete params.signTime;
|
delete params.signTime;
|
||||||
delete params._$expand;
|
delete params._$expand;
|
||||||
if (
|
if(this.datePipe.transform(this.sf?.value?.signTime?.[0], 'yyyy-MM-dd HH:mm:ss') && this.datePipe.transform(this.sf?.value?.signTime?.[1], 'yyyy-MM-dd HH:mm:ss')) {
|
||||||
this.datePipe.transform(this.sf?.value?.signTime?.[0], 'yyyy-MM-dd HH:mm:ss') &&
|
|
||||||
this.datePipe.transform(this.sf?.value?.signTime?.[1], 'yyyy-MM-dd HH:mm:ss')
|
|
||||||
) {
|
|
||||||
params.signTime = {
|
params.signTime = {
|
||||||
start: this.datePipe.transform(this.sf?.value?.signTime?.[0], 'yyyy-MM-dd HH:mm:ss'),
|
start: this.datePipe.transform(this.sf?.value?.signTime?.[0], 'yyyy-MM-dd HH:mm:ss'),
|
||||||
end: this.datePipe.transform(this.sf?.value?.signTime?.[1], 'yyyy-MM-dd HH:mm:ss')
|
end: this.datePipe.transform(this.sf?.value?.signTime?.[1], 'yyyy-MM-dd HH:mm:ss'),
|
||||||
};
|
|
||||||
}
|
}
|
||||||
if (
|
}
|
||||||
this.datePipe.transform(this.sf?.value?.effectiveEndTime?.[0], 'yyyy-MM-dd HH:mm:ss') &&
|
if(this.datePipe.transform(this.sf?.value?.effectiveEndTime?.[0], 'yyyy-MM-dd HH:mm:ss') && this.datePipe.transform(this.sf?.value?.effectiveEndTime?.[1], 'yyyy-MM-dd HH:mm:ss')) {
|
||||||
this.datePipe.transform(this.sf?.value?.effectiveEndTime?.[1], 'yyyy-MM-dd HH:mm:ss')
|
|
||||||
) {
|
|
||||||
params.effectiveEndTime = {
|
params.effectiveEndTime = {
|
||||||
start: this.datePipe.transform(this.sf?.value?.effectiveEndTime?.[0], 'yyyy-MM-dd HH:mm:ss'),
|
start: this.datePipe.transform(this.sf?.value?.effectiveEndTime?.[0], 'yyyy-MM-dd HH:mm:ss'),
|
||||||
end: this.datePipe.transform(this.sf?.value?.effectiveEndTime?.[1], 'yyyy-MM-dd HH:mm:ss')
|
end: this.datePipe.transform(this.sf?.value?.effectiveEndTime?.[1], 'yyyy-MM-dd HH:mm:ss'),
|
||||||
};
|
}
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
...params
|
...params
|
||||||
@ -77,7 +70,7 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
this.columns = [
|
this.columns = [
|
||||||
{
|
{
|
||||||
title: '合同编号',
|
title: '合同编号',
|
||||||
width: '130px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
render: 'contractCode'
|
render: 'contractCode'
|
||||||
},
|
},
|
||||||
@ -97,7 +90,7 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
title: '合同名称',
|
title: '合同名称',
|
||||||
width: '100px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'contractName'
|
index: 'templateName'
|
||||||
},
|
},
|
||||||
{ title: '网络货运人', index: 'enterpriseInfoName', width: '120px', className: 'text-center' },
|
{ title: '网络货运人', index: 'enterpriseInfoName', width: '120px', className: 'text-center' },
|
||||||
{ title: '合同对象', index: 'contractObjectName', width: '120px', className: 'text-center' },
|
{ title: '合同对象', index: 'contractObjectName', width: '120px', className: 'text-center' },
|
||||||
@ -128,19 +121,6 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
'5': { text: '已过期', color: 'warning' },
|
'5': { text: '已过期', color: 'warning' },
|
||||||
'7': { text: '已拒签', color: 'warning' }
|
'7': { text: '已拒签', color: 'warning' }
|
||||||
}
|
}
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '操作',
|
|
||||||
className: 'text-center',
|
|
||||||
fixed: 'right',
|
|
||||||
width: '80px',
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: '签署',
|
|
||||||
iif: item => item.esignFlowStatus === '0' || item.esignFlowStatus === '1' || item.esignFlowStatus === '13',
|
|
||||||
click: item => this.service.StartTheProcessToESignById(item.id, () => this.st.load(1))
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
@ -161,11 +141,11 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
enum: [
|
enum: [
|
||||||
{ label: '全部', value: '' },
|
{ label: '全部', value: '' },
|
||||||
{ label: '货主', value: 1 },
|
{ label: '货主', value: 1 },
|
||||||
{ label: '司机', value: 2 }
|
{ label: '司机', value: 2 },
|
||||||
],
|
],
|
||||||
ui: {
|
ui: {
|
||||||
widget: 'select',
|
widget: 'select',
|
||||||
placeholder: '请选择'
|
placeholder: '请选择',
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
contractType: {
|
contractType: {
|
||||||
@ -176,8 +156,8 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
widget: 'dict-select',
|
widget: 'dict-select',
|
||||||
containsAllLable: true,
|
containsAllLable: true,
|
||||||
params: { dictKey: 'contract:type' },
|
params: { dictKey: 'contract:type' },
|
||||||
containAllLable: true
|
containAllLable:true,
|
||||||
} as SFSelectWidgetSchema
|
} as SFSelectWidgetSchema,
|
||||||
},
|
},
|
||||||
enterpriseInfoId: {
|
enterpriseInfoId: {
|
||||||
type: 'string',
|
type: 'string',
|
||||||
@ -197,8 +177,8 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
title: '合同对象',
|
title: '合同对象',
|
||||||
ui: {
|
ui: {
|
||||||
visibleIf: {
|
visibleIf: {
|
||||||
_$expand: (value: boolean) => value
|
_$expand: (value: boolean) => value,
|
||||||
}
|
},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
signTime: {
|
signTime: {
|
||||||
@ -207,8 +187,8 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
ui: {
|
ui: {
|
||||||
widget: 'custom',
|
widget: 'custom',
|
||||||
visibleIf: {
|
visibleIf: {
|
||||||
_$expand: (value: boolean) => value
|
_$expand: (value: boolean) => value,
|
||||||
}
|
},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
effectiveEndTime: {
|
effectiveEndTime: {
|
||||||
@ -217,8 +197,8 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
ui: {
|
ui: {
|
||||||
widget: 'custom',
|
widget: 'custom',
|
||||||
visibleIf: {
|
visibleIf: {
|
||||||
_$expand: (value: boolean) => value
|
_$expand: (value: boolean) => value,
|
||||||
}
|
},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
esignFlowStatus: {
|
esignFlowStatus: {
|
||||||
@ -229,12 +209,12 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
widget: 'dict-select',
|
widget: 'dict-select',
|
||||||
containsAllLable: true,
|
containsAllLable: true,
|
||||||
params: { dictKey: 'esign:flow:status' },
|
params: { dictKey: 'esign:flow:status' },
|
||||||
containAllLable: true,
|
containAllLable:true,
|
||||||
visibleIf: {
|
visibleIf: {
|
||||||
_$expand: (value: boolean) => value
|
_$expand: (value: boolean) => value,
|
||||||
}
|
},
|
||||||
} as SFSelectWidgetSchema
|
} as SFSelectWidgetSchema,
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
type: 'object'
|
type: 'object'
|
||||||
};
|
};
|
||||||
@ -313,7 +293,6 @@ export class ContractManagementFrameComponent implements OnInit {
|
|||||||
resetSF() {
|
resetSF() {
|
||||||
this.sf.reset();
|
this.sf.reset();
|
||||||
this._$expand = false;
|
this._$expand = false;
|
||||||
this.isLoading = true;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
* @Author : Shiming
|
* @Author : Shiming
|
||||||
* @Date : 2021-12-07 15:57:49
|
* @Date : 2021-12-07 15:57:49
|
||||||
* @LastEditors : Shiming
|
* @LastEditors : Shiming
|
||||||
* @LastEditTime : 2022-05-07 17:52:57
|
* @LastEditTime : 2022-02-23 20:11:50
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\contract-management\\components\\contract-list\\contract-list.component.html
|
* @FilePath : \\tms-obc-web\\src\\app\\routes\\contract-management\\components\\contract-list\\contract-list.component.html
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
||||||
-->
|
-->
|
||||||
@ -29,7 +29,7 @@
|
|||||||
</sf>
|
</sf>
|
||||||
</div>
|
</div>
|
||||||
<div nz-col [nzSpan]="_$expand ? 24 : 6" [class.text-right]="_$expand">
|
<div nz-col [nzSpan]="_$expand ? 24 : 6" [class.text-right]="_$expand">
|
||||||
<button nz-button nzType="primary" [disabled]="!sf.valid" [nzLoading]="isLoading && st.loading"
|
<button nz-button nzType="primary" [disabled]="!sf.valid" [nzLoading]="false"
|
||||||
(click)="st?.load(1)" acl [acl-ability]="['CONTRACT-INDEX-searchDetail']">查询</button>
|
(click)="st?.load(1)" acl [acl-ability]="['CONTRACT-INDEX-searchDetail']">查询</button>
|
||||||
<button nz-button (click)="resetSF()">重置</button>
|
<button nz-button (click)="resetSF()">重置</button>
|
||||||
<button nz-button nzType="link" (click)="expandToggle()">
|
<button nz-button nzType="link" (click)="expandToggle()">
|
||||||
@ -48,11 +48,10 @@
|
|||||||
</nz-alert>
|
</nz-alert>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<st #st [data]="service.$api_listDetailed_page" [columns]="columns" [req]="{ params: reqParams }" [loading]="false"
|
<st #st [data]="service.$api_listDetailed_page" [columns]="columns" [req]="{ params: reqParams }"
|
||||||
[scroll]="{ x: '1200px', y: '370px' }" (change)="stChange($event)">
|
[loading]="false" [scroll]="{ x: '1200px', y: '370px' }" (change)="stChange($event)">
|
||||||
<ng-template st-row="contractCode" let-item let-index="index">
|
<ng-template st-row="contractCode" let-item let-index="index">
|
||||||
<a *ngIf="item.esignFlowStatus == '2'" (click)="service.openURL(item?.contractFilePath)">{{ item?.contractCode }}</a>
|
<a [routerLink]="'/contract-management/index/detail/' + item.id">{{ item?.contractCode }}</a>
|
||||||
<a *ngIf="item.esignFlowStatus !== '2'" [routerLink]="'/contract-management/index/detail/' + item.id">{{ item?.contractCode }}</a>
|
|
||||||
</ng-template>
|
</ng-template>
|
||||||
<ng-template st-row="signingObject" let-item let-index="index">
|
<ng-template st-row="signingObject" let-item let-index="index">
|
||||||
<span *ngIf="item.signingObject == 0"></span>
|
<span *ngIf="item.signingObject == 0"></span>
|
||||||
|
|||||||
@ -25,24 +25,20 @@ export class ContractManagementContractListComponent implements OnInit {
|
|||||||
columns: STColumn[] = [];
|
columns: STColumn[] = [];
|
||||||
ui: SFUISchema = {};
|
ui: SFUISchema = {};
|
||||||
_$expand = false;
|
_$expand = false;
|
||||||
isLoading: boolean = false;
|
|
||||||
/**
|
/**
|
||||||
* 查询参数
|
* 查询参数
|
||||||
*/
|
*/
|
||||||
get reqParams() {
|
get reqParams() {
|
||||||
const params = {
|
const params = {
|
||||||
...this.sf?.value
|
...this.sf?.value,
|
||||||
};
|
}
|
||||||
delete params.signTime;
|
delete params.signTime;
|
||||||
delete params._$expand;
|
delete params._$expand;
|
||||||
if (
|
if (this.datePipe.transform(this.sf?.value?.signTime?.[0], 'yyyy-MM-dd HH:mm:ss') && this.datePipe.transform(this.sf?.value?.signTime?.[1], 'yyyy-MM-dd HH:mm:ss')) {
|
||||||
this.datePipe.transform(this.sf?.value?.signTime?.[0], 'yyyy-MM-dd HH:mm:ss') &&
|
|
||||||
this.datePipe.transform(this.sf?.value?.signTime?.[1], 'yyyy-MM-dd HH:mm:ss')
|
|
||||||
) {
|
|
||||||
params.signTime = {
|
params.signTime = {
|
||||||
start: this.datePipe.transform(this.sf?.value?.signTime?.[0], 'yyyy-MM-dd HH:mm:ss'),
|
start: this.datePipe.transform(this.sf?.value?.signTime?.[0], 'yyyy-MM-dd HH:mm:ss'),
|
||||||
end: this.datePipe.transform(this.sf?.value?.signTime?.[1], 'yyyy-MM-dd HH:mm:ss')
|
end: this.datePipe.transform(this.sf?.value?.signTime?.[1], 'yyyy-MM-dd HH:mm:ss'),
|
||||||
};
|
}
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
...params
|
...params
|
||||||
@ -54,12 +50,12 @@ export class ContractManagementContractListComponent implements OnInit {
|
|||||||
private nzModalService: NzModalService,
|
private nzModalService: NzModalService,
|
||||||
public shipperservice: ShipperBaseService,
|
public shipperservice: ShipperBaseService,
|
||||||
private router: Router,
|
private router: Router,
|
||||||
private datePipe: DatePipe
|
private datePipe: DatePipe,
|
||||||
) {}
|
) { }
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
this.initST();
|
this.initST()
|
||||||
this.initSF();
|
this.initSF()
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 初始化数据列表
|
* 初始化数据列表
|
||||||
@ -68,7 +64,7 @@ export class ContractManagementContractListComponent implements OnInit {
|
|||||||
this.columns = [
|
this.columns = [
|
||||||
{
|
{
|
||||||
title: '合同编号',
|
title: '合同编号',
|
||||||
width: '130px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
render: 'contractCode'
|
render: 'contractCode'
|
||||||
},
|
},
|
||||||
@ -76,7 +72,7 @@ export class ContractManagementContractListComponent implements OnInit {
|
|||||||
title: '签约对象',
|
title: '签约对象',
|
||||||
width: '100px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'signingObjectLabel'
|
index: 'documentType'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '合同类型',
|
title: '合同类型',
|
||||||
@ -109,133 +105,72 @@ export class ContractManagementContractListComponent implements OnInit {
|
|||||||
'3': { text: '已撤销', color: 'warning' },
|
'3': { text: '已撤销', color: 'warning' },
|
||||||
'4': { text: '已作废', color: 'warning' },
|
'4': { text: '已作废', color: 'warning' },
|
||||||
'5': { text: '已过期', color: 'warning' },
|
'5': { text: '已过期', color: 'warning' },
|
||||||
'7': { text: '已拒签', color: 'warning' }
|
'7': { text: '已拒签', color: 'warning' },
|
||||||
}
|
|
||||||
},
|
},
|
||||||
{
|
},
|
||||||
title: '操作',
|
|
||||||
className: 'text-center',
|
|
||||||
fixed: 'right',
|
|
||||||
width: '80px',
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: '签署',
|
|
||||||
iif: item => item.esignFlowStatus === '0' || item.esignFlowStatus === '1' || item.esignFlowStatus === '13',
|
|
||||||
click: item => this.service.StartTheProcessToESignById(item.id, () => this.st.load(1))
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 初始化查询表单
|
* 初始化查询表单
|
||||||
*/
|
*/
|
||||||
initSF() {
|
initSF() {
|
||||||
this.schema = {
|
this.schema = {
|
||||||
properties: {
|
properties: {
|
||||||
_$expand: { type: 'boolean', ui: { hidden: true } },
|
_$expand: { type: 'boolean', ui: { hidden: true } },
|
||||||
contractCode: {
|
contractCode: {
|
||||||
type: 'string',
|
type: 'string',
|
||||||
title: '合同编号'
|
title: '合同编号',
|
||||||
},
|
},
|
||||||
businessCode: {
|
businessCode: {
|
||||||
type: 'string',
|
type: 'string',
|
||||||
title: '业务单号'
|
title: '业务单号'
|
||||||
},
|
},
|
||||||
signingObject: {
|
shipperName: {
|
||||||
type: 'string',
|
type: 'string',
|
||||||
title: '签约对象',
|
title: '托运人'
|
||||||
enum: [
|
},
|
||||||
{ label: '全部', value: '' },
|
carrierName: {
|
||||||
{ label: '货主', value: 1 },
|
type: 'string',
|
||||||
{ label: '司机', value: 2 }
|
title: '承运人',
|
||||||
],
|
|
||||||
ui: {
|
ui: {
|
||||||
widget: 'select',
|
visibleIf: {
|
||||||
placeholder: '请选择'
|
_$expand: (value: boolean) => value,
|
||||||
|
},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
contractType: {
|
documentType: {
|
||||||
title: '合同类型',
|
title: '单据类型',
|
||||||
type: 'string',
|
type: 'string',
|
||||||
default: '',
|
default: '',
|
||||||
ui: {
|
ui: {
|
||||||
widget: 'dict-select',
|
widget: 'dict-select',
|
||||||
containsAllLable: true,
|
containsAllLabel: true,
|
||||||
params: { dictKey: 'contract:type' },
|
params: { dictKey: 'contract:document:type' },
|
||||||
|
containAllLable: true,
|
||||||
visibleIf: {
|
visibleIf: {
|
||||||
_$expand: (value: boolean) => value
|
_$expand: (value: boolean) => value,
|
||||||
},
|
},
|
||||||
containAllLable: true
|
} as SFSelectWidgetSchema,
|
||||||
} as SFSelectWidgetSchema
|
|
||||||
},
|
|
||||||
resourceType: {
|
|
||||||
title: '货源类型',
|
|
||||||
type: 'string',
|
|
||||||
default: '',
|
|
||||||
ui: {
|
|
||||||
widget: 'dict-select',
|
|
||||||
params: { dictKey: 'goodresource:type' },
|
|
||||||
containsAllLable: true,
|
|
||||||
visibleIf: {
|
|
||||||
_$expand: (value: boolean) => value
|
|
||||||
}
|
|
||||||
} as SFSelectWidgetSchema
|
|
||||||
},
|
|
||||||
enterpriseInfoId: {
|
|
||||||
type: 'string',
|
|
||||||
title: '网络货运人',
|
|
||||||
ui: {
|
|
||||||
widget: 'select',
|
|
||||||
placeholder: '请选择',
|
|
||||||
allowClear: true,
|
|
||||||
visibleIf: {
|
|
||||||
_$expand: (value: boolean) => value
|
|
||||||
},
|
|
||||||
asyncData: () => this.shipperservice.getNetworkFreightForwarder()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
contractObjectName: {
|
|
||||||
type: 'string',
|
|
||||||
title: '合同对象',
|
|
||||||
ui: {
|
|
||||||
visibleIf: {
|
|
||||||
_$expand: (value: boolean) => value
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
signTime: {
|
signTime: {
|
||||||
title: '签署日期',
|
title: '签署日期',
|
||||||
type: 'string',
|
type: 'string',
|
||||||
ui: {
|
ui: {
|
||||||
widget: 'sl-from-to-search',
|
widget: 'custom',
|
||||||
format: 'yyyy-MM-dd',
|
|
||||||
visibleIf: {
|
visibleIf: {
|
||||||
_$expand: (value: boolean) => value
|
_$expand: (value: boolean) => value,
|
||||||
}
|
|
||||||
} as SFDateWidgetSchema
|
|
||||||
},
|
},
|
||||||
esignFlowStatus: {
|
|
||||||
title: '状态',
|
|
||||||
type: 'string',
|
|
||||||
default: '',
|
|
||||||
ui: {
|
|
||||||
widget: 'dict-select',
|
|
||||||
params: { dictKey: 'esign:flow:status' },
|
|
||||||
containsAllLable: true,
|
|
||||||
visibleIf: {
|
|
||||||
_$expand: (value: boolean) => value
|
|
||||||
}
|
|
||||||
} as SFSelectWidgetSchema
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
type: 'object'
|
},
|
||||||
|
type: 'object',
|
||||||
};
|
};
|
||||||
this.ui = { '*': { spanLabelFixed: 110, grid: { span: 8, gutter: 4 } } };
|
this.ui = { '*': { spanLabelFixed: 110, grid: { span: 8, gutter: 4 } } };
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 查询字段个数
|
* 查询字段个数
|
||||||
*/
|
*/
|
||||||
get queryFieldCount(): number {
|
get queryFieldCount(): number {
|
||||||
return Object.keys(this.schema?.properties || {}).length;
|
return Object.keys(this.schema?.properties || {}).length;
|
||||||
}
|
}
|
||||||
@ -300,7 +235,6 @@ export class ContractManagementContractListComponent implements OnInit {
|
|||||||
resetSF() {
|
resetSF() {
|
||||||
this.sf.reset();
|
this.sf.reset();
|
||||||
this._$expand = false;
|
this._$expand = false;
|
||||||
this.isLoading = true;
|
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 伸缩查询条件
|
* 伸缩查询条件
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
* @Author : Shiming
|
* @Author : Shiming
|
||||||
* @Date : 2022-01-07 13:29:57
|
* @Date : 2022-01-07 13:29:57
|
||||||
* @LastEditors : Shiming
|
* @LastEditors : Shiming
|
||||||
* @LastEditTime : 2022-05-07 17:56:08
|
* @LastEditTime : 2022-02-24 10:08:28
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\contract-management\\components\\contract-partner\\contract-partner.component.html
|
* @FilePath : \\tms-obc-web\\src\\app\\routes\\contract-management\\components\\contract-partner\\contract-partner.component.html
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
||||||
-->
|
-->
|
||||||
@ -41,7 +41,7 @@
|
|||||||
nz-button
|
nz-button
|
||||||
nzType="primary"
|
nzType="primary"
|
||||||
[disabled]="!sf.valid"
|
[disabled]="!sf.valid"
|
||||||
[nzLoading]="service.http.loading"
|
[nzLoading]="false"
|
||||||
(click)="st?.load(1)"
|
(click)="st?.load(1)"
|
||||||
acl
|
acl
|
||||||
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
||||||
@ -80,8 +80,7 @@
|
|||||||
(change)="stChange($event)"
|
(change)="stChange($event)"
|
||||||
>
|
>
|
||||||
<ng-template st-row="contractCode" let-item let-index="index">
|
<ng-template st-row="contractCode" let-item let-index="index">
|
||||||
<a *ngIf="item.esignFlowStatus == '2'" (click)="service.openURL(item?.contractFilePath)">{{ item?.contractCode }}</a>
|
<a [routerLink]="'/contract-management/index/detail/' + item.id">{{ item?.contractCode }}</a>
|
||||||
<a *ngIf="item.esignFlowStatus !== '2'" [routerLink]="'/contract-management/index/detail/' + item.id">{{ item?.contractCode }}</a>
|
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</st>
|
</st>
|
||||||
</nz-card>
|
</nz-card>
|
||||||
|
|||||||
@ -70,7 +70,7 @@ export class ContractManagementPartnerComponent implements OnInit {
|
|||||||
this.columns = [
|
this.columns = [
|
||||||
{
|
{
|
||||||
title: '合同编号',
|
title: '合同编号',
|
||||||
width: '130px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
render: 'contractCode'
|
render: 'contractCode'
|
||||||
},
|
},
|
||||||
@ -78,7 +78,7 @@ export class ContractManagementPartnerComponent implements OnInit {
|
|||||||
title: '签约对象',
|
title: '签约对象',
|
||||||
width: '100px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'signingObjectLabel'
|
index: 'signingObject'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '合同类型',
|
title: '合同类型',
|
||||||
@ -121,19 +121,6 @@ export class ContractManagementPartnerComponent implements OnInit {
|
|||||||
'5': { text: '已过期', color: 'warning' },
|
'5': { text: '已过期', color: 'warning' },
|
||||||
'7': { text: '已拒签', color: 'warning' }
|
'7': { text: '已拒签', color: 'warning' }
|
||||||
}
|
}
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '操作',
|
|
||||||
className: 'text-center',
|
|
||||||
fixed: 'right',
|
|
||||||
width: '80px',
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: '签署',
|
|
||||||
iif: item => item.esignFlowStatus === '0' || item.esignFlowStatus === '1' || item.esignFlowStatus === '13',
|
|
||||||
click: item => this.service.StartTheProcessToESignById(item.id, () => this.st.load(1))
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
* @Author : Shiming
|
* @Author : Shiming
|
||||||
* @Date : 2022-01-05 11:01:55
|
* @Date : 2022-01-05 11:01:55
|
||||||
* @LastEditors : Shiming
|
* @LastEditors : Shiming
|
||||||
* @LastEditTime : 2022-04-15 14:07:19
|
* @LastEditTime : 2022-01-18 17:16:27
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\contract-management\\components\\contract-template-detail\\contract-template-detail.component.html
|
* @FilePath : \\tms-obc-web\\src\\app\\routes\\contract-management\\components\\contract-template-detail\\contract-template-detail.component.html
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
||||||
-->
|
-->
|
||||||
@ -34,6 +34,9 @@
|
|||||||
<nz-card>
|
<nz-card>
|
||||||
<div nz-col nzSpan="20" style="overflow: scroll">
|
<div nz-col nzSpan="20" style="overflow: scroll">
|
||||||
<nz-card class="card-height" *ngIf="!isUpdate">
|
<nz-card class="card-height" *ngIf="!isUpdate">
|
||||||
|
<div class="mb-md">
|
||||||
|
<div>{{detailList?.templateName}}</div>
|
||||||
|
</div>
|
||||||
<div [innerHTML]="detailList?.templateContent | safehtml"></div>
|
<div [innerHTML]="detailList?.templateContent | safehtml"></div>
|
||||||
</nz-card>
|
</nz-card>
|
||||||
|
|
||||||
|
|||||||
@ -5,7 +5,7 @@ import { OnChanges } from '@angular/core';
|
|||||||
* @Author : Shiming
|
* @Author : Shiming
|
||||||
* @Date : 2022-01-05 11:01:55
|
* @Date : 2022-01-05 11:01:55
|
||||||
* @LastEditors : Shiming
|
* @LastEditors : Shiming
|
||||||
* @LastEditTime : 2022-05-07 14:28:16
|
* @LastEditTime : 2022-02-28 20:22:46
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\contract-management\\components\\contract-template-detail\\contract-template-detail.component.ts
|
* @FilePath : \\tms-obc-web\\src\\app\\routes\\contract-management\\components\\contract-template-detail\\contract-template-detail.component.ts
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
||||||
*/
|
*/
|
||||||
@ -87,6 +87,7 @@ export class ContractManagementTemplateTextComponent implements OnInit {
|
|||||||
widget: 'select',
|
widget: 'select',
|
||||||
placeholder: '请选择',
|
placeholder: '请选择',
|
||||||
change: (tag: any, org: any) => {
|
change: (tag: any, org: any) => {
|
||||||
|
console.log(tag);
|
||||||
switch (tag) {
|
switch (tag) {
|
||||||
case 'MX':
|
case 'MX':
|
||||||
this.Types = [
|
this.Types = [
|
||||||
@ -94,8 +95,7 @@ export class ContractManagementTemplateTextComponent implements OnInit {
|
|||||||
{ label: '订单补充协议', value: '2' },
|
{ label: '订单补充协议', value: '2' },
|
||||||
{ label: '运单合同', value: '3' },
|
{ label: '运单合同', value: '3' },
|
||||||
{ label: '运单补充协议', value: '4' },
|
{ label: '运单补充协议', value: '4' },
|
||||||
{ label: '委托代收合同', value: '5' },
|
{ label: '委托代收合同', value: '5' }
|
||||||
{ label: '权力义务转让协议', value: '10' },
|
|
||||||
];
|
];
|
||||||
this.sf.getProperty('/contractType')!.schema.enum = this.Types;
|
this.sf.getProperty('/contractType')!.schema.enum = this.Types;
|
||||||
this.sf.getProperty('/contractType')!.widget.reset(this.Types);
|
this.sf.getProperty('/contractType')!.widget.reset(this.Types);
|
||||||
@ -176,7 +176,7 @@ export class ContractManagementTemplateTextComponent implements OnInit {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
required: ['templateName', 'templateType', 'contractType']
|
required: ['templateName', 'templateType']
|
||||||
};
|
};
|
||||||
this.ui = {
|
this.ui = {
|
||||||
'*': {
|
'*': {
|
||||||
@ -204,70 +204,14 @@ export class ContractManagementTemplateTextComponent implements OnInit {
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
initData(url: string) {
|
initData(url: string) {
|
||||||
|
console.log('编辑');
|
||||||
|
|
||||||
this.service.request(url, { id: this.route.snapshot.params.id }).subscribe(res => {
|
this.service.request(url, { id: this.route.snapshot.params.id }).subscribe(res => {
|
||||||
if (res) {
|
if (res) {
|
||||||
this.detailList = res;
|
this.detailList = res;
|
||||||
this.title = this.detailList?.templateName;
|
this.title = this.detailList?.templateName;
|
||||||
this.sfdata = res;
|
this.sfdata = res;
|
||||||
this.sfdata2 = res;
|
this.sfdata2 = res;
|
||||||
|
|
||||||
switch (res.templateType) {
|
|
||||||
case 'MX':
|
|
||||||
let Types1 = [
|
|
||||||
{ label: '订单合同', value: '1' },
|
|
||||||
{ label: '订单补充协议', value: '2' },
|
|
||||||
{ label: '运单合同', value: '3' },
|
|
||||||
{ label: '运单补充协议', value: '4' },
|
|
||||||
{ label: '委托代收合同', value: '5' },
|
|
||||||
{ label: '权力义务转让协议', value: '10' },
|
|
||||||
];
|
|
||||||
setTimeout(() => {
|
|
||||||
if (this.sf) {
|
|
||||||
this.sf.getProperty('/contractType')!.schema.enum = Types1;
|
|
||||||
this.sf.getProperty('/contractType')!.widget.reset(Types1);
|
|
||||||
if (res.contractType) {
|
|
||||||
this.sf.setValue('/contractType', res.contractType);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
return;
|
|
||||||
break;
|
|
||||||
case 'KJ':
|
|
||||||
const Types2 = [
|
|
||||||
{ label: '网络货物运输服务合同', value: '6' },
|
|
||||||
{ label: '运输服务承揽合同', value: '7' }
|
|
||||||
];
|
|
||||||
setTimeout(() => {
|
|
||||||
if (this.sf) {
|
|
||||||
this.sf.getProperty('/contractType')!.schema.enum = Types2;
|
|
||||||
this.sf.getProperty('/contractType')!.widget.reset(Types2);
|
|
||||||
if (res.contractType) {
|
|
||||||
this.sf.setValue('/contractType', res.contractType);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
return;
|
|
||||||
break;
|
|
||||||
case 'HHR':
|
|
||||||
const Types3 = [
|
|
||||||
{ label: '企业合伙人入驻合同', value: '8' },
|
|
||||||
{ label: '个人合伙人入驻合同', value: '9' }
|
|
||||||
];
|
|
||||||
setTimeout(() => {
|
|
||||||
if (this.sf) {
|
|
||||||
this.sf.getProperty('/contractType')!.schema.enum = Types3;
|
|
||||||
this.sf.getProperty('/contractType')!.widget.reset(Types3);
|
|
||||||
if (res.contractType) {
|
|
||||||
this.sf.setValue('/contractType', res.contractType);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
return;
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -276,26 +220,22 @@ export class ContractManagementTemplateTextComponent implements OnInit {
|
|||||||
}
|
}
|
||||||
|
|
||||||
save() {
|
save() {
|
||||||
if (
|
// if (!this.sf.value.templateName || !this.sf.value.templateType || !this.sf2.value.templateContent || !this.title) {
|
||||||
!this.sf?.value.templateName ||
|
// this.service.msgSrv.error('必填参数为空,请检查再重新保存!');
|
||||||
!this.sf?.value.templateType ||
|
// return;
|
||||||
!this.sf2.value.templateContent ||
|
// }
|
||||||
!(this.title || this.detailList.templateName)
|
// if (this.sf.value.templateType == 'MX') {
|
||||||
) {
|
// if (this.sf.value.contractType == '') {
|
||||||
this.service.msgSrv.error('必填参数为空,请检查再重新保存!');
|
// this.service.msgSrv.error('必填参数为空,请检查再重新保存!');
|
||||||
return;
|
// return;
|
||||||
}
|
// }
|
||||||
if (this.sf?.value.templateType == 'MX') {
|
// }
|
||||||
if (this.sf?.value.contractType == '') {
|
|
||||||
this.service.msgSrv.error('必填参数为空,请检查再重新保存!');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
const params = {
|
const params = {
|
||||||
...this.sf?.value,
|
...this.sf.value,
|
||||||
...this.sf2.value,
|
...this.sf2.value,
|
||||||
templateTitle: this.detailList.templateName || this.title
|
templateTitle: this.title || this.detailList.templateName
|
||||||
};
|
};
|
||||||
|
console.log(params);
|
||||||
this.service.request(this.service.$api_save_contractTemplate, params).subscribe((res: any) => {
|
this.service.request(this.service.$api_save_contractTemplate, params).subscribe((res: any) => {
|
||||||
if (res) {
|
if (res) {
|
||||||
this.service.msgSrv.success('保存成功!');
|
this.service.msgSrv.success('保存成功!');
|
||||||
@ -303,5 +243,4 @@ export class ContractManagementTemplateTextComponent implements OnInit {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
EditType() {}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -43,7 +43,7 @@
|
|||||||
nz-button
|
nz-button
|
||||||
nzType="primary"
|
nzType="primary"
|
||||||
[disabled]="!sf.valid"
|
[disabled]="!sf.valid"
|
||||||
[nzLoading]="service.http.loading"
|
[nzLoading]="false"
|
||||||
(click)="st?.load(1)"
|
(click)="st?.load(1)"
|
||||||
acl
|
acl
|
||||||
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
||||||
@ -75,8 +75,7 @@
|
|||||||
[loading]="false"
|
[loading]="false"
|
||||||
>
|
>
|
||||||
<ng-template st-row="templateName" let-item let-index="index">
|
<ng-template st-row="templateName" let-item let-index="index">
|
||||||
<a (click)="service.openURL(item?.contractFilePath)">{{ item.templateName }}</a>
|
<a (click)="view(item)">{{ item.templateName }}</a>
|
||||||
<!-- <a (click)="view(item)">{{ item.templateName }}</a> -->
|
|
||||||
</ng-template>
|
</ng-template>
|
||||||
<ng-template st-row="signingObject" let-item let-index="index">
|
<ng-template st-row="signingObject" let-item let-index="index">
|
||||||
<span *ngIf="item?.signingObject == 1">货主</span>
|
<span *ngIf="item?.signingObject == 1">货主</span>
|
||||||
|
|||||||
@ -125,18 +125,17 @@ export class ContractManagementTemplateFrameComponent implements OnInit {
|
|||||||
{
|
{
|
||||||
title: '合同模板名称',
|
title: '合同模板名称',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
width: '300px',
|
|
||||||
render: 'templateName'
|
render: 'templateName'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '签约对象',
|
title: '签约对象',
|
||||||
width: '100px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'signingObjectLabel'
|
render: 'signingObjectLabel'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '合同类型',
|
title: '合同类型',
|
||||||
width: '200px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'contractTypeLabel'
|
index: 'contractTypeLabel'
|
||||||
},
|
},
|
||||||
@ -146,17 +145,15 @@ export class ContractManagementTemplateFrameComponent implements OnInit {
|
|||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'resourceTypeLabel'
|
index: 'resourceTypeLabel'
|
||||||
},
|
},
|
||||||
{ title: '创建人', index: 'createUserIdLabel', width: '120px', className: 'text-center' },
|
{ title: '创建人', index: 'createUserId', width: '120px', className: 'text-center' },
|
||||||
{
|
{
|
||||||
title: '创建时间',
|
title: '创建时间',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'createTime',
|
index: 'createTime'
|
||||||
width: '200px'
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '操作',
|
title: '操作',
|
||||||
fixed: 'right',
|
fixed: 'right',
|
||||||
width: '110px',
|
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
buttons: [
|
buttons: [
|
||||||
{
|
{
|
||||||
@ -245,7 +242,7 @@ export class ContractManagementTemplateFrameComponent implements OnInit {
|
|||||||
this.service.request(this.service.$api_deletebatch_contractTemplate, [value.id]).subscribe(res => {
|
this.service.request(this.service.$api_deletebatch_contractTemplate, [value.id]).subscribe(res => {
|
||||||
if (res) {
|
if (res) {
|
||||||
this.service.msgSrv.success('删除成功!');
|
this.service.msgSrv.success('删除成功!');
|
||||||
this.st.reload()
|
this.st.reload(1)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
|
|||||||
@ -43,7 +43,7 @@
|
|||||||
nz-button
|
nz-button
|
||||||
nzType="primary"
|
nzType="primary"
|
||||||
[disabled]="!sf.valid"
|
[disabled]="!sf.valid"
|
||||||
[nzLoading]="service.http.loading"
|
[nzLoading]="false"
|
||||||
(click)="st?.load(1)"
|
(click)="st?.load(1)"
|
||||||
acl
|
acl
|
||||||
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
||||||
@ -75,8 +75,7 @@
|
|||||||
[loading]="false"
|
[loading]="false"
|
||||||
>
|
>
|
||||||
<ng-template st-row="templateName" let-item let-index="index">
|
<ng-template st-row="templateName" let-item let-index="index">
|
||||||
<a (click)="service.openURL(item?.contractFilePath)">{{ item.templateName }}</a>
|
<a (click)="view(item)">{{ item.templateName }}</a>
|
||||||
<!-- <a (click)="view(item)">{{ item.templateName }}</a> -->
|
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</st>
|
</st>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -125,7 +125,6 @@ export class ContractManagementTemplatePartnerComponent implements OnInit {
|
|||||||
{
|
{
|
||||||
title: '合同模板名称',
|
title: '合同模板名称',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
width: '300px',
|
|
||||||
render: 'templateName'
|
render: 'templateName'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -136,7 +135,7 @@ export class ContractManagementTemplatePartnerComponent implements OnInit {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '合同类型',
|
title: '合同类型',
|
||||||
width: '200px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'contractTypeLabel'
|
index: 'contractTypeLabel'
|
||||||
},
|
},
|
||||||
@ -146,17 +145,15 @@ export class ContractManagementTemplatePartnerComponent implements OnInit {
|
|||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'resourceTypeLabel'
|
index: 'resourceTypeLabel'
|
||||||
},
|
},
|
||||||
{ title: '创建人', index: 'createUserIdLabel', width: '120px', className: 'text-center' },
|
{ title: '创建人', index: 'createUserId', width: '120px', className: 'text-center' },
|
||||||
{
|
{
|
||||||
title: '创建时间',
|
title: '创建时间',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'createTime',
|
index: 'createTime'
|
||||||
width: '200px'
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '操作',
|
title: '操作',
|
||||||
fixed: 'right',
|
fixed: 'right',
|
||||||
width: '110px',
|
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
buttons: [
|
buttons: [
|
||||||
{
|
{
|
||||||
@ -245,7 +242,7 @@ export class ContractManagementTemplatePartnerComponent implements OnInit {
|
|||||||
this.service.request(this.service.$api_deletebatch_contractTemplate, [value.id]).subscribe(res => {
|
this.service.request(this.service.$api_deletebatch_contractTemplate, [value.id]).subscribe(res => {
|
||||||
if (res) {
|
if (res) {
|
||||||
this.service.msgSrv.success('删除成功!');
|
this.service.msgSrv.success('删除成功!');
|
||||||
this.st.reload()
|
this.st.reload(1)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
|
|||||||
@ -43,7 +43,7 @@
|
|||||||
nz-button
|
nz-button
|
||||||
nzType="primary"
|
nzType="primary"
|
||||||
[disabled]="!sf.valid"
|
[disabled]="!sf.valid"
|
||||||
[nzLoading]="service.http.loading"
|
[nzLoading]="false"
|
||||||
(click)="st?.load(1)"
|
(click)="st?.load(1)"
|
||||||
acl
|
acl
|
||||||
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
[acl-ability]="['CONTRACT-INDEX-listFrame']"
|
||||||
|
|||||||
@ -125,7 +125,6 @@ export class ContractManagementTemplateDetailComponent implements OnInit {
|
|||||||
{
|
{
|
||||||
title: '合同模板名称',
|
title: '合同模板名称',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
width: '300px',
|
|
||||||
render: 'templateName'
|
render: 'templateName'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -136,7 +135,7 @@ export class ContractManagementTemplateDetailComponent implements OnInit {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '合同类型',
|
title: '合同类型',
|
||||||
width: '200px',
|
width: '100px',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'contractTypeLabel'
|
index: 'contractTypeLabel'
|
||||||
},
|
},
|
||||||
@ -146,17 +145,15 @@ export class ContractManagementTemplateDetailComponent implements OnInit {
|
|||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'resourceTypeLabel'
|
index: 'resourceTypeLabel'
|
||||||
},
|
},
|
||||||
{ title: '创建人', index: 'createUserIdLabel', width: '120px', className: 'text-center' },
|
{ title: '创建人', index: 'createUserId', width: '120px', className: 'text-center' },
|
||||||
{
|
{
|
||||||
title: '创建时间',
|
title: '创建时间',
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
index: 'createTime',
|
index: 'createTime'
|
||||||
width: '200px'
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '操作',
|
title: '操作',
|
||||||
fixed: 'right',
|
fixed: 'right',
|
||||||
width: '110px',
|
|
||||||
className: 'text-center',
|
className: 'text-center',
|
||||||
buttons: [
|
buttons: [
|
||||||
{
|
{
|
||||||
@ -245,7 +242,7 @@ export class ContractManagementTemplateDetailComponent implements OnInit {
|
|||||||
this.service.request(this.service.$api_deletebatch_contractTemplate, [value.id]).subscribe(res => {
|
this.service.request(this.service.$api_deletebatch_contractTemplate, [value.id]).subscribe(res => {
|
||||||
if (res) {
|
if (res) {
|
||||||
this.service.msgSrv.success('删除成功!');
|
this.service.msgSrv.success('删除成功!');
|
||||||
this.st.reload()
|
this.st.reload(1)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
|
|||||||
@ -9,16 +9,15 @@
|
|||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
||||||
-->
|
-->
|
||||||
|
|
||||||
|
|
||||||
<page-header-wrapper title="合同管理" [tab]="tpTab">
|
<page-header-wrapper title="合同管理" [tab]="tpTab">
|
||||||
</page-header-wrapper>
|
</page-header-wrapper>
|
||||||
<ng-template #tpTab>
|
<ng-template #tpTab>
|
||||||
<nz-tabset [(nzSelectedIndex)]="selectedIndex">
|
<nz-tabset [(nzSelectedIndex)]="selectedIndex">
|
||||||
<nz-tab nzTitle="明细合同" *ngIf="isShowDetail">
|
<nz-tab nzTitle="明细合同">
|
||||||
<app-contract-management-contract-list></app-contract-management-contract-list>
|
<app-contract-management-contract-list></app-contract-management-contract-list>
|
||||||
</nz-tab>
|
</nz-tab>
|
||||||
<nz-tab nzTitle="框架合同"*ngIf="isShowFrame">
|
<nz-tab nzTitle="框架合同">
|
||||||
<app-contract-management-contract-frame ></app-contract-management-contract-frame>
|
<app-contract-management-contract-frame></app-contract-management-contract-frame>
|
||||||
</nz-tab>
|
</nz-tab>
|
||||||
<nz-tab nzTitle="合伙人合同">
|
<nz-tab nzTitle="合伙人合同">
|
||||||
<app-contract-management-contract-partner></app-contract-management-contract-partner>
|
<app-contract-management-contract-partner></app-contract-management-contract-partner>
|
||||||
|
|||||||
@ -10,24 +10,18 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
import { ACLService } from '@delon/acl';
|
|
||||||
import { ModalHelper, _HttpClient } from '@delon/theme';
|
import { ModalHelper, _HttpClient } from '@delon/theme';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-supply-management-index',
|
selector: 'app-supply-management-index',
|
||||||
templateUrl: './index.component.html'
|
templateUrl: './index.component.html',
|
||||||
})
|
})
|
||||||
export class ContractManagementIndexComponent implements OnInit {
|
export class ContractManagementIndexComponent implements OnInit {
|
||||||
selectedIndex = 0;
|
selectedIndex = 0;
|
||||||
isShowDetail = false;
|
|
||||||
isShowFrame = false;
|
|
||||||
|
|
||||||
constructor(private http: _HttpClient, private modal: ModalHelper, private acl: ACLService) {
|
constructor(private http: _HttpClient, private modal: ModalHelper) { }
|
||||||
const acls = acl.data.abilities || [];
|
|
||||||
this.isShowDetail =acl.data.full || !!acls.find(acl => acl === 'CONTRACT-INDEX-searchDetail');
|
ngOnInit(): void { }
|
||||||
this.isShowFrame =acl.data.full || !!acls.find(acl => acl === 'CONTRACT-INDEX-listFrame');
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -32,7 +32,7 @@
|
|||||||
<sf #sf [schema]="schema" [ui]="ui" [compact]="true" [button]="'none'"></sf>
|
<sf #sf [schema]="schema" [ui]="ui" [compact]="true" [button]="'none'"></sf>
|
||||||
</div>
|
</div>
|
||||||
<div nz-col [nzSpan]="_$expand ? 24 : 6" [class.text-right]="_$expand">
|
<div nz-col [nzSpan]="_$expand ? 24 : 6" [class.text-right]="_$expand">
|
||||||
<button nz-button nzType="primary" [disabled]="!sf.valid" [nzLoading]="isLoading && st.loading" (click)="st?.load(1)" acl [acl-ability]="['CONTRACT-POLICY-search']">查询</button>
|
<button nz-button nzType="primary" [disabled]="!sf.valid" [nzLoading]="false" (click)="st?.load(1)" acl [acl-ability]="['CONTRACT-POLICY-search']">查询</button>
|
||||||
<button nz-button (click)="resetSF()">重置</button>
|
<button nz-button (click)="resetSF()">重置</button>
|
||||||
<button nz-button nzType="link" (click)="expandToggle()">
|
<button nz-button nzType="link" (click)="expandToggle()">
|
||||||
{{ !_$expand ? '展开' : '收起' }}
|
{{ !_$expand ? '展开' : '收起' }}
|
||||||
|
|||||||
@ -26,7 +26,6 @@ export class ContractManagementPolicyComponent implements OnInit {
|
|||||||
|
|
||||||
selectedRows: any[] = [];
|
selectedRows: any[] = [];
|
||||||
paramValue = '';
|
paramValue = '';
|
||||||
isLoading: boolean = false;
|
|
||||||
constructor(public service: ContractManagementService, private modal: NzModalService, private router: Router) {}
|
constructor(public service: ContractManagementService, private modal: NzModalService, private router: Router) {}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -34,7 +33,7 @@ export class ContractManagementPolicyComponent implements OnInit {
|
|||||||
*/
|
*/
|
||||||
get reqParams() {
|
get reqParams() {
|
||||||
const params: any = {
|
const params: any = {
|
||||||
...(this.sf && this.sf?.value)
|
...(this.sf && this.sf.value)
|
||||||
};
|
};
|
||||||
delete params.expand;
|
delete params.expand;
|
||||||
return params;
|
return params;
|
||||||
@ -186,7 +185,6 @@ export class ContractManagementPolicyComponent implements OnInit {
|
|||||||
resetSF() {
|
resetSF() {
|
||||||
this.sf.reset();
|
this.sf.reset();
|
||||||
this._$expand = false;
|
this._$expand = false;
|
||||||
this.isLoading = true
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@ -19,16 +19,12 @@ import { ContractManagementIndexComponent } from './components/index/index.compo
|
|||||||
import { ContractManagementPolicyComponent } from './components/policy/policy.component';
|
import { ContractManagementPolicyComponent } from './components/policy/policy.component';
|
||||||
import { ContractManagementTemplateComponent } from './components/template/template.component';
|
import { ContractManagementTemplateComponent } from './components/template/template.component';
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
{ path: 'index', component: ContractManagementIndexComponent, data: { guard: { ability: ['CONTRACT-INDEX-searchDetail'] } } },
|
{ path: 'index', component: ContractManagementIndexComponent },
|
||||||
{ path: 'index/detail/:id', component: ContractManagementDetailComponent },
|
{ path: 'index/detail/:id', component: ContractManagementDetailComponent },
|
||||||
{ path: 'template', component: ContractManagementTemplateComponent, data: { guard: { ability: ['CONTRACT-TEMPLATE-search'] } } },
|
{ path: 'template', component: ContractManagementTemplateComponent },
|
||||||
{
|
{ path: 'template/text/:id', component: ContractManagementTemplateTextComponent },
|
||||||
path: 'template/text/:id',
|
{ path: 'policy', component: ContractManagementPolicyComponent },
|
||||||
component: ContractManagementTemplateTextComponent,
|
{ path: 'partner', component: ContractManagementPartnerComponent },
|
||||||
data: { guard: { ability: ['CONTRACT-TEMPLATE-detail'] } }
|
|
||||||
},
|
|
||||||
{ path: 'policy', component: ContractManagementPolicyComponent, data: { guard: { ability: ['CONTRACT-POLICY-search'] } } },
|
|
||||||
{ path: 'partner', component: ContractManagementPartnerComponent }
|
|
||||||
];
|
];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
|
|||||||
@ -35,18 +35,7 @@ export class ContractManagementService extends BaseService {
|
|||||||
$api_listPartner_page = `/api/sdc/contract/listPartner/page`;
|
$api_listPartner_page = `/api/sdc/contract/listPartner/page`;
|
||||||
// 获取订单合同表
|
// 获取订单合同表
|
||||||
$api_contract_get = `/api/sdc/contract/get`;
|
$api_contract_get = `/api/sdc/contract/get`;
|
||||||
|
|
||||||
// 发起E签宝跟据合同ID
|
|
||||||
$api_startTheProcessToESignById = `/api/sdc/contract/startTheProcessToESignById`;
|
|
||||||
constructor(public injector: Injector) {
|
constructor(public injector: Injector) {
|
||||||
super(injector);
|
super(injector);
|
||||||
}
|
}
|
||||||
|
|
||||||
StartTheProcessToESignById(id: string, callback: () => void) {
|
|
||||||
this.request(this.$api_startTheProcessToESignById, { id }).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
callback();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -2,6 +2,7 @@ import { Component } from '@angular/core';
|
|||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-dashboard',
|
selector: 'app-dashboard',
|
||||||
template: ''
|
templateUrl: './dashboard.component.html',
|
||||||
|
styleUrls: ['./dashboard.component.less']
|
||||||
})
|
})
|
||||||
export class DashboardComponent {}
|
export class DashboardComponent {}
|
||||||
|
|||||||
@ -1,68 +0,0 @@
|
|||||||
<!--
|
|
||||||
* @Description :
|
|
||||||
* @Version : 1.0
|
|
||||||
* @Author : Shiming
|
|
||||||
* @Date : 2022-04-21 13:49:21
|
|
||||||
* @LastEditors : Shiming
|
|
||||||
* @LastEditTime : 2022-04-28 20:09:34
|
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\busitable\\busiindex\\busiindex.component.html
|
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
||||||
-->
|
|
||||||
<!-- 页头 -->
|
|
||||||
<page-header-wrapper [title]="'业务报表'"></page-header-wrapper>
|
|
||||||
<nz-card nzTitle="运多星平台业务情况" [nzExtra]="extraTemplate" acl [acl-ability]="['busiindex-tabel']">
|
|
||||||
<ng-template #extraTemplate>
|
|
||||||
<div class="chooseBox">
|
|
||||||
<button nz-button nzType="primary" (click)="exportFun()">导出</button>
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()" >
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
<label nz-radio-button nzValue="date">日</label>
|
|
||||||
<label nz-radio-button nzValue="define">自定义</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" *ngIf="mode !== 'define'" [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-date-picker>
|
|
||||||
<nz-range-picker [(ngModel)]="defineDate" [nzFormat]="dateFormat" *ngIf="mode === 'define'" [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-range-picker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
<st #st multiSort [columns]="columns" [ps]="20" [data]="service.$api_listPerformanceReportPage"
|
|
||||||
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
|
||||||
[scroll]="{ x: '1200px' }" [res]="{ reName: { list: 'data.records', total: 'data.total' } }"
|
|
||||||
[page]="{ show: true, showSize: true, pageSizes: [20, 50, 100] }"></st>
|
|
||||||
</nz-card>
|
|
||||||
<nz-card nzTitle="业绩报表" [nzExtra]="extraTemplate01" acl [acl-ability]="['busiindex-report']">
|
|
||||||
<ng-template #extraTemplate01>
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="modeNext" nzButtonStyle="solid" (ngModelChange)="changeDataNext()" >
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="dateNext" [nzDisabledDate]="disabledDate" [nzMode]="modeNext" (ngModelChange)="onChangeNext($event)"></nz-date-picker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<div nz-row [nzGutter]="64">
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="12">
|
|
||||||
<div class="title">
|
|
||||||
<div class="box" style="background-color: #3ba1ff;"></div> 环比(%)
|
|
||||||
</div>
|
|
||||||
<!-- <g2-custom delay="100" (render)="render($event)"></g2-custom> -->
|
|
||||||
<!-- <app-busitable-curve></app-busitable-curve> -->
|
|
||||||
<app-busitable-curve #curve [chartData]="chartData.chainRatio"></app-busitable-curve>
|
|
||||||
</div>
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="12">
|
|
||||||
<div class="title">
|
|
||||||
<div class="box" style="background-color: #f59a23;"></div> 业绩量(元)
|
|
||||||
</div>
|
|
||||||
<app-busitable-pillar #pillar [chartData]="chartData.performance"></app-busitable-pillar>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</nz-card>
|
|
||||||
@ -1,21 +0,0 @@
|
|||||||
.chooseBox{
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.timeBox{
|
|
||||||
display: flex;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
.dateBox{
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
.title{
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
.box{
|
|
||||||
width: 8px;
|
|
||||||
height: 8px;
|
|
||||||
margin-right: 10px;
|
|
||||||
border-radius: 100px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
import { DatatableBusiindexComponent } from './busiindex.component';
|
|
||||||
|
|
||||||
describe('DatatableBusiindexComponent', () => {
|
|
||||||
let component: DatatableBusiindexComponent;
|
|
||||||
let fixture: ComponentFixture<DatatableBusiindexComponent>;
|
|
||||||
|
|
||||||
beforeEach(waitForAsync(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ DatatableBusiindexComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(DatatableBusiindexComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,148 +0,0 @@
|
|||||||
import { Component, OnInit, ViewChild, NgZone } from '@angular/core';
|
|
||||||
import { STColumn, STComponent } from '@delon/abc/st';
|
|
||||||
import { DatePipe, _HttpClient } from '@delon/theme';
|
|
||||||
import { differenceInCalendarDays } from 'date-fns';
|
|
||||||
import { DataService } from '../../../services/data.service';
|
|
||||||
import { BusitablePillarComponent } from '../pillar/pillar.component';
|
|
||||||
import { BusitableCurveComponent } from './curve/curve.component';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-datatable-busiindex',
|
|
||||||
templateUrl: './busiindex.component.html',
|
|
||||||
styleUrls: ['./busiindex.component.less'],
|
|
||||||
providers: [DatePipe]
|
|
||||||
|
|
||||||
})
|
|
||||||
export class DatatableBusiindexComponent implements OnInit {
|
|
||||||
@ViewChild('st') private readonly st!: STComponent;
|
|
||||||
@ViewChild('curve') private readonly curve!: BusitableCurveComponent;
|
|
||||||
@ViewChild('pillar') private readonly pillar!: BusitablePillarComponent;
|
|
||||||
type = 1;
|
|
||||||
mode = 'year';
|
|
||||||
date: any = null;
|
|
||||||
time: any = ['2022-01-01 00:00:00']
|
|
||||||
defineDate = [];
|
|
||||||
dateNext: any = null;
|
|
||||||
modeNext = 'year';
|
|
||||||
timeNext: any = ['2022-01-01 00:00:00']
|
|
||||||
dateFormat = 'yyyy';
|
|
||||||
today = new Date();
|
|
||||||
chartData: any = {}
|
|
||||||
|
|
||||||
columns: STColumn[] = [
|
|
||||||
{ title: '运营主体', index: 'networkTransporterName', className: 'text-center' },
|
|
||||||
{ title: '合伙人数', index: 'partnerNumber', className: 'text-center' },
|
|
||||||
{ title: '客户数', index: 'enterpriseNumbe', className: 'text-center' },
|
|
||||||
{ title: '订单数', index: 'zsl', className: 'text-center' },
|
|
||||||
{ title: '客户预存款', index: 'czcgje', className: 'text-right', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.czcgje }) } },
|
|
||||||
{ title: '业绩量', index: 'yisje', className: 'text-center' },
|
|
||||||
{ title: '已收附加费', index: 'yisfjf', className: 'text-right', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.yisfjf }) } },
|
|
||||||
{ title: '平均附加费率', index: 'fjfl', className: 'text-center',format: (item)=> {
|
|
||||||
return item.fjfl + '%'
|
|
||||||
} },
|
|
||||||
{ title: '已开票金额', index: 'ykpje', className: 'text-right', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.ykpje }) } },
|
|
||||||
];
|
|
||||||
/**
|
|
||||||
* 查询参数
|
|
||||||
*/
|
|
||||||
get reqParams() {
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.type = 1
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.type = 2
|
|
||||||
} else if(this.mode === 'date') {
|
|
||||||
this.type = 3
|
|
||||||
} else {
|
|
||||||
this.type = 4
|
|
||||||
}
|
|
||||||
let params: any = {
|
|
||||||
time: this.time,
|
|
||||||
type: this.type
|
|
||||||
};
|
|
||||||
|
|
||||||
delete params._$expand;
|
|
||||||
return { ...params };
|
|
||||||
}
|
|
||||||
|
|
||||||
constructor(public service: DataService, private datePipe: DatePipe, private ngZone: NgZone) { }
|
|
||||||
ngOnInit(): void {
|
|
||||||
this.initData()
|
|
||||||
}
|
|
||||||
initData(flag?: boolean){
|
|
||||||
let type = 1
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
type = 1
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
type = 2
|
|
||||||
}
|
|
||||||
if(this.modeNext === 'year') {
|
|
||||||
type = 1
|
|
||||||
} else if(this.modeNext === 'month') {
|
|
||||||
type = 2
|
|
||||||
}
|
|
||||||
const params: any = {
|
|
||||||
time: this.timeNext,
|
|
||||||
type
|
|
||||||
};
|
|
||||||
this.service.request(this.service.$api_performanceReportHistogram, params).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.chartData = res
|
|
||||||
if(flag) {
|
|
||||||
this.pillar.reRender()
|
|
||||||
this.curve.reRender()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
changeData(){
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.dateFormat = 'yyyy'
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM'
|
|
||||||
} else {
|
|
||||||
this.dateFormat = 'yyyy-MM-dd'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
onChange(result: any) {
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy') + '-01-01 00:00:00']
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM') + '-01 00:00:00']
|
|
||||||
} else if(this.mode === 'date') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM-dd') + ' 00:00:00']
|
|
||||||
} else{
|
|
||||||
this.time = [this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd') + ' 00:00:00', this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd') + ' 00:00:00']
|
|
||||||
}
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
|
|
||||||
changeDataNext() {
|
|
||||||
if(this.modeNext === 'year') {
|
|
||||||
this.dateFormat = 'yyyy'
|
|
||||||
} else if(this.modeNext === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
onChangeNext(result: any) {
|
|
||||||
if(result === null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
console.log(this.mode);
|
|
||||||
if(this.modeNext === 'year') {
|
|
||||||
this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy') + '-01-01 00:00:00']
|
|
||||||
} else if(this.modeNext === 'month') {
|
|
||||||
this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy-MM') + '-01 00:00:00']
|
|
||||||
|
|
||||||
console.log(this.dateNext);
|
|
||||||
console.log(this.timeNext);
|
|
||||||
|
|
||||||
}
|
|
||||||
this.initData(true)
|
|
||||||
}
|
|
||||||
disabledDate = (current: Date): boolean =>
|
|
||||||
// Can not select days before today and today
|
|
||||||
differenceInCalendarDays(current, this.today) > 0;
|
|
||||||
exportFun(){
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1 +0,0 @@
|
|||||||
<g2-custom delay="200" (render)="render($event)"></g2-custom>
|
|
||||||
@ -1,72 +0,0 @@
|
|||||||
import { Component, ElementRef, Input, NgZone, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core';
|
|
||||||
import { Chart } from '@antv/g2';
|
|
||||||
import { DataService } from 'src/app/routes/datatable/services/data.service';
|
|
||||||
@Component({
|
|
||||||
selector: 'app-busitable-curve',
|
|
||||||
templateUrl: './curve.component.html',
|
|
||||||
styleUrls: ['./curve.component.less']
|
|
||||||
})
|
|
||||||
export class BusitableCurveComponent implements OnInit, OnChanges {
|
|
||||||
el: any;
|
|
||||||
@Input() chartData: any;
|
|
||||||
chart: any;
|
|
||||||
constructor(private service: DataService, private ngZone: NgZone) {
|
|
||||||
|
|
||||||
}
|
|
||||||
ngOnChanges(changes: SimpleChanges): void {
|
|
||||||
if (this.chartData) {
|
|
||||||
setTimeout(()=>{
|
|
||||||
this.chart.render(true)
|
|
||||||
}, 1000)
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
|
|
||||||
}
|
|
||||||
reRender() {
|
|
||||||
this.chart.data(this.chartData);
|
|
||||||
this.chart.render();
|
|
||||||
}
|
|
||||||
render(el: ElementRef<HTMLDivElement>): void {
|
|
||||||
this.el = el.nativeElement
|
|
||||||
setTimeout(() => {
|
|
||||||
this.ngZone.runOutsideAngular(() => this.init(this.el));
|
|
||||||
}, 500)
|
|
||||||
}
|
|
||||||
|
|
||||||
private init(el: HTMLElement): void {
|
|
||||||
this.chart = new Chart({
|
|
||||||
container: el,
|
|
||||||
autoFit: true,
|
|
||||||
height: 500,
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart.data(this.chartData);
|
|
||||||
this.chart.scale({
|
|
||||||
year: {
|
|
||||||
range: [0, 1],
|
|
||||||
},
|
|
||||||
number: {
|
|
||||||
min: -9999,
|
|
||||||
nice: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const itemTpl = `
|
|
||||||
<div style="padding: 15px; color: red">
|
|
||||||
环比: {value}%
|
|
||||||
</div>
|
|
||||||
`
|
|
||||||
this.chart.tooltip({
|
|
||||||
showCrosshairs: true, // 展示 Tooltip 辅助线
|
|
||||||
shared: true,
|
|
||||||
itemTpl: itemTpl
|
|
||||||
});
|
|
||||||
this.chart.line().position('time*number').label('number');
|
|
||||||
this.chart.point().position('time*number');
|
|
||||||
|
|
||||||
this.chart.render();
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@ -1,42 +0,0 @@
|
|||||||
<!-- 页头 -->
|
|
||||||
<page-header-wrapper [title]="'业务报表'"></page-header-wrapper>
|
|
||||||
<nz-card nzTitle="业务员报表" [nzExtra]="extraTemplate">
|
|
||||||
<ng-template #extraTemplate>
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()">
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
<label nz-radio-button nzValue="date">日</label>
|
|
||||||
<label nz-radio-button nzValue="define">自定义</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" *ngIf="mode !== 'define'" [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-date-picker>
|
|
||||||
<nz-range-picker [(ngModel)]="defineDate" [nzFormat]="dateFormat" *ngIf="mode === 'define'" [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-range-picker>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</ng-template>
|
|
||||||
<st #st multiSort [columns]="columns" [ps]="20" [data]="service.$api_listOperationalReportPage"
|
|
||||||
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
|
||||||
[scroll]="{ x: '1200px' }" [res]="{ reName: { list: 'data.records', total: 'data.total' } }"
|
|
||||||
[page]="{ show: true, showSize: true, pageSizes: [20, 50, 100] }" [loading]="service.http.loading"></st>
|
|
||||||
</nz-card>
|
|
||||||
<nz-card nzTitle="业绩报表" [nzExtra]="extraTemplate01">
|
|
||||||
<ng-template #extraTemplate01>
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="modeNext" nzButtonStyle="solid" (ngModelChange)="changeDataNext()">
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="dateNext" [nzDisabledDate]="disabledDate" [nzMode]="mode" (ngModelChange)="onChangeNext($event)"></nz-date-picker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
<app-busitable-pillar #pillar [chartData]="chartData.performance"></app-busitable-pillar>
|
|
||||||
</nz-card>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
.chooseBox{
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.timeBox{
|
|
||||||
display: flex;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
.dateBox{
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
import { DatatableMantableComponent } from './mantable.component';
|
|
||||||
|
|
||||||
describe('DatatableMantableComponent', () => {
|
|
||||||
let component: DatatableMantableComponent;
|
|
||||||
let fixture: ComponentFixture<DatatableMantableComponent>;
|
|
||||||
|
|
||||||
beforeEach(waitForAsync(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ DatatableMantableComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(DatatableMantableComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,138 +0,0 @@
|
|||||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
|
||||||
import { STColumn, STComponent } from '@delon/abc/st';
|
|
||||||
import { DatePipe, _HttpClient } from '@delon/theme';
|
|
||||||
import { differenceInCalendarDays } from 'date-fns';
|
|
||||||
import { DataService } from '../../../services/data.service';
|
|
||||||
import { BusitablePillarComponent } from '../pillar/pillar.component';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-datatable-mantable',
|
|
||||||
templateUrl: './mantable.component.html',
|
|
||||||
styleUrls: ['./mantable.component.less'],
|
|
||||||
providers: [DatePipe]
|
|
||||||
|
|
||||||
})
|
|
||||||
export class DatatableMantableComponent implements OnInit {
|
|
||||||
@ViewChild('pillar') private readonly pillar!: BusitablePillarComponent;
|
|
||||||
@ViewChild('st') private readonly st!: STComponent;
|
|
||||||
type = 1;
|
|
||||||
mode = 'year';
|
|
||||||
date: any = null;
|
|
||||||
defineDate = [];
|
|
||||||
time: any = ['2022-01-01 00:00:00']
|
|
||||||
dateFormat = 'yyyy';
|
|
||||||
today = new Date();
|
|
||||||
dateNext: any = null;
|
|
||||||
modeNext = 'year';
|
|
||||||
chartData: any = {}
|
|
||||||
timeNext: any = ['2022-01-01 00:00:00']
|
|
||||||
flag = false;
|
|
||||||
|
|
||||||
columns: STColumn[] = [
|
|
||||||
{ title: '部门', index: 'bm', className: 'text-center' },
|
|
||||||
{ title: '业务员', index: 'ywy', className: 'text-center' },
|
|
||||||
{ title: '合伙人数', index: 'hhrs', className: 'text-center' },
|
|
||||||
{ title: '客户数', index: 'khs', className: 'text-center' },
|
|
||||||
{ title: '客户活跃率', index: 'khhyl', className: 'text-center' },
|
|
||||||
{ title: '客户预存款', index: 'kfyck', className: 'text-center', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.kfyck }) } },
|
|
||||||
{ title: '订单数', index: 'dds', className: 'text-center' },
|
|
||||||
{ title: '订单金额', index: 'ddje', className: 'text-center', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.ddje }) } },
|
|
||||||
{ title: '业绩量', index: 'yjl', className: 'text-center' },
|
|
||||||
{ title: '附加费金额', index: 'fjfje', className: 'text-center', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.fjfje }) } },
|
|
||||||
{ title: '平均附加费率', index: 'pjfjl', className: 'text-center' },
|
|
||||||
{ title: '已开票金额', index: 'ykpje', className: 'text-center', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.ykpje }) } },
|
|
||||||
];
|
|
||||||
/**
|
|
||||||
* 查询参数
|
|
||||||
*/
|
|
||||||
get reqParams() {
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.type = 1
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.type = 2
|
|
||||||
} else if(this.mode === 'date') {
|
|
||||||
this.type = 3
|
|
||||||
} else {
|
|
||||||
this.type = 4
|
|
||||||
}
|
|
||||||
let params: any = {
|
|
||||||
time: this.time,
|
|
||||||
type: this.type
|
|
||||||
};
|
|
||||||
|
|
||||||
delete params._$expand;
|
|
||||||
return { ...params };
|
|
||||||
}
|
|
||||||
|
|
||||||
constructor(public service: DataService, private datePipe: DatePipe) { }
|
|
||||||
ngOnInit(): void { }
|
|
||||||
|
|
||||||
initData(){
|
|
||||||
let type = 1
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
type = 1
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
type = 2
|
|
||||||
}
|
|
||||||
const params: any = {
|
|
||||||
time: this.timeNext,
|
|
||||||
type
|
|
||||||
};
|
|
||||||
this.service.request(this.service.$api_performanceReportHistogram, params).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.chartData = res
|
|
||||||
if(this.flag) {
|
|
||||||
this.pillar.reRender()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
changeData(){
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.dateFormat = 'yyyy'
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM'
|
|
||||||
} else {
|
|
||||||
this.dateFormat = 'yyyy-MM-dd'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
onChange(result: any) {
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy') + '-01-01 00:00:00']
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM') + '-01 00:00:00']
|
|
||||||
} else if(this.mode === 'date') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM-dd') + ' 00:00:00']
|
|
||||||
} else{
|
|
||||||
this.time = [this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd') + '00:00:00', this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd') + ' 00:00:00']
|
|
||||||
}
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
|
|
||||||
changeDataNext() {
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.dateFormat = 'yyyy'
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
onChangeNext(result: any) {
|
|
||||||
if(result === null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy') + '-01-01 00:00:00']
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy-MM') + '-01 00:00:00']
|
|
||||||
}
|
|
||||||
this.flag = true
|
|
||||||
this.initData()
|
|
||||||
}
|
|
||||||
disabledDate = (current: Date): boolean =>
|
|
||||||
// Can not select days before today and today
|
|
||||||
differenceInCalendarDays(current, this.today) > 0;
|
|
||||||
exportFun(){
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@ -1 +0,0 @@
|
|||||||
<g2-custom delay="200" (render)="render($event)"></g2-custom>
|
|
||||||
@ -1,72 +0,0 @@
|
|||||||
/*
|
|
||||||
* @Description :
|
|
||||||
* @Version : 1.0
|
|
||||||
* @Author : Shiming
|
|
||||||
* @Date : 2022-04-06 14:32:03
|
|
||||||
* @LastEditors : Shiming
|
|
||||||
* @LastEditTime : 2022-04-18 14:25:25
|
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\busitable\\pillar\\pillar.component.ts
|
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
||||||
*/
|
|
||||||
import { Component, ElementRef, Input, NgZone, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core';
|
|
||||||
import { Chart } from '@antv/g2';
|
|
||||||
import { DataService } from 'src/app/routes/datatable/services/data.service';
|
|
||||||
@Component({
|
|
||||||
selector: 'app-busitable-pillar',
|
|
||||||
templateUrl: './pillar.component.html',
|
|
||||||
styleUrls: ['./pillar.component.less']
|
|
||||||
})
|
|
||||||
export class BusitablePillarComponent implements OnInit, OnChanges {
|
|
||||||
el: any;
|
|
||||||
@Input() chartData: any;
|
|
||||||
chart: any;
|
|
||||||
constructor(private service: DataService, private ngZone: NgZone) {
|
|
||||||
|
|
||||||
}
|
|
||||||
ngOnChanges(changes: SimpleChanges): void {
|
|
||||||
if (this.chartData) {
|
|
||||||
// setTimeout(()=>{
|
|
||||||
// this.chart.render(true)
|
|
||||||
// }, 1000)
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
|
|
||||||
}
|
|
||||||
reRender() {
|
|
||||||
this.chart.data(this.chartData);
|
|
||||||
this.chart.render();
|
|
||||||
}
|
|
||||||
render(el: ElementRef<HTMLDivElement>): void {
|
|
||||||
this.el = el.nativeElement
|
|
||||||
setTimeout(() => {
|
|
||||||
this.ngZone.runOutsideAngular(() => this.init(this.el));
|
|
||||||
}, 500)
|
|
||||||
}
|
|
||||||
|
|
||||||
private init(el: HTMLElement): void {
|
|
||||||
this.chart = new Chart({
|
|
||||||
container: el,
|
|
||||||
autoFit: true,
|
|
||||||
height: 500,
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart.data(this.chartData);
|
|
||||||
|
|
||||||
const itemTpl = `
|
|
||||||
<div style="padding: 15px; color: red">
|
|
||||||
业绩量: {value}
|
|
||||||
</div>
|
|
||||||
`
|
|
||||||
this.chart.tooltip({
|
|
||||||
showTitle: true,
|
|
||||||
showMarkers: false,
|
|
||||||
itemTpl: itemTpl
|
|
||||||
});
|
|
||||||
this.chart.interval().position('time*number');
|
|
||||||
this.chart.render();
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@ -1,48 +0,0 @@
|
|||||||
<!--
|
|
||||||
* @Description :
|
|
||||||
* @Version : 1.0
|
|
||||||
* @Author : Shiming
|
|
||||||
* @Date : 2022-03-30 13:55:41
|
|
||||||
* @LastEditors : Shiming
|
|
||||||
* @LastEditTime : 2022-04-18 16:13:49
|
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\compliance\\customer\\customer.component.html
|
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
||||||
-->
|
|
||||||
<!-- 页头 -->
|
|
||||||
<page-header-wrapper [title]="'数据报表'"></page-header-wrapper>
|
|
||||||
<nz-card>
|
|
||||||
<div nz-row nzGutter="8">
|
|
||||||
<div nz-col [nzXl]="24" [nzLg]="24" [nzSm]="24" [nzXs]="24">
|
|
||||||
<sf #sf [schema]="searchSchema" button="none"
|
|
||||||
[ui]="{ '*': { spanLabelFixed: 0, grid: { xxl:5,xl:4, lg: 8, md: 12, sm: 12, xs: 24,gutter:20 } } }"
|
|
||||||
[compact]="true">
|
|
||||||
<ng-template sf-template="no4" let-me let-ui="ui" let-schema="schema">
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()" acl [acl-ability]="['customer-search']">
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
<label nz-radio-button nzValue="date">日</label>
|
|
||||||
<label nz-radio-button nzValue="define">自定义</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" *ngIf="mode !== 'define'"
|
|
||||||
[nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-date-picker>
|
|
||||||
<nz-range-picker [(ngModel)]="defineDate" [nzFormat]="dateFormat" *ngIf="mode === 'define'"
|
|
||||||
[nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-range-picker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</sf>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<st #st multiSort [scroll]="{ x: '2000px' }" [data]="service.$api_listCusComplianceReportPage" [columns]="columns"
|
|
||||||
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
|
||||||
[scroll]="{ x: '1200px' }" [res]="{ reName: { list: 'data.records', total: 'data.total' } }"
|
|
||||||
[page]="{ show: true, showSize: true, pageSizes: [10, 20, 30, 50, 100, 200, 300, 500, 1000] }" [loading]="false">
|
|
||||||
<ng-template st-row="freightPrice" let-item let-index="index">
|
|
||||||
{{ item.freightPrice | currency }}
|
|
||||||
</ng-template>
|
|
||||||
</st>
|
|
||||||
</nz-card>
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
.chooseBox {
|
|
||||||
display: flex;
|
|
||||||
float : right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.timeBox {
|
|
||||||
display: flex;
|
|
||||||
margin : 0 0 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dateBox {
|
|
||||||
display: inline-block;
|
|
||||||
margin : 0 0 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
:host::ng-deep {
|
|
||||||
.ant-form-item-control {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,153 +0,0 @@
|
|||||||
import { SFComponent } from '@delon/form';
|
|
||||||
/*
|
|
||||||
* @Description :
|
|
||||||
* @Version : 1.0
|
|
||||||
* @Author : Shiming
|
|
||||||
* @Date : 2022-03-30 13:55:41
|
|
||||||
* @LastEditors : Shiming
|
|
||||||
* @LastEditTime : 2022-04-19 17:45:44
|
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\compliance\\customer\\customer.component.ts
|
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
||||||
*/
|
|
||||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
|
||||||
import { STColumn, STComponent, STRequestOptions } from '@delon/abc/st';
|
|
||||||
import { SFSchema } from '@delon/form';
|
|
||||||
import { ModalHelper, _HttpClient, DatePipe } from '@delon/theme';
|
|
||||||
import { DataService } from '../../../services/data.service';
|
|
||||||
import { differenceInCalendarDays } from 'date-fns';
|
|
||||||
import { Placeholder } from '@angular/compiler/src/i18n/i18n_ast';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-datatable-compliance-customer',
|
|
||||||
templateUrl: './customer.component.html',
|
|
||||||
styleUrls: ['./customer.component.less'],
|
|
||||||
providers: [DatePipe]
|
|
||||||
})
|
|
||||||
export class DatatableComplianceCustomerComponent implements OnInit {
|
|
||||||
@ViewChild('sf', { static: false }) sf!: SFComponent;
|
|
||||||
mode = 'year';
|
|
||||||
type = 1;
|
|
||||||
date: any = null;
|
|
||||||
defineDate = [];
|
|
||||||
time: any = ['2022'];
|
|
||||||
dateFormat = 'yyyy';
|
|
||||||
dateNext: any = null;
|
|
||||||
modeNext = 'year';
|
|
||||||
timeNext: any = ['2022-01-01 00:00:00'];
|
|
||||||
today = new Date();
|
|
||||||
searchSchema: SFSchema = {
|
|
||||||
properties: {
|
|
||||||
customerName: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
placeholder: '请输入客户名称',
|
|
||||||
change: (value: any) => {
|
|
||||||
console.log(value);
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
},
|
|
||||||
salesmanName: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
placeholder: '请输入业务员',
|
|
||||||
change: (value: any) => {
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
partnerName: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
placeholder: '请输入客户名称',
|
|
||||||
change: (value: any) => {
|
|
||||||
console.log(value);
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
no4: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
class: 'custom',
|
|
||||||
widget: 'custom',
|
|
||||||
grid: { xxl: 9, xl: 12, lg: 24, md: 24, sm: 24, xs: 24 }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
@ViewChild('st') private readonly st!: STComponent;
|
|
||||||
columns: STColumn[] = [
|
|
||||||
{ title: '公司名称',width: '200px', index: 'enterpriseName' ,},
|
|
||||||
{ title: '注册时间', width: '200px', index: 'registerTime',},
|
|
||||||
{ title: '客户类型', width: '200px', index: 'customerType' },
|
|
||||||
{ title: '业务员',width: '200px', index: 'salesmanName' },
|
|
||||||
{ title: '合伙人',width: '200px', index: 'partnerName' },
|
|
||||||
{ title: '订单数',width: '200px', index: 'billCounts' },
|
|
||||||
{ title: '订单不合格数',width: '200px', index: 'billQuaCounts' },
|
|
||||||
{ title: '订单不合格率',width: '200px', index: 'billQuaCountsPer' },
|
|
||||||
{ title: '货源单订单数',width: '200px', index: 'gsourceCounts' },
|
|
||||||
{ title: '合同单数', width: '200px',index: 'billConCounts' },
|
|
||||||
{ title: '货源单个',width: '200px', index: 'gsourceCounts' },
|
|
||||||
{ title: '运费直付单数',width: '200px', index: 'freightDirPayCounts' },
|
|
||||||
{ title: '运费代收单数',width: '200px', index: 'freightRepPayCounts' },
|
|
||||||
{ title: '手机直付', width: '200px',index: 'updatedAt' },
|
|
||||||
{ title: '汇款单数',width: '200px', index: 'updatedAt' },
|
|
||||||
{ title: '及时付款',width: '200px', index: 'timelyPayPer' },
|
|
||||||
|
|
||||||
];
|
|
||||||
|
|
||||||
constructor(private http: _HttpClient, private modal: ModalHelper, public service: DataService, private datePipe: DatePipe) {}
|
|
||||||
/**
|
|
||||||
* 查询参数
|
|
||||||
*/
|
|
||||||
get reqParams() {
|
|
||||||
if (this.mode === 'year') {
|
|
||||||
this.type = 1;
|
|
||||||
} else if (this.mode === 'month') {
|
|
||||||
this.type = 2;
|
|
||||||
} else if (this.mode === 'date') {
|
|
||||||
this.type = 3;
|
|
||||||
} else {
|
|
||||||
this.type = 4;
|
|
||||||
}
|
|
||||||
const params: any = Object.assign({}, this.sf?.value || {});
|
|
||||||
params.type = this.type;
|
|
||||||
params.queryTime = this.time;
|
|
||||||
delete params._$expand;
|
|
||||||
return { ...params };
|
|
||||||
}
|
|
||||||
ngOnInit(): void {}
|
|
||||||
onChange(result: any) {
|
|
||||||
if (this.mode === 'year') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy')];
|
|
||||||
} else if (this.mode === 'month') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM')];
|
|
||||||
} else if (this.mode === 'date') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM-dd')];
|
|
||||||
} else {
|
|
||||||
this.time = [
|
|
||||||
this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd'),
|
|
||||||
this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd')
|
|
||||||
];
|
|
||||||
}
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
changeData() {
|
|
||||||
if (this.mode === 'year') {
|
|
||||||
this.dateFormat = 'yyyy';
|
|
||||||
} else if (this.mode === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM';
|
|
||||||
} else {
|
|
||||||
this.dateFormat = 'yyyy-MM-dd';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
disabledDate = (current: Date): boolean =>
|
|
||||||
// Can not select days before today and today
|
|
||||||
differenceInCalendarDays(current, this.today) > 0;
|
|
||||||
}
|
|
||||||
@ -1,2 +0,0 @@
|
|||||||
<g2-custom delay="100" (render)="render($event)"></g2-custom>
|
|
||||||
|
|
||||||
@ -1,101 +0,0 @@
|
|||||||
/*
|
|
||||||
* @Description :
|
|
||||||
* @Version : 1.0
|
|
||||||
* @Author : Shiming
|
|
||||||
* @Date : 2022-04-28 20:27:07
|
|
||||||
* @LastEditors : Shiming
|
|
||||||
* @LastEditTime : 2022-05-07 10:16:08
|
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\compliance\\index\\curve\\curve.component.ts
|
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
||||||
*/
|
|
||||||
import { Component, ElementRef, Input, NgZone, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core';
|
|
||||||
import { G2MiniAreaClickItem } from '@delon/chart/mini-area';
|
|
||||||
|
|
||||||
// import DataSet from '@antv/data-set';
|
|
||||||
const DataSet = require('@antv/data-set');
|
|
||||||
import { Chart } from '@antv/g2';
|
|
||||||
import { DataService } from 'src/app/routes/datatable/services/data.service';
|
|
||||||
@Component({
|
|
||||||
selector: 'app-compliance-curve',
|
|
||||||
templateUrl: './curve.component.html',
|
|
||||||
styleUrls: ['./curve.component.less']
|
|
||||||
})
|
|
||||||
export class ComplianceCurveComponent implements OnInit,OnChanges {
|
|
||||||
el: any;
|
|
||||||
@Input() chartData: any;
|
|
||||||
chart: any;
|
|
||||||
constructor(private service: DataService, private ngZone: NgZone) {
|
|
||||||
|
|
||||||
}
|
|
||||||
ngOnChanges(changes: SimpleChanges): void {
|
|
||||||
if (this.chartData) {
|
|
||||||
// setTimeout(()=>{
|
|
||||||
// this.chart.render(true)
|
|
||||||
// }, 1000)
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
|
|
||||||
}
|
|
||||||
reRender() {
|
|
||||||
setTimeout(() => {
|
|
||||||
this.chart.data(this.chartData);
|
|
||||||
this.chart.render();
|
|
||||||
}, 1000)
|
|
||||||
}
|
|
||||||
render(el: ElementRef<HTMLDivElement>): void {
|
|
||||||
this.el = el.nativeElement
|
|
||||||
setTimeout(() => {
|
|
||||||
console.log(this.chartData)
|
|
||||||
this.ngZone.runOutsideAngular(() => this.init(this.el));
|
|
||||||
}, 1000)
|
|
||||||
}
|
|
||||||
|
|
||||||
private init(el: HTMLElement): void {
|
|
||||||
this.chart = new Chart({
|
|
||||||
container: el,
|
|
||||||
autoFit: true,
|
|
||||||
height: 500,
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart.data(this.chartData);
|
|
||||||
this.chart.scale({
|
|
||||||
time: {
|
|
||||||
range: [0, 1],
|
|
||||||
},
|
|
||||||
number: {
|
|
||||||
min: 0,
|
|
||||||
nice: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart.tooltip({
|
|
||||||
showCrosshairs: true,
|
|
||||||
shared: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart.axis('proportion', {
|
|
||||||
label: {
|
|
||||||
formatter: (val: any) => {
|
|
||||||
return (val*100).toFixed(0)+ ' %';
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart
|
|
||||||
.line()
|
|
||||||
.position('situationDate*proportion')
|
|
||||||
.color('type')
|
|
||||||
.tooltip('proportion*type', function(name: any, value: any) {
|
|
||||||
return {
|
|
||||||
name: name*100+'%',
|
|
||||||
value: value
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart.render();
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,67 +0,0 @@
|
|||||||
<!-- 页头 -->
|
|
||||||
<page-header-wrapper [title]="'合规监控报表'"></page-header-wrapper>
|
|
||||||
<nz-card>
|
|
||||||
<!-- 搜索区 -->
|
|
||||||
<div nz-row>
|
|
||||||
<div nz-col nzSpan="18">
|
|
||||||
<sf #sf [ui]="ui" [schema]="schema" [button]="'none'"></sf>
|
|
||||||
</div>
|
|
||||||
<div nz-col nzSpan="6">
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()" acl [acl-ability]="['index-lRateQualified']">
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" (ngModelChange)="onChange($event)"></nz-date-picker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</nz-card>
|
|
||||||
|
|
||||||
<div nz-row [nzGutter]="16">
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
||||||
<g2-card [title]="'订单合格率'" [bordered]="true" [total]="cardData1?.proportion || '0'" [footer]="footer1" contentHeight="46">
|
|
||||||
<ng-template #footer1>
|
|
||||||
<div class="card-f">
|
|
||||||
<span class="card-f-l">合格:{{cardData1?.leftQuantity}}</span> <span>不合格:{{cardData1?.rightQuantity}}</span>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</g2-card>
|
|
||||||
</div>
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
||||||
<g2-card [title]="'货源单占比'" [bordered]="true" [total]="cardData2?.proportion|| '0'" [footer]="footer2" contentHeight="46">
|
|
||||||
<ng-template #footer2>
|
|
||||||
<div class="card-f">
|
|
||||||
<span class="card-f-l">货源单:{{cardData2?.leftQuantity}}</span> <span>合同单:{{cardData2?.rightQuantity}}</span>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</g2-card>
|
|
||||||
</div>
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
||||||
<g2-card [title]="'运费直付占比'" [bordered]="true" [total]="cardData3?.proportion|| '0'" [footer]="footer3" contentHeight="46">
|
|
||||||
<ng-template #footer3>
|
|
||||||
<div class="card-f">
|
|
||||||
<span class="card-f-l">司机:{{cardData3?.leftQuantity}}</span> <span>车队长:{{cardData3?.rightQuantity}}</span>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</g2-card>
|
|
||||||
</div>
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
||||||
<g2-card [title]="'付款及时率'" [bordered]="true" [total]="cardData4?.proportion|| '0'" [footer]="footer4" contentHeight="46">
|
|
||||||
<ng-template #footer4>
|
|
||||||
<div class="card-f">
|
|
||||||
<span class="card-f-l">准时:{{cardData4?.leftQuantity}}</span> <span>逾期:{{cardData4?.rightQuantity}}</span>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</g2-card>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<nz-card nzTitle="平台合规情况监控报表">
|
|
||||||
<app-compliance-curve #curve [chartData]="chartData"></app-compliance-curve>
|
|
||||||
<!-- <g2-custom delay="100" (render)="render($event)"></g2-custom> -->
|
|
||||||
</nz-card>
|
|
||||||
@ -1,17 +0,0 @@
|
|||||||
.card-f{
|
|
||||||
color: #5a5a5a;
|
|
||||||
.card-f-l{
|
|
||||||
margin-right: 24px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.chooseBox{
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.timeBox{
|
|
||||||
display: flex;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
.dateBox{
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
@ -1,266 +0,0 @@
|
|||||||
import { Component, ElementRef, NgZone, OnInit, ViewChild } from '@angular/core';
|
|
||||||
import { DatePipe, ModalHelper, _HttpClient } from '@delon/theme';
|
|
||||||
import { G2MiniAreaClickItem, G2MiniAreaData } from '@delon/chart/mini-area';
|
|
||||||
import { format } from 'date-fns';
|
|
||||||
import { SFComponent, SFDateWidgetSchema, SFRadioWidgetSchema, SFSchema, SFUISchema } from '@delon/form';
|
|
||||||
import { G2TimelineData, G2TimelineMap } from '@delon/chart/timeline';
|
|
||||||
import { Chart } from '@antv/g2';
|
|
||||||
import { DataService } from '../../../services/data.service';
|
|
||||||
import { ComplianceCurveComponent } from './curve/curve.component';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-datatable-compliance-index',
|
|
||||||
templateUrl: './index.component.html',
|
|
||||||
styleUrls: ['./index.component.less'],
|
|
||||||
providers: [DatePipe]
|
|
||||||
})
|
|
||||||
export class DatatableComplianceIndexComponent implements OnInit {
|
|
||||||
@ViewChild('curve') private readonly curve!: ComplianceCurveComponent;
|
|
||||||
@ViewChild('sf', { static: false })
|
|
||||||
|
|
||||||
sf!: SFComponent;
|
|
||||||
ui!: SFUISchema;
|
|
||||||
schema: SFSchema = {};
|
|
||||||
|
|
||||||
mode = 'year';
|
|
||||||
date: any = null;
|
|
||||||
dateFormat = 'yyyy';
|
|
||||||
time: any = '2022'
|
|
||||||
chartData: any = {}
|
|
||||||
|
|
||||||
cardData1:any;
|
|
||||||
cardData2:any;
|
|
||||||
cardData3:any;
|
|
||||||
cardData4:any;
|
|
||||||
|
|
||||||
constructor(private http: _HttpClient, private modal: ModalHelper, private ngZone: NgZone,public service: DataService, private datePipe: DatePipe) {}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
this.initSF();
|
|
||||||
this.initdData();
|
|
||||||
}
|
|
||||||
|
|
||||||
initdData(){
|
|
||||||
const params ={
|
|
||||||
...this.sf?.value,
|
|
||||||
timeType:this.mode ==='month'?'M':'Y',
|
|
||||||
time:this.time
|
|
||||||
}
|
|
||||||
this.service.request(this.service.$api_getBillRateQualified, params).subscribe(res => {
|
|
||||||
|
|
||||||
if (res) {
|
|
||||||
this.cardData1 = res;
|
|
||||||
console.log(this.cardData1);
|
|
||||||
|
|
||||||
this.cardData1.proportion = (this.cardData1?.proportion*100).toFixed(2) +'%'
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service.request(this.service.$api_getBillRateProportion, params).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.cardData2 = res;
|
|
||||||
this.cardData2.proportion = (this.cardData2?.proportion*100).toFixed(2) +'%'
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service.request(this.service.$api_getBillRateDirectPayment, params).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.cardData3 = res;
|
|
||||||
this.cardData3.proportion = (this.cardData3?.proportion*100).toFixed(2) +'%'
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service.request(this.service.$api_getBillTimelyPayment, params).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.cardData4 = res;
|
|
||||||
this.cardData4.proportion = (this.cardData4?.proportion*100).toFixed(2) +'%'
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
this.service.request(this.service.$api_listMonitorSituation, params).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.chartData = res
|
|
||||||
this.curve.reRender();
|
|
||||||
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
changeData(){
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.dateFormat = 'yyyy'
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM'
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
onChange(result: any) {
|
|
||||||
if(result === null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.time = this.datePipe.transform(this.date, 'yyyy')
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.time = this.datePipe.transform(this.date, 'yyyy-MM')
|
|
||||||
}
|
|
||||||
this.initdData();
|
|
||||||
}
|
|
||||||
|
|
||||||
initSF() {
|
|
||||||
this.schema = {
|
|
||||||
properties: {
|
|
||||||
enterpriseInfoId: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
widget: 'select',
|
|
||||||
placeholder: '网络货运人',
|
|
||||||
asyncData: () => this.service.getNetworkFreightForwarder({}),
|
|
||||||
change:()=>{
|
|
||||||
this.initdData();
|
|
||||||
},
|
|
||||||
allowClear: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
enterpriseProjectId: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
widget: 'select',
|
|
||||||
placeholder: '部门'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
salesmanId: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
placeholder: '业务员',
|
|
||||||
enter: () => this.initdData(),
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
this.ui = {
|
|
||||||
'*': {
|
|
||||||
grid: { span: 4 }
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
render(el: ElementRef<HTMLDivElement>) {
|
|
||||||
this.ngZone.runOutsideAngular(() => this.init(el.nativeElement));
|
|
||||||
}
|
|
||||||
|
|
||||||
private init(el: HTMLElement): void {
|
|
||||||
const chart = new Chart({
|
|
||||||
container: el,
|
|
||||||
autoFit: true,
|
|
||||||
height: 400
|
|
||||||
});
|
|
||||||
// 以三组数据为例, 需要展示 91/92/93年中a/b/c数据走势
|
|
||||||
const data = [
|
|
||||||
{ data: '1月', label: '订单合格率', value: 5 },
|
|
||||||
{ data: '2月', label: '订单合格率', value: 10 },
|
|
||||||
{ data: '3月', label: '订单合格率', value: 25 },
|
|
||||||
{ data: '4月', label: '订单合格率', value: 35 },
|
|
||||||
{ data: '5月', label: '订单合格率', value: 15 },
|
|
||||||
{ data: '6月', label: '订单合格率', value: 5 },
|
|
||||||
{ data: '7月', label: '订单合格率', value: 95 },
|
|
||||||
{ data: '8月', label: '订单合格率', value: 45 },
|
|
||||||
|
|
||||||
{ data: '1月', label: '付款及时率', value: 10 },
|
|
||||||
{ data: '2月', label: '付款及时率', value: 15 },
|
|
||||||
{ data: '3月', label: '付款及时率', value: 30 },
|
|
||||||
{ data: '4月', label: '付款及时率', value: 8 },
|
|
||||||
{ data: '5月', label: '付款及时率', value: 9 },
|
|
||||||
{ data: '6月', label: '付款及时率', value: 5 },
|
|
||||||
{ data: '7月', label: '付款及时率', value: 80 },
|
|
||||||
{ data: '8月', label: '付款及时率', value: 55 },
|
|
||||||
|
|
||||||
{ data: '1月', label: '货源占比率', value: 90 },
|
|
||||||
{ data: '2月', label: '货源占比率', value: 30 },
|
|
||||||
{ data: '3月', label: '货源占比率', value: 45 },
|
|
||||||
{ data: '4月', label: '货源占比率', value: 35 },
|
|
||||||
{ data: '5月', label: '货源占比率', value: 95 },
|
|
||||||
{ data: '6月', label: '货源占比率', value: 35 },
|
|
||||||
{ data: '7月', label: '货源占比率', value: 65 },
|
|
||||||
{ data: '8月', label: '货源占比率', value: 63 },
|
|
||||||
|
|
||||||
{ data: '1月', label: '运费直付占比', value: 30 },
|
|
||||||
{ data: '2月', label: '运费直付占比', value: 60 },
|
|
||||||
{ data: '3月', label: '运费直付占比', value: 25 },
|
|
||||||
{ data: '4月', label: '运费直付占比', value: 35 },
|
|
||||||
{ data: '5月', label: '运费直付占比', value: 15 },
|
|
||||||
{ data: '6月', label: '运费直付占比', value: 55 },
|
|
||||||
{ data: '7月', label: '运费直付占比', value: 50 },
|
|
||||||
{ data: '8月', label: '运费直付占比', value: 30 },
|
|
||||||
];
|
|
||||||
|
|
||||||
chart.data(data);
|
|
||||||
//刻度自定义
|
|
||||||
chart.scale({
|
|
||||||
data: {
|
|
||||||
range: [0, 1],
|
|
||||||
},
|
|
||||||
value: {
|
|
||||||
min: 0,
|
|
||||||
nice: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
// 图表下方图形文字自定义
|
|
||||||
chart.legend({
|
|
||||||
items:[
|
|
||||||
{
|
|
||||||
name: '订单合格率',
|
|
||||||
value: 'node_load1',
|
|
||||||
marker: {
|
|
||||||
symbol: 'circle',
|
|
||||||
style: {fill: '#6193f7'}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '付款及时率',
|
|
||||||
value: 'node_load2',
|
|
||||||
marker: {symbol: 'circle',style: {fill: '#58d3a2'}},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '货源占比率',
|
|
||||||
value: 'node_load13',
|
|
||||||
marker: {symbol: 'circle',style: {fill: '#5b6d8f'}},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '运费直付占比',
|
|
||||||
value: 'node_load13',
|
|
||||||
marker: {symbol: 'circle',style: {fill: '#f0b915'}},
|
|
||||||
},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
// 提示自定义
|
|
||||||
chart.tooltip({
|
|
||||||
showCrosshairs: true,
|
|
||||||
shared: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
//数据格式化
|
|
||||||
chart.axis('value', {
|
|
||||||
label: {
|
|
||||||
formatter: (val) => {
|
|
||||||
return val + ' %';
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
// 在x*y的坐标点上按z值绘制线条, 如果z值相同将使用直线连接
|
|
||||||
chart.line().position('data*value').color('label').tooltip('label*value', (name:any, value:any) => {
|
|
||||||
return {
|
|
||||||
name: name,
|
|
||||||
value: value + '%'
|
|
||||||
};
|
|
||||||
});;
|
|
||||||
// 在x*y的坐标上按z值绘制圆点
|
|
||||||
chart.point().position('data*value').size(4).color('label').shape('circle');
|
|
||||||
chart.render();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,46 +0,0 @@
|
|||||||
<!--
|
|
||||||
* @Description :
|
|
||||||
* @Version : 1.0
|
|
||||||
* @Author : Shiming
|
|
||||||
* @Date : 2022-03-30 17:57:46
|
|
||||||
* @LastEditors : Shiming
|
|
||||||
* @LastEditTime : 2022-04-18 17:21:43
|
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\compliance\\salesman\\salesman.component.html
|
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
||||||
-->
|
|
||||||
<!-- 页头 -->
|
|
||||||
<page-header-wrapper [title]="'业务员-合规报告'"></page-header-wrapper>
|
|
||||||
<nz-card >
|
|
||||||
|
|
||||||
<div nz-row nzGutter="8">
|
|
||||||
<div nz-col [nzXl]="24" [nzLg]="24" [nzSm]="24" [nzXs]="24">
|
|
||||||
<sf #sf [schema]="searchSchema" button="none"
|
|
||||||
[ui]="{ '*': { spanLabelFixed: 0, grid: { xxl:5,xl:4, lg: 8, md: 12, sm: 12, xs: 24,gutter:20 } } }"
|
|
||||||
[compact]="true">
|
|
||||||
<ng-template sf-template="no4" let-me let-ui="ui" let-schema="schema">
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()" acl [acl-ability]="['salesman-ComplianceReportPage']">
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
<label nz-radio-button nzValue="date">日</label>
|
|
||||||
<label nz-radio-button nzValue="define">自定义</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" *ngIf="mode !== 'define'"
|
|
||||||
[nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-date-picker>
|
|
||||||
<nz-range-picker [(ngModel)]="defineDate" [nzFormat]="dateFormat" *ngIf="mode === 'define'"
|
|
||||||
[nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-range-picker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</sf>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<st #st multiSort [columns]="columns" [ps]="20" [data]="service.$api_listPartComplianceReportPage"
|
|
||||||
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
|
||||||
[scroll]="{ x: '1200px' }" [res]="{ reName: { list: 'data.records', total: 'data.total' } }"
|
|
||||||
[page]="{ show: true, showSize: true, pageSizes: [20, 50, 100] }">
|
|
||||||
</st>
|
|
||||||
</nz-card>
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
.chooseBox {
|
|
||||||
display: flex;
|
|
||||||
float : right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.timeBox {
|
|
||||||
display: flex;
|
|
||||||
margin : 0 0 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dateBox {
|
|
||||||
display: inline-block;
|
|
||||||
margin : 0 0 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
:host::ng-deep {
|
|
||||||
.ant-form-item-control {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,220 +0,0 @@
|
|||||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
|
||||||
import { STColumn, STComponent } from '@delon/abc/st';
|
|
||||||
import { SFComponent, SFDateWidgetSchema, SFSchema, SFUISchema } from '@delon/form';
|
|
||||||
import { DatePipe, _HttpClient } from '@delon/theme';
|
|
||||||
import { differenceInCalendarDays } from 'date-fns';
|
|
||||||
import { DataService } from '../../../services/data.service';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-datatable-compliance-salesman',
|
|
||||||
templateUrl: './salesman.component.html',
|
|
||||||
styleUrls: ['./salesman.component.less'],
|
|
||||||
providers: [DatePipe]
|
|
||||||
|
|
||||||
})
|
|
||||||
export class DatatableComplianceSalesmanComponent implements OnInit {
|
|
||||||
url = `/user`;
|
|
||||||
@ViewChild('st', { static: false }) st!: STComponent;
|
|
||||||
@ViewChild('sf', { static: false }) sf!: SFComponent;
|
|
||||||
_$expand = false;
|
|
||||||
type = 1;
|
|
||||||
mode = 'year';
|
|
||||||
date: any = null;
|
|
||||||
defineDate = [];
|
|
||||||
time: any = ['2022-01-01 00:00:00']
|
|
||||||
dateFormat = 'yyyy';
|
|
||||||
today = new Date();
|
|
||||||
ui: SFUISchema = {};
|
|
||||||
schema: SFSchema = {};
|
|
||||||
isLoading: boolean = false;
|
|
||||||
searchSchema: SFSchema = {
|
|
||||||
properties: {
|
|
||||||
department: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
placeholder: '请选择部门',
|
|
||||||
change: (value: any) => {
|
|
||||||
console.log(value);
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
},
|
|
||||||
customerName: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
placeholder: '请输入业务员',
|
|
||||||
change: (value: any) => {
|
|
||||||
console.log(value);
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
salesmanName: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
placeholder: '请输入客户名称',
|
|
||||||
change: (value: any) => {
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
no4: {
|
|
||||||
type: 'string',
|
|
||||||
title: '',
|
|
||||||
ui: {
|
|
||||||
class: 'custom',
|
|
||||||
widget: 'custom',
|
|
||||||
grid: { xxl: 9, xl: 10, lg: 12, md: 24, sm: 24, xs: 24 }
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
};
|
|
||||||
columns: STColumn[] = [
|
|
||||||
{ title: '部门', index: 'department', className: 'text-center', width: '200px' },
|
|
||||||
{ title: '业务员', index: 'salesmen', className: 'text-center', width: '100px' },
|
|
||||||
{ title: '客户数', index: 'cusCount', className: 'text-right', width: '100px', },
|
|
||||||
{ title: '订单数', index: 'billCount', className: 'text-center', width: '120px' },
|
|
||||||
{ title: '订单合格率', index: 'billComPer', className: 'text-right', width: '100px',format: (item: any) => {return ((item?.billComPer)*100).toFixed(2) + '%' }},
|
|
||||||
{ title: '付款及时率', index: 'payTimePer', className: 'text-center', width: '130px',format: (item: any) => {return ((item?.payTimePer)*100).toFixed(2) + '%' } },
|
|
||||||
{ title: '货源单占比', index: 'goodResPer', className: 'text-right', width: '120px',format: (item: any) => {return ((item?.goodResPer)*100).toFixed(2) + '%' } },
|
|
||||||
{ title: '运费直付占比', index: 'feightPayPer', className: 'text-right', width: '100px', format: (item: any) => {return ((item?.feightPayPer)*100).toFixed(2) + '%' } },
|
|
||||||
];
|
|
||||||
/**
|
|
||||||
* 查询参数
|
|
||||||
*/
|
|
||||||
get reqParams() {
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.type = 1
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.type = 2
|
|
||||||
} else if(this.mode === 'date') {
|
|
||||||
this.type = 3
|
|
||||||
} else {
|
|
||||||
this.type = 4
|
|
||||||
}
|
|
||||||
let params: any = {
|
|
||||||
time: this.time,
|
|
||||||
type: this.type,
|
|
||||||
...this.sf?.value
|
|
||||||
};
|
|
||||||
|
|
||||||
delete params._$expand;
|
|
||||||
return { ...params };
|
|
||||||
}
|
|
||||||
constructor(public service: DataService, private datePipe: DatePipe) { }
|
|
||||||
ngOnInit(): void {
|
|
||||||
this.initSF();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* 初始化查询表单
|
|
||||||
*/
|
|
||||||
initSF() {
|
|
||||||
this.schema = {
|
|
||||||
properties: {
|
|
||||||
_$expand: { type: 'boolean', ui: { hidden: true } },
|
|
||||||
enterpriseName: {
|
|
||||||
type: 'string',
|
|
||||||
title: '货主名称',
|
|
||||||
ui: {
|
|
||||||
placeholder: '请输入',
|
|
||||||
}
|
|
||||||
},
|
|
||||||
customerType: {
|
|
||||||
type: 'string',
|
|
||||||
title: '客户类型',
|
|
||||||
ui: {
|
|
||||||
widget: 'select',
|
|
||||||
placeholder: '请选择',
|
|
||||||
},
|
|
||||||
enum: [
|
|
||||||
{label: '直客', value: 2},
|
|
||||||
{label: '渠道客户', value: 3},
|
|
||||||
{label: '平台客户', value: 1},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
customerStatus: {
|
|
||||||
type: 'string',
|
|
||||||
title: '客户状态',
|
|
||||||
ui: {
|
|
||||||
widget: 'select',
|
|
||||||
placeholder: '请选择',
|
|
||||||
},
|
|
||||||
enum: [
|
|
||||||
{label: '未激活', value: 1},
|
|
||||||
{label: '沉默', value: 2},
|
|
||||||
{label: '流失', value: 3},
|
|
||||||
{label: '活跃', value: 4},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
registerTime: {
|
|
||||||
title: '注册时间',
|
|
||||||
type: 'string',
|
|
||||||
ui: {
|
|
||||||
widget: 'sl-from-to', type: 'date', format: 'yyyy-MM-dd', visibleIf: {
|
|
||||||
_$expand: (value: boolean) => value,
|
|
||||||
},
|
|
||||||
} as SFDateWidgetSchema,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
type: 'object'
|
|
||||||
};
|
|
||||||
this.ui = { '*': { spanLabelFixed: 110, grid: { span: 8, gutter: 4 } } };
|
|
||||||
}
|
|
||||||
changeData(){
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.dateFormat = 'yyyy'
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM'
|
|
||||||
} else {
|
|
||||||
this.dateFormat = 'yyyy-MM-dd'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
onChange(result: any) {
|
|
||||||
if(result === null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy') + '-01-01 00:00:00']
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM') + '-01 00:00:00']
|
|
||||||
} else if(this.mode === 'date') {
|
|
||||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM-dd') + ' 00:00:00']
|
|
||||||
} else{
|
|
||||||
this.time = [this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd') + '00:00:00', this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd') + ' 00:00:00']
|
|
||||||
}
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
disabledDate = (current: Date): boolean =>
|
|
||||||
// Can not select days before today and today
|
|
||||||
differenceInCalendarDays(current, this.today) > 0;
|
|
||||||
|
|
||||||
export() {
|
|
||||||
// this.service.downloadFile(this.service.$api_exportUploadBill, this.sf?.value, {});
|
|
||||||
}
|
|
||||||
search() {
|
|
||||||
this.st?.load(1)
|
|
||||||
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* 伸缩查询条件
|
|
||||||
*/
|
|
||||||
expandToggle() {
|
|
||||||
this._$expand = !this._$expand;
|
|
||||||
this.sf?.setValue('/_$expand', this._$expand);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 重置表单
|
|
||||||
*/
|
|
||||||
resetSF() {
|
|
||||||
this.sf.reset();
|
|
||||||
this._$expand = false;
|
|
||||||
this.isLoading = true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1 +0,0 @@
|
|||||||
<g2-custom delay="100" (render)="render($event)"></g2-custom>
|
|
||||||
@ -1,92 +0,0 @@
|
|||||||
/*
|
|
||||||
* @Description :
|
|
||||||
* @Version : 1.0
|
|
||||||
* @Author : Shiming
|
|
||||||
* @Date : 2022-04-06 13:43:29
|
|
||||||
* @LastEditors : Shiming
|
|
||||||
* @LastEditTime : 2022-04-06 19:20:24
|
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\customtable\\customindex\\curve\\curve.component.ts
|
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
||||||
*/
|
|
||||||
import { Component, ElementRef, Input, NgZone, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core';
|
|
||||||
import { Chart } from '@antv/g2';
|
|
||||||
import { DataService } from 'src/app/routes/datatable/services/data.service';
|
|
||||||
@Component({
|
|
||||||
selector: 'app-datatable-customindex-curve',
|
|
||||||
templateUrl: './curve.component.html',
|
|
||||||
styleUrls: ['./curve.component.less']
|
|
||||||
})
|
|
||||||
export class DatatableCustomindexCurveComponent implements OnInit, OnChanges {
|
|
||||||
el: any;
|
|
||||||
@Input() chartData: any;
|
|
||||||
chart: any;
|
|
||||||
constructor(private service: DataService, private ngZone: NgZone) {
|
|
||||||
|
|
||||||
}
|
|
||||||
ngOnChanges(changes: SimpleChanges): void {
|
|
||||||
if (this.chartData) {
|
|
||||||
// setTimeout(()=>{
|
|
||||||
// this.chart.render(true)
|
|
||||||
// }, 1000)
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
|
|
||||||
}
|
|
||||||
reRender() {
|
|
||||||
setTimeout(() => {
|
|
||||||
this.chart.data(this.chartData);
|
|
||||||
this.chart.render();
|
|
||||||
}, 1000)
|
|
||||||
}
|
|
||||||
render(el: ElementRef<HTMLDivElement>): void {
|
|
||||||
this.el = el.nativeElement
|
|
||||||
setTimeout(() => {
|
|
||||||
this.ngZone.runOutsideAngular(() => this.init(this.el));
|
|
||||||
},500)
|
|
||||||
console.log(this.chartData);
|
|
||||||
}
|
|
||||||
|
|
||||||
private init(el: HTMLElement): void {
|
|
||||||
this.chart = new Chart({
|
|
||||||
container: el,
|
|
||||||
autoFit: true,
|
|
||||||
height: 500,
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart.data(this.chartData);
|
|
||||||
this.chart.scale({
|
|
||||||
time: {
|
|
||||||
range: [0, 1],
|
|
||||||
},
|
|
||||||
number: {
|
|
||||||
nice: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart.tooltip({
|
|
||||||
showCrosshairs: true,
|
|
||||||
shared: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart.axis('number', {
|
|
||||||
label: {
|
|
||||||
formatter: (val: any) => {
|
|
||||||
return val;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
this.chart
|
|
||||||
.line()
|
|
||||||
.position('time*number')
|
|
||||||
.color('name')
|
|
||||||
|
|
||||||
|
|
||||||
this.chart.render();
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@ -1,81 +0,0 @@
|
|||||||
<!--
|
|
||||||
* @Description :
|
|
||||||
* @Version : 1.0
|
|
||||||
* @Author : Shiming
|
|
||||||
* @Date : 2022-04-06 13:20:56
|
|
||||||
* @LastEditors : Shiming
|
|
||||||
* @LastEditTime : 2022-04-29 17:55:02
|
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\customtable\\customindex\\customindex.component.html
|
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
||||||
-->
|
|
||||||
<!-- 页头 -->
|
|
||||||
<page-header-wrapper [title]="'客户报表'"></page-header-wrapper>
|
|
||||||
<div nz-row [nzGutter]="16" acl [acl-ability]="['customindex-statisticsTotal']">
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
||||||
<g2-card [title]="'货主'" [bordered]="true" [total]="hzData?.total || '0'"
|
|
||||||
[footer]="'已认证' + ' ' + hzData?.auditPassTotal" contentHeight="46">
|
|
||||||
</g2-card>
|
|
||||||
</div>
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
||||||
<g2-card [title]="'合伙人'" [bordered]="true" [total]="hhrData?.total || '0'"
|
|
||||||
[footer]="'已认证' + ' ' + hhrData?.auditPassTotal" contentHeight="46">
|
|
||||||
</g2-card>
|
|
||||||
</div>
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
||||||
<g2-card [title]="'司机'" [bordered]="true" [total]="sjData?.total || '0'"
|
|
||||||
[footer]="'已认证' + ' ' + sjData?.auditPassTotal" contentHeight="46">
|
|
||||||
</g2-card>
|
|
||||||
</div>
|
|
||||||
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
||||||
<g2-card [title]="'车辆'" [bordered]="true" [total]="clData?.total || '0'"
|
|
||||||
[footer]="'已认证' + ' '+ clData?.auditPassTotal" contentHeight="46">
|
|
||||||
</g2-card>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<nz-card nzTitle="客户报表" [nzExtra]="extraTemplate" acl [acl-ability]="['customindex-client']">
|
|
||||||
<ng-template #extraTemplate>
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()">
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
<label nz-radio-button nzValue="date">日</label>
|
|
||||||
<label nz-radio-button nzValue="define">自定义</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" *ngIf="mode !== 'define'"
|
|
||||||
[nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-date-picker>
|
|
||||||
<nz-range-picker [(ngModel)]="defineDate" [nzFormat]="dateFormat" *ngIf="mode === 'define'"
|
|
||||||
[nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-range-picker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
<st #st multiSort [columns]="columns" [ps]="20" [data]="reportData" [scroll]="{ x: '1200px' }"
|
|
||||||
[res]="{ reName: { list: 'data', total: 'data.total' } }"
|
|
||||||
[page]="{ show: false, showSize: false, pageSizes: [20, 50, 100] }">
|
|
||||||
<ng-template st-row="type" let-item>
|
|
||||||
<div *ngIf="item.type == '1'">货主</div>
|
|
||||||
<div *ngIf="item.type == '2'">合伙人</div>
|
|
||||||
<div *ngIf="item.type == '3'">司机</div>
|
|
||||||
<div *ngIf="item.type == '4'">车辆</div>
|
|
||||||
</ng-template>
|
|
||||||
</st>
|
|
||||||
</nz-card>
|
|
||||||
<nz-card nzTitle="用户新增报表" [nzExtra]="extraTemplate01" acl [acl-ability]="['customindex-totalAdd']">
|
|
||||||
<ng-template #extraTemplate01>
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="modeNext" nzButtonStyle="solid" (ngModelChange)="changeDataNext2()">
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [nzDisabledDate]="disabledDate" [(ngModel)]="dateNext" [nzMode]="modeNext"
|
|
||||||
(ngModelChange)="onChangeNext($event)"></nz-date-picker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
<app-datatable-customindex-curve #curve [chartData]="chartData"></app-datatable-customindex-curve>
|
|
||||||
</nz-card>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
.chooseBox{
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.timeBox{
|
|
||||||
display: flex;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
.dateBox{
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
import { DatatableCustomindexComponent } from './customindex.component';
|
|
||||||
|
|
||||||
describe('DatatableCustomindexComponent', () => {
|
|
||||||
let component: DatatableCustomindexComponent;
|
|
||||||
let fixture: ComponentFixture<DatatableCustomindexComponent>;
|
|
||||||
|
|
||||||
beforeEach(waitForAsync(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ DatatableCustomindexComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(DatatableCustomindexComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,236 +0,0 @@
|
|||||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
|
||||||
import { STColumn, STComponent } from '@delon/abc/st';
|
|
||||||
import { SFComponent } from '@delon/form';
|
|
||||||
import { DatePipe, _HttpClient } from '@delon/theme';
|
|
||||||
import { differenceInCalendarDays } from 'date-fns';
|
|
||||||
import { DataService } from '../../../services/data.service';
|
|
||||||
import { DatatableCustomindexCurveComponent } from './curve/curve.component';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-datatable-customindex',
|
|
||||||
templateUrl: './customindex.component.html',
|
|
||||||
styleUrls: ['./customindex.component.less'],
|
|
||||||
providers: [DatePipe]
|
|
||||||
})
|
|
||||||
export class DatatableCustomindexComponent implements OnInit {
|
|
||||||
@ViewChild('st') private readonly st!: STComponent;
|
|
||||||
@ViewChild('sf', { static: false }) sf!: SFComponent;
|
|
||||||
@ViewChild('curve') private readonly curve!: DatatableCustomindexCurveComponent;
|
|
||||||
type = 1;
|
|
||||||
mode = 'year';
|
|
||||||
date: any = null;
|
|
||||||
defineDate = [];
|
|
||||||
timeStart: any = '2022-01-01';
|
|
||||||
timeEnd: any = '2022-12-31';
|
|
||||||
dateFormat = 'yyyy';
|
|
||||||
today = new Date();
|
|
||||||
dateNext: any = null;
|
|
||||||
modeNext = 'year';
|
|
||||||
timeNext: any = ['2022-01-01 00:00:00'];
|
|
||||||
chartData: any = [];
|
|
||||||
flag = false;
|
|
||||||
|
|
||||||
columns: STColumn[] = [
|
|
||||||
{ title: '用户类型', render: 'type', className: 'text-center' },
|
|
||||||
{ title: '用户总数', index: 'total', className: 'text-center' },
|
|
||||||
{ title: '已认证数量', index: 'auditPassTotal', className: 'text-center' },
|
|
||||||
{ title: '活跃用户数', index: 'activeTotal', className: 'text-center' },
|
|
||||||
{ title: '未激活用户数', index: 'notActivationTotal', className: 'text-center' },
|
|
||||||
{ title: '沉默用户数', index: 'silentTotal', className: 'text-center' },
|
|
||||||
{ title: '流失用户数', index: 'drainTotal', className: 'text-center' },
|
|
||||||
{ title: '流失率', index: 'drainRate', className: 'text-center',format: (item: any) => {return ((item?.drainRate)*100).toFixed(2) + '%' }}
|
|
||||||
];
|
|
||||||
hzData: any;
|
|
||||||
hhrData: any = {
|
|
||||||
total: 0
|
|
||||||
};
|
|
||||||
sjData: any;
|
|
||||||
clData: any;
|
|
||||||
reportData: any = [];
|
|
||||||
|
|
||||||
constructor(public service: DataService, private datePipe: DatePipe) {}
|
|
||||||
ngOnInit(): void {
|
|
||||||
this.initCurveData();
|
|
||||||
}
|
|
||||||
initCurveData() {
|
|
||||||
this.cardData();
|
|
||||||
this.listData();
|
|
||||||
this.addData('year', '2022-01-01');
|
|
||||||
}
|
|
||||||
listData(type?: string, stime?: any, etime?: any) {
|
|
||||||
this.reportData = [];
|
|
||||||
this.service
|
|
||||||
.request(this.service.$api_statistics_totalDetail, {
|
|
||||||
dateStart: stime || this.timeStart,
|
|
||||||
dateEnd: etime || this.timeEnd,
|
|
||||||
type: 1 //用户角色类型 1:货主 2:合伙人 3:司机 4:车辆
|
|
||||||
})
|
|
||||||
.subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.reportData.push(res);
|
|
||||||
this.st.reload();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service
|
|
||||||
.request(this.service.$api_statistics_totalDetail, {
|
|
||||||
dateStart: stime || this.timeStart,
|
|
||||||
dateEnd: etime || this.timeEnd,
|
|
||||||
type: 2
|
|
||||||
})
|
|
||||||
.subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.reportData.push(res);
|
|
||||||
this.st.reload();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service
|
|
||||||
.request(this.service.$api_statistics_totalDetail, {
|
|
||||||
dateStart: stime || this.timeStart,
|
|
||||||
dateEnd: etime || this.timeEnd,
|
|
||||||
type: 3
|
|
||||||
})
|
|
||||||
.subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.reportData.push(res);
|
|
||||||
this.st.reload();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service
|
|
||||||
.request(this.service.$api_statistics_totalDetail, {
|
|
||||||
dateStart: stime || this.timeStart,
|
|
||||||
dateEnd: etime || this.timeEnd,
|
|
||||||
type: 4
|
|
||||||
})
|
|
||||||
.subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.reportData.push(res);
|
|
||||||
this.st.reload();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
cardData() {
|
|
||||||
this.service.request(this.service.$api_statistics_total, { type: 1 }).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.hzData = res;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service.request(this.service.$api_statistics_total, { type: 2 }).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
|
|
||||||
this.hhrData = res;
|
|
||||||
console.log(this.hhrData);
|
|
||||||
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service.request(this.service.$api_statistics_total, { type: 3 }).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.sjData = res;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service.request(this.service.$api_statistics_total, { type: 4 }).subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.clData = res;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
addData(type?: string, time?: any) {
|
|
||||||
this.chartData = []
|
|
||||||
this.service
|
|
||||||
.request(this.service.$api_statistics_totalAdd, {
|
|
||||||
date: time,
|
|
||||||
dateType: type === 'month' ? 2 : 1, //日期类型 1:年 2:月
|
|
||||||
type: 1
|
|
||||||
})
|
|
||||||
.subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.chartData.push(...res);
|
|
||||||
console.log(this.curve);
|
|
||||||
this.curve.reRender();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service
|
|
||||||
.request(this.service.$api_statistics_totalAdd, {
|
|
||||||
date: time,
|
|
||||||
dateType: type === 'month' ? 2 : 1, //日期类型 1:年 2:月
|
|
||||||
type: 2
|
|
||||||
})
|
|
||||||
.subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.chartData.push(...res);
|
|
||||||
this.curve.reRender();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service
|
|
||||||
.request(this.service.$api_statistics_totalAdd, {
|
|
||||||
date: time,
|
|
||||||
dateType: type === 'month' ? 2 : 1, //日期类型 1:年 2:月
|
|
||||||
type: 3
|
|
||||||
})
|
|
||||||
.subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.chartData.push(...res);
|
|
||||||
this.curve.reRender();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.service
|
|
||||||
.request(this.service.$api_statistics_totalAdd, {
|
|
||||||
date: time,
|
|
||||||
dateType: type === 'month' ? 2 : 1, //日期类型 1:年 2:月
|
|
||||||
type: 4
|
|
||||||
})
|
|
||||||
.subscribe(res => {
|
|
||||||
if (res) {
|
|
||||||
this.chartData.push(...res);
|
|
||||||
this.curve.reRender();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
changeData() {
|
|
||||||
if (this.mode === 'year') {
|
|
||||||
this.dateFormat = 'yyyy';
|
|
||||||
} else if (this.mode === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM';
|
|
||||||
} else {
|
|
||||||
this.dateFormat = 'yyyy-MM-dd';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
onChange(result: any) {
|
|
||||||
if (this.mode === 'year') {
|
|
||||||
this.timeStart = this.datePipe.transform(this.date, 'yyyy') + '-01-01';
|
|
||||||
this.timeEnd = this.datePipe.transform(this.date, 'yyyy') + '-12-31';
|
|
||||||
|
|
||||||
} else if (this.mode === 'month') {
|
|
||||||
this.timeStart = this.datePipe.transform(this.date, 'yyyy-MM') + '-01' ;
|
|
||||||
this.timeEnd = this.datePipe.transform(this.date, 'yyyy-MM') + '-31';
|
|
||||||
} else if (this.mode === 'date') {
|
|
||||||
this.timeStart=this.datePipe.transform(this.date, 'yyyy-MM-dd');
|
|
||||||
this.timeEnd = this.datePipe.transform(this.date, 'yyyy-MM-dd') ;
|
|
||||||
} else {
|
|
||||||
this.timeStart = this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd') ;
|
|
||||||
this.timeEnd = this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd');
|
|
||||||
}
|
|
||||||
this.listData(this.mode, this.timeStart, this.timeEnd);
|
|
||||||
}
|
|
||||||
disabledDate = (current: Date): boolean =>
|
|
||||||
// Can not select days before today and today
|
|
||||||
differenceInCalendarDays(current, this.today) > 0;
|
|
||||||
|
|
||||||
changeDataNext2() {
|
|
||||||
if (this.modeNext === 'year') {
|
|
||||||
this.dateFormat = 'yyyy';
|
|
||||||
} else if (this.modeNext === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
onChangeNext(result: any) {
|
|
||||||
if (result === null) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (this.modeNext === 'year') {
|
|
||||||
this.timeNext = this.datePipe.transform(this.dateNext, 'yyyy') + '-01-01';
|
|
||||||
} else if (this.modeNext === 'month') {
|
|
||||||
this.timeNext = this.datePipe.transform(this.dateNext, 'yyyy-MM') + '-01';
|
|
||||||
}
|
|
||||||
this.addData(this.modeNext, this.timeNext);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,46 +0,0 @@
|
|||||||
<!-- 页头 -->
|
|
||||||
<page-header-wrapper [title]="'司机报表'"></page-header-wrapper>
|
|
||||||
<nz-card>
|
|
||||||
<!-- 搜索表单 -->
|
|
||||||
<div nz-row nzGutter="8">
|
|
||||||
<!-- 查询字段大于3个时,根据展开状态调整布局 -->
|
|
||||||
<ng-container>
|
|
||||||
<div nz-col [nzSpan]="_$expand ? 24 : 18">
|
|
||||||
<sf #sf [schema]="schema" [ui]="ui" [compact]="true" [button]="'none'"></sf>
|
|
||||||
</div>
|
|
||||||
<div nz-col [nzSpan]="_$expand ? 24 : 6" [class.text-right]="_$expand">
|
|
||||||
<button nz-button nzType="primary" [disabled]="!sf.valid" [nzLoading]="isLoading && st.loading" (click)="search()"acl [acl-ability]="['driver-search']">查询</button>
|
|
||||||
<button nz-button (click)="resetSF()" >重置</button>
|
|
||||||
<!-- <button nz-button (click)="export()">导出</button> -->
|
|
||||||
<button nz-button nzType="link" (click)="expandToggle()">
|
|
||||||
{{ !_$expand ? '展开' : '收起' }}
|
|
||||||
<i nz-icon [nzType]="!_$expand ? 'down' : 'up'"></i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</ng-container>
|
|
||||||
</div>
|
|
||||||
</nz-card>
|
|
||||||
<nz-card nzTitle="司机报表" [nzExtra]="extraTemplate">
|
|
||||||
<ng-template #extraTemplate>
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()">
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
<label nz-radio-button nzValue="date">日</label>
|
|
||||||
<label nz-radio-button nzValue="define">自定义</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" *ngIf="mode !== 'define'" [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-date-picker>
|
|
||||||
<nz-range-picker [(ngModel)]="defineDate" [nzFormat]="dateFormat" *ngIf="mode === 'define'" [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-range-picker>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
<st #st multiSort [columns]="columns" [ps]="20" [data]="service.$api_listDriverReportPage"
|
|
||||||
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
|
||||||
[scroll]="{ x: '1200px' }" [res]="{ reName: { list: 'data.records', total: 'data.total' } }"
|
|
||||||
[page]="{ show: true, showSize: true, pageSizes: [20, 50, 100] }">
|
|
||||||
</st>
|
|
||||||
</nz-card>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
.chooseBox{
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.timeBox{
|
|
||||||
display: flex;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
.dateBox{
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0 0 0 10px;
|
|
||||||
}
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
import { DatatableDriverComponent } from './driver.component';
|
|
||||||
|
|
||||||
describe('DatatableDriverComponent', () => {
|
|
||||||
let component: DatatableDriverComponent;
|
|
||||||
let fixture: ComponentFixture<DatatableDriverComponent>;
|
|
||||||
|
|
||||||
beforeEach(waitForAsync(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ DatatableDriverComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(DatatableDriverComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,178 +0,0 @@
|
|||||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
|
||||||
import { STColumn, STComponent } from '@delon/abc/st';
|
|
||||||
import { SFComponent, SFDateWidgetSchema, SFSchema, SFUISchema } from '@delon/form';
|
|
||||||
import { DatePipe, _HttpClient } from '@delon/theme';
|
|
||||||
import { differenceInCalendarDays } from 'date-fns';
|
|
||||||
import { DataService } from '../../../services/data.service';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-datatable-driver',
|
|
||||||
templateUrl: './driver.component.html',
|
|
||||||
styleUrls: ['./driver.component.less'],
|
|
||||||
providers: [DatePipe]
|
|
||||||
})
|
|
||||||
export class DatatableDriverComponent implements OnInit {
|
|
||||||
@ViewChild('st', { static: false }) st!: STComponent;
|
|
||||||
@ViewChild('sf', { static: false }) sf!: SFComponent;
|
|
||||||
_$expand = false;
|
|
||||||
type = 1;
|
|
||||||
mode = 'year';
|
|
||||||
date: any = null;
|
|
||||||
defineDate = [];
|
|
||||||
queryTime: any = [new Date().getFullYear()]
|
|
||||||
dateFormat = 'yyyy';
|
|
||||||
today = new Date();
|
|
||||||
ui: SFUISchema = {};
|
|
||||||
schema: SFSchema = {};
|
|
||||||
|
|
||||||
columns: STColumn[] = [
|
|
||||||
{ title: '司机姓名', index: 'driverName', className: 'text-center' },
|
|
||||||
{ title: '手机号', index: 'driverPhone', className: 'text-center' },
|
|
||||||
{ title: '注册时间', index: 'driverRegisterTime', className: 'text-center' },
|
|
||||||
{
|
|
||||||
title: '司机状态', index: 'driverStatus', className: 'text-center', type: 'enum', enum: {
|
|
||||||
0: '未激活',
|
|
||||||
1: '活跃',
|
|
||||||
2: '沉默',
|
|
||||||
3: '流失',
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ title: '运单数', index: 'wbAllCount', className: 'text-center' },
|
|
||||||
{ title: '待接单运单', index: 'wbWaitCount', className: 'text-center' },
|
|
||||||
{ title: '已完成运单', index: 'wbOverCount', className: 'text-center' },
|
|
||||||
{ title: '运费金额', index: 'wbAllAmount', className: 'text-right', width: '100px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.wbAllAmount }) } },
|
|
||||||
{ title: '已收运费金额', index: 'wbGetAmount', className: 'text-right', width: '100px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.wbGetAmount }) } },
|
|
||||||
{ title: '待收运费金额', index: 'wbWaitAmount', className: 'text-right', width: '100px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.wbWaitAmount }) } },
|
|
||||||
];
|
|
||||||
isLoading: boolean = false;
|
|
||||||
/**
|
|
||||||
* 查询参数
|
|
||||||
*/
|
|
||||||
get reqParams() {
|
|
||||||
if (this.mode === 'year') {
|
|
||||||
this.type = 1
|
|
||||||
} else if (this.mode === 'month') {
|
|
||||||
this.type = 2
|
|
||||||
} else if (this.mode === 'date') {
|
|
||||||
this.type = 3
|
|
||||||
} else {
|
|
||||||
this.type = 4
|
|
||||||
}
|
|
||||||
let params: any = {
|
|
||||||
queryTime: this.queryTime,
|
|
||||||
...this.sf?.value
|
|
||||||
};
|
|
||||||
|
|
||||||
delete params._$expand;
|
|
||||||
return { ...params };
|
|
||||||
}
|
|
||||||
constructor(public service: DataService, private datePipe: DatePipe) { }
|
|
||||||
ngOnInit(): void {
|
|
||||||
this.initSF();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* 初始化查询表单
|
|
||||||
*/
|
|
||||||
initSF() {
|
|
||||||
this.schema = {
|
|
||||||
properties: {
|
|
||||||
_$expand: { type: 'boolean', ui: { hidden: true } },
|
|
||||||
driverName: {
|
|
||||||
type: 'string',
|
|
||||||
title: '司机姓名',
|
|
||||||
ui: {
|
|
||||||
placeholder: '请输入',
|
|
||||||
}
|
|
||||||
},
|
|
||||||
driverPhone: {
|
|
||||||
type: 'string',
|
|
||||||
title: '手机号',
|
|
||||||
ui: {
|
|
||||||
placeholder: '请选择',
|
|
||||||
}
|
|
||||||
},
|
|
||||||
driverStatus: {
|
|
||||||
type: 'string',
|
|
||||||
title: '司机状态',
|
|
||||||
ui: {
|
|
||||||
widget: 'select',
|
|
||||||
placeholder: '请选择',
|
|
||||||
},
|
|
||||||
enum: [
|
|
||||||
{ label: '未激活', value: 0 },
|
|
||||||
{ label: '活跃', value: 1 },
|
|
||||||
{ label: '沉默', value: 2 },
|
|
||||||
{ label: '流失', value: 3 },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
driverRegisterTime: {
|
|
||||||
title: '注册时间',
|
|
||||||
type: 'string',
|
|
||||||
ui: {
|
|
||||||
widget: 'sl-from-to', type: 'date', format: 'yyyy-MM-dd', visibleIf: {
|
|
||||||
_$expand: (value: boolean) => value,
|
|
||||||
},
|
|
||||||
} as SFDateWidgetSchema,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
type: 'object'
|
|
||||||
};
|
|
||||||
this.ui = { '*': { spanLabelFixed: 110, grid: { span: 8, gutter: 4 } } };
|
|
||||||
}
|
|
||||||
changeData() {
|
|
||||||
if (this.mode === 'year') {
|
|
||||||
this.dateFormat = 'yyyy'
|
|
||||||
} else if (this.mode === 'month') {
|
|
||||||
this.dateFormat = 'yyyy-MM'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
onChange(result: any) {
|
|
||||||
if(result === null) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// if (this.mode === 'year') {
|
|
||||||
// this.queryTime = this.datePipe.transform(this.date, 'yyyy')
|
|
||||||
// } else if (this.mode === 'month') {
|
|
||||||
// this.queryTime = this.datePipe.transform(this.date, 'yyyy-MM')
|
|
||||||
// }
|
|
||||||
|
|
||||||
if(this.mode === 'year') {
|
|
||||||
this.queryTime = [this.datePipe.transform(this.date, 'yyyy')]
|
|
||||||
} else if(this.mode === 'month') {
|
|
||||||
this.queryTime = [this.datePipe.transform(this.date, 'yyyy-MM')]
|
|
||||||
} else if(this.mode === 'date') {
|
|
||||||
this.queryTime = [this.datePipe.transform(this.date, 'yyyy-MM-dd')]
|
|
||||||
} else{
|
|
||||||
this.queryTime = [this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd'), this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd')]
|
|
||||||
}
|
|
||||||
|
|
||||||
this.st.reload({ ...this.reqParams });
|
|
||||||
}
|
|
||||||
disabledDate = (current: Date): boolean =>
|
|
||||||
// Can not select days before today and today
|
|
||||||
differenceInCalendarDays(current, this.today) > 0;
|
|
||||||
|
|
||||||
export() {
|
|
||||||
// this.service.downloadFile(this.service.$api_exportUploadBill, this.sf?.value, {});
|
|
||||||
}
|
|
||||||
search() {
|
|
||||||
this.st?.load(1)
|
|
||||||
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* 伸缩查询条件
|
|
||||||
*/
|
|
||||||
expandToggle() {
|
|
||||||
this._$expand = !this._$expand;
|
|
||||||
this.sf?.setValue('/_$expand', this._$expand);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 重置表单
|
|
||||||
*/
|
|
||||||
resetSF() {
|
|
||||||
this.sf.reset();
|
|
||||||
this._$expand = false;
|
|
||||||
this.isLoading = true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,51 +0,0 @@
|
|||||||
<!--
|
|
||||||
* @Description :
|
|
||||||
* @Version : 1.0
|
|
||||||
* @Author : Shiming
|
|
||||||
* @Date : 2022-03-30 17:57:46
|
|
||||||
* @LastEditors : Shiming
|
|
||||||
* @LastEditTime : 2022-04-19 15:09:26
|
|
||||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\customtable\\mancustomtable\\mancustomtable.component.html
|
|
||||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
||||||
-->
|
|
||||||
<!-- 页头 -->
|
|
||||||
<page-header-wrapper [title]="'业务员报告'"></page-header-wrapper>
|
|
||||||
<nz-card >
|
|
||||||
<nz-tabset (nzSelectedIndexChange)="selectChange($event)" [nzTabBarExtraContent]="extraTemplate">
|
|
||||||
<nz-tab [nzTitle]="'客户'"></nz-tab>
|
|
||||||
<nz-tab [nzTitle]="'合伙人'"></nz-tab>
|
|
||||||
</nz-tabset>
|
|
||||||
<ng-template #extraTemplate>
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<sf #sf [schema]="searchSchema" button="none"
|
|
||||||
[ui]="{ '*': { spanLabelFixed: 0, grid: { xxl:5,xl:4, lg: 8, md: 12, sm: 12, xs: 24,gutter:20 } } }"
|
|
||||||
[compact]="true">
|
|
||||||
<ng-template sf-template="no4" let-me let-ui="ui" let-schema="schema">
|
|
||||||
<div class="chooseBox">
|
|
||||||
<div class="timeBox">
|
|
||||||
<nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()" acl [acl-ability]="['mancustomtable-search']">
|
|
||||||
<label nz-radio-button nzValue="year">年</label>
|
|
||||||
<label nz-radio-button nzValue="month">月</label>
|
|
||||||
<label nz-radio-button nzValue="date">日</label>
|
|
||||||
<label nz-radio-button nzValue="define">自定义</label>
|
|
||||||
</nz-radio-group>
|
|
||||||
<div class="dateBox">
|
|
||||||
<nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" *ngIf="mode !== 'define'"
|
|
||||||
[nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-date-picker>
|
|
||||||
<nz-range-picker [(ngModel)]="defineDate" [nzFormat]="dateFormat" *ngIf="mode === 'define'"
|
|
||||||
[nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-range-picker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</sf>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
<st #st multiSort [columns]="columns" [ps]="20" [data]="service.$api_listPartBusinessReportPage"
|
|
||||||
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
|
||||||
[scroll]="{ x: '1200px' }" [res]="{ reName: { list: 'data.records', total: 'data.total' } }"
|
|
||||||
[page]="{ show: true, showSize: true, pageSizes: [20, 50, 100] }">
|
|
||||||
</st>
|
|
||||||
</nz-card>
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
.chooseBox {
|
|
||||||
display: flex;
|
|
||||||
float : right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.timeBox {
|
|
||||||
display: flex;
|
|
||||||
margin : 0 0 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dateBox {
|
|
||||||
display: inline-block;
|
|
||||||
margin : 0 0 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
:host::ng-deep {
|
|
||||||
.ant-form-item-control {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
import { DatatableMancustomtableComponent } from './mancustomtable.component';
|
|
||||||
|
|
||||||
describe('DatatableMancustomtableComponent', () => {
|
|
||||||
let component: DatatableMancustomtableComponent;
|
|
||||||
let fixture: ComponentFixture<DatatableMancustomtableComponent>;
|
|
||||||
|
|
||||||
beforeEach(waitForAsync(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
declarations: [ DatatableMancustomtableComponent ]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
}));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
fixture = TestBed.createComponent(DatatableMancustomtableComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user