薪资单跳转详情

d589d9dd · sunchao · 8378d1ec · d589d9dd · d589d9dd · d589d9dd
Commit d589d9dd authored May 18, 2021 by sunchao
12 changed files
--- a/src/app/common/detail-modal/detail-modal.component.html
+++ b/src/app/common/detail-modal/detail-modal.component.html
+<!--弹窗Starts-->
+<div class="detailContent defineFixed" *ngIf="isOpen">
+  <!-- 其他应税项目模板-->
+  <div class="detailBox" *ngIf="application===1">
+    <div class="header">
+      <div></div>
+      <h5>其他应税加扣款</h5>
+      <div class="closeModal cursor" (click)="closeModal()">&times;</div>
+    </div>
+  </div>
+  <!-- 其他应税项目模板-->
+  <!--个人所得税政策模板-->
+  <div class="detailBox" *ngIf="application===2">
+    <div class="header">
+      <div></div>
+      <h5>个人所得税政策</h5>
+      <div class="closeModal cursor" (click)="closeModal()">&times;</div>
+    </div>
+  </div>
+</div>
+<!--弹窗结束-->
--- a/src/app/common/detail-modal/detail-modal.component.scss
+++ b/src/app/common/detail-modal/detail-modal.component.scss
+.detailContent {
+    top: 0;
+    height: 100%;
+    background: rgba(0,0,0,.5);
+    z-index: 3004;
+    .detailBox {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 70%;
+      background-color: #fff;
+      overflow-y: scroll;
+      animation: slowUp .5s ease both;
+      .header {
+        position: relative;
+        width: 100%;
+        height: 48px;
+        line-height: 48px;
+        padding-right: 15px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        h5 {
+          font-size: 16px;
+          color: #000;
+        }
+        .closeModal {
+          color: #8a8a8a;
+          font-size: 32px;
+        }
+      }
+      .header:after {
+        position: absolute;
+        left: 0;
+        bottom: 1px;
+        width: 100%;
+        content: '';
+        height: 1px;
+        background-color: #dcdcdc;
+        transform: scaleY(0.5);
+      }
+      h4 {
+        color: #ec2d37;
+        font-weight: bold;
+      }
+      .body {
+        padding: 10px 15px 0 15px;
+        > ul {
+          > li {
+            height: 34px;
+            line-height: 34px;
+            letter-spacing: 1px;
+            display: flex;
+            justify-content: space-between;
+          }
+        }
+      }
+    }
+  }
+.defineFixed{
+    position: fixed;
+    left: 0;
+    right: 0;
+    min-width: 320px;
+    max-width: 640px;
+    width: 100%;
+    margin: 0 auto;
+}
\ No newline at end of file
--- a/src/app/common/detail-modal/detail-modal.component.spec.ts
+++ b/src/app/common/detail-modal/detail-modal.component.spec.ts
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { DetailModalComponent } from './detail-modal.component';
+describe('DetailModalComponent', () => {
+  let component: DetailModalComponent;
+  let fixture: ComponentFixture<DetailModalComponent>;
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ DetailModalComponent ]
+    })
+    .compileComponents();
+  }));
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DetailModalComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
--- a/src/app/common/detail-modal/detail-modal.component.ts
+++ b/src/app/common/detail-modal/detail-modal.component.ts
+import { Component, OnInit, Input, Output,EventEmitter } from '@angular/core';
+@Component({
+  selector: 'ydlife-detail-modal',
+  templateUrl: './detail-modal.component.html',
+  styleUrls: ['./detail-modal.component.scss']
+})
+export class DetailModalComponent implements OnInit {
+ // application:1其他应税项目，2为个人所得税政策
+ @Input() application: number;
+ @Output() closeDetailModal = new EventEmitter();
+ isOpen: boolean;
+  constructor() {
+    this.isOpen = true;
+   }
+  ngOnInit() {
+  }
+  //   关闭弹窗
+  closeModal() {
+    this.isOpen = false;
+    this.closeDetailModal.emit();
+  }
+}
--- a/src/app/my/my.module.ts
+++ b/src/app/my/my.module.ts
@@ -66,8 +66,10 @@ import { UEditorModule } from 'ngx-ueditor';
 import { ArticleReadComponent } from './article-read/article-read.component';
 import { SalaryDetailComponent } from './salary-detail/salary-detail.component';
 import { SalaryFirstYearComponent } from './salary-first-year/salary-first-year.component';
+import { DetailModalComponent } from '../common/detail-modal/detail-modal.component';
 @NgModule({
-  declarations: [MyCenterHomeComponent, MkMaterialComponent, MkMaterialDetailComponent, FileUploadComponent, ImportantAnnouncementComponent, SalesDetailComponent, AnnouncementDetailComponent, MyBusinessComponent, MyBusinessDetailComponent, PickerComponent, MyToastComponent, SalesRankComponent, TeamRankComponent, RecruitingComponent, RecruitingDetailComponent, ThanksComponent, MySettingComponent, MySettingDetailComponent, MyNewsComponent, MyTargetComponent, TeamPanelComponent, SwitchNumberPipe, TeamSalesScoreComponent, ScoreDetailsComponent, BusinessCardComponent, OrderDetailComponent, SalaryComponent, TodoListComponent, AddTaskComponent, MedicalServiceComponent, InvitationComponent, RegisterComponent, EmployeeInfoComponent, EmployeeBasicInfoComponent, WorkExperienceComponent, PersonalPhotosComponent, EmployeeIdCardComponent, EmployeeEducationComponent, PersonalStatementComponent, SignatureComponent, EmployeeSubmitComponent, BankCardComponent, MemberDetailComponent, ApprovalListComponent, ApprovalCommentsComponent, ApprovalResultListComponent, MyApplicationComponent, SuggestionComponent, EmployeeSalaryComponent, HistoricalRankComponent, TeamAreaPanelComponent, ArticleComponent, ArticleDetailComponent, ArticleReadComponent,SalaryDetailComponent,SalaryFirstYearComponent],
+  declarations: [MyCenterHomeComponent, MkMaterialComponent, MkMaterialDetailComponent, FileUploadComponent, ImportantAnnouncementComponent, SalesDetailComponent, AnnouncementDetailComponent, MyBusinessComponent, MyBusinessDetailComponent, PickerComponent, MyToastComponent, SalesRankComponent, TeamRankComponent, RecruitingComponent, RecruitingDetailComponent, ThanksComponent, MySettingComponent, MySettingDetailComponent, MyNewsComponent, MyTargetComponent, TeamPanelComponent, SwitchNumberPipe, TeamSalesScoreComponent, ScoreDetailsComponent, BusinessCardComponent, OrderDetailComponent, SalaryComponent, TodoListComponent, AddTaskComponent, MedicalServiceComponent, InvitationComponent, RegisterComponent, EmployeeInfoComponent, EmployeeBasicInfoComponent, WorkExperienceComponent, PersonalPhotosComponent, EmployeeIdCardComponent, EmployeeEducationComponent, PersonalStatementComponent, SignatureComponent, EmployeeSubmitComponent, BankCardComponent, MemberDetailComponent, ApprovalListComponent, ApprovalCommentsComponent, ApprovalResultListComponent, MyApplicationComponent, SuggestionComponent, EmployeeSalaryComponent, HistoricalRankComponent, TeamAreaPanelComponent, ArticleComponent, ArticleDetailComponent, ArticleReadComponent,SalaryDetailComponent,SalaryFirstYearComponent,DetailModalComponent],
  imports: [
    CommonModule,
    LifeCommonModule,

--- a/src/app/my/my.service.ts
+++ b/src/app/my/my.service.ts
@@ -611,9 +611,8 @@ export class MyService {
   * 获取微信用户的详细信息
   */
    getWxUserInfo(trackId) {
-      const url = this.API + '/getWxUserInfo';
+      const url = this.API + '/getSnsApiUserInfo?trackId=' + trackId;
-      const cs = {trackId:trackId};
+      return this.http.get(url).pipe((res)=>{
-      return this.http.post(url, cs).pipe((res)=>{
        return res;
      });
    }

--- a/src/app/my/salary-detail/salary-detail.component.html
+++ b/src/app/my/salary-detail/salary-detail.component.html
@@ -14,35 +14,37 @@
    <div class="part">
      <div class="item">
        <div class="title">个人销售(A)</div>
-        <div class="item_detail">
+        <div class="item_detail" (click)="jumpToFirstYearSales(1)">
-          <a style="color:#2c67a0;" (click)="jumpToFirstYearSales()">首年度销售佣金</a>
+          <span>首年度销售佣金</span>
-          <span class="red">18,505.00</span>
+          <span class="red">18,505.00 <i class="iconfont icon-ar-r"></i> </span>
        </div>
-        <div class="item_detail">
+        <div class="item_detail" (click)="jumpToFirstYearSales(2)">
          <span>续年度销售佣金</span>
-          <span class="red">225.00</span>
+          <span class="red">225.00 <i class="iconfont icon-ar-r"></i></span>
        </div>
      </div>
      <div class="item">
        <div class="title">销售管理(B)</div>
-        <div class="item_detail">
+        <div class="item_detail" (click)="jumpToFirstYearSales(3)">
          <span>首年度辅导奖金</span>
-          <span class="red">18,505.00</span>
+          <span class="red">18,505.00 <i class="iconfont icon-ar-r"></i></span>
        </div>
-        <div class="item_detail">
+        <div class="item_detail" (click)="jumpToFirstYearSales(4)">
          <span>续年度辅导奖金</span>
-          <span class="red">225.00</span>
+          <span class="red">225.00 <i class="iconfont icon-ar-r"></i></span>
        </div>
-        <div class="item_detail">
+        <div class="item_detail" (click)="jumpToFirstYearSales(5)">
          <span>特别管理奖金</span>
-          <span class="red">225.00</span>
+          <span class="red">225.00 <i class="iconfont icon-ar-r"></i></span>
        </div>
      </div>
      <div class="item">
-        <div class="title">其他应税项目(C)</div>
+        <div class="title" style="justify-content: inherit;" (click)="toastShow = true">
-        <div class="item_detail">
+          其他应税项目(C)
+          <span class="iconfont icon-wenhao" style="margin-top: 3px;color: #f8002e;margin-left: 3px;"></span></div>
+        <div class="item_detail" (click)="jumpToFirstYearSales(6)">
          <span>其他应税加扣款</span>
-          <span class="red">225.00</span>
+          <span class="red">225.00<i class="iconfont icon-ar-r"></i></span>
        </div>
      </div>
      <div class="item">
@@ -70,13 +72,18 @@
    </div>
    <a style="color:#2c67a0;" (click)="lookTak()">点击查看个人所得税明细</a>
  </div>
+  <!--保险公司介绍弹窗-->
+  <div *ngIf="toastShow">
+    <ydlife-detail-modal [application]="1"
+      (closeDetailModal)="toastShow = false"></ydlife-detail-modal>
+  </div>
 </div>
 <div class="mask" *ngIf="takFlag == true;"></div>
 <div class="tax_mask" *ngIf="takFlag == true;">
  <div class="close" (click)="takFlag = false;"> X </div>
  <div class="mask_title">
    <div>个人所得税预扣明细</div>
-    <div><span class="iconfont icon-zhuyishixiang"></span> 个人所得税政策</div>
+    <div (click)="toastShow = true"><span class="iconfont icon-zhuyishixiang"></span> 个人所得税政策</div>
  </div>
  <div class="tax_content">
    <div class="tax_item">

--- a/src/app/my/salary-detail/salary-detail.component.scss
+++ b/src/app/my/salary-detail/salary-detail.component.scss
@@ -52,7 +52,14 @@
                    justify-content: space-between;
                    align-items: center;
                    height: 30px;
-                    padding-left: 15px;
+                    margin-left: 15px;
+                    border-bottom: 1px #f4f4f4 solid;
+                    .iconfont{
+                        font-size: 14px;
+                    }
+                }
+                .item_detail:last-child{
+                    border-bottom:0;
                } 
                .red{
                    color:#f8002e;

--- a/src/app/my/salary-detail/salary-detail.component.ts
+++ b/src/app/my/salary-detail/salary-detail.component.ts
@@ -11,6 +11,7 @@ import { ActivatedRoute,Router } from "@angular/router";
 export class SalaryDetailComponent implements OnInit {
  monDtlPeriod:string;
  takFlag:boolean = false;
+  toastShow:boolean;
  constructor(public lifeCommonService: LifeCommonService,
    private activatedRoute: ActivatedRoute,
    private router:Router) { }
@@ -22,11 +23,20 @@ export class SalaryDetailComponent implements OnInit {
  lookTak(){
    this.takFlag = true;
-    console.log(this.takFlag)
  }
-  jumpToFirstYearSales(){
+  /**
-    this.router.navigate([`/salary_detail/${this.monDtlPeriod}`]);
+   * 
+   * @param type 
+   * 1.首年度销售佣金
+   * 2.续年度销售佣金
+   * 3.首年度辅导奖金
+   * 4.续年度辅导奖金
+   * 5.特别管理奖金
+   * 6.其他应税加扣款
+   */
+  jumpToFirstYearSales(type){
+    this.router.navigate([`/salary_detail/${this.monDtlPeriod}`],{queryParams:{type:type}});
  }
 }
--- a/src/app/my/salary-first-year/salary-first-year.component.html
+++ b/src/app/my/salary-first-year/salary-first-year.component.html
 <div class="wrapper">
  <div class="header">
-    <div class="iconfont icon-fanhui"></div>
+    <div class="iconfont icon-fanhui" (click)="goBack()"></div>
-    <div>首年销售奖金</div>
+    <div>{{getTitleName(type)}}</div>
  </div>
  <div class="content_wrapper">
    <div class="policy_item">
@@ -11,10 +11,16 @@
        <div>保险公司:复星</div>
        <div>生效时间:2021-03-07</div>
        <div>保单号:1234567</div>
+        <div *ngIf="status">保费：</div>
+        <div *ngIf="status">FYC：</div>
+        <div *ngIf="status">职阶率：</div>
+        <div *ngIf="status">体系：</div>
+        <div *ngIf="status">经纪人：</div>
      </div>
      <div class="money" (click)="status = !status">
        ￥3,750.00 
-          <div style="width: 15px;height: 15px;position: absolute;right: -15px;top: 8px;" [ngStyle]="{'transform': status ? 'rotate(0)' : 'rotate(180deg)'}">
+          <div style="width: 15px;height: 15px;position: absolute;right: -20px;top: 8px;" 
+          [ngStyle]="{'transform': status ? 'rotate(0)' : 'rotate(180deg)','top':status?'0':'8px'}">
            <span class="iconfont icon-xiangxia" ></span>
          </div>
      </div>

--- a/src/app/my/salary-first-year/salary-first-year.component.ts
+++ b/src/app/my/salary-first-year/salary-first-year.component.ts
 import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute,Router } from "@angular/router";
 @Component({
  selector: 'ydlife-salary-first-year',
@@ -7,9 +8,34 @@ import { Component, OnInit } from '@angular/core';
 })
 export class SalaryFirstYearComponent implements OnInit {
  status:boolean;
-  constructor() { }
+  type:any;
+  constructor(private activatedRoute: ActivatedRoute) { }
  ngOnInit() {
+    this.type = this.activatedRoute.snapshot.queryParams.type?this.activatedRoute.snapshot.queryParams.type:null;
  }
+  goBack(){
+    history.go(-1);
+  }
+  getTitleName(type){
+    switch (type){
+      case '1':
+        return '首年度销售佣金';
+      case '2':
+        return '续年度销售佣金';
+      case '3':
+        return '首年度辅导奖金';
+      case '4':
+        return '续年度辅导奖金';
+      case '5':
+        return '特别管理奖金';
+      case '6':
+        return '其他应税加扣款';
+      default :
+        return '/'
+    }
+  }
 }
--- a/src/app/my/salary/salary.component.scss
+++ b/src/app/my/salary/salary.component.scss
@@ -37,7 +37,7 @@
              height: 35px;
              position: absolute;
              left: 13px;
-              top: 13px;
+              top: 15px;
              line-height: 30px;
              text-align: center;
              border-radius: 50%;