init

.editorconfig

+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

.gitignore

+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# compiled output
+/dist
+/tmp
+/out-tsc
+# Only exists if Bazel was run
+/bazel-out
+
+# dependencies
+/node_modules
+
+# profiling files
+chrome-profiler-events.json
+speed-measure-plugin.json
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# IDE - VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# misc
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
+npm-debug.log
+yarn-error.log
+testem.log
+/typings
+
+# System Files
+.DS_Store
+Thumbs.db

README.md

+# YdLife
+
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.3.5.
+
+## Development server
+
+Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
+
+## Code scaffolding
+
+Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+
+## Build
+
+Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
+
+## Running unit tests
+
+Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Running end-to-end tests
+
+Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

angular.json

+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "ydLife": {
+      "root": "",
+      "sourceRoot": "src", // 源码根目录
+      "projectType": "application",
+      "prefix": "ydlife", // 使用`ng generate`命令时，自动为selector元数据的值添加的前缀名
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss"
+        }
+      },
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/",
+            "index": "src/index.html", //指定首页文件，默认值是`index.html`
+            "main": "src/main.ts", // 指定应用的入门文件
+            "polyfills": "src/polyfills.ts", // 指定polyfill文件
+            "tsConfig": "src/tsconfig.app.json", // 指定tsconfig文件
+            "assets": [ // 记录资源文件夹，构建时复制到`outDir`指定的目录
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [ // 引入全局样式，构建时会打包进来，常用于第三方库引入的样式
+              "src/assets/font/iconfont.css",
+              "src/assets/weui/weui.css",
+              "src/styles.scss"
+            ],
+            "scripts": [], // 引入全局脚步，构建时会打包进来，常用于第三方库引入的脚本
+            "es5BrowserSupport": true
+          },
+          "configurations": {
+            "dev": {
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "deployUrl": "",
+              "baseHref": "/ydLife/",
+              "namedChunks": false,
+              "aot": false,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": false,
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                }
+              ]
+            },
+            "stage": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.stage.ts"
+                }
+              ],
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "deployUrl": "",
+              "baseHref": "/ydLife/",
+              "namedChunks": false,
+              "aot": false,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": false,
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                }
+              ]
+            },
+            "production": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "deployUrl": "",
+              "baseHref": "/ydLife/",
+              "namedChunks": false,
+              "aot": false,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": false,
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                }
+              ]
+            }
+          }
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "options": {
+            "browserTarget": "ydLife:build"
+          },
+          "configurations": {
+            "production": {
+              "browserTarget": "ydLife:build:production"
+            }
+          }
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "ydLife:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "src/test.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "src/tsconfig.spec.json",
+            "karmaConfig": "src/karma.conf.js",
+            "styles": [
+              "src/styles.scss"
+            ],
+            "scripts": [],
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ]
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "src/tsconfig.app.json",
+              "src/tsconfig.spec.json"
+            ],
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    },
+    "ydLife-e2e": {
+      "root": "e2e/",
+      "projectType": "application",
+      "prefix": "",
+      "architect": {
+        "e2e": {
+          "builder": "@angular-devkit/build-angular:protractor",
+          "options": {
+            "protractorConfig": "e2e/protractor.conf.js",
+            "devServerTarget": "ydLife:serve"
+          },
+          "configurations": {
+            "production": {
+              "devServerTarget": "ydLife:serve:production"
+            }
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": "e2e/tsconfig.e2e.json",
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    }
+  },
+  "defaultProject": "ydLife"
+}
\ No newline at end of file

e2e/protractor.conf.js

+// Protractor configuration file, see link for more information
+// https://github.com/angular/protractor/blob/master/lib/config.ts
+
+const { SpecReporter } = require('jasmine-spec-reporter');
+
+exports.config = {
+  allScriptsTimeout: 11000,
+  specs: [
+    './src/**/*.e2e-spec.ts'
+  ],
+  capabilities: {
+    'browserName': 'chrome'
+  },
+  directConnect: true,
+  baseUrl: 'http://localhost:4200/',
+  framework: 'jasmine',
+  jasmineNodeOpts: {
+    showColors: true,
+    defaultTimeoutInterval: 30000,
+    print: function() {}
+  },
+  onPrepare() {
+    require('ts-node').register({
+      project: require('path').join(__dirname, './tsconfig.e2e.json')
+    });
+    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
+  }
+};
\ No newline at end of file

e2e/src/app.e2e-spec.ts

+import { AppPage } from './app.po';
+import { browser, logging } from 'protractor';
+
+describe('workspace-project App', () => {
+  let page: AppPage;
+
+  beforeEach(() => {
+    page = new AppPage();
+  });
+
+  it('should display welcome message', () => {
+    page.navigateTo();
+    expect(page.getTitleText()).toEqual('Welcome to ydLife!');
+  });
+
+  afterEach(async () => {
+    // Assert that there are no errors emitted from the browser
+    const logs = await browser.manage().logs().get(logging.Type.BROWSER);
+    expect(logs).not.toContain(jasmine.objectContaining({
+      level: logging.Level.SEVERE,
+    } as logging.Entry));
+  });
+});

e2e/src/app.po.ts

+import { browser, by, element } from 'protractor';
+
+export class AppPage {
+  navigateTo() {
+    return browser.get(browser.baseUrl) as Promise<any>;
+  }
+
+  getTitleText() {
+    return element(by.css('app-root h1')).getText() as Promise<string>;
+  }
+}

e2e/tsconfig.e2e.json

+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../out-tsc/app",
+    "module": "commonjs",
+    "target": "es5",
+    "types": [
+      "jasmine",
+      "jasminewd2",
+      "node"
+    ]
+  }
+}
\ No newline at end of file

package.json

+{
+  "name": "protest",
+  "version": "0.0.0",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve --host 192.168.1.25",
+    "buildDev": "ng build -c=dev --prod",
+    "buildStage": "ng build -c=stage --prod",
+    "buildProd": "ng build -c=production --prod",
+    "test": "ng test",
+    "lint": "ng lint",
+    "e2e": "ng e2e"
+  },
+  "private": true,
+  "dependencies": {
+    "@angular/animations": "~7.2.0",
+    "@angular/common": "~7.2.0",
+    "@angular/compiler": "~7.2.0",
+    "@angular/core": "~7.2.0",
+    "@angular/forms": "~7.2.0",
+    "@angular/platform-browser": "~7.2.0",
+    "@angular/platform-browser-dynamic": "~7.2.0",
+    "@angular/router": "~7.2.0",
+    "buffer": "^5.4.3",
+    "core-js": "^2.5.4",
+    "html2canvas": "^1.0.0-rc.5",
+    "rxjs": "~6.3.3",
+    "tslib": "^1.9.0",
+    "uuid": "^3.3.3",
+    "zone.js": "~0.8.26"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "~0.13.0",
+    "@angular/cli": "~7.3.5",
+    "@angular/compiler-cli": "~7.2.0",
+    "@angular/language-service": "~7.2.0",
+    "@types/jasmine": "~2.8.8",
+    "@types/jasminewd2": "~2.0.3",
+    "@types/node": "~8.9.4",
+    "codelyzer": "~4.5.0",
+    "jasmine-core": "~2.99.1",
+    "jasmine-spec-reporter": "~4.2.1",
+    "karma": "~4.0.0",
+    "karma-chrome-launcher": "~2.2.0",
+    "karma-coverage-istanbul-reporter": "~2.0.1",
+    "karma-jasmine": "~1.1.2",
+    "karma-jasmine-html-reporter": "^0.2.2",
+    "protractor": "~5.4.0",
+    "ts-node": "~7.0.0",
+    "tslint": "~5.11.0",
+    "typescript": "~3.2.2"
+  }
+}
\ No newline at end of file

src/app/app-routing.module.ts

+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { PageNotFoundComponent } from './page-not-found/page-not-found.component';
+import { AuthGuard } from './auth/auth.guard';
+
+const routes: Routes = [
+  { path: '', redirectTo: '/my', pathMatch: 'full' },
+  { path: 'my', loadChildren: () => import('./my/my.module').then(mod => mod.MyModule), canLoad: [AuthGuard] },
+  { path: 'login', loadChildren: () => import('./auth/auth.module').then(mod => mod.AuthModule) },
+  { path: '**', component: PageNotFoundComponent }
+];
+
+@NgModule({
+  imports: [RouterModule.forRoot(routes)],
+  exports: [RouterModule]
+})
+export class AppRoutingModule {
+}

src/app/app.component.html

+<!--The content below is only a placeholder and can be replaced.-->
+<router-outlet></router-outlet>
+<ydlife-guide-page *ngIf="shareGuidePageEnable"></ydlife-guide-page>
+<ydlife-alert *ngIf="isNeedAlert" [dialogInfo]="dialogInfo" (popInfo)="getPopInfo()"></ydlife-alert>
\ No newline at end of file

src/app/app.component.spec.ts

+import { TestBed, async } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { AppComponent } from './app.component';
+
+describe('AppComponent', () => {
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        RouterTestingModule
+      ],
+      declarations: [
+        AppComponent
+      ],
+    }).compileComponents();
+  }));
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.debugElement.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it(`should have as title 'ydLife'`, () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.debugElement.componentInstance;
+    expect(app.title).toEqual('ydLife');
+  });
+
+  it('should render title in a h1 tag', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+    const compiled = fixture.debugElement.nativeElement;
+    expect(compiled.querySelector('h1').textContent).toContain('Welcome to ydLife!');
+  });
+});

src/app/app.component.ts

+import { Component, OnDestroy, OnInit } from '@angular/core';
+import { AuthService } from "./auth/auth.service";
+import { LifeCommonService } from "./common/life-common.service";
+import { Subscription } from "rxjs/index";
+declare var wx: any;
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: ['./app.component.scss']
+})
+export class AppComponent implements OnInit, OnDestroy {
+  shareGuidePageEnable: boolean;
+  subscription: Subscription;
+  currentVersion: any;
+  isNeedAlert: boolean;
+  dialogInfo: any;
+
+  constructor(private authService: AuthService, private lifeCommonService: LifeCommonService) {
+    this.subscription = lifeCommonService.shareStatus$.subscribe(status => {
+      this.shareGuidePageEnable = status == '1';
+    });
+  }
+
+  ngOnInit() {
+    this.authService.obtainToken().subscribe(res => {
+      if (res['success']) {
+        localStorage.setItem('lifeToken', res['data']['token']);
+        this.ydWxConfig();
+      }
+    });
+
+    this.getVersion();
+  }
+
+  ngOnDestroy() {
+    this.subscription.unsubscribe();
+  }
+
+
+  // 微信JS-SDK注册
+  ydWxConfig() {
+    const url = encodeURIComponent(location.href.split('#')[0]);
+    this.authService.ydWxConfig(url).subscribe(res => {
+      const data = res['data'];
+      wx.config({
+        debug: false,
+        appId: data.appId,
+        timestamp: data.timestamp,
+        nonceStr: data.nonceStr,
+        signature: data.signature,
+        jsApiList: data.jsApiList,
+        beta: true
+      });
+    });
+  }
+
+  // 关闭弹窗
+  getPopInfo() {
+    this.isNeedAlert = false;
+    let { search, href } = window.location;
+    href = href.replace(/&?t_reload=(\d+)/g, '');
+    window.location.href = href + (search ? '&' : '?') + 't_reload=' + new Date().getTime();
+    localStorage.setItem('Version', this.currentVersion)
+  }
+
+  getVersion() {
+    this.authService.currentVersionQuery().subscribe((res) => {
+      if (res['data']['currentVersion']) {
+        this.currentVersion = res['data']['currentVersion'];
+      }
+      //只在微信端判断缓存
+      if (this.lifeCommonService.checkDeviceType() === '3') {
+        //如果本地没有版本号刷新并设置缓存
+        if (!localStorage.getItem('Version')) {
+          this.isNeedAlert = true;
+          this.dialogInfo = {
+            title: null,
+            content: { value: '检测到新版本', align: 'center' },
+            footer: [{ value: '更新', routerLink: '', className: 'weui-dialog__btn_primary' }],
+          };
+        } else {
+          const Version = localStorage.getItem('Version');
+          //如果缓存有版本号对比本地和接口版本
+          if (Version != this.currentVersion) {
+            this.isNeedAlert = true;
+            this.dialogInfo = {
+              title: null,
+              content: { value: '检测到新版本', align: 'center' },
+              footer: [{ value: '更新', routerLink: '', className: 'weui-dialog__btn_primary' }],
+            };
+          }
+        }
+      }
+
+    })
+  }
+}

src/app/app.module.ts

+import { BrowserModule } from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+import { AppRoutingModule } from './app-routing.module';
+import { AppComponent } from './app.component';
+import { PageNotFoundComponent } from './page-not-found/page-not-found.component';
+import { MyModule } from './my/my.module';
+import { Router } from '@angular/router';
+import { AuthModule } from './auth/auth.module';
+import { HttpClientModule } from '@angular/common/http';
+import { LifeCommonModule } from './common/life-common.module';
+import { httpInterceptorProviders } from './http-interceptors/index';
+import { DatePipe } from "@angular/common";
+import { SafeHtmlPipe } from './safe-html.pipe';
+import { LocalStorage } from './domain/local.storage';
+import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
+
+@NgModule({
+  declarations: [
+    AppComponent,
+    PageNotFoundComponent,
+    SafeHtmlPipe
+  ],
+  imports: [
+    BrowserModule,
+    MyModule,
+    AuthModule,
+    LifeCommonModule,
+    HttpClientModule,
+    AppRoutingModule,
+    BrowserAnimationsModule
+  ],
+  providers: [DatePipe, httpInterceptorProviders, LocalStorage],
+  bootstrap: [AppComponent]
+})
+export class AppModule {
+}

src/app/auth/auth-routing.module.ts

+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import {LoginComponent} from './login/login.component';
+
+const routes: Routes = [
+  { path: '', component: LoginComponent }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class AuthRoutingModule { }

src/app/auth/auth.guard.spec.ts

+import { TestBed, async, inject } from '@angular/core/testing';
+
+import { AuthGuard } from './auth.guard';
+
+describe('AuthGuard', () => {
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      providers: [AuthGuard]
+    });
+  });
+
+  it('should ...', inject([AuthGuard], (guard: AuthGuard) => {
+    expect(guard).toBeTruthy();
+  }));
+});

src/app/auth/auth.guard.ts

+import { Injectable } from '@angular/core';
+import {
+  CanActivate, Router,
+  ActivatedRouteSnapshot,
+  RouterStateSnapshot,
+  CanActivateChild,
+  NavigationExtras,
+  CanLoad, Route
+} from '@angular/router';
+import { AuthService } from './auth.service';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class AuthGuard implements CanActivate, CanActivateChild, CanLoad {
+  constructor(private authService: AuthService, private router: Router) {
+  }
+
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
+    let url: string = state.url;
+    return this.checkLogin(url);
+  }
+
+  canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
+    return this.canActivate(route, state);
+  }
+
+  canLoad(route: Route): boolean {
+    let url = `/${route.path}`;
+    return this.checkLogin(url);
+  }
+
+  checkLogin(url: string): boolean {
+    const lifeCustomerInfo = localStorage.getItem('lifeCustomerInfo') ? JSON.parse(localStorage.getItem('lifeCustomerInfo')) : null;
+    if (this.authService.isLoggedIn || (lifeCustomerInfo && lifeCustomerInfo['customerId'] && lifeCustomerInfo['practitionerId'])) {
+      return true;
+    }
+    // Store the attempted URL for redirecting
+    this.authService.redirectUrl = url;
+    // Navigate to the login page with extras
+    this.router.navigate(['/login']);
+    return false;
+  }
+
+}

src/app/auth/auth.module.ts

+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
+
+import {AuthRoutingModule} from './auth-routing.module';
+import {LoginComponent} from './login/login.component';
+import {LifeCommonModule} from "../common/life-common.module";
+
+@NgModule({
+  declarations: [LoginComponent],
+  imports: [
+    CommonModule,
+    LifeCommonModule,
+    AuthRoutingModule
+  ]
+})
+export class AuthModule {
+}

src/app/auth/auth.service.spec.ts

+import { TestBed } from '@angular/core/testing';
+
+import { AuthService } from './auth.service';
+
+describe('AuthService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: AuthService = TestBed.get(AuthService);
+    expect(service).toBeTruthy();
+  });
+});

src/app/auth/auth.service.ts

+import { Injectable } from '@angular/core';
+
+import { Observable, of, throwError } from 'rxjs';
+import { environment } from '../../environments/environment';
+import { HttpClient, HttpErrorResponse } from '@angular/common/http';
+import { catchError } from 'rxjs/internal/operators';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class AuthService {
+  constructor(private http: HttpClient) {
+  }
+
+  private API = environment.BACKEND_URL_CONFIG_VALUE;
+  private ydapi = environment.ORIGINNAME;
+  isLoggedIn = false;
+  // store the URL so we can redirect after logging in
+  redirectUrl: string;
+  // 经纪人登陆
+  login(loginInfo): Observable<any> {
+    const api = this.ydapi + '/practitioner/login';
+    return this.http.post(api, JSON.stringify(loginInfo));
+  }
+
+  //  发送验证码
+  verificationCode(verticalCode) {
+    const url = this.API + '/verificationCode';
+    return this.http
+      .post(url, JSON.stringify(verticalCode));
+  }
+
+  //  校验验证码
+  compare(compareCode) {
+    const url = this.API + '/checkVerificationCode';
+    return this.http
+      .post(url, JSON.stringify(compareCode))
+      .pipe(
+        catchError(this.handleError)
+      );
+  }
+
+  /**
+   * 获取TOKEN
+   */
+  obtainToken() {
+    const url = this.API + '/authorize/obtainToken';
+    const ticketObj = {
+      ticket: 'life'
+    };
+    return this.http.post(url, JSON.stringify(ticketObj));
+  }
+
+  //获取微信配置ydLife公众号
+  ydWxConfig(Currenturl) {
+    const url = this.ydapi + '/wxConfig';
+    const postUrl = {
+      url: Currenturl
+    };
+    return this.http.post(url, JSON.stringify(postUrl));
+  }
+
+
+
+  //  获取错误详情
+  private handleError(error: HttpErrorResponse) {
+    if (error.error instanceof ErrorEvent) {
+      console.error('An error occurred:', error.error.message);
+    } else {
+      console.error(
+        `Backend returned code ${error.status}, ` +
+        `body was: ${JSON.stringify(error.error)}`);
+    }
+    return throwError(
+      'Something bad happened; please try again later.');
+  }
+
+  currentVersionQuery() {
+    const url = this.API + '/metadata/currentVersionQuery';
+    return this.http.get(url);
+  }
+
+  getOppId(urlParam) {
+    return this.http.get(urlParam)
+  }
+}

src/app/auth/login/login.component.html

+<div class="page form_vcode js_show">
+  <div class="weui-form">
+    <div class="weui-form__text-area" style="position: relative;">
+      <img style="width: 100%;" src="assets/images/ydinsurance_logo.png">
+      <div style="font-family: '微软雅黑';position: absolute; top: 65%;left: 35%;font-size: 14px;">
+        海纳百<span style="letter-spacing: 3px;">川</span>赢家后盾
+      </div>
+    </div>
+    <div class="weui-form__control-area">
+      <div class="weui-cells__group weui-cells__group_form">
+        <div class="weui-cells weui-cells_form">
+          <div class="weui-cell" style="padding:10px 0px">
+            <!-- <div class="weui-cell__hd"><label class="weui-label">手机号</label></div> -->
+            <div class="weui-cell__bd">
+              <input autofocus="" class="weui-input" type="tel" maxlength="11" pattern="[0-9]*" placeholder="请输入手机号"
+                name="mobileNo" [(ngModel)]="userInfo.mobileNo" (blur)="inputBlur()">
+            </div>
+          </div>
+          <div class="weui-cell weui-cell_vcode" style="padding:12px 0px">
+            <!-- <div class="weui-cell__hd"><label class="weui-label">验证码</label></div> -->
+            <div class="weui-cell__bd">
+              <input class="weui-input" type="tel" pattern="[0-9]*" id="js_input" placeholder="请输入验证码" maxlength="4"
+                name="verificationCode" [(ngModel)]="userInfo.verificationCode" (blur)="inputBlur()">
+            </div>
+            <div class="weui-cell__ft">
+              <button class="weui-btn weui-btn_default weui-vcode-btn" (click)="verificationCode()">{{sendCodeHtml}}
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="weui-form__opr-area">
+      <a class="weui-btn weui-btn_primary login" href="javascript:" id="showTooltips"
+        style="width:100%;padding: 10px 24px;" (click)="login()">登录</a>
+    </div>
+  </div>
+</div>
+<ydlife-alert *ngIf="isNeedAlert" [dialogInfo]="dialogInfo" (popInfo)="getPopInfo()"></ydlife-alert>
\ No newline at end of file

src/app/auth/login/login.component.scss

+.weui-form__control-area{
+    margin: 20px 0 45px 0;
+}
+.weui-form{
+    padding: 56px 15px 0px 15px;
+}
+.weui-form__opr-area{
+    .login{
+        color: #fff;
+        background: #ff1c2b;
+    }
+}
+.weui-cells__group_form .weui-cells:before, .weui-cells__group_form .weui-cell:before{
+    left:0;
+    right: 0;
+}
+.weui-cells__group_form .weui-cells:before{
+    border-top: none;
+}
+.weui-cells__group_form .weui-cells:after {
+    left: 0;
+    right: 0;
+}
+.weui-cells__group_form .weui-vcode-btn{
+    background: none;
+    background: none;
+    border: 1px red solid;
+    color: red;
+    font-weight: normal;
+}
+.weui-input {
+    caret-color: red;
+    font-size: 20px;
+    padding-left: 10px;
+}
+.weui-input::-webkit-input-placeholder {
+    font-size: 20px;
+ }
+

src/app/auth/login/login.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LoginComponent } from './login.component';
+
+describe('LoginComponent', () => {
+  let component: LoginComponent;
+  let fixture: ComponentFixture<LoginComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ LoginComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(LoginComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/auth/login/login.component.ts

+import { Component, OnDestroy, OnInit } from '@angular/core';
+import { NavigationExtras, Router } from '@angular/router';
+import { AuthService } from '../auth.service';
+import { LifeCommonService } from '../../common/life-common.service';
+
+@Component({
+  selector: 'ydlife-login',
+  templateUrl: './login.component.html',
+  styleUrls: ['./login.component.scss']
+})
+export class LoginComponent implements OnInit, OnDestroy {
+  MOBILE_REGEXP = /^(1)\d{10}$/;
+  sendCodeHtml: string = '获取验证码';
+  timer: any;
+  remainTimes: number = 60;
+  disabledSendBtn: boolean = false;
+  userInfo: any = {
+    mobileNo: null,
+    verificationCode: null
+  };
+  isNeedAlert: boolean;
+  dialogInfo: any;
+  redirect: any;
+  constructor(public authService: AuthService, public router: Router, public lifeCommonService: LifeCommonService) {
+  }
+
+  ngOnInit() {
+
+  }
+
+  ngOnDestroy() {
+    clearInterval(this.timer);
+  }
+
+  inputBlur() {
+    window.scrollTo(0, 0)
+  }
+
+  login() {
+    const compareInfo = {
+      mobileNo: this.userInfo.mobileNo,
+      verificationCode: this.userInfo.verificationCode,
+      expireTime: '3600'
+    };
+    if (this.MOBILE_REGEXP.test(this.userInfo.mobileNo) && this.userInfo.verificationCode && this.userInfo.verificationCode.length == 4) {
+      this.authService.compare(compareInfo).subscribe(res => {
+        if (res['success']) {
+          this.authService.login({ mobileNo: this.userInfo.mobileNo }).subscribe((response) => {
+            if (response['success']) {
+              this.authService.isLoggedIn = true;
+              const lifeCustomerInfo = { ...response.data, mobileNo: this.userInfo.mobileNo, commonResult: null };
+              if (lifeCustomerInfo['customerId'] && lifeCustomerInfo['practitionerId']) {
+                localStorage.setItem('lifeCustomerInfo', JSON.stringify(lifeCustomerInfo));
+                //如果有openId跳页由后端判断，没有的话根据登录次数前端判断跳页
+                if (response['data']['getOpenIdUrl']) {
+                  const deviceType = this.lifeCommonService.checkDeviceType()
+                  if (deviceType == 3) {
+                    window.location.href = response['data']['getOpenIdUrl'];
+                  } else {
+                    if (response['data']['loginTimes'] > 0) {
+                      this.redirect = this.authService.redirectUrl ? this.router.parseUrl(this.authService.redirectUrl) : '/my';
+                      this.router.navigateByUrl(this.redirect);
+                    } else {
+                      this.redirect = this.authService.redirectUrl ? this.router.parseUrl(this.authService.redirectUrl) : '/thanks';
+                      this.router.navigateByUrl(this.redirect);
+                    }
+                  }
+                } else {
+                  if (response['data']['loginTimes'] > 0) {
+                    this.redirect = this.authService.redirectUrl ? this.router.parseUrl(this.authService.redirectUrl) : '/my';
+                    this.router.navigateByUrl(this.redirect);
+                  } else {
+                    this.redirect = this.authService.redirectUrl ? this.router.parseUrl(this.authService.redirectUrl) : '/thanks';
+                    this.router.navigateByUrl(this.redirect);
+                  }
+                }
+                // if (response['data']['loginTimes'] > 0) {
+                //   this.redirect = this.authService.redirectUrl ? this.router.parseUrl(this.authService.redirectUrl) : '/my';
+                //   this.router.navigateByUrl(this.redirect);
+                //   // if (response['data']['getOpenIdUrl']) {
+                //   //   window.location.href = response['data']['getOpenIdUrl'];
+                //   // } else {
+                //   //   this.redirect = this.authService.redirectUrl ? this.router.parseUrl(this.authService.redirectUrl) : '/my';
+                //   //   this.router.navigateByUrl(this.redirect);
+                //   // }
+                // } else {
+                //   this.router.navigateByUrl('/thanks')
+                //   // if (response['data']['getOpenIdUrl']) {
+                //   //   window.location.href = response['data']['getOpenIdUrl'];
+                //   // } else {
+                //   //   this.router.navigateByUrl('/thanks')
+                //   // }
+                // }
+              } else {
+                this.openPopInfo('暂无查询资格');
+              }
+            } else {
+              this.openPopInfo(response['message']);
+            }
+          });
+        } else {
+          this.openPopInfo(res['message']);
+        }
+      });
+    } else {
+      this.openPopInfo('手机号或验证码不正确');
+    }
+  }
+
+  //  发送验证码
+  verificationCode() {
+    const verificationInfo = {
+      mobileNo: this.userInfo.mobileNo,
+      type: '1'
+    };
+    if (this.MOBILE_REGEXP.test(this.userInfo.mobileNo) && !this.disabledSendBtn) {
+      this.authService.verificationCode(verificationInfo).subscribe(res => {
+        if (res['success']) {
+          this.countDown();
+        } else {
+          this.openPopInfo(res['message']);
+        }
+      });
+    } else if (!this.MOBILE_REGEXP.test(this.userInfo.mobileNo)) {
+      this.openPopInfo('手机号不正确');
+    }
+  }
+
+  //  倒计时
+  countDown() {
+    this.disabledSendBtn = true;
+    this.timer = setInterval(() => {
+      this.remainTimes--;
+      this.sendCodeHtml = `${this.remainTimes}(S)`;
+      if (this.remainTimes <= 0) {
+        this.sendCodeHtml = '获取验证码';
+        this.remainTimes = 60;
+        this.disabledSendBtn = false;
+        clearInterval(this.timer);
+      }
+    }, 1000);
+  }
+
+  // 打开弹窗
+  openPopInfo(message) {
+    this.isNeedAlert = true;
+    this.dialogInfo = {
+      title: null,
+      content: { value: message, align: 'center' },
+      footer: [{ value: '我知道了', routerLink: '', className: 'weui-dialog__btn_primary' }],
+    };
+  }
+
+  // 关闭弹窗
+  getPopInfo() {
+    this.isNeedAlert = false;
+  }
+}

src/app/common/alert/alert.component.html

+<div id="dialogs">
+  <!--BEGIN dialog1-->
+  <div class="js_dialog" id="iosDialog1">
+    <div class="weui-mask"></div>
+    <div class="weui-dialog" style="width: 70%;">
+      <div class="weui-dialog__hd" *ngIf="dialogInfo.title"><strong
+          class="weui-dialog__title">{{dialogInfo.title}}</strong></div>
+      <div class="weui-dialog__bd" [ngStyle]="{'text-align':dialogInfo.content.align}">{{dialogInfo.content.value}}
+      </div>
+      <div class="weui-dialog__ft" style="line-height: normal;min-height: auto;margin: 0 auto 10px auto;">
+        <a href="javascript:;" class="weui-dialog__btn" [ngClass]="footer.className"
+          *ngFor="let footer of dialogInfo.footer" (click)="sendInfo()">{{footer.value}}</a>
+      </div>
+    </div>
+  </div>
+  <!--END dialog1-->
+</div>
\ No newline at end of file

src/app/common/alert/alert.component.scss

+a:hover.weui-dialog__ft{
+    color: #fff;
+    text-decoration: none;
+}
\ No newline at end of file

src/app/common/alert/alert.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AlertComponent } from './alert.component';
+
+describe('AlertComponent', () => {
+  let component: AlertComponent;
+  let fixture: ComponentFixture<AlertComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ AlertComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AlertComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/common/alert/alert.component.ts

+import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
+
+@Component({
+  selector: 'ydlife-alert',
+  templateUrl: './alert.component.html',
+  styleUrls: ['./alert.component.scss']
+})
+export class AlertComponent implements OnInit {
+
+  @Input() dialogInfo: any;
+  @Output() popInfo = new EventEmitter();
+
+  constructor() {
+    this.dialogInfo = {
+      title: null,
+      content: {value: '弹窗内容', align: 'center'},
+      footer: [{value: '我知道了', routerLink: '', className: 'weui-dialog__btn_primary'}],
+    };
+  }
+
+  ngOnInit() {
+  }
+
+  sendInfo() {
+    this.popInfo.emit();
+  }
+}

src/app/common/guide-page/guide-page.component.html

+<div class="guidePageContainer" (click)="closeGuidePage()">
+  <div class="guideTips">
+    <p>请点击右上角菜单</p>
+    <p>分享给朋友</p>
+  </div>
+  <i class="iconfont icon-yindaojiantou"></i>
+</div>

src/app/common/guide-page/guide-page.component.scss

+.guidePageContainer {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.8);
+  color: #fff;
+  display: flex;
+  justify-content: center;
+  .guideTips {
+    margin-top: 35%;
+    letter-spacing: 3px;
+    text-align: center;
+    font-size: 22px;
+  }
+  .iconfont {
+    position: absolute;
+    right: 8%;
+    font-size: 40px;
+    top: 2px;
+    font-weight: 700;
+  }
+}

src/app/common/guide-page/guide-page.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { GuidePageComponent } from './guide-page.component';
+
+describe('GuidePageComponent', () => {
+  let component: GuidePageComponent;
+  let fixture: ComponentFixture<GuidePageComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ GuidePageComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(GuidePageComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/common/guide-page/guide-page.component.ts

+import { Component, OnInit } from '@angular/core';
+import { LifeCommonService } from "../life-common.service";
+
+@Component({
+  selector: 'ydlife-guide-page',
+  templateUrl: './guide-page.component.html',
+  styleUrls: ['./guide-page.component.scss']
+})
+export class GuidePageComponent implements OnInit {
+
+  constructor(private lifeCommonService: LifeCommonService) {
+  }
+
+  ngOnInit() {
+    setTimeout(() => {
+      this.closeGuidePage();
+    }, 6000);
+  }
+
+  closeGuidePage() {
+    this.lifeCommonService.shareStatusPublish(0);
+  }
+
+}

src/app/common/life-common.module.ts

+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { AlertComponent } from './alert/alert.component';
+import { FormsModule } from "@angular/forms";
+import { GuidePageComponent } from './guide-page/guide-page.component';
+import { SafeHtmlPipe } from './safe-html.pipe';
+
+
+@NgModule({
+  declarations: [AlertComponent, GuidePageComponent, SafeHtmlPipe],
+  imports: [
+    CommonModule,
+    FormsModule
+  ],
+  exports: [
+    FormsModule,
+    AlertComponent,
+    GuidePageComponent,
+    SafeHtmlPipe
+  ]
+})
+export class LifeCommonModule {
+}

src/app/common/life-common.service.spec.ts

+import { TestBed } from '@angular/core/testing';
+
+import { LifeCommonService } from './life-common.service';
+
+describe('LifeCommonService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: LifeCommonService = TestBed.get(LifeCommonService);
+    expect(service).toBeTruthy();
+  });
+});

src/app/common/life-common.service.ts

+import { Injectable } from '@angular/core';
+import { DatePipe } from '@angular/common';
+import { Meta, Title } from '@angular/platform-browser';
+import { Subject } from "rxjs/index";
+declare var wx: any;
+@Injectable({
+  providedIn: 'root'
+})
+export class LifeCommonService {
+  private shareStatusSource = new Subject<string>();
+  shareStatus$ = this.shareStatusSource.asObservable();
+
+  constructor(private datePipe: DatePipe,
+    private titleService: Title,
+    private metaService: Meta) {
+  }
+
+  // 向订阅者发布分享结果
+  // 0.关闭分享引导页
+  // 1.用户点击分享
+  // 2.已经分享过了
+  shareStatusPublish(type) {
+    this.shareStatusSource.next(type);
+  }
+
+  /**
+   * 检测操作系统
+   */
+  checkOs() {
+    let os;
+    const isWin = (navigator.platform === 'Win32') || (navigator.platform === 'Windows');
+    const isMac = (navigator.platform === 'Mac68K') ||
+      (navigator.platform === 'MacPPC') ||
+      (navigator.platform === 'Macintosh') ||
+      (navigator.platform === 'MacIntel');
+    if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
+      os = 1;
+      return os; // 这是iOS平台下浏览器
+    } else if (/android/i.test(navigator.userAgent)) {
+      os = 2;
+      return os; // 这是Android平台下浏览器
+    } else if (isWin) {
+      os = 3;
+      return os; // 这是Android平台下浏览器
+    } else if (isMac) {
+      os = 4;
+      return os; // 这是mac系统
+    } else if (/Linux/i.test(navigator.userAgent)) {
+      os = 5;
+      return os; // 这是Linux平台下浏览器
+    } else {
+      os = 6;
+      return os;
+    }
+  }
+
+  /**
+   * 检测设备信息
+   * deviceType:PC为1,移动端为2,微信为3
+   */
+  checkDeviceType() {
+    let deviceType = null;
+    if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
+
+      if (navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1) {
+        deviceType = '3';
+      } else {
+        deviceType = '2';
+      }
+    } else {
+      deviceType = '1';
+    }
+    return deviceType;
+  }
+
+  /**
+   * shareCode生成器
+   */
+  generateShareCode(jsonParams?: any) {
+    const shareCode = {
+      shareType: '1',
+      os: this.checkOs(),
+      channel: '0',
+      isOrder: 0,
+      jsonParams: JSON.stringify(jsonParams)
+    };
+    return shareCode;
+  }
+
+  // 设置title
+  setTitle(title) {
+    this.titleService.setTitle(title);
+  }
+
+  // 更新meta标签
+  updateMeta(keywords, description) {
+    this.metaService.updateTag({ content: keywords }, 'name=keywords');
+    this.metaService.updateTag({ content: description }, 'name=description');
+  }
+
+  wxShare(title: string, desc: string, link: string, imgUrl: string) {
+    const shareData = {
+      title: title, // 分享标题
+      desc: desc, // 分享描述
+      link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
+      imgUrl: imgUrl, // 分享图标
+      success: () => {
+        this.shareStatusPublish(0);
+      }
+    };
+    wx.ready(() => {   // 需在用户可能点击分享按钮前就先调用
+      wx.updateAppMessageShareData(shareData);
+      wx.updateTimelineShareData(shareData);
+    });
+  }
+
+  // 根据开始时间设置结束时间,天数应减1，当日~当日是一天
+  setInitDate(dayCount) {
+    let dt;
+    let dtEnd;
+    (dt = new Date()).setDate(dt.getDate() + 1);
+    (dtEnd = new Date(dt)).setDate(dt.getDate() + dayCount * 1 - 1);
+    const initDate = {
+      startDate: Date.parse(dt.toDateString()),
+      endDate: Date.parse(dtEnd.toDateString())
+    };
+    sessionStorage.removeItem('timeRange');
+    sessionStorage.setItem('initDate', JSON.stringify(initDate));
+    const date = {
+      startDate: dt,
+      endDate: dtEnd
+    };
+    return date;
+  }
+
+  // 判断一年是365还是366
+  yearDayCount(days, disableCalc?: boolean) {
+    if (days === 365 || days === 366) {
+      const y = new Date().getFullYear();
+      const isLeap = (0 === y % 4) && (0 !== y % 100) || (0 === y % 400);
+      days = isLeap ? 366 : 365;
+      if (disableCalc) {
+        days = 365;
+      }
+    }
+    return days;
+  }
+
+  dateFormat(date: any, format?: string) {
+    return this.datePipe.transform(date, format);
+  }
+
+  delHtmlTag(str) {
+    return str.replace(/<[^>]+>/g, "");//去掉所有的html标记
+  }
+
+  /**
+ * 姓名正则
+ */
+  nameValid(name) {
+    const NAME_REGEXP = /(^[\u4e00-\u9fa5]{1}[\u4e00-\u9fa5\.·()（）。]{0,48}[\u4e00-\u9fa5]{1}$)|(^[a-zA-Z]{1}[a-zA-Z\s]{0,48}[a-zA-Z]{1}$)/;
+    return NAME_REGEXP.test(name);
+  }
+  /**
+   * 手机号码正则
+   * @param no
+   * @returns {boolean}
+   */
+  mobileNoValid(no) {
+    const MOBILE_REGEXP = /^(1)\d{10}$/;
+    return MOBILE_REGEXP.test(no);
+  }
+
+  getFileName(str) {
+    let strArr = str.split('?');
+    let k = strArr[0], appU = k.split('/');
+    let L = appU[appU.length - 1];
+    return L;
+  }
+
+  toPercent(point) {
+    if (point == 0) {
+      return 0 + '%';
+    }
+    let result = String(point * 100);
+    let idx = result.indexOf(".");
+    if (idx == -1 || result.substr(idx + 1).length <= 2) {
+      return result + "%";
+    }
+    return result.substr(0, idx + 2) + "%";
+  }
+
+  transform(value: any, args?: any): any {
+    if ((value + "").trim() == "") {
+      return "";
+    }
+    if (typeof value == 'string') {
+      value = value.replace(/,/gi, '');
+    }
+    if ((value + "").trim() == "") {
+      return "";
+    }
+    if (isNaN(value)) {
+      return "";
+    }
+    value = value + "";
+    if (/^.*\..*$/.test(value)) {
+      let pointIndex = value.lastIndexOf(".");
+      let intPart = value.substring(0, pointIndex);
+      let pointPart = value.substring(pointIndex + 1, value.length);
+      intPart = intPart + "";
+      const re = /(-?\d+)(\d{3})/
+      while (re.test(intPart)) {
+        intPart = intPart.replace(re, "$1,$2")
+      }
+      value = intPart + "." + pointPart;
+    } else {
+      value = value + "";
+      var re = /(-?\d+)(\d{3})/
+      while (re.test(value)) {
+        value = value.replace(re, "$1,$2")
+      }
+    }
+    return value;
+  }
+
+  getDate(str) {
+    str = String(str)
+    const newStr = str.substr(0, 4) + '年' + str.substr(4, 2) + '月';
+    return newStr;
+  }
+}

src/app/common/picker/picker.component.html

+<div class="">
+  <div class="weui-mask weui-animate-fade-in"></div>
+  <div class="weui-picker weui-animate-slide-up">
+    <div class="weui-picker__hd">
+      <span>{{title}}</span>
+      <a href="javascript:;" data-action="cancel" class="weui-picker__action" (click)="cancel()">取消</a>
+    </div>
+    <div class="weui-picker__bd">
+      <div class="weui-picker__content" *ngIf="!provinceId">
+        <div class="cursor weui-picker__item borderBottom" *ngFor="let provinceList of provinceLists"
+          (click)="selectProvince(provinceList.provinceId,provinceList.provinceName)">{{provinceList.provinceName}}
+        </div>
+      </div>
+      <div class="weui-picker__content" *ngIf="provinceId && !cityId">
+        <div class="cursor weui-picker__item borderBottom" *ngFor="let cityList of cityLists"
+          (click)="selectCity(cityList.cityId,cityList.cityName)">{{cityList.cityName}}
+        </div>
+      </div>
+      <div class="weui-picker__content" *ngIf="provinceId && cityId && !districtId">
+        <div class="cursor weui-picker__item borderBottom" *ngFor="let districtList of districtLists"
+          (click)="selectDistrict(districtList.districtId,districtList.districtName)">{{districtList.districtName}}
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
\ No newline at end of file

src/app/common/picker/picker.component.scss

+.weui-mask {
+    position: fixed;
+    z-index: 1000;
+    top: 0;
+    right: 0;
+    left: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.6);
+  }
+  
+  .weui-animate-fade-in {
+    -webkit-animation: fadeIn ease .3s forwards;
+    animation: fadeIn ease .3s forwards;
+  }
+  
+  @keyframes fadeIn {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }
+  
+  .weui-picker {
+    position: fixed;
+    width: 100%;
+    max-width: 640px;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 5000;
+    margin: 0 auto;
+    background-color: #fff;
+    -webkit-backface-visibility: hidden;
+    backface-visibility: hidden;
+    -webkit-transform: translate(0, 100%);
+    transform: translate(0, 100%);
+    -webkit-transition: -webkit-transform .3s;
+    transition: -webkit-transform .3s;
+    transition: transform .3s;
+  }
+  
+  @keyframes slideUp {
+    from {
+      transform: translate3d(0, 100%, 0);
+    }
+  
+    to {
+      transform: translate3d(0, 0, 0);
+    }
+  }
+  
+  .weui-animate-slide-up {
+    animation: slideUp ease .3s forwards;
+  }
+  
+  .weui-picker__hd {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: flex;
+    padding: 16px;
+    position: relative;
+    text-align: center;
+    font-size: 17px;
+    line-height: 1.4;
+  
+    .weui-picker__action {
+      display: block;
+      -webkit-box-flex: 1;
+      -webkit-flex: 1;
+      flex: 1;
+      color: #576B95;
+    }
+  
+    .weui-picker__action:last-child {
+      text-align: right;
+    }
+  }
+  
+  .weui-picker__hd:after {
+    content: " ";
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    height: 1px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+    color: rgba(0, 0, 0, 0.1);
+    -webkit-transform-origin: 0 100%;
+    transform-origin: 0 100%;
+    -webkit-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+  }
+  
+  .weui-picker__bd {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: flex;
+    position: relative;
+    background-color: #fff;
+    height: 240px;
+    overflow: hidden;
+    .weui-picker__content {
+      width: 100%;
+      padding-bottom: 90px;
+      height: auto;
+      overflow-y: scroll;
+      -webkit-overflow-scrolling: touch;
+      .weui-picker__item {
+        height: 50px;
+        line-height: 50px;
+        padding: 0 15px;
+      }
+    }
+  }
+  
+  
\ No newline at end of file

src/app/common/picker/picker.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PickerComponent } from './picker.component';
+
+describe('PickerComponent', () => {
+  let component: PickerComponent;
+  let fixture: ComponentFixture<PickerComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ PickerComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PickerComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/common/picker/picker.component.ts

+import { Component, OnInit, Output, Input, EventEmitter } from '@angular/core';
+
+@Component({
+  selector: 'ydlife-picker',
+  templateUrl: './picker.component.html',
+  styleUrls: ['./picker.component.scss']
+})
+export class PickerComponent implements OnInit {
+  @Input() provinceLists: Array<any>;
+  // 地址选择到区还是市 ，省为1，市为2，区为3
+  @Input() limitStep: number;
+  @Output() selectedArea = new EventEmitter();
+  cityLists: Array<any>;
+  districtLists: Array<any>;
+  provinceId: any;
+  districtId: any;
+  cityId: any;
+  title: any;
+  area: any;
+  isNeedDistrict: boolean = true;
+  areaLimitStep: number;
+  isNeedCity: boolean = true;
+  isNeedProvince: boolean = true;
+  constructor() {
+    this.title = '选择省份';
+    this.area = {
+      province: { id: null, value: null },
+      city: { id: null, value: null },
+      district: { id: null, value: null }
+    }
+  }
+
+  ngOnInit() {
+    if (this.isNeedDistrict) {
+      this.areaLimitStep = 3;
+    } else if (this.isNeedCity) {
+      this.areaLimitStep = 2;
+    } else if (this.isNeedProvince) {
+      this.areaLimitStep = 1;
+    } else {
+      this.areaLimitStep = 3;
+    }
+  }
+
+
+  //  选择省份
+  selectProvince(provinceId, provinceName) {
+    this.area.province.value = provinceName;
+    this.area.province.id = this.provinceId = provinceId;
+    this.cityLists = this.provinceLists.filter(item => item.provinceId === provinceId).pop().citys;
+    this.title = '选择城市';
+    if (this.limitStep === 1) {
+      this.selectedArea.emit(this.area);
+      return;
+    }
+  }
+
+  //  选择城市
+  selectCity(cityId, cityName) {
+    this.area.city.value = cityName;
+    this.area.city.id = this.cityId = cityId;
+    this.title = '选择地区';
+    if (this.limitStep === 2) {
+      this.selectedArea.emit(this.area);
+      return;
+    }
+    this.districtLists = this.cityLists.filter(item => item.cityId === cityId).pop().districtItem;
+    if (!this.districtLists) {
+      this.selectedArea.emit(this.area);
+    }
+  }
+
+  //  选择地区
+  selectDistrict(districtId, districtName) {
+    this.area.district.value = districtName;
+    this.area.district.id = this.districtId = districtId;
+    this.selectedArea.emit(this.area);
+  }
+
+  //   取消
+  cancel() {
+    this.selectedArea.emit();
+  }
+
+
+}

src/app/common/pipe/switch-number.pipe.spec.ts

+import { SwitchNumberPipe } from './switch-number.pipe';
+
+describe('SwitchNumberPipe', () => {
+  it('create an instance', () => {
+    const pipe = new SwitchNumberPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

src/app/common/pipe/switch-number.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'switchNumber'
+})
+export class SwitchNumberPipe implements PipeTransform {
+
+  transform(value: any, args?: any): any {
+    if ((value + "").trim() == "") {
+      return "";
+    }
+    if (typeof value == 'string') {
+      value = value.replace(/,/gi, '');
+    }
+    if ((value + "").trim() == "") {
+      return "";
+    }
+    if (isNaN(value)) {
+      return "";
+    }
+    value = value + "";
+    if (/^.*\..*$/.test(value)) {
+      let pointIndex = value.lastIndexOf(".");
+      let intPart = value.substring(0, pointIndex);
+      let pointPart = value.substring(pointIndex + 1, value.length);
+      intPart = intPart + "";
+      const re = /(-?\d+)(\d{3})/
+      while (re.test(intPart)) {
+        intPart = intPart.replace(re, "$1,$2")
+      }
+      value = intPart + "." + pointPart;
+    } else {
+      value = value + "";
+      var re = /(-?\d+)(\d{3})/
+      while (re.test(value)) {
+        value = value.replace(re, "$1,$2")
+      }
+    }
+    return value;
+  }
+
+}

src/app/common/safe-html.pipe.spec.ts

+import { SafeHtmlPipe } from './safe-html.pipe';
+
+describe('SafeHtmlPipe', () => {
+  it('create an instance', () => {
+    const pipe = new SafeHtmlPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

src/app/common/safe-html.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+import {DomSanitizer} from "@angular/platform-browser";
+
+@Pipe({
+  name: 'safeHtml'
+})
+export class SafeHtmlPipe implements PipeTransform {
+
+  constructor(private sanitized: DomSanitizer) {
+  }
+
+  transform(value: any, args?: any): any {
+    return this.sanitized.bypassSecurityTrustHtml(value);
+  }
+
+}

src/app/common/slideDown.ts

+import {
+  trigger, // 动画封装触发，外部的触发器
+  state, // 转场状态控制
+  style, // 用来书写基本的样式
+  transition, // 用来实现css3的 transition
+  animate, // 用来实现css3的animations
+  keyframes // 用来实现css3 keyframes的
+} from '@angular/animations';
+
+
+export const fadeIn = trigger('fadeIn', [
+  state('in', style({ display: 'none' })), // 默认元素不展开
+  state('out', style({ display: 'block' })),
+
+  // transition('in => out', animate('.5s .2s ease-out')),
+  // transition('out => in', animate('.5s .2s ease-in')),
+  // transition('in <=> out', animate('.5s .2s ease-in'))
+  transition('in => out', [ // 进场动画
+    animate(300, keyframes([
+      style({ height: '0', opacity: 0, offset: 0 }), // 元素高度0，元素隐藏(透明度为0)，动画帧在0%
+      style({ height: '*', opacity: 1, offset: 1 }) // 200ms后高度自适应展开，元素展开(透明度为1)，动画帧在100%
+    ]))
+  ]),
+  transition('out=> in', [
+    animate(300, keyframes([
+      style({ height: '*', opacity: 1, offset: 0 }), // 与之对应，让元素从显示到隐藏一个过渡
+      style({ height: '0', opacity: 0, offset: 1 })
+    ]))
+  ])
+
+]);

src/app/common/toast/toast.component.html

+<div id="toast" *ngIf="toastHidden">
+  <div class="weui-mask_transparent"></div>
+  <div class="weui-toast">
+    <!--<i class="weui-icon_toast icon icon-checkmark-rounded" [ngClass]="{'icon-additional':toastInfo.status===0}"></i>-->
+    <p class="weui-toast__content" [ngStyle]="{'text-align':toastInfo.align}">{{toastInfo.msg}}</p>
+  </div>
+</div>
\ No newline at end of file

src/app/common/toast/toast.component.scss

+.weui-mask_transparent {
+    position: fixed;
+    z-index: 1000;
+    top: 0;
+    right: 0;
+    left: 0;
+    bottom: 0;
+  }
+  
+  .weui-toast {
+    position: fixed;
+    z-index: 5000;
+    width: 16.8em;
+    height: 60px;
+    padding: 0 0.7em;
+    left: 50%;
+    background: rgba(17, 17, 17, 0.7);
+    text-align: justify;
+    border-radius: 5px;
+    color: #FFFFFF;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    .weui-toast__content {
+      width: 100%;
+      word-break: break-all;
+      text-align: justify;
+    }
+    .weui-icon_toast {
+      margin: 22px 0 0;
+      display: block;
+    }
+    .icon-checkmark-rounded:before {
+      color: #fff;
+      font-size: 34px;
+      display: block;
+      margin-bottom: 10px;
+    }
+    .icon-additional:before {
+      transform: rotate(38deg);
+    }
+  }
+  
\ No newline at end of file

src/app/common/toast/toast.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ToastComponent } from './toast.component';
+
+describe('ToastComponent', () => {
+  let component: ToastComponent;
+  let fixture: ComponentFixture<ToastComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ToastComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ToastComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/common/toast/toast.component.ts

+import { Component, OnInit, Input, OnChanges } from '@angular/core';
+import { Router } from "@angular/router";
+
+@Component({
+  selector: 'ydlife-toast',
+  templateUrl: './toast.component.html',
+  styleUrls: ['./toast.component.scss']
+})
+export class ToastComponent implements OnInit {
+  @Input() toastInfo: any;
+  @Input() routerLink: any;
+  toastHidden: boolean;
+
+  constructor(private router: Router) {
+    // autoHidden 是否自动消失
+    this.toastInfo = {
+      status: 1,
+      msg: '已完成',
+      timeout: 3000,
+      autoHidden: 1,
+      align: 'justify'
+    };
+    this.toastHidden = true;
+  }
+
+  ngOnInit() {
+    if (this.toastInfo.autoHidden == 0) {
+      if (this.routerLink) {
+        this.toastHidden = false;
+        this.router.navigate(['/' + this.routerLink]);
+      }
+    } else {
+      setTimeout(() => {
+        this.toastHidden = false;
+        if (this.routerLink) {
+          this.router.navigate(['/' + this.routerLink]);
+        }
+      }, this.toastInfo.timeout)
+    }
+  }
+
+  ngOnChanges() {
+    this.toastHidden = true;
+    setTimeout(() => {
+      this.toastHidden = false;
+      if (this.routerLink) {
+        this.router.navigate(['/' + this.routerLink]);
+      }
+    }, this.toastInfo.timeout)
+  }
+}

src/app/domain/businessQuery.ts

+export class BusinessQuery {
+  constructor(public opportunityId?: any,
+    public age?: string,
+    public name?: string,
+    public gender?: any,
+    public mobileNo?: string,
+    public weChat?: string,
+    public otherContacts?: string,
+    public sourceChannel?: string,
+    public address?: string,
+    public opportunityDate?: string,
+    public opportunityCustomerTags?: any,
+    public zodiacTypeId?: any,
+    public zodiacType?: any,
+    public bloodTypeId?: any,
+    public bloodType?: any,
+    public fyp?: any,
+    public fyc?: any,
+    public pieces?: any,
+    public remark?: any,
+    public assignedPractitionerId?: any,
+    public sourceFrom?: any,
+    public timeToClose?: any,
+    public leadsAssignedId?: any,
+    public expertType?: any,
+    public expertPractitionerId?: any,
+    public expertPractitionerName?: any
+  ) {
+
+
+  }
+}

src/app/domain/local.storage.ts

+export class LocalStorage {
+
+  public localStorage: any;
+
+  constructor() {
+    if (!localStorage) {
+      throw new Error('Current browser does not support Local Storage');
+    }
+    this.localStorage = localStorage;
+  }
+
+  public set(key: string, value: string): void {
+    this.localStorage[key] = value;
+  }
+
+  public get(key: string): string {
+    return this.localStorage[key] || false;
+  }
+
+  public setObject(key: string, value: any): void {
+    this.localStorage[key] = JSON.stringify(value);
+  }
+
+  public getObject(key: string): any {
+    return JSON.parse(this.localStorage[key] || '{}');
+  }
+
+  public remove(key: Array<string>): any {
+    let m = 0;
+    let status = false;
+    key.map(i => {
+      this.localStorage.removeItem(i);
+      m++;
+      status = m === key.length;
+    });
+    return status;
+  }
+}
+
+// export const LOCAL_STORAGE_PROVIDERS:any[] = [
+//         Provider(LocalStorage, {useClass: LocalStorage})
+// ];

src/app/domain/nameAge.ts

+export class NameAge {
+  id?: number;
+  name?: string;
+  age?: number;
+  birthDay?: string;
+  gender?: string;
+}

src/app/domain/plans.ts

+export class Plans {
+  planName?: string;
+  productName?: string;
+  companyName?: string;
+  companyDesc?: string;
+  labels?: Array<any>;
+  price?: number;
+  planId?: number;
+  companyLogoPath?: string;
+  iconPath?: string;
+  customerServicePhone?: string;
+  type?: number;
+  minDay?: number;
+  maxDay?: number;
+  minAge?: number;
+  maxAge?: number;
+  defaultBirth?: string;
+  isSocialInsured?: string;
+  adultCount?: number;
+  childCount?: number;
+  eldCount?: number;
+  dayCount?: number;
+  insurerId?: string;
+  planCategoryId?: number;
+  planPara?: any;
+  holderPara?: any;
+  insuredPara?: any;
+  quotePara?: any;
+  subjectPara?: any;
+  vehiclePara?: any;
+  feedbackCount?: any;
+  productCategoryId?: any;
+  productId?: any;
+  noPlanProduct?: boolean;
+  needIdCard?: string;
+  isActiveForProduct?: number;
+  isActiveForPlan?: number;
+}

src/app/domain/recruitingQuery.ts

+export class RecruitingQuery {
+    constructor(
+        public name?: string,
+        public gender?: any,
+        public age?: string,
+        public mobileNo?: string,
+        public wechatId?: string,
+        public qqId?: string,
+        public othersContacts?: string,
+        public educationLevel?: string,
+        public resourceDropMasterId?: string,
+        public remark?: string,
+        public ossPathResume?: string,
+        public operateUserId?: string,
+        public potentialId?: any,
+        public practitionerId?: any,
+        public createdAt?: any,
+        public timeToOnboarding?: any
+    ) {
+    }
+}
\ No newline at end of file

src/app/domain/settinginfo.ts

+export class SettingInfo {
+  constructor(
+    public bioIntro?: any,
+    public headImgUrl?: any,
+    public lifeImgUrls?: any,
+    public practitionerId?: any,
+    public wxQRImgUrl?: any,
+    public isMobileShow?: any,
+    public isNameShow?: any
+  ) {
+  }
+}

src/app/domain/user.ts

+export class User {
+  constructor(public dayCount?: any,
+              public adultCount?: any,
+              public childCount?: any,
+              public eldCount?: any,
+              public level?: any,
+              public destinationType?: any,
+              public destinationId?: any,
+              public destinationName?: any,
+              public levelCodeForBuilding?: any,
+              public productId?: any,
+              public planId?: any) {
+  }
+}

src/app/domain/wxconfig.ts

+export class WxConfig {
+  appId: string;
+  timestamp: string;
+  nonceStr: string;
+  signature: string;
+  jsApiList: any;
+}

src/app/http-interceptors/auth-interceptor.ts

+import { Injectable } from '@angular/core';
+import {
+  HttpEvent, HttpInterceptor, HttpHandler, HttpRequest
+} from '@angular/common/http';
+import { Observable } from "rxjs/index";
+import { tap } from "rxjs/internal/operators";
+
+@Injectable()
+export class AuthInterceptor implements HttpInterceptor {
+  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+    const authReq = req.clone({
+      headers: req.headers.set('X-Authorization', localStorage.getItem('lifeToken') ? localStorage.getItem('lifeToken') : ''),
+      setHeaders: { 'Content-Type': 'application/json' }
+    });
+    return next.handle(authReq)
+      .pipe(
+        tap(
+          event => { },
+          error => {
+            if (error.status === 401) {
+              let { search, href } = window.location;
+              href = href.replace(/&?t_reload=(\d+)/g, '');
+              window.location.href = href + (search ? '&' : '?') + 't_reload=' + new Date().getTime();
+            }
+          }
+        )
+      );
+  }
+}

src/app/http-interceptors/index.ts

+/* "Barrel" of Http Interceptors */
+import { HTTP_INTERCEPTORS } from '@angular/common/http';
+
+import { AuthInterceptor } from './auth-interceptor';
+import { TrimNameInterceptor } from './trim-name-interceptor';
+
+
+/** Http interceptor providers in outside-in order */
+export const httpInterceptorProviders = [
+  { provide: HTTP_INTERCEPTORS, useClass: TrimNameInterceptor, multi: true },
+  { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true }
+
+];

src/app/http-interceptors/trim-name-interceptor.ts

+/**
+ * Created by Sweet on 2019/12/5.
+ */
+import { Injectable } from '@angular/core';
+import {
+  HttpEvent, HttpInterceptor, HttpHandler, HttpRequest
+} from '@angular/common/http';
+
+import { Observable } from 'rxjs';
+
+@Injectable()
+export class TrimNameInterceptor implements HttpInterceptor {
+  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+    const body = req.body;
+    if (!body || !body.name ) {
+      return next.handle(req);
+    }
+    // copy the body and trim whitespace from the name property
+    const newBody = { ...body, name: body.name.trim() };
+    // clone request and set its body
+    const newReq = req.clone({ body: newBody });
+    // send the cloned request to the next handler.
+    return next.handle(newReq);
+  }
+}

src/app/my/announcement-detail/announcement-detail.component.html

+<div class="wrapper">
+  <div class="headWrapper">
+    <div class="title">
+      {{titleDeatil}}
+    </div>
+    <div class="announcement_at_top">
+      上海银盾保险经纪有限公司&nbsp;&nbsp;
+      {{announcementLists?.announcementAt}}
+    </div>
+  </div>
+  <div class="announcementItem">
+    <div class="announcement_title"><span
+        class="announcement_type">【{{announcementLists?.announcementTypeName}}】</span><span
+        [innerHtml]="announcementLists?.title |safeHtml"></span></div>
+    <div [innerHtml]="announcementLists?.content | safeHtml" class="announcement_content"></div>
+    <!-- <div class="announcement_at">上海银盾保险经纪有限公司 &nbsp;&nbsp;{{announcementLists?.announcementAt}}</div> -->
+  </div>
+</div>
\ No newline at end of file

src/app/my/announcement-detail/announcement-detail.component.scss

+.wrapper{
+    padding: 10px 8px;
+    .headWrapper{
+        .title{
+            text-align: center;
+            font-size: 24px;
+        }
+        .announcement_at_top{
+            color: #8d9599;
+        }
+    }
+    
+    .announcementItem {
+        padding: 10px 0;
+        .announcement_type {
+          color: #ff3500;
+        }
+        .announcement_at {
+            display: flex;
+            justify-content: flex-end;
+            margin-top: 20px;
+        }
+      }
+}

src/app/my/announcement-detail/announcement-detail.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AnnouncementDetailComponent } from './announcement-detail.component';
+
+describe('AnnouncementDetailComponent', () => {
+  let component: AnnouncementDetailComponent;
+  let fixture: ComponentFixture<AnnouncementDetailComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ AnnouncementDetailComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AnnouncementDetailComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my/announcement-detail/announcement-detail.component.ts

+import { Component, OnInit } from '@angular/core';
+import { MyService } from "../my.service";
+import { ActivatedRoute } from '@angular/router';
+import { LifeCommonService } from '../../common/life-common.service';
+
+@Component({
+  selector: 'ydlife-announcement-detail',
+  templateUrl: './announcement-detail.component.html',
+  styleUrls: ['./announcement-detail.component.scss']
+})
+export class AnnouncementDetailComponent implements OnInit {
+  announcementId: string;
+  announcementLists: Array<any>;
+  titleDeatil: string;
+  constructor(private activateRoute: ActivatedRoute,
+    private myService: MyService,
+    public lifeCommonService: LifeCommonService) { }
+
+  ngOnInit() {
+    this.announcementId = this.activateRoute.snapshot.paramMap.get('id');
+    this.announcementQuery(this.announcementId, null)
+  }
+
+  announcementQuery(id, announcementType) {
+    this.myService.announcementQuery(id, announcementType).subscribe(res => {
+      if (res['success']) {
+        this.announcementLists = res['data']['announcementInfoList'][0];
+        this.titleDeatil = this.lifeCommonService.delHtmlTag(this.announcementLists['title'])
+      }
+    });
+  }
+
+
+}

src/app/my/business-card/business-card.component.html

+<div class="businessCardContainer">
+  <div class="brokerCardPositive">
+    <div class="qrcodeBox">
+      <div>
+        <div style="margin-bottom: 20%;"><img src="assets/images/ydShield.png" alt="银盾保险经纪" class="img-responsive">
+        </div>
+        <div><img src="assets/images/ydCompanyName.png" alt="银盾保险经纪" class="img-responsive"></div>
+      </div>
+      <div><img src="assets/images/online_chat.jpg" alt="" class="img-responsive"></div>
+    </div>
+    <div class="dividingContainer">
+      <div class="dividingBox"></div>
+      <div class="dividingLine"></div>
+    </div>
+    <div class="brokerInfo">
+      <div class="brokerBasicInfo">
+        <div class="brokerName">
+          <div>{{lifeCustomerInfo.practitionerBasicInfo.name}}</div>
+          <div>Neo Zheng</div>
+        </div>
+        <div class="brokerTitle">
+          <div>{{lifeCustomerInfo.practitionerBasicInfo.levelName}}</div>
+          <div>Sales Director</div>
+        </div>
+      </div>
+      <div class="brokerCompanyInfo">
+        <div style="font-size: 14px">上海银盾保险经纪有限公司</div>
+        <div style="font-size:10px;font-weight: lighter;">上海市浦东新区张杨路560号中融恒瑞国际西楼1502室</div>
+        <div style="font-size: 11px">客服专线：400-921-9290</div>
+      </div>
+      <div class="brokerContactInfo">
+        <div>
+          <i class="iconfont icon-dianhua"></i>
+          <span>M: {{lifeCustomerInfo.mobileNo}}</span>
+        </div>
+        <div>
+          <i class="iconfont icon-youxiang"></i>
+          <span>50262253@qq.com</span>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="brokerCardOpposite">
+    <img src="assets/images/card_opposite.jpg" alt="" class="img-responsive">
+  </div>
+</div>

src/app/my/business-card/business-card.component.scss

+.businessCardContainer {
+  display: flex;
+  flex-direction: column;
+  .brokerCardPositive {
+    display: flex;
+    padding-top: 7%;
+    padding-left: 5%;
+    margin-bottom: 10%;
+    .qrcodeBox {
+      width: 15%;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+    }
+    .dividingContainer {
+      padding-top: 45px;
+      margin-right: 11px;
+      margin-left: 5%;
+      .dividingBox {
+        width: 10px;
+        height: 10px;
+        background-color: #ee262e;
+      }
+      .dividingLine {
+        width: 1px;
+        background-color: #b9b9ba;
+        height: 100%;
+      }
+    }
+    .brokerInfo {
+      flex: 1;
+      .brokerBasicInfo {
+        display: flex;
+        align-items: flex-end;
+        justify-content: space-between;
+        padding-right: 5%;
+        margin-bottom: 10%;
+        color: #231f20;
+        .brokerName {
+          div:first-child {
+            font-size: 24px;
+            letter-spacing: 5px;
+            font-weight: bold;
+            line-height: 1.1;
+          }
+          div:last-child {
+            font-size: 12px;
+          }
+        }
+        .brokerTitle {
+          div:first-child {
+            font-size: 13px;
+          }
+          div:last-child {
+            font-size: 12px;
+          }
+        }
+      }
+      .brokerCompanyInfo {
+        margin-bottom: 3%;
+      }
+      .brokerContactInfo {
+        line-height: 1.1;
+        .iconfont {
+          margin-right: 5px;
+          color: #ee262e;
+        }
+      }
+    }
+  }
+
+}

src/app/my/business-card/business-card.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BusinessCardComponent } from './business-card.component';
+
+describe('BusinessCardComponent', () => {
+  let component: BusinessCardComponent;
+  let fixture: ComponentFixture<BusinessCardComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ BusinessCardComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BusinessCardComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my/business-card/business-card.component.ts

+import {Component, OnInit} from '@angular/core';
+
+@Component({
+  selector: 'ydlife-business-card',
+  templateUrl: './business-card.component.html',
+  styleUrls: ['./business-card.component.scss']
+})
+export class BusinessCardComponent implements OnInit {
+  lifeCustomerInfo: any;
+
+  constructor() {
+  }
+
+  ngOnInit() {
+    this.lifeCustomerInfo = JSON.parse(localStorage.getItem('lifeCustomerInfo'));
+  }
+
+}

src/app/my/file-upload/file-upload.component.html

+<div class="fileUploadLists">
+  <div class="nav">
+    <ul class="left">
+      <li *ngFor="let categoryItem of categoryList" (click)="switchCategory(categoryItem.id)"
+        [ngClass]="{'actived':selectedCategoryId===categoryItem.id}">
+        {{categoryItem.dropOptionName}}
+      </li>
+    </ul>
+  </div>
+  <div class="contentList">
+    <ul>
+      <li *ngFor="let fileUploadItem of fileUploadItemList">
+        <a href="{{fileUploadItem.filePath}}" download="{{fileUploadItem.itemName}}" target="_blank">
+          <div><i class="iconfont icon-pdf"></i></div>
+          <div title="{{fileUploadItem.itemName}}">{{fileUploadItem.itemName}}</div>
+          <div style="position: absolute;right: 5px;top: 6px;"><i class="iconfont icon-xiazai"></i></div>
+        </a>
+      </li>
+    </ul>
+  </div>
+</div>
\ No newline at end of file

src/app/my/file-upload/file-upload.component.scss

+.fileUploadLists {
+  height: 100%;
+  ul {
+    list-style: none;
+  }
+  .nav{
+    overflow: hidden;
+    width: 100%;
+    overflow-x: auto;
+    .left{
+      padding: 10px 2px;
+      // background: #f0f0f0;
+      margin-bottom: 10px;
+      float: left;
+      width: 120%;
+      overflow: hidden;
+      overflow-x: auto;
+      list-style: none;
+      li{
+        border: 1px #a9aabb solid;
+        text-align: center;
+        font-size: 14px;
+        height: 30px;
+        line-height: 30px;
+        border-radius: 20px;
+        margin: 0px 2px;
+        float: left;
+        width: 15.6%;
+      }
+      li.actived{
+        // background-color: #ff5a32;
+        // color: #fff;
+        // border: 1px #f0f0f0 solid;
+        border: 1px #e10d0d solid;
+      }
+    }
+  }
+  .nav::-webkit-scrollbar{                    
+    opacity: 0;
+    }
+  .contentList{
+    background-color: #fff;
+    -webkit-box-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    height: auto;
+    overflow-x: hidden;
+    overflow-y: scroll;
+    -webkit-overflow-scrolling: touch;
+    ul li{
+      border-bottom: 1px solid #dcdcdc;
+      padding: 4px 20px;
+      position: relative;
+      .icon-xiazai {
+        font-size: 22px;
+        color: #ec2d37;
+        font-weight: bold;
+      }
+      a {
+        display: flex;
+        align-items: center;
+        color: #000;
+        .iconfont {
+          color: #ec2d37;
+          font-size: 22px;
+          margin-right: 8px;
+        }
+      }
+    }
+    ul li:last-child {
+      border: none;
+    }
+  }
+}

src/app/my/file-upload/file-upload.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FileUploadComponent } from './file-upload.component';
+
+describe('FileUploadComponent', () => {
+  let component: FileUploadComponent;
+  let fixture: ComponentFixture<FileUploadComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ FileUploadComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(FileUploadComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my/file-upload/file-upload.component.ts

+import { Component, OnInit } from '@angular/core';
+import { LifeCommonService } from "../../common/life-common.service";
+import { MyService } from "../my.service";
+import { ActivatedRoute } from "@angular/router";
+
+@Component({
+  selector: 'ydlife-file-upload',
+  templateUrl: './file-upload.component.html',
+  styleUrls: ['./file-upload.component.scss']
+})
+export class FileUploadComponent implements OnInit {
+  fileUploadItemList: Array<any>;
+  // 判断是文件下载还是教育培训
+  type: string;
+  categoryList: Array<any>;
+  selectedCategoryId: number;
+  constructor(private myService: MyService, private activatedRoute: ActivatedRoute) {
+  }
+
+  ngOnInit() {
+    this.type = this.activatedRoute.snapshot.data[0]['type'];
+    this.dropOptionsQuery();
+    if (this.type === 'fileUpload') {
+      this.fileUpload(3, 0, 19, 'yd_download_file_type', this.selectedCategoryId);
+    } else if (this.type === 'training') {
+      this.fileUpload(3, 0, 23, 'yd_trainning_file_type', this.selectedCategoryId);
+    }
+
+  }
+
+  //  文件下载
+  fileUpload(itemType, itemId, fileCategory, code, mdDropOptionId) {
+    this.myService.filePath(itemType, itemId, fileCategory, code, mdDropOptionId).subscribe(res => {
+      if (res['success']) {
+        this.fileUploadItemList = res['data']['fileUploadItemList'];
+      }
+    });
+  }
+
+  //培训资料分类
+  dropOptionsQuery() {
+    const code = this.type === 'fileUpload' ? 'yd_download_file_type' : 'yd_trainning_file_type'
+    this.myService.dropOptionsQuery({ code: code }).subscribe(res => {
+      if (res['success']) {
+        this.categoryList = res['data']['dropMasterInfoList'][0]['dropOptionsInfoList'];
+        if (this.categoryList.length > 0) {
+          this.selectedCategoryId = this.categoryList[0].id;
+          this.switchCategory(this.selectedCategoryId)
+        }
+      } else {
+        this.categoryList = [];
+      }
+    })
+  }
+
+  switchCategory(e) {
+    this.selectedCategoryId = e;
+    if (this.type === 'fileUpload') {
+      this.fileUpload(3, 0, 19, 'yd_download_file_type', this.selectedCategoryId);
+    } else if (this.type === 'training') {
+      this.fileUpload(3, 0, 23, 'yd_trainning_file_type', this.selectedCategoryId);
+    }
+  }
+}

src/app/my/important-announcement/important-announcement.component.html

+<div class="nav">
+  <ul class="left">
+    <li *ngFor="let categoryItem of importantAnnouncementLists" (click)="switchCategory(categoryItem.id)"
+      [ngClass]="{'actived':selectedCategoryId===categoryItem.id}">
+      {{categoryItem.dropOptionName}}
+    </li>
+  </ul>
+</div>
+<div #hide class="materialContainer">
+  <div class="materialItem" *ngFor="let announcementInfo of announcementLists;index as i"
+    [routerLink]="['/importantAnnouncement',announcementInfo.id]">
+    <!-- <div class="title" [innerHtml]="announcementInfo.title"></div> -->
+    <div class="title">{{this.lifeCommonService.delHtmlTag(announcementInfo.title)}}</div>
+
+    <div class="date">
+      <span> 上海银盾保险经纪有限公司</span>
+      <span>{{announcementInfo.createdAt}}</span>
+    </div>
+  </div>
+</div>
\ No newline at end of file

src/app/my/important-announcement/important-announcement.component.scss

+.nav{
+  overflow: hidden;
+  width: 100%;
+  overflow-x: auto;
+  .left{
+    padding: 10px 2px;
+    // background: #f0f0f0;
+    margin-bottom: 10px;
+    float: left;
+    width: 120%;
+    overflow: hidden;
+    overflow-x: auto;
+    list-style: none;
+    li{
+      border: 1px #a9aabb solid;
+      text-align: center;
+      font-size: 14px;
+      height: 30px;
+      line-height: 30px;
+      border-radius: 20px;
+      margin: 0px 2px;
+      float: left;
+      width: 15.7%;
+    }
+    li.actived{
+      // background-color: #ff5a32;
+      // color: #fff;
+      // border: 1px #f0f0f0 solid;
+      border: 1px #e10d0d solid;
+    }
+  }
+}
+.nav::-webkit-scrollbar{                    
+  opacity: 0;
+  }
+
+.materialContainer{
+  .materialItem{
+    padding: 5px 10px;
+    border-bottom: 1px #ddd solid;
+    margin-bottom: 8px;
+    .title{
+      margin-bottom: 8px;
+    }
+    .date{
+      color: #737272;
+      font-size: 14px;
+      display: flex;
+      justify-content: space-between;
+    }
+  }
+  .materialItem:last-child{
+    border-bottom: none;
+  }
+  
+}

src/app/my/important-announcement/important-announcement.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ImportantAnnouncementComponent } from './important-announcement.component';
+
+describe('ImportantAnnouncementComponent', () => {
+  let component: ImportantAnnouncementComponent;
+  let fixture: ComponentFixture<ImportantAnnouncementComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ImportantAnnouncementComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ImportantAnnouncementComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my/important-announcement/important-announcement.component.ts

+import { Component, OnInit, ViewChild, ElementRef, AfterViewInit } from '@angular/core';
+import { MyService } from "../my.service";
+import { Router } from "@angular/router";
+import { LifeCommonService } from '../../common/life-common.service';
+
+@Component({
+  selector: 'ydlife-important-announcement',
+  templateUrl: './important-announcement.component.html',
+  styleUrls: ['./important-announcement.component.scss']
+})
+export class ImportantAnnouncementComponent implements OnInit, AfterViewInit {
+  @ViewChild('hide') hide: ElementRef
+  announcementLists: Array<any>;
+  importantAnnouncementLists: Array<any>;
+  selectedCategoryId: any;
+  titleList: Array<any> = [];
+  constructor(
+    private myService: MyService,
+    private router: Router,
+    public lifeCommonService: LifeCommonService) {
+  }
+
+  ngOnInit() {
+    this.dropOptionsQuery();
+  }
+
+  ngAfterViewInit() {
+    setTimeout(() => {
+      this.switchCategory(this.selectedCategoryId)
+    }, 500);
+  }
+
+  // 获取所有的公告类型
+  dropOptionsQuery() {
+    this.myService.dropOptionsQuery({ code: 'yd_mkt_announcement_type' }).subscribe(res => {
+      if (res['success']) {
+        this.importantAnnouncementLists = res['data']['dropMasterInfoList'][0]['dropOptionsInfoList'];
+        if (this.importantAnnouncementLists.length > 0) {
+          this.selectedCategoryId = res['data']['dropMasterInfoList'][0]['dropOptionsInfoList'][0]['id'];
+          this.announcementQuery(null, this.selectedCategoryId);
+        }
+      }
+    })
+  }
+
+  announcementQuery(id, announcementType) {
+    this.myService.announcementQuery(id, announcementType).subscribe(res => {
+      if (res['success']) {
+        this.announcementLists = res['data']['announcementInfoList'];
+      }
+    });
+  }
+
+
+  switchCategory(e) {
+    this.selectedCategoryId = e;
+    this.announcementQuery(null, this.selectedCategoryId);
+  }
+
+}

src/app/my/mk-material-detail/mk-material-detail.component.html

+<!-- 这个元素用来承载生成的二维码 不显示 style="display: none" -->
+<div id="qrcode" style="display: none"></div>
+
+<!-- 点击这个按钮之后下载图片 -->
+<!--<button id="download"> 下载图片</button>-->
+
+<!-- canvas 标签 主要用来进行图形的绘制-->
+<canvas id="canvas" #canvas></canvas>
+
+<!--生成图片-->
+<img src="" alt="" id="bannerImg" class="img-responsive">

src/app/my/mk-material-detail/mk-material-detail.component.scss

+

src/app/my/mk-material-detail/mk-material-detail.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MkMaterialDetailComponent } from './mk-material-detail.component';
+
+describe('MkMaterialDetailComponent', () => {
+  let component: MkMaterialDetailComponent;
+  let fixture: ComponentFixture<MkMaterialDetailComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ MkMaterialDetailComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MkMaterialDetailComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my/mk-material/mk-material.component.html

+<div class='nav'>
+  <ul class="left">
+    <ng-container>
+      <li *ngFor="let categoryItem of categoryList" (click)="switchCategory(categoryItem.id)"
+        [ngClass]="{'actived':selectedCategoryId===categoryItem.id}">
+        {{categoryItem.dropOptionName}}
+      </li>
+    </ng-container>
+  </ul>
+</div>
+
+<div class="materialContainer">
+  <div class="materialItem" *ngFor="let posterInfo of posterInfos;index as i"
+    [routerLink]="['/material',posterInfo.itemId]"
+    [queryParams]="{itemType:posterInfo.itemType,posterType:posterInfo.id}">
+    <div>
+      <img src="{{posterInfo.productPosterPath}}" alt="" class="img-responsive">
+    </div>
+    <div class="title">{{posterInfo.title}}</div>
+  </div>
+</div>
\ No newline at end of file

src/app/my/mk-material/mk-material.component.scss

+.nav{
+  overflow: hidden;
+  width: 100%;
+  overflow-x: auto;
+  .left{
+    padding: 10px 2px;
+    // background: #f0f0f0;
+    margin-bottom: 10px;
+    float: left;
+    width: 120%;
+    overflow: hidden;
+    overflow-x: auto;
+    list-style: none;
+    li{
+      border: 1px #a9aabb solid;
+      text-align: center;
+      font-size: 14px;
+      height: 30px;
+      line-height: 30px;
+      border-radius: 20px;
+      margin: 0px 2px;
+      float: left;
+      width: 15.6%;
+    }
+    li.actived{
+      // background-color: #ff5a32;
+      // color: #fff;
+      // border: 1px #f0f0f0 solid;
+      border: 1px #e10d0d solid;
+    }
+  }
+}
+.nav::-webkit-scrollbar{                    
+  opacity: 0;
+  }
+.materialContainer {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-template-rows: repeat(3, 1fr);
+  grid-row-gap: 10px;
+  grid-column-gap: 10px;
+  
+  .materialItem {
+    position: relative;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    background-color: #f7f7f7;
+    padding: 14px;
+    box-sizing: border-box;
+    .title {
+      font-size: 12px;
+      line-height: 1.1;
+      margin-top: 5px;
+    }
+  }
+}

src/app/my/mk-material/mk-material.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MkMaterialComponent } from './mk-material.component';
+
+describe('MkMaterialComponent', () => {
+  let component: MkMaterialComponent;
+  let fixture: ComponentFixture<MkMaterialComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ MkMaterialComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MkMaterialComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my/mk-material/mk-material.component.ts

+import { Component, OnInit } from '@angular/core';
+import { Router } from "@angular/router";
+import { MyService } from "../my.service";
+import { ActivatedRoute } from "@angular/router";
+@Component({
+  selector: 'ydlife-mk-material',
+  templateUrl: './mk-material.component.html',
+  styleUrls: ['./mk-material.component.scss']
+})
+export class MkMaterialComponent implements OnInit {
+  posterInfos: Array<any>;
+  categoryList: Array<any>;
+  selectedCategoryId: number;
+  recruit: any;
+  constructor(private activatedRoute: ActivatedRoute, private router: Router, private myService: MyService) {
+  }
+
+  ngOnInit() {
+    this.recruit = this.activatedRoute.snapshot.queryParams.recruit ? this.activatedRoute.snapshot.queryParams.recruit : null;
+    this.dropOptionsQuery();
+  }
+
+  posterQuery() {
+    const param = {
+      practitionerId: JSON.parse(localStorage.getItem('lifeCustomerInfo'))['practitionerId'],
+      mdDropOptionId: this.selectedCategoryId,
+      paginationInfo: { noLimitFlag: 'CONFIRM' }
+    }
+    this.myService.posterQuery(param).subscribe(res => {
+      if (res['success']) {
+        this.posterInfos = res['data']['posterInfos'];
+      }
+    });
+  }
+
+  //海报分类
+  dropOptionsQuery() {
+    this.myService.dropOptionsQuery({ code: 'yd_productbill_file_type' }).subscribe(res => {
+      if (res['success']) {
+        this.categoryList = res['data']['dropMasterInfoList'][0]['dropOptionsInfoList'];
+        if (this.categoryList.length > 0) {
+          if (this.recruit == 'recruit') {
+            this.selectedCategoryId = 78;
+            this.categoryList = this.categoryList.filter((item) => {
+              return item.id == 78;
+            })
+          } else {
+            this.selectedCategoryId = this.categoryList[0].id;
+          }
+          this.posterQuery();
+        }
+      } else {
+        this.categoryList = [];
+      }
+    })
+  }
+
+  switchCategory(e) {
+    this.selectedCategoryId = e;
+    this.posterQuery();
+  }
+}

src/app/my/my-business-detail/my-business-detail.component.scss

+.wrapper {
+  padding-bottom: 40px;
+  font-size: 16px;
+  select {
+    -webkit-appearance: none;
+    border: none;
+    box-shadow: none;
+  }
+  .tab {
+    display: flex;
+    list-style: none;
+    margin: 10px 0px;
+    padding-left: 1%;
+    li {
+      margin-right: 10px;
+      line-height: 30px;
+      height: 30px;
+      width: 25%;
+      text-align: center;
+      border: 1px #a9aabb solid;
+      border-radius: 20px;
+      h3 {
+        font-weight: normal;
+        font-size: 16px;
+      }
+    }
+    li.selected {
+      // background-color: #ff5a32;
+      // color: #fff;
+      border: 1px #e10d0d solid;
+    }
+  }
+  .content {
+    padding: 10px 5px;
+    position: relative;
+    > .iconfont {
+      width: 55px;
+      height: 55px;
+      line-height: 55px;
+      border-radius: 50%;
+      position: fixed;
+      left: 42%;
+      font-size: 24px;
+      color: #fff;
+      background: #0767bf;
+      text-align: center;
+      bottom: 5px;
+    }
+    .contentDetail {
+      margin-top: 15px;
+      .wrapper_item {
+        border-bottom: 1px #ddd solid;
+        margin-bottom: 10px;
+        .contentItem {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          // border-bottom: 1px #ddd solid;
+          margin: 0 8px 5px 8px;
+          > span:first-child {
+            white-space: nowrap;
+          }
+          input.form-control {
+            // width: 60%;
+            margin: 0 5px;
+            background: none;
+            outline: none;
+            border: none;
+            text-align: right;
+            box-shadow: none;
+            display: flex;
+            flex-wrap: wrap;
+            font-size: 16px;
+          }
+          .sexWrapper {
+            display: flex;
+            width: 60%;
+            justify-content: flex-end;
+            padding-right: 3px;
+            .form-control.sex {
+              width: 20%;
+              margin-left: 5px;
+              border: none;
+              box-shadow: none;
+            }
+            .form-control.sex.sexBtn {
+              border: 1px #0767bf solid;
+            }
+            .form-control[disabled] {
+              background-color: transparent;
+              opacity: 1;
+            }
+          }
+          select.form-control {
+            direction: rtl;
+          }
+          select.form-control[disabled] {
+            background-color: transparent;
+            color: #999;
+          }
+        }
+        .contentItem:last-child {
+          border-bottom: none;
+        }
+      }
+
+    }
+    .tagWrapper {
+      display: flex;
+      flex-wrap: wrap;
+      padding-left: 8px;
+      div.tagContent {
+        margin: 10px 3px 0 3px;
+        height: 28px;
+        line-height: 28px;
+        text-align: center;
+        // background-color: #e8e8e8;
+        border-radius: 12px;
+        font-size: 13px;
+        padding: 0 15px;
+      }
+      div.selected {
+        border: 1px #0767bf solid;
+      }
+    }
+    .add {
+      position: absolute;
+      .iconfont {
+        width: 55px;
+        height: 55px;
+        line-height: 55px;
+        border-radius: 50%;
+        position: fixed;
+        right:42%;
+        font-size: 24px;
+        color: #fff;
+        background: #0767bf;
+        text-align: center;
+        bottom: 5px;
+        font-size: 28px;
+        // color: #ff5933;
+        font-weight: bold;
+
+      }
+    }
+    .answerContent {
+      border-bottom: 1px #ddd solid;
+      margin-bottom: 5px;
+      padding: 5px 0;
+      .questionTitle {
+        font-weight: 700;
+        font-size: 13px;
+      }
+      .questionContent {
+        font-size: 16px;
+      }
+    }
+    .answerContent:last-child {
+      border-bottom: 0;
+    }
+    .record {
+      display: flex;
+      list-style: none;
+      justify-content: space-between;
+      li {
+        width: 30%;
+        text-align: center;
+        height: 30px;
+        line-height: 30px;
+      }
+    }
+  }
+
+  .editContainer {
+    padding: 10px;
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    height: 45%;
+    background-color: #fff;
+    z-index: 20;
+    -webkit-animation: .5s both slowUp;
+    animation: .5s both slowUp;
+    min-width: 320px;
+    max-width: 640px;
+    margin: 0 auto;
+    > div {
+      height: 50px;
+      border-bottom: 1px solid #dbdbdb;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      > div:first-child {
+        width: 100px;
+        font-size: 15px;
+      }
+      > div:last-child {
+        flex: 1;
+      }
+      .form-control {
+        border: none;
+        box-shadow: none;
+      }
+    }
+    > div:last-child {
+      border: none;
+    }
+    ul.footer {
+      display: flex;
+      list-style: none;
+      justify-content: center;
+      margin-top: 15%;
+      li {
+        width: 30%;
+        height: 35px;
+        line-height: 35px;
+        text-align: center;
+        background: #e10d0d;
+        color: #fff;
+        margin: 0 10px;
+        border-radius: 10px;
+      }
+    }
+  }
+  .recordLists {
+    li {
+      border-bottom: 1px solid #f0f0f0;
+      padding: 5px 10px;
+      background: rgb(251, 251, 251);
+    }
+    li:last-child {
+      border: none;
+    }
+    .opportunityRecordItem {
+      font-size: 15px;
+    }
+    .salesNotice {
+      font-size: 14px;
+      color: #8a8a8a;
+      line-height: 1.1;
+      margin-bottom: 5px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      span{
+        width: 85%;
+        .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
+          background-color: #eee;
+          opacity: .5;
+          border: none;
+          outline: none;
+          box-shadow: none;
+          padding-left: 0;
+      }
+      }
+      .iconfont{
+        font-size: 18px;
+      }
+    }
+    .updatedAt {
+      // font-size: 12px;
+      // color: #8a8a8a;
+      // text-align: right;
+    }
+  }
+  .toast {
+    position: fixed;
+    left: 0;
+    right: 0;
+    min-width: 320px;
+    max-width: 640px;
+    width: 100%;
+    margin: 0 auto;
+    z-index: 1;
+  }
+  .toastWrapper {
+    height: 100%;
+    background-color: rgba(0, 0, 0, .5);
+    top: 0;
+  }
+}

src/app/my/my-business-detail/my-business-detail.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyBusinessDetailComponent } from './my-business-detail.component';
+
+describe('MyBusinessDetailComponent', () => {
+  let component: MyBusinessDetailComponent;
+  let fixture: ComponentFixture<MyBusinessDetailComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ MyBusinessDetailComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyBusinessDetailComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my/my-business/my-business.component.html

+<div class="salesWrapper">
+  <div class="salesContent">
+    <div style="text-align: center;margin: 20px auto;font-size: 20px;" *ngIf="businessList?.length==0">暂无商机</div>
+    <!-- <div class="line" *ngFor="let businessItem of businessList" [queryParams]="{orderId:businessItem.orderId}">
+      <div></div>
+      <div>手机号：{{businessItem.mobileNo}}</div>
+      <div>商机来源：{{businessItem.opportunityFrom}}</div>
+      <div></div>
+    </div> -->
+    <div class="salesItem" *ngFor="let businessItem of businessList"
+      [routerLink]="['/business',businessItem.opportunityId]"
+      [queryParams]="{orderId:businessItem.orderId,leadsAssignedId:businessItem.leadsAssignedId}">
+      <div class="icon_bolck" [ngStyle]="{'background':businessItem.expertType=='1'? '#ddd' : 'none'}">
+        <span class="iconfont icon-xiansuo1" *ngIf="businessItem.expertType=='0'"></span>
+        <span class="iconfont icon-zhuanjia" style="color: #093d9b;" *ngIf="businessItem.expertType=='1'"></span>
+      </div>
+      <div class="line">
+        <div>姓名：{{businessItem.name}}</div>
+        <span class="iconfont icon-ar-r" style="font-size: 10px;position: relative; right: -2px;"></span>
+      </div>
+      <div class="line">
+        <div> 手机号：{{businessItem.mobileNo}}</div>
+        <div>{{businessItem.mdDropOptionName ? businessItem.mdDropOptionName:'待跟进'}}</div>
+      </div>
+      <div class="line">
+        <div>商机来源：{{businessItem.opportunityFrom}}</div>
+        <div>{{(businessItem.opportunityDate).substr(0,10)}}</div>
+      </div>
+    </div>
+  </div>
+  <div class="add">
+    <i class="iconfont icon-jiahao" (click)="addBussiness()"></i>
+  </div>
+</div>
\ No newline at end of file

src/app/my/my-business/my-business.component.scss

+.salesWrapper{
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    // background:#f7f7f2;
+    .salesContent{
+        .salesItem{
+            border-bottom: 1px #dcdcdc solid;
+            padding: 10px;
+            padding-left: 45px;
+            position: relative;
+
+            .icon_bolck{
+                border: 1px #dcdcdc solid;
+                width: 35px;
+                height: 35px;
+                position: absolute;
+                left: 3px;
+                top: 20px;
+                line-height: 30px;
+                text-align: center;
+                border-radius: 50%;
+                .iconfont{
+                    color: #ff3500;
+                    font-size: 26px;
+                    position: relative;
+                    top: 1px;
+                }
+            }
+            
+            .line{
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+                font-size: 13px;
+                flex: 1;
+                .price{
+                    font-size: 16px;
+                    color: #ff3500;
+                    font-weight: bold;
+                }
+            }
+        }
+        .salesItem:last-child{
+            border-bottom: none;
+        }
+    }
+    .add {
+        position: absolute;
+        .iconfont {
+          width: 55px;
+          height: 55px;
+          line-height: 55px;
+          border-radius: 50%;
+          position: fixed;
+          right: 10px;
+          font-size: 24px;
+          color: #fff;
+          background: #0767bf;
+          text-align: center;
+          bottom: 50px;
+          font-size: 28px;
+          // color: #ff5933;
+          font-weight: bold;
+          left: 42%;
+        }
+      }
+}
\ No newline at end of file

src/app/my/my-business/my-business.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyBusinessComponent } from './my-business.component';
+
+describe('MyBusinessComponent', () => {
+  let component: MyBusinessComponent;
+  let fixture: ComponentFixture<MyBusinessComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ MyBusinessComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyBusinessComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my/my-business/my-business.component.ts

+import { Component, OnInit } from '@angular/core';
+import { MyService } from '../my.service';
+import { LifeCommonService } from '../../common/life-common.service';
+import { Router } from "@angular/router";
+@Component({
+  selector: 'ydlife-my-business',
+  templateUrl: './my-business.component.html',
+  styleUrls: ['./my-business.component.scss']
+})
+export class MyBusinessComponent implements OnInit {
+  businessList: Array<any>;
+  constructor(private myService: MyService, public lifeCommonService: LifeCommonService, private router: Router) { }
+
+  ngOnInit() {
+    this.ownOpportunityQuery()
+  }
+
+  ownOpportunityQuery() {
+    const brokerCustomerId = JSON.parse(localStorage.getItem('lifeCustomerInfo'))['customerId'];
+    const brokerPractitionerId = JSON.parse(localStorage.getItem('lifeCustomerInfo'))['practitionerId'];
+    this.myService.ownOpportunityQuery({ customerId: brokerCustomerId, practitionerId: brokerPractitionerId }).subscribe((res) => {
+      if (res['data']['ownOpportunityInfos']) {
+        this.businessList = res['data']['ownOpportunityInfos'];
+      } else {
+        this.businessList = []
+      }
+    })
+  }
+
+  addBussiness() {
+    this.router.navigate(['/business/0']);
+  }
+}

src/app/my/my-center-home/my-center-home.component.html

+<div class="weui-panel">
+  <div class="weui-panel__hd header">
+    <!--头部经纪人信息START-->
+    <div class="avatar" routerLink="setting">
+      <img
+        src="{{lifeCustomerInfo?.practitionerBasicInfo?.headImagePath ? lifeCustomerInfo?.practitionerBasicInfo?.headImagePath : './assets/images/icons/meng.png'}}"
+        alt="头像">
+    </div>
+    <div class="brokerInfo">
+      <div class="brokerName">
+        <div style="letter-spacing: 2px"><span>{{lifeCustomerInfo?.practitionerBasicInfo?.name}}</span></div>
+        <span i class="iconfont icon-ar-r" style="font-size:18px;" routerLink="setting"></span>
+      </div>
+
+      <div class="brokerTag">
+        <div>
+          <p>{{lifeCustomerInfo?.practitionerBasicInfo?.insurerBranchName ?
+            lifeCustomerInfo?.practitionerBasicInfo?.insurerBranchName : '银盾保险'}}</p>
+        </div>
+        <div>·</div>
+        <div>{{lifeCustomerInfo?.practitionerBasicInfo?.subordinateName}}</div>
+        <div>·</div>
+        <div><span class="ydTitle">{{lifeCustomerInfo?.practitionerBasicInfo?.levelName}}</span></div>
+      </div>
+    </div>
+    <!--头部经纪人信息END-->
+  </div>
+
+  <div class="weui-panel__bd">
+    <div class="performance_wrapper">
+      <!-- <img class="bg" src="assets/images/sales__bg.png" > -->
+      <div class="content">
+        <span class="detail" (click)="jumpToDetail()">龙虎榜<i class="iconfont icon-ar-r"
+            style="font-size:12px;"></i></span>
+        <ul class="tab">
+          <li *ngFor="let item of performanceList" (click)="rank(item.time,1,2);rank(item.time,2,2)"
+            [ngClass]="{selected:performanceSelectedFlag==item.time}">
+            <div style="position: relative;">
+              <h3>{{item.name}}
+                <i class="line" *ngIf="performanceSelectedFlag==item.time" [ngStyle]="{'left':leftWidth}"></i>
+              </h3>
+            </div>
+          </li>
+        </ul>
+        <div>
+          <ul class="performance_list title">
+            <li></li>
+            <li>首年保费
+              <!-- <span class="iconfont icon-xiangxia" style="font-size: 10px;margin-left: 3px;"></span> -->
+            </li>
+            <li>首年佣金</li>
+            <li>件数</li>
+            <li>完成率</li>
+          </ul>
+          <ul class="performance_list">
+            <li>线上</li>
+            <li class="markPrice" style="margin:0 7px;">
+              ￥{{onlineInfo?.fyp | number: "1.0-0"}}
+            </li>
+            <li class="markPrice">
+              ￥{{onlineInfo?.fyc | number: "1.0-0"}}
+            </li>
+            <li class="markPrice">{{onlineInfo?.count?onlineInfo.count:'-'}}</li>
+            <li class="markPrice" style="position: relative;top: 12px;">
+              {{onlineInfo?.completionRate?onlineInfo.completionRate + '%':'-'}}
+            </li>
+          </ul>
+          <ul class="performance_list">
+            <li>线下</li>
+            <li class="markPrice" style="margin:0 7px;">
+              ￥{{offlineInfo?.fyp | number: "1.0-0"}}
+            </li>
+            <li class="markPrice">
+              ￥{{offlineInfo?.fyc | number: "1.0-0"}}
+            </li>
+            <li class="markPrice">{{offlineInfo?.count?offlineInfo.count:'-'}}</li>
+            <li class="markPrice">
+              &nbsp;
+            </li>
+          </ul>
+        </div>
+      </div>
+
+    </div>
+    <div class="performance_wrapper">
+      <div class="content">
+        <div class="activities_grade">
+          <span>销售活动量分值</span>
+          <span class="iconfont icon-ar-r" routerLink="scoreDeatil"></span>
+        </div>
+        <ul class="activities">
+          <li class="markPrice">{{this.activities_grade?.scoreDay}}</li>
+          <li class="markPrice">{{this.activities_grade?.scoreWeek}}</li>
+          <li class="markPrice">{{this.activities_grade?.scoreMonth}}</li>
+          <li class="markPrice">
+            {{this.activities_grade?.achievementRateWeek!=null  ? lifeCommonService.toPercent(this.activities_grade?.achievementRateWeek) :'-'}}
+          </li>
+          <li class="markPrice">
+            {{this.activities_grade?.achievementRateMonth!=null ? lifeCommonService.toPercent(this.activities_grade?.achievementRateMonth)  :'-'}}
+          </li>
+          <li class="markPrice">{{this.activities_grade?.addOpportunityNum}}</li>
+        </ul>
+        <ul class="activities">
+          <li>今天</li>
+          <li>本周</li>
+          <li>本月</li>
+          <li>本周达成率</li>
+          <li>本月达成率</li>
+          <li>本周新增商机</li>
+        </ul>
+      </div>
+    </div>
+    <div class="performance_wrapper notice">
+      <div style="position: relative;">
+        <h3 style="font-size: 16px;color: #ff002a;">公告</h3><i class="iconfont" style="color: #ff002a;">&#xe645;</i>
+        <div #hide style="font-size: 14px;position: absolute;z-index:-100" [innerHtml]="firstAnnouncement"></div>
+        <div>{{this.firstAnnouncementTitle}}</div>
+        <span style="position:absolute;right:5px;font-size: 12px;color:#408dc9;"
+          routerLink="importantAnnouncement">更多</span>
+      </div>
+    </div>
+    <div class="tool_wrapper" *ngFor="let menuItem of menuLists;">
+      <div class="tool_item" *ngIf="menuItem.isShow">
+        <h3>{{menuItem.title}}</h3>
+        <div class="tool_content">
+          <div class="content_item" *ngFor="let menuItemContent of menuItem['content']" href="javascript:;"
+            (click)="menuNavigation(menuItemContent)">
+            <span class="iconfont" [ngClass]="menuItemContent.icon"></span>
+            <div style="font-size: 13px;">{{menuItemContent.subtitle}}</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- <hr style="border-top: 1px solid #ddd;border-left: none;border-right: none;border-bottom: none;" /> -->
+    <div class="hotProduct">
+      <div style="margin-bottom: 10px;">
+        <h3>热销产品</h3>
+      </div>
+      <div class="media borderBottom" *ngFor="let product of products,let i = index" (click)="goProductDetail(product)"
+        [ngClass]="{'pad15':!isShowShare}">
+        <div class="media-left media-middle">
+          <img class="media-object" src="{{product.iconPath}}" alt="{{product.planName}}">
+          <div class="yd_logo">
+            <img src="assets/images/yd-online_logo.png" alt="上海银盾保险经纪有限公司">
+          </div>
+        </div>
+        <div class="media-body">
+          <div class="media-heading">
+            <h4>{{product.planName}}</h4>
+            <div class="companylogo">
+              <span class="logoBox"><img src="{{product.companyLogoPath}}" alt="{{product.companyName}}"
+                  class="img-responsive"></span>
+            </div>
+          </div>
+          <div class="summaryBox">
+            <div class="summaryContent" *ngFor="let label of product.labels">
+              <div class="summaryIcon"><i class="iconfont icon-gou"></i></div>
+              <div class="summaryLabel">{{label}}</div>
+            </div>
+          </div>
+          <div class="priceContainer">
+            <div style="width: 75%;display: flex;justify-content:space-between;align-items: flex-end">
+              <span class="price" *ngIf="product.productCategoryId!='4'"><strong>￥{{product.price}}</strong><small
+                  style="font-size:12px;font-weight: normal;margin-left: 2px;">起</small><span
+                  style="margin-left: 5px;white-space: nowrap">1人{{product.dayCount>=365 ? '1年' : product.dayCount + '天'}}</span></span>
+              <span class="price" *ngIf="product.productCategoryId=='4'"><strong>￥{{product.price}}</strong><small
+                  style="font-size:12px;font-weight: normal;margin-left: 2px;">/年 起</small></span>
+              <span style="color:#4a4a4a;font-weight:lighter;white-space: nowrap">{{product.feedbackCount}}条评价</span>
+            </div>
+            <div><span style="font-size: 16px;padding-right: 18px;color:#4a4a4a" class="iconfont icon-ar-r"></span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- <hr style="border-top: 1px solid #ddd;border-left: none;border-right: none;border-bottom: none;" /> -->
+    <div class="health_wrapper">
+      <h3>医疗服务</h3>
+      <img style="border-radius: 10px;width: 48%;margin-right: 10px;" src="assets/images/yindunvipmember.jpg"
+        (click)="jumpUrl()">
+      <!-- <img style="border-radius: 10px;width: 48%;" src="assets/images/yindunvipmember.jpg" (click)="jumpUrl()"> -->
+
+    </div>
+
+    <div class="health_wrapper" style="padding: 12px 10px 12px 10px;">
+      <h3 style="margin-bottom: 0;">我的设置
+        <span i class="iconfont icon-ar-r" style="font-size:18px;float: right;" routerLink="setting"></span>
+      </h3>
+    </div>
+    <div class="health_wrapper" style="padding: 12px 10px 12px 10px;">
+      <h3 style="margin-bottom: 0;">我的消息
+        <span i class="iconfont icon-ar-r" style="font-size:18px;float: right;" routerLink="news"></span></h3>
+    </div>
+  </div>
+  <div class="footer" style="font-size: 12px;padding-top: 10px;text-align: center;background: #f6f7f2;">
+    <p>上海银盾保险经纪有限公司</p>
+    <p>保险业务经营许可证：269615000000800</p>
+    <p>版权所有©2020银盾保险在线 &nbsp;沪ICP备18000565号</p>
+  </div>
+
+</div>
+
+
+
+<ydlife-alert *ngIf="isNeedAlert" [dialogInfo]="dialogInfo" (popInfo)="getPopInfo()"></ydlife-alert>
\ No newline at end of file

src/app/my/my-center-home/my-center-home.component.scss

+.weui-panel{
+  position: relative;
+  .weui-cell__hd {
+    i.iconfont {
+      background-image: -webkit-gradient(linear, left top, right bottom, from(#ff1c2b), to(#461415));
+      background-image: linear-gradient(to bottom right, #ff1c2b, #461415);
+      -webkit-background-clip: text;
+      color: transparent;
+      margin-right: 10px;
+      width: 35px;
+      height: 35px;
+      line-height: 35px;
+      text-align: center;
+      font-size: 26px;
+    }
+  }
+  
+  .weui-panel__hd {
+    display: flex;
+    -webkit-box-align: center;
+    align-items: center;
+    padding: 10px 0 10px 21px;
+    width: 100%;
+    // color: #fff;
+    // background: linear-gradient(90deg, #494949, #393939);
+    color: #333;
+    background: #f6f7f2;
+    box-sizing: border-box;
+    img {
+      max-width: 100%;
+      height: 100%;
+      display: block;
+    }
+    > div {
+      margin-right: 15px;
+    }
+    .avatar {
+      width: 60px;
+      height: 60px;
+      border-radius: 50%;
+      overflow: hidden;
+    }
+    .brokerInfo {
+      flex: 1;
+      .brokerName {
+        display: flex;
+        justify-content: space-between;
+        // color: #e3c385;
+        font-weight: normal;
+        font-size: 16px;
+        > div:first-child {
+          display: flex;
+          align-items: flex-end;
+          font-size: 17px;
+        }
+      }
+      .ydTitle, .brokerTag {
+        // color: #ae9f82;
+        border-radius: 6px;
+      }
+      .brokerTag {
+        // margin-top: 10px;
+        display: flex;
+        font-weight: normal;
+        font-size: 14px;
+        > div {
+          display: flex;
+          align-items: center;
+          margin-right: 5px;
+        }
+  
+      }
+    }
+  
+    .shareSelfInfoBtn {
+      padding: 0 15px;
+      color: #fff;
+      background-color: #ff4100;
+      border-radius: 20px;
+      font-size: 15px;
+    }
+  }
+  .weui-panel__hd.header{
+    // background: -webkit-linear-gradient(left, #696d90, #a1adc7);
+    // background: -o-linear-gradient(left, #696d90, #a1adc7);
+    // background: -moz-linear-gradient(left, #696d90, #a1adc7);
+    // background: -ms-linear-gradient(left, #696d90, #a1adc7);
+    // background: linear-gradient(to right, #696d90, #a1adc7);
+  }
+  .weui-panel__bd{
+      background: #f6f7f2;
+      height: auto;
+      padding: 0px 8px;
+      
+      img{
+        width: 100%;
+      }
+    .performance_wrapper{
+      border-radius: 6px;
+      // margin: 5px auto 8px auto;
+      margin: 0 auto 8px auto;
+      box-shadow: 0 0px 2.5px #eceaea;
+      position: relative;
+      // background: url('../../../assets/images/top_bg.png') no-repeat ;
+      background: url('../../../assets/images/bg_02.jpg') no-repeat ;
+      background-size: cover;
+      .bg{
+        height: 100%;
+        position: absolute;
+        z-index: 1;
+      }
+      .content{
+        position: relative;
+        padding: 0px 0px 5px 8px;
+        ul{
+          list-style: none;
+        }
+        .tab{
+          display: flex;
+          list-style: none;
+          margin-bottom: 5px;
+           li {
+            margin-right: 15px;
+            line-height: 38px;
+            height: 38px;
+            color: #fff;
+            h3{
+              font-weight: normal;
+              font-size: 16px;
+            }
+          }
+          li.selected{
+            h3{
+              font-weight: bold;
+            }
+            .line{
+              width: 20px;
+              height: 3px;
+              display: inline-block;
+              position: absolute;
+              bottom: 2px;
+              background: #ff002a;
+            }
+          }
+        }
+        .detail{
+          display: inline-block;
+          color: #fff;
+          text-align: center;
+          cursor: pointer;
+          position: absolute;
+          right: 0px;
+          top: 5px;
+          width: 60px;
+          height: 25px;
+          line-height: 25px;
+          background: rgba(0, 0, 0, 0.4);
+          border-top-left-radius: 12px;
+          border-bottom-left-radius: 12px;
+          font-size:12px;
+        }
+        .performance_list{
+          display: flex;
+          font-size: 14px;
+          li{
+            width: 15%;
+            text-align: center;
+            line-height: 25px;
+            font-size: 12px;
+            color: #fff;
+            margin: 0 5px; 
+            overflow: hidden;
+          }
+          li.markPrice{
+            color: #fff;
+            font-weight: bold;
+            font-size: 15px; 
+          }
+          li:nth-child(1){
+            width: 8%;
+            text-align: left;
+            margin: 0;
+          }
+          li:nth-child(2),li:nth-child(3){
+            width: 26%;
+            text-align: right;
+          }
+          li:last-child{
+            width: 18%;
+          }
+        }
+        .activities{
+          display: flex;
+          font-size: 14px;
+          li{
+            width: 23%;
+            text-align: center;
+            line-height: 25px;
+            font-size: 12px;
+            color: #fff;
+            overflow: hidden;
+          }
+          li:nth-child(1),li:nth-child(2),li:nth-child(3){
+            width: 12%;
+          }
+          li.markPrice{
+            color: #fff;
+            font-weight: bold;
+            font-size: 15px; 
+          }
+        }
+        .activities_grade{
+          color: #fff;
+          height: 38px;
+          line-height: 38px;
+          display: flex;
+          justify-content: space-between;
+          padding-right: 5px;
+        }
+      }   
+    }
+
+    .notice{
+      background: #FFF;
+      padding: 0px 0px 0px 10px;
+      margin-top: 10px;
+      div{
+        display: flex;
+        align-items: center;
+        color: #737272;
+        height: 40px;
+        .iconfont{
+          font-size: 30px;
+        }
+      }
+      
+    }
+  
+    .tool_wrapper{
+      .tool_item{
+        display: flex;
+        flex-direction: column;
+        flex-wrap: wrap;
+        background: #fff;
+        box-shadow:0 0px 2.5px #eceaea;
+        border-radius: 6px;
+        margin-bottom: 10px;
+        padding: 7px 0px 0px 10px;
+        h3{
+
+          font-size: 16px;
+          margin-bottom: 10px;
+        }
+        .tool_content{
+          display: flex;
+          justify-content: space-between;
+          margin-bottom: 10px;
+          flex-wrap: wrap;
+          .content_item{
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            width: 25%;
+            height: 60px;
+            margin-bottom: 10px;
+            .iconfont{
+              color: #ff002a;
+              font-size: 26px;
+            }
+          }
+        }
+      }
+    }
+  
+    .hotProduct{
+      margin: 10px auto;
+      background: #fff;
+      box-shadow: 0 0px 2.5px #eceaea;
+      border-radius: 6px;
+      margin-bottom: 10px;
+      padding: 7px 10px 0px 10px;
+      h3{
+        font-weight: normal;
+        font-size: 16px;
+      }
+        .media {
+          position: relative;
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+          align-items: flex-start;
+          cursor: pointer;
+          padding-bottom: 15px;
+        }
+        .media-left {
+          width: 30%;
+          padding-right: 10px;
+          .yd_logo {
+            padding: 8px;
+            background: rgba(114, 209, 196, 0.18);
+            margin-top: -5px;
+            border-bottom-left-radius: 6px;
+            border-bottom-right-radius: 6px;
+          }
+        }
+        .media-body {
+          width: 75%;
+        }
+        .summaryBox {
+          justify-content: space-between;
+        }
+        .priceContainer {
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+          align-items: flex-end;
+          line-height: 1;
+          margin-top: 5px;
+          span {
+            font-size: 12px;
+            color: #e56124;
+          }
+          .price {
+            display: flex;
+            font-size: 22px;
+            margin-right: 15px;
+            color: #e56124;
+            justify-content: space-between;
+            align-items: flex-end;
+          }
+        }
+        .media-heading {
+          display: flex;
+          justify-content: space-between;
+          align-items: flex-start;
+          color: #4a4a4a;
+        }
+        h4 {
+          font-size: 15px;
+          margin: 0;
+          width: 85%;
+        }
+        .companylogo {
+          width: 70px;
+          height: 26px;
+          margin-top: -1px;
+          font-size: 12px;
+        }
+        .logoBox {
+          width: 100%;
+          height: 100%;
+          display: inline-block;
+        }
+    }
+  
+    .health_wrapper{
+      background: #fff;
+      box-shadow: 0 0px 2.5px #eceaea;
+      border-radius: 6px;
+      margin-bottom: 10px;
+      padding: 7px 10px 10px 10px;
+      h3{
+        font-weight: normal;
+        font-size: 16px;
+        margin-bottom:8px;
+      }
+    }
+  } 
+  
+  .thankWrapper{
+    width: 95%;
+    height: 50%;
+    margin: 0 auto;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    text-align: center;
+  }
+}
+

src/app/my/my-center-home/my-center-home.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyCenterHomeComponent } from './my-center-home.component';
+
+describe('MyCenterHomeComponent', () => {
+  let component: MyCenterHomeComponent;
+  let fixture: ComponentFixture<MyCenterHomeComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ MyCenterHomeComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyCenterHomeComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my/my-news/my-news.component.html

+<div class="wrapper">
+  <div class="item" [routerLink]="['/thanks']">
+    <span>银盾保险经纪董事长欢迎信</span>
+    <div class="content">
+      <span class="iconfont icon-ar-r"></span>
+    </div>
+  </div>
+
+</div>
\ No newline at end of file

src/app/my/my-news/my-news.component.scss

+.wrapper{
+    position: relative;
+    width: 100%;
+    height: 100%;
+    padding: 10px 5px;
+    background: #efefef;
+    .item{
+        height: 60px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 10px;
+        width: 95%;
+        margin: 10px auto;
+        background: #fff;
+        box-shadow:0 0px 3.5px #eceaea;
+        border-radius: 6px;
+        .switch{
+            .iconfont{
+                color: #ff002a;
+                font-size: 18px;
+            }
+        }
+        img{
+         width: 35px;
+         height: 35px;
+         margin-right: 10px;
+        }
+    }
+    .lifeList{
+        display: flex;
+        >div{
+            width: 50%;
+            background-color: #ddd;
+            flex: 1;
+            border-right: 3px solid #fff;
+            img{
+                display: block;
+                max-width: 100%;
+                height: auto;
+            }
+        }
+        >div:last-child{
+            border: none;
+        }
+
+    }
+
+
+}
\ No newline at end of file