Commit 5acc4793 authored by liujiaxin's avatar liujiaxin

www

parent e6c4dce0
...@@ -36,11 +36,11 @@ ...@@ -36,11 +36,11 @@
*ngFor="let part of cropperParts;let i = index" *ngFor="let part of cropperParts;let i = index"
class="part-item" > class="part-item" >
<div class="part-item-wrap" style="margin-right: 2.5rem;"> <div class="part-item-wrap" style="margin-right: 2.5rem;">
<i class="anticon anticon-edit" <div *ngIf="currentEditPartIndex !== i"
nz-tooltip nzTitle="edit mode" nz-tooltip nzTitle="edit mode"
(click)="editPart($event, i)">
*ngIf="currentEditPartIndex !== i" <i class="anticon anticon-edit"></i>
(click)="editPart(i)"></i> </div>
<i class="anticon anticon-close-square dynamic-delete-button" <i class="anticon anticon-close-square dynamic-delete-button"
nz-popconfirm nz-popconfirm
...@@ -57,7 +57,8 @@ ...@@ -57,7 +57,8 @@
<div class="part-view" <div class="part-view"
(click)="previewUserSelectPart(i)" (click)="previewUserSelectPart(i)"
[ngStyle]="part.previewCss"> [ngStyle]="part.previewCss">
<img *ngIf="currentEditPartIndex !== i" <!-- *ngIf="currentEditPartIndex !== i"-->
<img
[ngStyle]="part.imgCss" [ngStyle]="part.imgCss"
(load)="initPart($event, i)" (load)="initPart($event, i)"
[src]="picId"> [src]="picId">
......
...@@ -266,6 +266,7 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro ...@@ -266,6 +266,7 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro
// } // }
// return; // return;
// } // }
if (this.cropperParts.length === this.colors.length ) { if (this.cropperParts.length === this.colors.length ) {
this.nzMessageService.info('you can only add seven parts.'); this.nzMessageService.info('you can only add seven parts.');
return; return;
...@@ -289,6 +290,7 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro ...@@ -289,6 +290,7 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro
}); });
this.currentEditPartIndex = this.cropperParts.length - 1; this.currentEditPartIndex = this.cropperParts.length - 1;
// this.angularCropper.cropper.reset(); // this.angularCropper.cropper.reset();
console.log(123123);
this.focusUserInput(); this.focusUserInput();
this.save(); this.save();
} }
...@@ -300,7 +302,10 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro ...@@ -300,7 +302,10 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro
} }
}, 10); }, 10);
} }
editPart(idx) {
editPart(evt, idx) {
const img = evt.currentTarget.parentNode.parentNode.querySelector('img')
console.log('editPart');
this.currentEditPartIndex = idx; this.currentEditPartIndex = idx;
const obj = this.cropperParts[idx]; const obj = this.cropperParts[idx];
this.angularCropper.cropper.setData(obj.data); this.angularCropper.cropper.setData(obj.data);
...@@ -309,6 +314,7 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro ...@@ -309,6 +314,7 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro
this._tmpEditWord = obj.word; this._tmpEditWord = obj.word;
this._tmpEditData = Object.assign({}, obj.data); this._tmpEditData = Object.assign({}, obj.data);
this.focusUserInput(); this.focusUserInput();
this.initPart(img, idx);
} }
confirmRemovePart(idx, evt) { confirmRemovePart(idx, evt) {
this.removePart(idx, evt); this.removePart(idx, evt);
...@@ -322,6 +328,8 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro ...@@ -322,6 +328,8 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro
} }
} }
exitEditPart(evt, idx) { exitEditPart(evt, idx) {
console.log('exitEditPart')
// if( !this.cropperParts[idx].word) { // if( !this.cropperParts[idx].word) {
// const el = this.partConfigBoxes.toArray()[idx].nativeElement.querySelector('.part-word'); // const el = this.partConfigBoxes.toArray()[idx].nativeElement.querySelector('.part-word');
// if (!el.classList.contains('err')) { // if (!el.classList.contains('err')) {
...@@ -344,8 +352,9 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro ...@@ -344,8 +352,9 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro
const cropper: any = this.angularCropper.cropper; const cropper: any = this.angularCropper.cropper;
cropper.previews = []; cropper.previews = [];
} }
savePart(evt, idx) { savePart(evt, idx) {
// const el = this.partConfigBoxes.toArray()[idx].nativeElement.querySelector('.part-word'); // const el = this.partConfigBoxes.toArray()[idx].nativeElement.querySelector('.part-word');
// if (!el.value) { // if (!el.value) {
...@@ -357,16 +366,17 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro ...@@ -357,16 +366,17 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro
// if (el && el.classList.contains('err')) { // if (el && el.classList.contains('err')) {
// return; // return;
// } // }
console.log(evt);
const img = evt.currentTarget.parentNode.parentNode.parentNode.querySelector('img')
this.currentEditPartIndex = this.cropperParts.length - 1; this.currentEditPartIndex = this.cropperParts.length - 1;
this.currentEditPartIndex = -1; this.currentEditPartIndex = -1;
// const origin = this.cropperParts[idx]; // const origin = this.cropperParts[idx];
const data = this.angularCropper.cropper.getData(); const data = this.angularCropper.cropper.getData();
this.cropperParts[idx].data = data; this.cropperParts[idx].data = {...data};
const cropper: any = this.angularCropper.cropper; const cropper: any = this.angularCropper.cropper;
cropper.previews = []; cropper.previews = [];
this.initPart(img ,idx);
this.save(); this.save();
} }
previewUserSelectPart(idx) { previewUserSelectPart(idx) {
...@@ -374,9 +384,9 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro ...@@ -374,9 +384,9 @@ export class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestro
this.angularCropper.cropper.setData(part.data); this.angularCropper.cropper.setData(part.data);
} }
initPart(evt, idx) { initPart(evt, idx) {
// console.log('initPart', evt); console.log('initPart', evt);
const part = this.cropperParts[idx]; const part = this.cropperParts[idx];
const img = evt.target; const img = evt.target || evt;
const preview = img.parentNode; const preview = img.parentNode;
if (!preview) { if (!preview) {
return; return;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment