Sineedge/sparqsineedge
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

image cropping tools

Browse Source
This commit is contained in:
venbatechnologies@gmail.com 2022-02-18 10:46:10 +05:30
parent 2a7e2804db
commit dd20044f17
9 changed files with 76 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
ng6-seed/Sparqsineedge Web 17-02-22 Test.zip Normal file
View File

Binary file not shown.

4
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/dialogue/crop-tools/crop-tools.component.html Normal file
View File

@ -0,0 +1,4 @@
<p>
crop-tools works!
</p>

0
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/dialogue/crop-tools/crop-tools.component.scss Normal file
View File

25
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/dialogue/crop-tools/crop-tools.component.spec.ts Normal file
View File

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

23
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/dialogue/crop-tools/crop-tools.component.ts Normal file
View File

@ -0,0 +1,23 @@
import { Component,ViewChild, OnInit, ViewEncapsulation, OnDestroy, OnChanges, ElementRef, Inject } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { NotifierService } from 'angular-notifier';
import { MatPaginator, MatSort, MatTableDataSource, PageEvent, MatTabChangeEvent } from '@angular/material';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA , DialogPosition} from '@angular/material';
import { PdTrigerService} from './../../../../../../pd-service/pd-triger.service';
import { Observable, Observer } from 'rxjs';
//import { ImageCroppedEvent } from 'ngx-image-cropper';
import { DomSanitizer, SafeResourceUrl, SafeUrl } from '@angular/platform-browser';
@Component({
selector: 'app-crop-tools',
templateUrl: './crop-tools.component.html',
styleUrls: ['./crop-tools.component.scss']
})
export class CropToolsComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}

12
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/dialogue/image-crop/image-crop.component.scss
View File

@ -22,4 +22,16 @@
.card-container {
text-align: center;
}
.img-container {
width: 640px;
height: 480px;
float: left;
}
.img-preview {
width: 200px;
height: 200px;
float: left;
margin-left: 10px;
}

5
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/dialogue/image-crop/image-crop.component.ts
View File

@ -78,10 +78,12 @@ export class ImageCropComponent implements OnInit, OnDestroy {
clickToCrop()
{
let that = this;
that.cropflag = true;
that.cropper = $('.container > img').cropper({
aspectRatio: 16 / 9,
//aspectRatio: 1,
autoCrop:false,
rotatable: true,
getData:true,
@ -100,6 +102,7 @@ export class ImageCropComponent implements OnInit, OnDestroy {
crop()
{
var cropcanvas = $('.container > img').cropper('getCroppedCanvas');
var croppng = cropcanvas.toDataURL("image/png") ;
this.previewflag = true;

5
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/image-docs/image-docs.component.ts
View File

@ -3,6 +3,7 @@ import { PdTrigerService } from 'app/personal-discussion/pd-service/pd-triger.se
import { NotifierService } from 'angular-notifier';
import { ImageCropComponent } from '../dialogue/image-crop/image-crop.component';
import { MatDialog } from '@angular/material';
import { CropToolsComponent } from '../dialogue/crop-tools/crop-tools.component';
@Component({
selector: 'app-image-docs',
@ -92,13 +93,15 @@ export class ImageDocsComponent implements OnInit {
},err=>{console.log(err)})
}
imageCrop(pic) {
// let arr = { 'pic_name':pic_name,'pic':pic,'from_id':this.form_id}
pic.pdid = this.pdid;
const imageRef = this.dialog.open(ImageCropComponent, {
// const imageRef = this.dialog.open(CropToolsComponent, {
data: pic,
maxWidth: '100vw',
maxHeight: '100vh',
height: '100%',
height: '200%',
width: '100%',
});
imageRef.afterClosed()

7
ng6-seed/src/app/personal-discussion/manage-pd/manage-pd.module.ts
View File

@ -162,6 +162,7 @@ import {
MatTreeModule,
} from '@angular/material';
import { CropToolsComponent } from './list-pd/start-pd/forms/dialogue/crop-tools/crop-tools.component';
/**
* Custom angular notifier options
*/
@ -207,7 +208,7 @@ const pdCustomNotifierOptions: NotifierOptions = {
};
@NgModule({
declarations: [TelePdAllocationComponent, FinancialInfoComponent, BusinessInfoComponent, EmploymentInfoComponent, StockComponent, BankingDetailsComponent, ListPdComponent, FamilyDetailsComponent, AddressComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent,VendorPdAllocationComponent, DuplicatePdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent,StartPd2Component, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, CurrentLoanComponent, AssetsInfoComponent, LoanDetailsComponent, OtherIncomeComponent, SupplierInfoComponent, PersonalInfoComponent, LenderRepresentativeComponent, PdReportComponent, AssessedIncomeComponent, AllocationViewMoreComponent, PdRequirementComponent,PdCollectedDocsComponent, GeneralInfoComponent, ModelEditPdReportComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, DialogChangeCurrentVenrsion, FinalRemarksComponent, BusinessOtherFamilyMemberComponent, QcReviewComponent, BusinessInfoGroupComponent, SearchRelationPipe, RupeeCurrencyFormatPipe, NumberToWordsPipe, DeleteRecordsCountPipe, BusinessAssetsInfoComponent, BusinessBankingDetailsComponent, SalesDetailsComponent, DailySalesDetailsComponent, SalesCalculationComponent, ManageSalesComponent, PurchaseDetailsComponent, BusinessExpenseDetailsComponent, HouseHoldDetailsComponent, OtherBusinessIncomeDetailsComponent, ManagePurchaseComponent, ManageBusinesExpenseComponent, ManageHouseHoldComponent, ManageOtherBusinessIncomeComponent, GrossProfitCalculationComponent, ManageDailySalesComponent, PdStatusChangeDialogueComponent, PdLocatedMapViewDirective, ViewLocationComponent, GetAnswerableFormsPipe, ConfirmAiDetailsComponent, RentalVerificationComponent, InitiateAdditionalPdComponent ,ManageDailyPurchaseComponent, DailyPurchaseDetailsComponent, ManageRentalVerificationComponent, FuturePlansAndBusinessEnvironmentComponent, ImageCropComponent,PurchaseCalculationComponent,QueriesDocsComponent, ImageDocsComponent,CustomTitleCaseDirective, SpeedDialFabComponent,VideoPlayerComponent,
declarations: [TelePdAllocationComponent, FinancialInfoComponent, BusinessInfoComponent, EmploymentInfoComponent, StockComponent, BankingDetailsComponent, ListPdComponent, FamilyDetailsComponent, AddressComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent,VendorPdAllocationComponent, DuplicatePdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent,StartPd2Component, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, CurrentLoanComponent, AssetsInfoComponent, LoanDetailsComponent, OtherIncomeComponent, SupplierInfoComponent, PersonalInfoComponent, LenderRepresentativeComponent, PdReportComponent, AssessedIncomeComponent, AllocationViewMoreComponent, PdRequirementComponent,PdCollectedDocsComponent, GeneralInfoComponent, ModelEditPdReportComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, DialogChangeCurrentVenrsion, FinalRemarksComponent, BusinessOtherFamilyMemberComponent, QcReviewComponent, BusinessInfoGroupComponent, SearchRelationPipe, RupeeCurrencyFormatPipe, NumberToWordsPipe, DeleteRecordsCountPipe, BusinessAssetsInfoComponent, BusinessBankingDetailsComponent, SalesDetailsComponent, DailySalesDetailsComponent, SalesCalculationComponent, ManageSalesComponent, PurchaseDetailsComponent, BusinessExpenseDetailsComponent, HouseHoldDetailsComponent, OtherBusinessIncomeDetailsComponent, ManagePurchaseComponent, ManageBusinesExpenseComponent, ManageHouseHoldComponent, ManageOtherBusinessIncomeComponent, GrossProfitCalculationComponent, ManageDailySalesComponent, PdStatusChangeDialogueComponent, PdLocatedMapViewDirective, ViewLocationComponent, GetAnswerableFormsPipe, ConfirmAiDetailsComponent, RentalVerificationComponent, InitiateAdditionalPdComponent ,ManageDailyPurchaseComponent, DailyPurchaseDetailsComponent, ManageRentalVerificationComponent, FuturePlansAndBusinessEnvironmentComponent, ImageCropComponent,CropToolsComponent,PurchaseCalculationComponent,QueriesDocsComponent, ImageDocsComponent,CustomTitleCaseDirective, SpeedDialFabComponent,VideoPlayerComponent,
DynamicFormComponent,DynamicQuestionTemplateComponent, ImagesAllComponent,AnswerOptionCreateDialogComponent,FormComponent,FormGroupComponent],
imports: [
CommonModule,
@ -259,13 +260,13 @@ const pdCustomNotifierOptions: NotifierOptions = {
MatVideoModule
],
exports: [DuplicatePdComponent,VendorPdAllocationComponent,PdLocatedMapViewDirective, PdAllocationComponent, SmartPdAllocationComponent, TelePdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent,StartPd2Component, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent, AssessedIncomeComponent, AllocationViewMoreComponent, GeneralInfoComponent, PdRequirementComponent,PdCollectedDocsComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, BusinessOtherFamilyMemberComponent, BusinessInfoGroupComponent,DailySalesDetailsComponent, SalesCalculationComponent, PurchaseDetailsComponent, BusinessExpenseDetailsComponent, HouseHoldDetailsComponent, OtherBusinessIncomeDetailsComponent, ManageSalesComponent, ManagePurchaseComponent, ManageBusinesExpenseComponent, ManageHouseHoldComponent, ManageOtherBusinessIncomeComponent, GrossProfitCalculationComponent, ManageDailySalesComponent, PdStatusChangeDialogueComponent, ViewLocationComponent, ConfirmAiDetailsComponent, RentalVerificationComponent, InitiateAdditionalPdComponent, DailyPurchaseDetailsComponent, ManageDailyPurchaseComponent,ManageRentalVerificationComponent,ImageCropComponent,PurchaseCalculationComponent],
exports: [DuplicatePdComponent,VendorPdAllocationComponent,PdLocatedMapViewDirective, PdAllocationComponent, SmartPdAllocationComponent, TelePdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent,StartPd2Component, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent, AssessedIncomeComponent, AllocationViewMoreComponent, GeneralInfoComponent, PdRequirementComponent,PdCollectedDocsComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, BusinessOtherFamilyMemberComponent, BusinessInfoGroupComponent,DailySalesDetailsComponent, SalesCalculationComponent, PurchaseDetailsComponent, BusinessExpenseDetailsComponent, HouseHoldDetailsComponent, OtherBusinessIncomeDetailsComponent, ManageSalesComponent, ManagePurchaseComponent, ManageBusinesExpenseComponent, ManageHouseHoldComponent, ManageOtherBusinessIncomeComponent, GrossProfitCalculationComponent, ManageDailySalesComponent, PdStatusChangeDialogueComponent, ViewLocationComponent, ConfirmAiDetailsComponent, RentalVerificationComponent, InitiateAdditionalPdComponent, DailyPurchaseDetailsComponent, ManageDailyPurchaseComponent,ManageRentalVerificationComponent,ImageCropComponent,CropToolsComponent,PurchaseCalculationComponent],
providers: [PdTrigerService, GetGeometricLocationService,{provide: MAT_DATE_LOCALE, useValue: 'en-GB'},
{provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE]},
{provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS}, PdLocatedMapViewDirective,QuesFormService],
entryComponents: [DuplicatePdComponent,VendorPdAllocationComponent,PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, TelePdAllocationComponent, AllocationViewMoreComponent, PersonalInfoComponent,BusinessAssetsInfoComponent,
ClientInfoComponent, SupplierInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent, AssessedIncomeComponent, GeneralInfoComponent, PdRequirementComponent,PdCollectedDocsComponent, ModelEditPdReportComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, DialogChangeCurrentVenrsion, FinalRemarksComponent, BusinessOtherFamilyMemberComponent, QcReviewComponent, BusinessInfoGroupComponent,BusinessBankingDetailsComponent, ManageSalesComponent, ManagePurchaseComponent, ManageBusinesExpenseComponent, ManageHouseHoldComponent, ManageOtherBusinessIncomeComponent, ManageDailySalesComponent,PdStatusChangeDialogueComponent, ViewLocationComponent, ConfirmAiDetailsComponent, RentalVerificationComponent, InitiateAdditionalPdComponent, ManageDailyPurchaseComponent,ManageRentalVerificationComponent,FuturePlansAndBusinessEnvironmentComponent,ImageCropComponent,QueriesDocsComponent,
ClientInfoComponent, SupplierInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent, AssessedIncomeComponent, GeneralInfoComponent, PdRequirementComponent,PdCollectedDocsComponent, ModelEditPdReportComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, DialogChangeCurrentVenrsion, FinalRemarksComponent, BusinessOtherFamilyMemberComponent, QcReviewComponent, BusinessInfoGroupComponent,BusinessBankingDetailsComponent, ManageSalesComponent, ManagePurchaseComponent, ManageBusinesExpenseComponent, ManageHouseHoldComponent, ManageOtherBusinessIncomeComponent, ManageDailySalesComponent,PdStatusChangeDialogueComponent, ViewLocationComponent, ConfirmAiDetailsComponent, RentalVerificationComponent, InitiateAdditionalPdComponent, ManageDailyPurchaseComponent,ManageRentalVerificationComponent,FuturePlansAndBusinessEnvironmentComponent,ImageCropComponent,CropToolsComponent,QueriesDocsComponent,
DynamicFormComponent,DynamicQuestionTemplateComponent,VideoPlayerComponent,ImageDocsComponent,ImagesAllComponent,FormComponent,FormGroupComponent],
})
export class ManagePdModule {