157 lines
8.8 KiB
HTML
157 lines
8.8 KiB
HTML
<div id="package-info">
|
|
<h4>{{packageInfo.name}} ({{'packages.headers.SOLD_IN' | translate}} {{packageInfo.country}})</h4>
|
|
<div ng-bind-html="renderHtml(packageInfo.description)" class="package_description"></div>
|
|
<h4>{{'packages.headers.PRODUCTS' | translate}}:</h4>
|
|
<div class="products-list">
|
|
<div class="package-category" ng-repeat="(productType, produccts) in packageProducts">
|
|
<div class="product-category-title">{{productType}} ({{produccts.length}}):</div>
|
|
<div class="package-info-product" ng-repeat="product in produccts">
|
|
{{product.quantity}} x {{product.productName}} : {{calculateTotalPrice(product.unitCostPrice, product.payPeriod, product.isPriceRecurring, product.quantity)}} ({{calculateTotalPrice(product.unitCostPrice, product.payPeriod, product.isPriceRecurring)}} {{'packages.headers.UNIT' | translate}})
|
|
<span ng-if="isPriceRecurring(product.isPriceRecurring)" class="product-recurring-info">({{product.unitCostPrice}} / {{'packages.extra.MONTH_FOR' | translate}} {{product.payPeriod}} {{'packages.extra.MONTHS' | translate}})</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="total-costs" class="row">
|
|
<h3 class="col-md-12">{{'packages.headers.TOTAL_COSTS' | translate}}</h3>
|
|
<div class="col-md-12">
|
|
<div class="price-col col-md-2" ng-if="totalPrices.product">
|
|
<div class="price-header">Products</div>
|
|
<div class="price-text">{{totalPrices.product}}</div>
|
|
</div>
|
|
<div class="price-col col-md-2" ng-if="totalPrices.service.fixedPrice">
|
|
<div class="price-header">One time services</div>
|
|
<div class="price-text">{{totalPrices.service.fixedPrice}}</div>
|
|
</div>
|
|
<div class="price-col col-md-2" ng-if="totalPrices.installation">
|
|
<div class="price-header">Installation</div>
|
|
<div class="price-text">{{totalPrices.installation}}</div>
|
|
</div>
|
|
<div class="price-col col-md-2" ng-if="totalPrices.service.recurringPrice">
|
|
<div class="price-header">Recurring services</div>
|
|
<div class="price-text">{{totalPrices.service.recurringPrice}} / month</div>
|
|
</div>
|
|
<div class="price-col col-md-2">
|
|
<div class="price-header">Interest Rate</div>
|
|
<div class="price-text">{{interestRate}} %</div>
|
|
</div>
|
|
<div class="total-col col-md-2">
|
|
<div class="price-header">{{'packages.headers.PAY_MARGIN' | translate}}</div>
|
|
<div class="price-text">
|
|
<input type="number" ng-model="commissionSplit.payMargin"/>
|
|
</div>
|
|
</div>
|
|
<div ng-if="maxMarginExceded(commissionSplit.payMargin, totalPrice)" class="col-md-4">
|
|
<div class="alert alert-danger">
|
|
<span class="glyphicon glyphicon-ban-circle"></span>
|
|
{{'packages.messages.PAY_MARGIN_EXCEDED' | translate}}
|
|
</div>
|
|
</div>
|
|
<div class="total-col col-md-12">
|
|
<div class="price-header">Total cost</div>
|
|
<div class="row">
|
|
<div class="col-md-1">Fixed cost:</div>
|
|
<div class="col-md-2">{{calculateTotalCost(totalPrices, 'fixed')}}</div>
|
|
</div>
|
|
<div class="row" ng-if="calculateTotalCost(totalPrices, 'recurring')">
|
|
<div class="col-md-1">Recurring cost:</div>
|
|
<div class="col-md-2">{{calculateTotalCost(totalPrices, 'recurring')}} / month</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="comission-split" class="row">
|
|
<h3 class="col-md-12">{{'packages.headers.COMISSION_SPLIT' | translate}}</h3>
|
|
<div class="user-layer">
|
|
<div class="user-icon glyphicon glyphicon-user"></div>
|
|
<div class="user-type">
|
|
{{'packages.headers.BROKER' | translate}}
|
|
</div>
|
|
</div>
|
|
<div class="commission-range-layer">
|
|
<input ng-model="commissionSplit.broker" ng-change="updateCommission('broker')" type="number" class="small-input"/>
|
|
<span class="split-percent-sign">%</span>
|
|
<input ng-model="commissionSplit.broker" ng-change="updateCommission('broker')" type="range" min="0" max="100" class="range-input"/>
|
|
<input ng-model="commissionSplit.commercialLead" ng-change="updateCommission('commercialLead')" type="number" class="small-input"/>
|
|
<span class="split-percent-sign">%</span>
|
|
</div>
|
|
|
|
<div class="user-layer">
|
|
<div class="user-icon glyphicon glyphicon-user"></div>
|
|
<div class="user-type">
|
|
{{'packages.headers.COMMERCIAL_LEAD' | translate}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="packages-per-pay-type">
|
|
<h3>{{'packages.headers.PACKAGE_PER_PAY_TYPES' | translate}}</h3>
|
|
<div ng-repeat="(key, price) in selectedPrices" class="price-group row">
|
|
<div class="pay-type col-md-12">{{price.payType}}</div>
|
|
<div class="price-small-group col-md-12">
|
|
<div class="price-col col-md-2">
|
|
<div class="price-header">{{'packages.headers.MINIMAL_FIXED_SELL_PRICE' | translate}}</div>
|
|
<div class="price-text"><input ng-model="price.minimalFixedPrice"/></div>
|
|
</div>
|
|
<div class="price-col col-md-2">
|
|
<div class="price-header">{{'packages.headers.MINIMAL_RECURENT_SELL_PRICE' | translate}}</div>
|
|
<div class="price-text">{{(price.minimalRecurentPrice + price.minimalServicesPrice).toFixed(0)}}</div>
|
|
</div>
|
|
<div class="price-col col-md-3" ng-if="price.packagePayPeriod > 0">
|
|
<div class="price-header">Principal Amount</div>
|
|
<div class="price-text"><input type="number" ng-change="setRecurrentPrice(interestRate / 100, price)" ng-model="price.principalAmount"/></div>
|
|
<div class="price-header">{{'packages.headers.MINIMAL_RECURENT_PACKAGE_PRICE' | translate}} ({{boundMessage(price.packagePayPeriod, price.periodUnit, 'packagePayPeriod')}})</div>
|
|
<div class="price-text">{{calculateFinancing(interestRate / 100, price.packagePayPeriod, price.principalAmount).toFixed(0)}} / {{price.periodUnit}}</div>
|
|
</div>
|
|
<div class="price-col col-md-3">
|
|
<div class="price-header">{{'packages.headers.MINIMAL_RECURENT_SERVICES_PRICE' | translate}} ({{boundMessage(price.servicesContractPeriod, price.periodUnit, 'servicesContractPeriod')}})</div>
|
|
<div class="price-text"><input type="number" ng-model="price.minimalServicesPrice"/> / {{price.periodUnit}}</div>
|
|
<div class="price-total-recurent" ng-if="price.servicesContractPeriod > 0">
|
|
{{'packages.headers.FINAL_TOTAL' | translate}} {{(price.minimalServicesPrice * price.servicesContractPeriod).toFixed(2)}}
|
|
</div>
|
|
</div>
|
|
<div class="price-col col-md-2">
|
|
<div class="price-header">Max contract period</div>
|
|
<div class="price-text">{{price.maxContractPeriod}} {{price.periodUnit}}</div>
|
|
</div>
|
|
</div>
|
|
<div id="remove-pay-{{key}}" class="pay-type-btn btn btn-danger" ng-click="removePayType(key)">
|
|
<span class="glyphicon glyphicon-minus"></span>
|
|
<span class="btn-extra-text">
|
|
{{'packages.buttons.REMOVE' | translate}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div id="all-price-types" ng-if="payTypesVisible" class="price-group row">
|
|
<div ng-repeat="(key, price) in prices" class="price-col pay-type-selection">
|
|
<input type="checkbox" ng-checked="price.isChecked" ng-model="price.isChecked" class="price-checkbox"/>
|
|
<label>{{price.payType}}
|
|
({{'packages.headers.PAY_PERIOD' | translate}} {{price.packagePayPeriod}} {{price.periodUnit}} ,
|
|
{{'packages.headers.SERVICES_AND_SUPPORT' | translate}} {{price.servicesContractPeriod}} {{price.periodUnit}},
|
|
{{'packages.headers.MAX_PERIOD' | translate}} {{price.maxContractPeriod}} {{price.periodUnit}})
|
|
</label>
|
|
</div>
|
|
<div id="select-pay-types" class="pay-type-btn btn btn-success" ng-click="selectPayTypes()">
|
|
<span class="glyphicon glyphicon-ok"></span>
|
|
<span class="btn-extra-text">
|
|
{{'packages.buttons.SELECT' | translate}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div id="action-buttons" class="col-md-12">
|
|
<div id="add-pay-type" ng-if="!payTypesVisible" class="pay-type-btn btn btn-success" ng-click="addPayType()">
|
|
<span class="glyphicon glyphicon-plus"></span>
|
|
<span class="btn-extra-text">
|
|
{{'packages.buttons.ADD' | translate}}
|
|
</span>
|
|
</div>
|
|
<div class="save-btn btn btn-primary"
|
|
ng-if="!payTypesVisible"
|
|
ng-click="updateBrokerPricesAndCommission(key)">
|
|
{{'packages.buttons.SAVE' | translate}}
|
|
</div>
|
|
</div>
|
|
</div>
|