调整名片实现方式

package.json

@@ -26,7 +26,7 @@
     "core-js": "^2.5.4",
     "dayjs": "1.10.4",
     "echarts": "^4.9.0",
-    "html2canvas": "^1.0.0-rc.7",
+    "html2canvas": "^1.4.1",
     "jquery": "^3.5.1",
     "jspdf": "^2.3.0",
     "ng-zorro-antd-mobile": "^0.12.5",

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

 <div class="businessCardContainer">
   <div style="text-align: right;padding-top: 15px;">
     <button class="applyEmailBtn" (click)="applyEmail()" *ngIf="practitionerInfo?.emailIsActive==0">申请公司邮箱</button>
-    <a class="applyEmailBtn" href="assets/pdfjs/web/viewer.html?file={{practitionerInfo?.businessCardPdfUrl}}&isNeedCover=false&isNeedDownload=true" target="_blank" rel="noopener noreferrer">保存名片PDF档</a>
+    <!-- <button class="applyEmailBtn" (click)="savePicture(practitionerInfo.businessCardProsImg)" *ngIf="practitionerInfo?.businessCardProsImg">保存名片正面</button>
+    <button class="applyEmailBtn" (click)="savePicture(practitionerInfo.businessCardConsImg)" *ngIf="practitionerInfo?.businessCardConsImg">保存名片反面</button> -->
+    <!-- <a class="applyEmailBtn" href="assets/pdfjs/web/viewer.html?file={{practitionerInfo?.businessCardPdfUrl}}&isNeedCover=false&isNeedDownload=true" target="_blank" rel="noopener noreferrer">保存名片PDF档</a> -->
+    <!-- <a class="applyEmailBtn" href="{{practitionerInfo?.businessCardProsImg}}" download="名片正面" target="_blank" rel="noopener noreferrer">保存名片正面</a> -->
+    <!-- <a class="applyEmailBtn" href="{{practitionerInfo?.businessCardConsImg}}" download="名片反面" target="_blank" rel="noopener noreferrer">保存名片反面</a> -->
   </div>
-  <div class="brokerCardPositive">
+  <div *ngIf="practitionerInfo?.businessCardProsImg" style="text-align: center;color: red;">长按可保存名片到相册</div>
+<div id="saveImgContainer">
+  <div>
+    <img src="{{practitionerInfo?.businessCardProsImg}}" alt="" class="img-responsive">
+  </div>
+  <div>
+    <img src="{{practitionerInfo?.businessCardConsImg}}" alt="" class="img-responsive">
+  </div>
+  <!-- <div class="brokerCardPositive">
     <div class="qrcodeBox">
       <div>
         <div style="margin-bottom: 20%;"><img src="assets/images/ydShield.png" alt="银盾保险经纪" class="img-responsive">
@@ -46,6 +58,7 @@
   </div>
   <div class="brokerCardOpposite">
     <img src="assets/images/card_opposite.jpg" alt="" class="img-responsive">
-  </div>
+  </div> -->
+</div>
 </div>
 <ydlife-alert *ngIf="isNeedAlert" [dialogInfo]="dialogInfo" (popInfo)="getPopInfo()"></ydlife-alert>
\ No newline at end of file

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

@@ -18,6 +18,19 @@ export class BusinessCardComponent implements OnInit {
     this.lifeCustomerInfo = JSON.parse(localStorage.getItem('lifeCustomerInfo'));
     this.businessCard();
   }
+
+  savePicture(Url) {
+		var blob = new Blob([''], { type: 'application/octet-stream' });
+		var url = URL.createObjectURL(blob);
+		var a = document.createElement('a');
+		a.href = Url;
+		a.download = Url.replace(/(.*\/)*([^.]+.*)/ig, "$2").split("?")[0];
+		var e = document.createEvent('MouseEvents');
+		e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
+		a.dispatchEvent(e);
+		URL.revokeObjectURL(url);
+	}
+
   // 申请企业邮箱
   applyEmail(){
     this.myService.applyEmail({practitionerId:this.practitionerInfo.practitionerId,email:this.practitionerInfo.email}).subscribe(res=>{
@@ -44,7 +57,7 @@ export class BusinessCardComponent implements OnInit {
     this.isNeedAlert = false;
   }
   businessCard(){
-    this.myService.businessCard({practitionerId:this.lifeCustomerInfo.practitionerId}).subscribe(res=>{
+    this.myService.businessCard({practitionerId:this.lifeCustomerInfo.practitionerId,businessCardType:2}).subscribe(res=>{
       if(res['success']){
         this.practitionerInfo = res['data'];
         this.practitionerInfo.certificateList = this.practitionerInfo.certificateList.splice(0,3)