Asp.net And HTML Css And Web Development: How To Sort Row Of Grid in Angular 6
Asp.net And HTML Css And Web Development: How To Sort Row Of Grid in Angular 6: How To Sort Row Of Grid in Angular 6 Setup For Sortable JS 1). Install Plugin "'angular-sortablejs" 2). set ref...
How To Sort Row Of Grid in Angular 6
How To Sort Row Of Grid in Angular 6
Setup For Sortable JS
1). Install Plugin "'angular-sortablejs"
2). set reference or import service
import { SortablejsOptions } from 'angular-sortablejs';
3).Define Variable in Class
public sortableOptions: SortablejsOptions;
4).Define Function in class for Get Rows of Grid or table
get fieldRows() {
return this.contractFormService.fieldRows(this.newContractIOTForm, this.discountType, this.discountTypeID, this.j);
}
5).Call Method in OnInit() method
this.sortableOptions = {
onSort: (event: any) => {
this.contractFormService.sortFormFields(
this.j,
this.newContractIOTForm,
this.discountType,
this.fieldRows, this.discountTypeID);
}
};
6). set property of Grid in html of Currunt ts file
[sortablejs]="fieldRows" [sortablejsOptions]="sortableOptions"
7). Define Common Function for sorting Functionality for Data
sortFormFields(j: number, newContractIOTForm: FormGroup, discountType: string, arrayIndexes: AbstractControl[], TypeID) {
const discountTypeList = newContractIOTForm.get(discountType).get('DiscountTypes').value;
if (discountTypeList) {
for (let index = 0; index < discountTypeList.length; index++) {
const discountTypeID = discountTypeList[index].DiscountTypeID;
const offerFields: FormArray = this.getDiscountFields(newContractIOTForm, discountType, discountTypeID);
if (TypeID === discountTypeID) {
const _temp: FormArray = offerFields.controls[j] as FormArray;
arrayIndexes.forEach((ele: FormGroup, i) => {
const fields = _temp.controls[i] as FormGroup;
fields.setValue(ele.value);
});
}
How to Generate Pdf in angular 6
How to Generate Pdf in angular 6
_________________________________________________________________________________
import { Injectable } from '@angular/core';
import * as jspdf from 'jspdf';
import 'jspdf-autotable';
import * as logoFile from './tritexlogo.js';
import { formatCurrency, formatNumber } from '@angular/common';
@Injectable({
providedIn: 'root'
})
export class PdfService {
constructor() { }
generatePDF(data) {
const DiscountPeriodStyle = { lineWidth: 0.25, overflow: 'linebreak', halign: 'left', fontSize: 9 };
const DiscountPeriodHeader = [
[
{
content: 'Discount Periods - ' + 'Short stub', colSpan: 3, styles: { halign: 'center' }
}
],
[
{
content: 'Sr. No.', styles: DiscountPeriodStyle
},
{
content: 'Start Date', styles: DiscountPeriodStyle
},
{
content: 'End Date', styles: DiscountPeriodStyle
}],
];
const OfferIsBandedTied = (data.Offer && data.Offer.DiscountTypes) ?
data.Offer.DiscountTypes.filter(x => x.DiscountTypeID === 4).length : 0;
const BidIsBandedTied = (data.Bid && data.Bid.DiscountTypes) ? data.Bid.DiscountTypes.filter(x => x.DiscountTypeID === 4).length : 0;
let pageLayout = '';
if (BidIsBandedTied > 0 || OfferIsBandedTied > 0) {
pageLayout = 'landscape';
}
const pdf = new jspdf(pageLayout);
const yOffset = (pdf.internal.pageSize.height / 2);
const LogoPosition = (pageLayout && pageLayout === 'landscape') ? ((pdf.internal.pageSize.height / 2) + 15) : (yOffset / 2);
pdf.addImage(logoFile.logoBase64, 'JPEG', LogoPosition, 5);
const HeaderStyle = { fontStyle: 'bold', fontSize: 9, cellWidth: (pdf.internal.pageSize.width / 9) };
const item = [];
if (data.CounterPartyTADIGCodes) {
data.CounterPartyTADIGCodes = data.CounterPartyTADIGCodes.filter(x => x.IsSelected === true);
}
if (data.TradingEntityTADIGCodes) {
data.TradingEntityTADIGCodes = data.TradingEntityTADIGCodes.filter(x => x.IsSelected === true);
}
pdf.autoTable({
theme: 'plain',
startY: 41,
styles: {
cellPadding: 1,
fontSize: 9
},
tableWidth: (pdf.internal.pageSize.width) - 20,
margin: { left: 10, top: 10 },
columnStyles: {
2: {
cellWidth: (pdf.internal.pageSize.width / 6)
},
5: {
cellWidth: (pdf.internal.pageSize.width / 6)
}
},
body: [
[
{ content: 'Tritex ContractID', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data, 'ReferenceNo'), colSpan: 4 }
],
[
{ content: 'Deal Type', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data, 'ContractDealType'), colSpan: 4 }
],
[
{ content: 'Direction', styles: HeaderStyle },
{ content: ':' },
{ content: data.TypeName, colSpan: 4 }
],
[
{ content: '', colSpan: 6 }
],
[
{ content: 'Party A', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data, 'TradingEntityName') },
{ content: 'Party B', styles: HeaderStyle },
{ content: ':' },
{ content: data.CounterPartyName }
],
[
{ content: 'Party A TCID', styles: HeaderStyle },
{ content: ':' },
{ content: data.TradingEntityTCID },
{ content: 'Party B TCID', styles: HeaderStyle },
{ content: ':' },
{ content: data.CounterPartyTCID }
],
[
{ content: 'Party A TAP Codes', styles: HeaderStyle },
{ content: ':' },
{
content: this.checkExistValue(data, 'TradingEntityTADIGCodes', 'Array', 'TadigCode')
}
,
{ content: 'Party B TAP Codes', styles: HeaderStyle },
{ content: ':' },
{
content: this.checkExistValue(data, 'CounterPartyTADIGCodes', 'Array', 'TadigCode')
}
],
[
{ content: '', colSpan: 6 }
],
[
{ content: 'Trade Date', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data, 'TradeDate'), colSpan: 4 }
],
[
{ content: 'Start Date', styles: HeaderStyle },
{ content: ':' },
{ content: data.StartDate, colSpan: 4 }
],
[
{ content: 'Auto-renew', styles: HeaderStyle },
{ content: ':' },
{ content: data.IsAutoRenewal ? 'Yes' : 'No', colSpan: 4 }
],
[
{ content: 'End date of First Discount Period', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data, 'EndDate'), colSpan: 4 }
],
[
{ content: 'Number of Discount Period', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data, 'NoOfDiscountPeriods'), colSpan: 4 }
],
[
{ content: 'Length of Discount Period', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data, 'DiscountPeriodName'), colSpan: 4 }
],
[
{ content: 'Agreement Notification Period', styles: HeaderStyle },
{ content: ':' },
{
content: this.checkExistValue(data, 'TerminationName'), colSpan: 4
}
],
]
});
data.DiscountPeriods.forEach(element => {
item.push([element.DiscountPeriod, element.DiscountPeriodStartDate, element.DiscountPeriodEndDate]);
});
data.DiscountPeriods = item;
pdf.autoTable({
theme: 'plain',
margin: { left: 10, top: 10 },
head: DiscountPeriodHeader,
tableWidth: (pdf.internal.pageSize.width / 2),
body: data.DiscountPeriods,
styles: DiscountPeriodStyle,
didDrawCell: data.DiscountPeriods
});
pdf.autoTable({
theme: 'plain',
styles: {
cellPadding: 1,
fontSize: 9
},
columnStyles: {
2: {
cellWidth: (pdf.internal.pageSize.width / 6)
},
5: {
cellWidth: (pdf.internal.pageSize.width / 6)
}
},
pageBreak: (pageLayout && pageLayout === 'landscape') ? 'avoid' : 'auto',
tableWidth: (pdf.internal.pageSize.width) - 20,
margin: { left: 10, top: 10 },
body: [
[
{
content: 'Party A HPMN', styles: {
fontStyle: 'bold',
fontSize: 9,
cellWidth: (pdf.internal.pageSize.width / 9),
valign: 'middle',
halign: 'center',
textColor: [120, 120, 120]
},
colSpan: 3
},
{
content: 'Party B VPMN', styles: {
fontStyle: 'bold',
fontSize: 9,
cellWidth: (pdf.internal.pageSize.width / 9),
valign: 'middle',
halign: 'center',
textColor: [120, 120, 120]
},
colSpan: 3
},
],
[
{ content: 'Settlement', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data.Offer, 'SettlementTypeName') },
{ content: 'Settlement', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data.Bid, 'SettlementTypeName') }
],
[
{ content: 'Tax Treatment', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data.Offer, 'TaxTreatmentValue') },
{ content: 'Tax Treatment', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data.Bid, 'TaxTreatmentValue') }
],
[
{ content: 'Exclusions Services', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data.Offer, 'Exclusions', 'Array', 'ExclusionName') },
{ content: 'Exclusions Services', styles: HeaderStyle },
{ content: ':' },
{ content: this.checkExistValue(data.Bid, 'Exclusions', 'Array', 'ExclusionName') }
],
[
{ content: 'Exclusion Counties', styles: HeaderStyle },
{ content: ':' },
{
content: (data.Offer ? this.checkExistValue(data.Offer.ExclusionsCountryRegion, 'Countries', 'Array', 'CountryName')
: 'N/A')
},
{ content: 'Exclusion Counties', styles: HeaderStyle },
{ content: ':' },
{
content: (data.Bid ? this.checkExistValue(data.Bid.ExclusionsCountryRegion, 'Countries', 'Array', 'CountryName')
: 'N/A')
}
],
]
});
if (data && data.Offer) {
this.getDiscountGrids(data.Offer, pdf, DiscountPeriodStyle, 'A', 'HPMN');
}
if (data && data.Bid) {
this.getDiscountGrids(data.Bid, pdf, DiscountPeriodStyle, 'B', 'VPMN');
}
this.setWaterMark(pdf);
pdf.save(data.ReferenceNo + '.pdf');
}
getDiscountGrids(data, pdf, DiscountPeriodStyle, type, value) {
pdf.autoTable({
theme: 'plain',
styles: {
overflow: 'linebreak',
halign: 'left',
fontStyle: 'bold', fontSize: 12,
},
tableWidth: (pdf.internal.pageSize.width) - 20,
margin: { left: 10, top: 10 },
body:
[
{ content: 'Party ' + type + ' as ' + value + ' Pricing Grid ' }
]
});
if (data.Financial && data.Financial.length > 0) {
this.getAYCEGrid(data.Financial, pdf, DiscountPeriodStyle);
}
if (data.FlatRate && data.FlatRate.length > 0) {
this.getFlatRateGrid(data.FlatRate, pdf, DiscountPeriodStyle);
}
if (data.BalancedUnbalanced && data.BalancedUnbalanced.length > 0) {
this.getBalancedUnbalancedGrid(data.BalancedUnbalanced, pdf, DiscountPeriodStyle);
}
if (data.BandedTiered && data.BandedTiered.length > 0) {
this.getBandedTieredGrid(data.BandedTiered, pdf, DiscountPeriodStyle);
}
}
getFlatRateGrid(FlatRate, pdf, DiscountPeriodStyle) {
FlatRate.forEach((el, index) => {
const PricingGridHeader = [
[
{
content: 'Flat Rate', colSpan: 8, styles: { halign: 'center' }
}
],
[
{
content: 'Discount Period -' + (index + 1), colSpan: 8, styles: { halign: 'left' }
}
],
[
{
content: 'Service.', styles: DiscountPeriodStyle
},
{
content: 'Operator Affiliates', styles: DiscountPeriodStyle
},
{
content: 'OriginatedIn', styles: DiscountPeriodStyle
},
{
content: 'Terminated in', styles: DiscountPeriodStyle
},
{
content: 'Currency', styles: DiscountPeriodStyle
}
,
{
content: 'Traffic rate', styles: DiscountPeriodStyle
},
{
content: 'per', styles: DiscountPeriodStyle
},
{
content: 'Charging Interval', styles: DiscountPeriodStyle
}
],
];
const PricingGridHeader1 = [
[
{
content: 'Discount Period -' + (index + 1), colSpan: 8, styles: { halign: 'left' }
}
],
[
{
content: 'Service.', styles: DiscountPeriodStyle
},
{
content: 'Operator Affiliates', styles: DiscountPeriodStyle
},
{
content: 'OriginatedIn', styles: DiscountPeriodStyle
},
{
content: 'Terminated in', styles: DiscountPeriodStyle
},
{
content: 'Currency', styles: DiscountPeriodStyle
}
,
{
content: 'Traffic rate', styles: DiscountPeriodStyle
},
{
content: 'per', styles: DiscountPeriodStyle
},
{
content: 'Charging Interval', styles: DiscountPeriodStyle
}
],
];
const itemlist = [];
el.forEach(element => {
itemlist.push([element.ServiceName, element.OperatorAffiliate.map(x => x.TadigCode), element.OriginatedIn.map(x => x.CountryName),
element.TerminatedName, element.ISO, this.convertDecimalFormat(element.TrafficRate),
element.PerUnitName, element.ChargingIntervalName]);
});
pdf.autoTable({
theme: 'plain',
margin: { left: 10, top: 10 },
head: index === 0 ? PricingGridHeader : PricingGridHeader1,
pageBreak: 'auto',
showHead: 'firstPage',
tableWidth: (pdf.internal.pageSize.width) - 20,
body: itemlist,
styles: DiscountPeriodStyle,
didDrawCell: itemlist
});
});
}
getBalancedUnbalancedGrid(BalancedUnbalanced, pdf, DiscountPeriodStyle) {
BalancedUnbalanced.forEach((el, index) => {
const PricingGridHeader = [
[
{
content: 'Balanced / Unbalanced', colSpan: 9, styles: { halign: 'center' }
}
],
[
{
content: 'Discount Period -' + (index + 1), colSpan: 9, styles: { halign: 'left' }
}
],
[
{
content: 'Service.', styles: DiscountPeriodStyle
},
{
content: 'Operator Affiliates', styles: DiscountPeriodStyle
},
{
content: 'OriginatedIn', styles: DiscountPeriodStyle
},
{
content: 'Terminated in', styles: DiscountPeriodStyle
},
{
content: 'Currency', styles: DiscountPeriodStyle
}
,
{
content: 'Balanced Traffic rate', styles: DiscountPeriodStyle
},
{
content: 'UnBalanced Traffic rate', styles: DiscountPeriodStyle
},
{
content: 'per', styles: DiscountPeriodStyle
},
{
content: 'Charging Interval', styles: DiscountPeriodStyle
}
],
];
const PricingGridHeader1 = [
[
{
content: 'Discount Period -' + (index + 1), colSpan: 9, styles: { halign: 'left' }
}
],
[
{
content: 'Service.', styles: DiscountPeriodStyle
},
{
content: 'Operator Affiliates', styles: DiscountPeriodStyle
},
{
content: 'OriginatedIn', styles: DiscountPeriodStyle
},
{
content: 'Terminated in', styles: DiscountPeriodStyle
},
{
content: 'Currency', styles: DiscountPeriodStyle
}
,
{
content: 'Balanced Traffic rate', styles: DiscountPeriodStyle
},
{
content: 'UnBalanced Traffic rate', styles: DiscountPeriodStyle
},
{
content: 'per', styles: DiscountPeriodStyle
},
{
content: 'Charging Interval', styles: DiscountPeriodStyle
}
],
];
const itemlist = [];
el.forEach(element => {
itemlist.push([element.ServiceName, element.OperatorAffiliate.map(x => x.TadigCode), element.OriginatedIn.map(x => x.CountryName),
element.TerminatedName, element.ISO, this.convertDecimalFormat(element.BalancedTrafficRate),
this.convertDecimalFormat(element.UnbalancedTrafficRate), element.PerUnitName,
element.ChargingIntervalName]);
});
pdf.autoTable({
theme: 'plain',
columnStyles: {
1: {
cellWidth: (pdf.internal.pageSize.width / 9)
},
2: {
cellWidth: (pdf.internal.pageSize.width / 9)
}
},
margin: { left: 10, top: 10 },
head: index === 0 ? PricingGridHeader : PricingGridHeader1,
pageBreak: 'auto',
showHead: 'firstPage',
tableWidth: (pdf.internal.pageSize.width) - 20,
body: itemlist,
styles: DiscountPeriodStyle,
});
});
}
getAYCEGrid(Financial, pdf, DiscountPeriodStyle) {
Financial.forEach((el, index) => {
const PricingGridHeader = [
[
{
content: 'All You Can Eat', colSpan: 5, styles: { halign: 'center' }
}
],
[
{
content: 'Discount Period -' + (index + 1), colSpan: 5, styles: { halign: 'left' }
}
],
[
{
content: 'Service.', styles: DiscountPeriodStyle
},
{
content: 'Operator Affiliates', styles: DiscountPeriodStyle
},
{
content: 'OriginatedIn', styles: DiscountPeriodStyle
},
{
content: 'Currency', styles: DiscountPeriodStyle
}
,
{
content: 'AYCERate', styles: DiscountPeriodStyle
}
],
];
const PricingGridHeader1 = [
[
{
content: 'Discount Period -' + (index + 1), colSpan: 5, styles: { halign: 'left' }
}
],
[
{
content: 'Service.', styles: DiscountPeriodStyle
},
{
content: 'Operator Affiliates', styles: DiscountPeriodStyle
},
{
content: 'OriginatedIn', styles: DiscountPeriodStyle
},
{
content: 'Currency', styles: DiscountPeriodStyle
}
,
{
content: 'AYCERate', styles: DiscountPeriodStyle
}
],
];
const itemlist = [];
el.forEach(element => {
itemlist.push([element.Services.map(x => x.ServiceName),
element.OperatorAffiliate.map(x => x.TadigCode), element.OriginatedIn.map(x => x.CountryName),
element.ISO, this.convertDecimalFormat(element.AYCERate)]);
});
pdf.autoTable({
theme: 'plain',
columnStyles: {
1: {
cellWidth: (pdf.internal.pageSize.width / 5)
},
2: {
cellWidth: (pdf.internal.pageSize.width / 5)
}
},
margin: { left: 10, top: 10 },
head: index === 0 ? PricingGridHeader : PricingGridHeader1,
pageBreak: 'auto',
showHead: 'firstPage',
tableWidth: (pdf.internal.pageSize.width) - 20,
body: itemlist,
styles: DiscountPeriodStyle
});
});
}
getBandedTieredGrid(BandedTiered, pdf, DiscountPeriodStyle) {
BandedTiered.forEach((el, index) => {
const PricingGridHeader = [
[
{
content: 'Banded / Tiered', colSpan: 12, styles: { halign: 'center' }
}
],
[
{
content: 'Discount Period -' + (index + 1), colSpan: 12, styles: { halign: 'left' }
}
],
[
{
content: 'Service.', styles: DiscountPeriodStyle
},
{
content: 'Operator Affiliates', styles: DiscountPeriodStyle
},
{
content: 'OriginatedIn', styles: DiscountPeriodStyle
},
{
content: 'TerminatedIn', styles: DiscountPeriodStyle
},
{
content: 'Currency', styles: DiscountPeriodStyle
}
,
{
content: 'Band Threshold Type', styles: DiscountPeriodStyle
}
,
{
content: 'Traffic Rate', styles: DiscountPeriodStyle
},
{
content: ' \u003E\u003D ', styles: DiscountPeriodStyle
}
,
{
content: 'Band Threshold', styles: DiscountPeriodStyle
}
,
{
content: 'Back To First', styles: DiscountPeriodStyle
},
{
content: 'per ', styles: DiscountPeriodStyle
},
{
content: 'Charging Interval', styles: DiscountPeriodStyle
}
],
];
const PricingGridHeader1 = [
[
{
content: 'Discount Period -' + (index + 1), colSpan: 12, styles: { halign: 'left' }
}
],
[
{
content: 'Service.', styles: DiscountPeriodStyle
},
{
content: 'Operator Affiliates', styles: DiscountPeriodStyle
},
{
content: 'OriginatedIn', styles: DiscountPeriodStyle
},
{
content: 'TerminatedIn', styles: DiscountPeriodStyle
},
{
content: 'Currency', styles: DiscountPeriodStyle
}
,
{
content: 'Band Threshold Type', styles: DiscountPeriodStyle
}
,
{
content: 'Traffic Rate', styles: DiscountPeriodStyle
},
{
content: '\u003E\u003D', styles: DiscountPeriodStyle
}
,
{
content: 'Band Threshold', styles: DiscountPeriodStyle
}
,
{
content: 'Back To First', styles: DiscountPeriodStyle
},
{
content: 'per ', styles: DiscountPeriodStyle
},
{
content: 'Charging Interval', styles: DiscountPeriodStyle
}
]
];
const itemlist = [];
el.forEach(element => {
element.Bands.forEach((elementItem, i) => {
if (element.Bands.length > 1) {
if (i === 0) {
itemlist.push([
{
content: element.ServiceName, rowSpan: element.Bands.length
},
{
content: element.OperatorAffiliate.map(x => x.TadigCode), rowSpan: element.Bands.length
},
{
content: element.OriginatedIn.map(x => x.CountryName), rowSpan: element.Bands.length
},
{
content: element.TerminatedName, rowSpan: element.Bands.length
},
{
content: element.ISO, rowSpan: element.Bands.length
}, {
content: elementItem.BandThresholdTypeName
},
{
content: this.convertDecimalFormat(elementItem.TrafficRate),
},
{
content: '\u003E\u003D'
},
{
content: elementItem.BandThresholdTypeName !== 'Commitment' ?
(elementItem.BandThresholdTypeName !== 'Volume' ? this.convertDecimalFormat(elementItem.BandThreshold) :
this.convertCurruncyFormat(elementItem.BandThreshold)) : ''
},
{
content: (elementItem.IsBandBackToFirst) ? 'Yes' : 'No'
},
{
content: element.PerUnitName, rowSpan: element.Bands.length
},
{
content: element.ChargingIntervalName, rowSpan: element.Bands.length
}
]);
} else {
itemlist.push([
elementItem.BandThresholdTypeName,
this.convertDecimalFormat(elementItem.TrafficRate),
'\u003E\u003D',
elementItem.BandThresholdTypeName !== 'Commitment' ?
(elementItem.BandThresholdTypeName !== 'Volume' ? this.convertDecimalFormat(elementItem.BandThreshold) :
this.convertCurruncyFormat(elementItem.BandThreshold)) : '',
(elementItem.IsBandBackToFirst) ? 'Yes' : 'No'
]);
}
} else {
itemlist.push([
{
content: element.ServiceName
},
{
content: element.OperatorAffiliate.map(x => x.TadigCode)
},
{
content: element.OriginatedIn.map(x => x.CountryName)
},
{
content: element.TerminatedName
},
{
content: element.ISO
},
{
content: elementItem.BandThresholdTypeName,
},
{
content: this.convertDecimalFormat(elementItem.TrafficRate),
},
{
content: '\u003E\u003D'
},
{
content: elementItem.BandThresholdTypeName !== 'Commitment' ?
(elementItem.BandThresholdTypeName !== 'Volume' ? this.convertDecimalFormat(elementItem.BandThreshold) :
this.convertCurruncyFormat(elementItem.BandThreshold)) : ''
},
{
content: (elementItem.IsBandBackToFirst) ? 'Yes' : 'No'
},
{
content: element.PerUnitName
},
{
content: element.ChargingIntervalName
}]);
}
});
});
pdf.autoTable({
theme: 'plain',
margin: { left: 10, top: 10 },
head: index === 0 ? PricingGridHeader : PricingGridHeader1,
pageBreak: 'auto',
showHead: 'firstPage',
tableWidth: (pdf.internal.pageSize.width) - 20,
body: itemlist,
styles: DiscountPeriodStyle,
didDrawCell: itemlist
});
});
}
checkExistValue(item, key, type?, searchkey?) {
if (type === 'Array') {
return (item && item[key]) ? item[key].map(x => x[searchkey]) : 'N/A';
} else {
return (item && item[key]) ? item[key] : 'N/A';
}
}
convertDecimalFormat(rate) {
return formatCurrency(rate, 'en', '', 'USD', '1.2-6');
}
convertCurruncyFormat(rate) {
return formatNumber(rate, 'en');
}
setWaterMark(pdf) {
const totalPages = pdf.internal.getNumberOfPages();
for (let i = 1; i <= totalPages; i++) {
pdf.setPage(i);
// pdf.setTextColor(230);
// pdf.setFontSize(65);
// pdf.text((pdf.internal.pageSize.width / 2) - 30, pdf.internal.pageSize.height / 2 - 30, 'Tritex', null, 45);
pdf.setFontSize(9);
pdf.setTextColor(170);
pdf.text(10, (pdf.internal.pageSize.height) - 5, 'Page-' + i);
// pdf.text((pdf.internal.pageSize.width) - 35, 5, 'Tritex One Page PDF');
}
}
}
How to Generate XML in angular js (angular 6)
How to Generate XML in angular js (angular 6)
_________________________________________________________________________________
import { Injectable } from '@angular/core';
import * as XMLWriter from 'xml-writer';
import * as FileSaver from 'file-saver';
@Injectable({
providedIn: 'root'
})
export class XmlService {
xw = new XMLWriter;
constructor() { }
public generateXml(paramData: any, _ReferenceNo) {
// Start XML Node
this.xw = new XMLWriter;
this.xw.startDocument();
this.xw.startElement('root');
this.xw.text('*TAP Instruction sheet created and approved on the Tritex IOT Management platform');
this.generateNode(paramData, true); // For Home
this.generateNode(paramData, false); // For Visitor
this.xw.endElement();
const blob = new Blob([this.xw], { type: 'application/xhtml+xml;charset=UTF-8' });
FileSaver.saveAs(blob, _ReferenceNo + '.xhtml');
}
generateNode(paramData, isHome) {
const tapValue = paramData.newTAPInstructionForm;
const taxTreatmentList = paramData.taxTreatmentList;
const chargingIntervalEnumList = paramData.chargingIntervalEnumList;
const perEnumList = paramData.perEnumList;
const serviceList = paramData.serviceList;
const tapServiceList = paramData.tapServiceList;
const _entity = isHome ? tapValue.HomeEntity : tapValue.VisitorEntity;
const _sectionText = isHome ? 'HPMN' : 'VPMN';
_entity.forEach(element => {
// this.xw.startElement('section').writeAttribute('S', _sectionText).writeAttribute('OC', element.OperatorCode)
// .writeElement('tag', 'Some content');
// this.xw.endElement();
this.xw.startElement('section').writeAttribute('S', _sectionText).writeAttribute('OC', element.OperatorCode);
const ISO = element.OperatorCurrencyISO;
console.log(ISO);
// Common Details
this.xw.startElement('CD').writeAttribute('EDT', element.EffectiveDate);
if (isHome) {
this.xw.writeAttribute('PA', tapValue.TradingEntity);
this.xw.writeAttribute('PB', tapValue.CounterParty);
this.xw.writeAttribute('O', element.OperatorName);
this.xw.writeAttribute('TC', element.OperatorCode);
} else {
this.xw.writeAttribute('PA', tapValue.TradingEntity);
this.xw.writeAttribute('PB', tapValue.CounterParty);
this.xw.writeAttribute('O', element.OperatorName);
this.xw.writeAttribute('TC', element.OperatorCode);
}
// Period
element.EntityDetails[0].TapService.forEach((eleTapService, periodIndex) => {
// const tempEleTabDetails = eleTapService.TapService[periodIndex];
this.xw.startElement('PD');
this.xw.writeAttribute('P', 'Period' + Number(periodIndex + 1));
this.xw.writeAttribute('SDT', (eleTapService.StartDate) ? eleTapService.StartDate as string : 'n/a');
this.xw.writeAttribute('EDT', (eleTapService.EndDate) ? eleTapService.EndDate as string : 'n/a');
this.xw.writeAttribute('ISO', (ISO) ? ISO as string : 'n/a');
element.EntityDetails.forEach((eleEntity, entityIndex) => {
const eleTabDetails = eleEntity.TapService[periodIndex].TapServicePeriodWise;
this.xw.startElement('RW');
this.xw.writeAttribute('PA', eleEntity.PartyATAPCode);
this.xw.writeAttribute('PB', eleEntity.PartyBTAPCode);
this.xw.writeAttribute('E', (element.Exclusions) ? element.Exclusions : 'n/a');
this.xw.writeAttribute('T', taxTreatmentList.filter(x => x.EnumID === eleEntity.TaxTreatmentEnumID)
.map(x => x.DisplayName).toString());
eleTabDetails.forEach((eleTab) => {
this.xw.startElement('RD');
this.xw.writeAttribute('MS', tapServiceList.filter(x => x.EnumID === eleTab.TapServiceEnumID)
.map(x => x.SubType).toString());
this.xw.writeAttribute('SS', serviceList.filter(x => x.EnumID === eleTab.ServiceEnumID).map(x => x.DisplayName).toString());
this.xw.writeElement('R', (eleTab.Rate) ? eleTab.Rate as string : 'n/a');
if (eleTab.TapServiceEnumID === 7 || eleTab.TapServiceEnumID === 8) {
this.xw.writeElement('P', perEnumList.filter(x => x.EnumID === eleTab.PerEnumID).map(x => x.DisplayName).toString());
}
this.xw.writeElement('I', chargingIntervalEnumList.filter(x => x.EnumID === eleTab.IntervalEnumID)
.map(x => x.DisplayName).toString());
this.xw.endElement(); // RD
});
this.xw.endElement(); // RW
});
this.xw.endElement(); // PD
});
this.xw.endElement(); // Common Details
this.xw.endElement(); // section
});
}
}
Subscribe to:
Posts (Atom)
Featured Post
How To Dynamic Upload multiple files with extra detail of model in asp.net core
How To Dynamic Upload multiple files with extra detail of model in asp.net core 1). firstly create Model File namespace MyModel { pub...
Popular Posts
-
How To Get IP Address And MAC Address Using c# , Aps.net MVC public ActionResult Index() { var IP = GetUser_IP(); ... -
Using Angular in ASP.NET MVC 5 with Angular CLI and Visual Studio 2017 Angular is one of most in-demand web front-end fram... -
How To Add AngularJs In Visual Studio or Add Nuget Package in VisualStudio Before Add Controller And Nuget Package of A...
-
how to post formdata or http.context.form data from angular 6 to asp.net mvc web api or api using Token based authentication with header ... -
How To Design Certificate using Html CSS And Format for print landscape and portrait Mode page Design OUTPUT:- HTML AND CSS... -
How to Add Entity Data Model In Project Of MVC Before Add Entity Mode First You Need to Know How To Add New Project In Asp.net MVC fo...