文章列表页&跳转

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

@@ -511,4 +511,24 @@ export class LifeCommonService {
     const taxNo_reg = /[a-zA-Z0-9]{5,20}/;
     const taxNo_reg = /[a-zA-Z0-9]{5,20}/;
     return taxNo_reg.test(val);
     return taxNo_reg.test(val);
   }
   }
+
+  //截取字符串英文字母算半个字符
+  getTwenty(str, len) {
+    if (!str) return "";
+    if (len <= 0) return "";
+    var templen = 0;
+    for (var i = 0; i < str.length; i++) {
+      if (str.charCodeAt(i) > 255) {
+        templen += 2;
+      } else {
+        templen++;
+      }
+      if (templen == len) {
+        return str.substring(0, i + 1) + '...';
+      } else if (templen > len) {
+        return str.substring(0, i) + '...';
+      }
+    }
+    return str;
+  }
 }
 }

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

+<div [innerHTML]="articleInfo.fileContent">
+</div>

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

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

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

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'ydlife-article-detail',
+  templateUrl: './article-detail.component.html',
+  styleUrls: ['./article-detail.component.scss']
+})
+export class ArticleDetailComponent implements OnInit {
+  articleInfo:any;
+  constructor() { }
+
+  ngOnInit() {
+    this.articleInfo =JSON.parse(sessionStorage.getItem('articleInfo'))
+    console.log(this.articleInfo)
+  }
+
+}

src/app/my/article/article.component.html

+<div class="salesWrapper">
+  <ul class="tab" >
+    <li *ngFor="let titleItem of titleList" (click)="selectTab(titleItem.id)"
+      [ngClass]="{selected:mdDropOptionId===titleItem.id}">
+      <div style="position: relative;">
+        <h3>{{titleItem.dropOptionName}}
+        </h3>
+      </div>
+    </li>
+  </ul>
+  <div class="article_wrapper">
+    <ul>
+      <li *ngFor="let articleItem of articleList" (click)="articleDetail(articleItem)">
+        <div class="left">
+          <div class="title">{{articleItem.title}}</div>
+          <div class="digest">{{lifeCommonService.getTwenty(articleItem.digest,46)}}</div>
+        </div>
+        <div class="right">
+          <img [src]="articleItem.coverUrl">
+        </div>
+      </li>
+      <div class="more" *ngIf="paginationInfo?.pageNum<totalPage" (click)="lookMore()">
+        查看更多
+      </div>
+    </ul>
+  </div>
+</div>
\ No newline at end of file

src/app/my/article/article.component.scss

+.salesWrapper{
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    background: #f5f5f5;
+    .tab {
+      display: flex;
+      list-style: none;
+      justify-content: space-around;
+      background:#fff;
+      margin-bottom: 10px;
+        li {
+          line-height: 50px;
+          height: 50px;
+          text-align: center;
+          h3 {
+            font-weight: normal;
+            font-size: 16px;
+          }
+        }
+        li.selected {
+          border-bottom: 3px #e10d0d solid;
+          h3{
+            color: #e10d0d;
+          }
+        }
+      }
+    .article_wrapper{
+        background: #fff;
+        ul{
+            padding: 10px 15px;
+            li{
+                display: flex;
+                justify-content: space-between;
+                border-bottom: 1px #dbdbdb solid;
+                padding: 15px 0;
+                .right{
+                    width: 40%;
+                    img{
+                        border-radius: 8px;
+                    }
+                }
+                .left{
+                    width: 55%;
+                    .title{
+                        color: #333333;
+                        font-size: 16px;
+                        margin-bottom: 8px;
+                    }
+                    .digest{
+                        color: #666666;
+                        width:100%;
+                    }
+                }
+            }
+            li:last-child{
+                border-bottom: 0;
+            }
+        }
+        .more{
+            margin-top: 10px;
+        }
+    }
+}
\ No newline at end of file

src/app/my/article/article.component.spec.ts

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

src/app/my/article/article.component.ts

+import { Component, OnInit } from '@angular/core';
+import { MyService } from '../../my/my.service';
+import { LifeCommonService } from '../../common/life-common.service';
+import { Router,ActivatedRoute } from '@angular/router';
+import { parse } from 'querystring';
+ 
+@Component({
+  selector: 'ydlife-article',
+  templateUrl: './article.component.html',
+  styleUrls: ['./article.component.scss']
+})
+export class ArticleComponent implements OnInit {
+  titleList:Array<any>;
+  mdDropOptionId:number = null;
+  paginationInfo:any;
+  articleList:Array<any>;
+  totalPage:number;
+  constructor(private myService:MyService,public lifeCommonService:LifeCommonService,private router:Router) { 
+    this.paginationInfo = {
+      pageNum: 1,
+      pageSize: 5
+    }
+  }
+
+  ngOnInit() {
+    this.dropOptionsQuery();
+  }
+
+  dropOptionsQuery() {
+    this.myService.dropOptionsQuery({ code: "practitioner_sharing_file_type" })
+      .subscribe((res) => {
+        if (res["success"]) {
+          this.titleList =res["data"]["dropMasterInfoList"][0]["dropOptionsInfoList"];
+          this.mdDropOptionId = this.titleList[0]['id'];
+          this.practitionerFileSharingList(null);
+        }
+      });
+  }
+
+  selectTab(id) {
+    this.mdDropOptionId = id;
+    this.paginationInfo = {
+      pageNum: 1,
+      pageSize: 5
+    }
+    this.practitionerFileSharingList(null);
+  }
+
+  //文章查询列表
+  practitionerFileSharingList(flag){
+    const param = {
+      mdDropOptionId:this.mdDropOptionId,
+      practitionerFileShares:this.paginationInfo
+    }
+    this.myService.practitionerFileSharingList(param).subscribe((res)=>{
+      if(res['success']){
+        if(flag == null){
+          this.articleList = res['data']['practitionerFileShares']['list'];
+        }else{
+          this.articleList = this.articleList.concat(res['data']['practitionerFileShares']['list'])
+        }
+        this.paginationInfo.pageNum = res['data']['practitionerFileShares']['pageNum'];//当前页
+        this.totalPage = res['data']['practitionerFileShares']['pages'];//总页数
+      }else{
+
+      }
+    })
+  }
+  
+  lookMore(){
+    this.paginationInfo.pageNum ++;
+    this.practitionerFileSharingList('flag');
+  }
+
+  //设置缓存并跳转到文章详情
+  articleDetail(articleItem){
+    sessionStorage.setItem('articleInfo',JSON.stringify(articleItem));
+    this.router.navigate(['/articleDetail']);
+  }
+
+}

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

@@ -93,7 +93,7 @@ export class MyCenterHomeComponent implements OnInit, AfterViewInit {
           { no: 13, subtitle: '我的商机', icon: 'line', path: '', routerLink: 'business',showSubMenu:true },
           { no: 13, subtitle: '我的商机', icon: 'line', path: '', routerLink: 'business',showSubMenu:true },
           { no: 9, subtitle: '执业证书', icon: 'card', path: `https://${window.location.host}/brokerQry/#/brokerDetail/${this.lifeCustomerInfo.practitionerId}?source=0`, routerLink: '',showSubMenu:true },
           { no: 9, subtitle: '执业证书', icon: 'card', path: `https://${window.location.host}/brokerQry/#/brokerDetail/${this.lifeCustomerInfo.practitionerId}?source=0`, routerLink: '',showSubMenu:true },
           { no: 10, subtitle: '职业类别', icon: 'job', path: 'https://www.ydinsurance.cn/occupationQry/', routerLink: '',showSubMenu:true },
           { no: 10, subtitle: '职业类别', icon: 'job', path: 'https://www.ydinsurance.cn/occupationQry/', routerLink: '',showSubMenu:true },
-          { no: 7, subtitle: '文章分享', icon: 'article', path: `https://${window.location.host}/discovery`, routerLink: '' ,showSubMenu:true},
+          { no: 7, subtitle: '文章分享', icon: 'article', path: '', routerLink: 'article' ,showSubMenu:true},
           { no: 3, subtitle: '产品海报', icon: 'poster_p', path: '/salesDetail', routerLink: 'material',showSubMenu:true },
           { no: 3, subtitle: '产品海报', icon: 'poster_p', path: '/salesDetail', routerLink: 'material',showSubMenu:true },
         ],
         ],
         isShow: true
         isShow: true
@@ -318,10 +318,10 @@ export class MyCenterHomeComponent implements OnInit, AfterViewInit {
       if (res['success']) {
       if (res['success']) {
         this.isShow = true;
         this.isShow = true;
         sessionStorage.setItem('isTeamleader', '1');
         sessionStorage.setItem('isTeamleader', '1');
-        sessionStorage.setItem('subordinateSystemName', res['data']['subordinateSystemName'])
+        sessionStorage.setItem('subordinateSystemName', res['data']['subordinateSystemName']);
       } else {
       } else {
         this.isShow = false;
         this.isShow = false;
-        sessionStorage.setItem('isTeamleader', '0')
+        sessionStorage.setItem('isTeamleader', '0');
       }
       }
     })
     })
   }
   }

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

@@ -49,6 +49,8 @@ import { SuggestionComponent } from './suggestion/suggestion.component';
 import { EmployeeSalaryComponent } from './application-process/employee-salary/employee-salary.component';
 import { EmployeeSalaryComponent } from './application-process/employee-salary/employee-salary.component';
 import { HistoricalRankComponent } from './historical-rank/historical-rank.component';
 import { HistoricalRankComponent } from './historical-rank/historical-rank.component';
 import { TeamAreaPanelComponent } from './team-area-panel/team-area-panel.component';
 import { TeamAreaPanelComponent } from './team-area-panel/team-area-panel.component';
+import { ArticleComponent } from './article/article.component';
+import { ArticleDetailComponent } from './article-detail/article-detail.component';
 
 
 const myRoutes: Routes = [
 const myRoutes: Routes = [
   { path: '', component: MyCenterHomeComponent, canActivate: [AuthGuard], data: [{ title: '银盾保险经纪 - 工作台' }] },
   { path: '', component: MyCenterHomeComponent, canActivate: [AuthGuard], data: [{ title: '银盾保险经纪 - 工作台' }] },
@@ -104,7 +106,9 @@ const myRoutes: Routes = [
   { path: 'my_application',component:MyApplicationComponent,data: [{ title: '我的报聘' }],canActivate:[AuthGuard]},
   { path: 'my_application',component:MyApplicationComponent,data: [{ title: '我的报聘' }],canActivate:[AuthGuard]},
   { path: 'suggestion',component:SuggestionComponent,data: [{ title: '问题反馈' }],canActivate:[AuthGuard]},
   { path: 'suggestion',component:SuggestionComponent,data: [{ title: '问题反馈' }],canActivate:[AuthGuard]},
   { path: 'historical_rank', component: HistoricalRankComponent, canActivate: [AuthGuard] },
   { path: 'historical_rank', component: HistoricalRankComponent, canActivate: [AuthGuard] },
-  { path: 'team_area',component:TeamAreaPanelComponent, canActivate: [AuthGuard]}
+  { path: 'team_area',component:TeamAreaPanelComponent, canActivate: [AuthGuard]},
+  { path: 'article', component:ArticleComponent,canActivate:[AuthGuard]},
+  { path: 'articleDetail',component:ArticleDetailComponent}
 ];
 ];
 
 
 @NgModule({
 @NgModule({

src/app/my/my.module.ts

@@ -59,9 +59,11 @@ import { SuggestionComponent } from './suggestion/suggestion.component';
 import { EmployeeSalaryComponent } from './application-process/employee-salary/employee-salary.component';
 import { EmployeeSalaryComponent } from './application-process/employee-salary/employee-salary.component';
 import { HistoricalRankComponent } from './historical-rank/historical-rank.component';
 import { HistoricalRankComponent } from './historical-rank/historical-rank.component';
 import { TeamAreaPanelComponent } from './team-area-panel/team-area-panel.component';
 import { TeamAreaPanelComponent } from './team-area-panel/team-area-panel.component';
+import { ArticleComponent } from './article/article.component';
+import { ArticleDetailComponent } from './article-detail/article-detail.component';
 
 
 @NgModule({
 @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],
+  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],
   imports: [
   imports: [
     CommonModule,
     CommonModule,
     LifeCommonModule,
     LifeCommonModule,

src/app/my/my.service.ts

@@ -598,4 +598,12 @@ export class MyService {
       const url = this.ydapi + "/practitioner/canSeeSalaryList/" + params ;
       const url = this.ydapi + "/practitioner/canSeeSalaryList/" + params ;
       return this.http.get(url);
       return this.http.get(url);
     }
     }
+
+    //文章查询列表
+    practitionerFileSharingList(param){
+      const url = this.ydapi + '/agms/practitionerFileSharingList';
+      return this.http.post(url, JSON.stringify(param)).pipe((res)=>{
+        return res;
+      });
+    }
 }
 }