医疗服务列表&图片设置宽度后失真修复

src/app/my/medical-service/medical-service.component.html

+<div class="wrapper">
+  <div class="list">
+    <img img src="assets/images/list_03.png" alt="" (click)="jumpUrl()">
+  </div>
+  <div class="list">
+    <img src="assets/images/list_01.png" alt="">
+  </div>
+  <div class="list">
+    <img img src="assets/images/list_02.png" alt="">
+  </div>
+</div>

src/app/my/medical-service/medical-service.component.scss

+.wrapper{
+    padding: 10px 7px;
+    background: #fff;
+    min-height: 100%;
+    .list{
+        margin-bottom: 20px;
+        img{
+            max-width: 100%;
+            box-shadow: 0 0px 10px #e4e3e3;
+            border-radius: 5px;
+            image-rendering: -moz-crisp-edges; /* Firefox */     
+            image-rendering: -o-crisp-edges; /* Opera */      
+            image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */ image-rendering: crisp-edges;
+            -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
+        }
+    }
+}
\ No newline at end of file

src/app/my/medical-service/medical-service.component.spec.ts

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

src/app/my/medical-service/medical-service.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'ydlife-medical-service',
+  templateUrl: './medical-service.component.html',
+  styleUrls: ['./medical-service.component.scss']
+})
+export class MedicalServiceComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+  
+  jumpUrl() {
+    window.location.href = `https://${window.location.host}/mk/ydviphexincoupon`
+  }
+
+}

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

@@ -170,9 +170,11 @@
     </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()">
+      <h3 style="display: flex;justify-content: space-between;align-items: center;">
+        医疗服务 
+        <span style="color: #666666;font-size: 14px;" routerLink="medical_service">查看更多</span>
+      </h3>
+      <img id="medical" src="assets/images/list_01.png">
       <!-- <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;">

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

@@ -33,6 +33,7 @@ ul,ol{
       max-width: 100%;
       height: 100%;
       display: block;
+      
     }
     > div {
       margin-right: 15px;
@@ -299,6 +300,10 @@ ul,ol{
             margin-bottom: 10px;
             img{
               max-width: 44%;
+              image-rendering: -moz-crisp-edges; /* Firefox */     
+              image-rendering: -o-crisp-edges; /* Opera */      
+              image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */ image-rendering: crisp-edges;
+              -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
             }
             // .iconfont{
             //   color: #ff002a;
@@ -417,7 +422,14 @@ ul,ol{
       }
     }
   } 
-  
+  #medical{
+    border-radius: 5px;
+    box-shadow: 0 0px 10px #e4e3e3;
+    image-rendering: -moz-crisp-edges; /* Firefox */     
+    image-rendering: -o-crisp-edges; /* Opera */      
+    image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */ image-rendering: crisp-edges;
+    -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
+  }
   .thankWrapper{
     width: 95%;
     height: 50%;

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

@@ -287,10 +287,6 @@ export class MyCenterHomeComponent implements OnInit, AfterViewInit {
     this.lifeCommonService.setInitDate(this.productInfo.dayCount);
   }
 
-  jumpUrl() {
-    window.location.href = `https://${window.location.host}/mk/ydviphexincoupon`
-  }
-
   jumpToDetail() {
     this.router.navigate(['/rank'], { queryParams: { time: this.performanceSelectedFlag } });
   }

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

@@ -27,6 +27,8 @@ import { OrderDetailComponent } from './order-detail/order-detail.component';
 import { SalaryComponent } from './salary/salary.component';
 import { TodoListComponent } from './todo-list/todo-list.component';
 import { AddTaskComponent } from './add-task/add-task.component';
+import { MedicalServiceComponent} from './medical-service/medical-service.component';
+
 
 const myRoutes: Routes = [
   { path: '', component: MyCenterHomeComponent, canActivate: [AuthGuard], data: [{ title: '银盾保险经纪 - 工作台' }] },
@@ -58,7 +60,8 @@ const myRoutes: Routes = [
   { path: 'orderDetail', component: OrderDetailComponent, canActivate: [AuthGuard] },
   { path: 'salary', component: SalaryComponent, canActivate: [AuthGuard] },
   { path: 'todo', component: TodoListComponent, canActivate: [AuthGuard] },
-  { path: 'addtask',component:AddTaskComponent,canActivate:[AuthGuard]}
+  { path: 'addtask',component:AddTaskComponent,canActivate:[AuthGuard]},
+  { path:'medical_service',component:MedicalServiceComponent,canActivate:[AuthGuard]}
 ];
 
 @NgModule({

src/app/my/my.module.ts

@@ -35,9 +35,10 @@ import { AddTaskComponent } from './add-task/add-task.component';
 
 
 import { NgZorroAntdMobileModule, ModalServiceComponent, ToastComponent } from 'ng-zorro-antd-mobile';
-import {NgxEchartsModule} from 'ngx-echarts'
+import {NgxEchartsModule} from 'ngx-echarts';
+import { MedicalServiceComponent } from './medical-service/medical-service.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],
+  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],
   imports: [
     CommonModule,
     LifeCommonModule,