first commit
|
@ -0,0 +1,11 @@
|
|||
.classpath
|
||||
.DS_Store
|
||||
.sfdx
|
||||
.project
|
||||
.salesforce
|
||||
node_modules
|
||||
.idea
|
||||
.tern-project
|
||||
.settings
|
||||
selenium-client-jars/
|
||||
test/artifacts
|
|
@ -0,0 +1,3 @@
|
|||
## Northern Trail Outfitters Sample App
|
||||
|
||||
See [this blog post](https://developer.salesforce.com/blogs) for details and installation instructions.
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"orgName": "ccoenraets Company",
|
||||
"edition": "Developer",
|
||||
"orgPreferences" : {
|
||||
"enabled": ["S1DesktopEnabled"]
|
||||
}
|
||||
}
|
|
@ -0,0 +1,10 @@
|
|||
[
|
||||
{
|
||||
"sobject": "Merchandise__c",
|
||||
"saveRefs": true,
|
||||
"resolveRefs": false,
|
||||
"files": [
|
||||
"sample-data-Merchandise__cs.json"
|
||||
]
|
||||
}
|
||||
]
|
|
@ -0,0 +1,114 @@
|
|||
{
|
||||
"records": [
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef1"
|
||||
},
|
||||
"Name": "BOREALIS BACKPACK",
|
||||
"Description__c": "Free of embellishment, this sleek, 29-liter daypack boasts two large zip pockets so you can stash gear quickly and hit the road. The main compartment features a padded laptop sleeve (fits most 15\" laptops), and an almost equally large secondary zip pocket with built-in organizational sleeves. Bungee cord on face of pack lets you store additional gear, or cinch down contents inside. Updated shoulder straps and back panel.",
|
||||
"Price__c": 89,
|
||||
"Category__c": "Gear",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products1110/4004100.jpg"
|
||||
},
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef2"
|
||||
},
|
||||
"Name": "WOMEN'S LEONIDAS JACKET",
|
||||
"Description__c": "Persevere through wet conditions in remote locations with the help of our alpine workhorse, a waterproof soft shell with leakproof fully-taped seams. Four-way stretch HyVent 2L technology provides durable, multi-layer waterproofing that remains breathable during stages of intense climbing. Fully adjustable hood with laminated brim is helmet compatible for extra coverage. Cuffs adjust with non-abrasive molded tabs.",
|
||||
"Price__c": 230,
|
||||
"Category__c": "Womens",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products370/2011100.jpg"
|
||||
},
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef3"
|
||||
},
|
||||
"Name": "MEN'S QUANTUM JACKET",
|
||||
"Description__c": "Reach new heights during aerobic assaults on the summit wearing this lightweight Polartec Thermal Pro gridded fleece mid-layer with an exceptional warmth-to-weight ratio. Hybrid construction strategically places Polartec Power Dry under the arms, on the upper back, and down the forearms for improved moisture management. Zippered handwarmer pockets are designed to remain accessible while you're wearing a climbing harness or a pack.",
|
||||
"Price__c": 160,
|
||||
"Category__c": "Mens",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products1110/1002100.jpg"
|
||||
},
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef4"
|
||||
},
|
||||
"Name": "WOMEN'S ARCTIC PARKA",
|
||||
"Description__c": "Even if you don't live in the Arctic, it probably feels like you do on some winter days. This trench coat combines waterproof, breathable, seam sealed protection via HyVent nylon fabric at exterior with thermal 550 fill down insulation to create a resilient barrier during winter weather. Attached, adjustable hood features two cinch-cords to secure a close fit (removable faux fur trim), and five pockets throughout creates plenty of space to stash essentials.",
|
||||
"Price__c": 330,
|
||||
"Category__c": "Womens",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products1110/2007100.jpg"
|
||||
},
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef5"
|
||||
},
|
||||
"Name": "BOYS' PRINTED RESOLVE JACKET",
|
||||
"Description__c": "He'll splish-splash his way through the worst weather, yet remain bone dry, while wearing this waterproof boys' hooded jacket. Durable HyVent 2L technology features multi-layer waterproofing that's also highly breathable for improved temperature regulation. A mesh lining improves the overall breathability of this seam-sealed rain jacket. The full-length front zipper is protected by a Velcro stormflap to shut out wind and rain. Finished with a brushed collar lining that's soft against the skin when the jacket is fully zipped. Hood stows away in the collar when not in use.",
|
||||
"Price__c": 75,
|
||||
"Category__c": "Kids",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products1110/3006100.jpg"
|
||||
},
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef6"
|
||||
},
|
||||
"Name": "2-METER DOME",
|
||||
"Description__c": "\"If you are planning on spending long periods of time in the mountains, this is the dream base camp tent. This 2-Meter Dome was my living room, bed room, kitchen, and art studio for two months in the Himalayas. It was so cozy I almost didn't want to leave.\" - Cedar Wright, The North Face Athlete, Rock ClimberThe ultimate eight-person expedition base camp tent, the 2-Meter Dome is extremely durable and efficient in merciless environs such as the Himalayas and Antarctica. Setting the standard for unrivaled performance in major expeditions, this is the tent top mountaineers trust in critical conditions.",
|
||||
"Price__c": 5000,
|
||||
"Category__c": "Gear",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products1110/4437100.jpg"
|
||||
},
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef7"
|
||||
},
|
||||
"Name": "JESTER BACKPACK",
|
||||
"Description__c": "No one will call you a fool with the Jester on your back. Designed with two large zip compartments, this versatile 27-liter pack features a front accessory zip pocket with an internal organization sleeve to stash smaller items. Bungee cords crisscross across this pack's face to provide a stellar spot to loop in a rain jacket, or wiffle ball bat.",
|
||||
"Price__c": 65,
|
||||
"Category__c": "Gear",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products1110/4003100.jpg"
|
||||
},
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef8"
|
||||
},
|
||||
"Name": "MINIBUS 3",
|
||||
"Description__c": "Cutting-edge tent design for backpackers features spacious internal volume through tall vertical side walls on the interior and tons of usable vestibule space. Leading the industry in terms of interior volume, this three-person tent also features comprehensive color coded poles for easy setup, refined venting options, and a large front window to watch passing raccoons.",
|
||||
"Price__c": 399,
|
||||
"Category__c": "Gear",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products1110/4412100.jpg"
|
||||
},
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef9"
|
||||
},
|
||||
"Name": "MEN'S LEONIDAS JACKET",
|
||||
"Description__c": "Persevere through wet conditions in remote locations with the help of our alpine workhorse, a waterproof soft shell with leak-proof fully taped seams. Four-way stretch HyVent 2L technology provides durable, multi-layer waterproofing that remains breathable during stages of intense climbing. Fully adjustable hood with laminated brim is helmet compatible for extra coverage. Cuffs adjust with non-abrasive molded tabs.",
|
||||
"Price__c": 230,
|
||||
"Category__c": "Mens",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products1110/1008100.jpg"
|
||||
},
|
||||
{
|
||||
"attributes": {
|
||||
"type": "Merchandise__c",
|
||||
"referenceId": "Merchandise__cRef10"
|
||||
},
|
||||
"Name": "GIRLS' MOUNTAIN VIEW TRICLIMATE JACKET",
|
||||
"Description__c": "It's all about the power of three: this versatile jacket combines a waterproof, breathable, fully seam sealed HyVent shell with a removable, insulated interior jacket for adaptable protection in any condition. Adjustable drawcord lock system accessible through interior pockets. Traditional color blocking underneath arms creates classic alpine style.",
|
||||
"Price__c": 140,
|
||||
"Category__c": "Kids",
|
||||
"Picture_URL__c": "https://s3-us-west-2.amazonaws.com/nto-products/products1110/3031100.jpg"
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,22 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<CustomApplication xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<brand>
|
||||
<headerColor>#027FB3</headerColor>
|
||||
<logo>nto_logo</logo>
|
||||
<logoVersion>1</logoVersion>
|
||||
</brand>
|
||||
<description>Connecting to our customers in a whole new way</description>
|
||||
<formFactors>Large</formFactors>
|
||||
<label>Northern Trail</label>
|
||||
<navType>Standard</navType>
|
||||
<tab>standard-home</tab>
|
||||
<tab>standard-Account</tab>
|
||||
<tab>standard-Contact</tab>
|
||||
<tab>Merchandising_Mix__c</tab>
|
||||
<tab>Merchandise__c</tab>
|
||||
<tab>standard-File</tab>
|
||||
<tab>standard-Opportunity</tab>
|
||||
<tab>standard-Event</tab>
|
||||
<uiType>Lightning</uiType>
|
||||
<utilityBar>Northern_Trail_UtilityBar</utilityBar>
|
||||
</CustomApplication>
|
|
@ -0,0 +1,16 @@
|
|||
<aura:component controller="MerchandiseController" access="global">
|
||||
|
||||
<aura:registerEvent name="onchange" type="c:ValueChange"/>
|
||||
|
||||
<ltng:require scripts="{!$Resource.DataCache}" afterScriptsLoaded="{!c.afterScriptsLoaded}"/>
|
||||
|
||||
<aura:attribute name="categories" type="String[]" />
|
||||
<aura:attribute name="selectedValue" type="String"/>
|
||||
|
||||
<lightning:select name="categorySelector" label="Category" value="{!v.selectedValue}" onchange="{!c.changeHandler}">
|
||||
<aura:iteration items="{!v.categories}" var="category">
|
||||
<option text="{#category}" value="{#category}"/>
|
||||
</aura:iteration>
|
||||
</lightning:select>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,3 @@
|
|||
.THIS {
|
||||
max-width: 436px;
|
||||
}
|
|
@ -0,0 +1,20 @@
|
|||
({
|
||||
afterScriptsLoaded : function(component, event, helper) {
|
||||
var assetClasses = window.DataCache.getData("assetClasses");
|
||||
if (assetClasses) {
|
||||
console.log('product categories retrieved from custom cache');
|
||||
component.set("v.categories", assetClasses);
|
||||
} else {
|
||||
helper.loadCategories(component);
|
||||
}
|
||||
},
|
||||
|
||||
changeHandler : function(component, event, helper) {
|
||||
var changeEvent = component.getEvent("onchange");
|
||||
changeEvent.setParams({
|
||||
"value": component.get("v.selectedValue")
|
||||
});
|
||||
changeEvent.fire();
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,15 @@
|
|||
({
|
||||
loadCategories: function (component) {
|
||||
var action = component.get("c.getCategories");
|
||||
action.setCallback(this, function (response) {
|
||||
var categories = response.getReturnValue();
|
||||
if (categories) {
|
||||
categories.unshift("");
|
||||
window.DataCache.setData("categories", categories);
|
||||
component.set("v.categories", categories);
|
||||
}
|
||||
});
|
||||
$A.enqueueAction(action);
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,29 @@
|
|||
<aura:component implements="flexipage:availableForAllPageTypes" access="global" >
|
||||
|
||||
<aura:attribute name="showSearch" type="Boolean" default="true"/>
|
||||
<aura:attribute name="showCategory" type="Boolean" default="true"/>
|
||||
<aura:attribute name="showSubcategory" type="Boolean" default="true"/>
|
||||
|
||||
<aura:registerEvent name="filterChange" type="c:MerchandiseFilterChange"/>
|
||||
|
||||
<div class="slds-text-heading_small">All Available Merchandise</div>
|
||||
|
||||
<lightning:layout class="slds-m-vertical_medium">
|
||||
<aura:if isTrue="{!v.showSearch}">
|
||||
<lightning:layoutitem flexibility="grow" class="right-padding">
|
||||
<c:SearchBar onchange="{!c.searchKeyChangeHandler}"/>
|
||||
</lightning:layoutitem>
|
||||
</aura:if>
|
||||
<aura:if isTrue="{!v.showCategory}">
|
||||
<lightning:layoutitem flexibility="grow" class="right-padding">
|
||||
<c:CategorySelector onchange="{!c.categoryChangeHandler}"/>
|
||||
</lightning:layoutitem>
|
||||
</aura:if>
|
||||
<aura:if isTrue="{!v.showSubcategory}">
|
||||
<lightning:layoutitem flexibility="grow">
|
||||
<c:SubcategorySelector />
|
||||
</lightning:layoutitem>
|
||||
</aura:if>
|
||||
</lightning:layout>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,7 @@
|
|||
.THIS .slider {
|
||||
margin-top: -14px;
|
||||
}
|
||||
|
||||
.THIS .right-padding {
|
||||
padding-right: 12px;
|
||||
}
|
|
@ -0,0 +1,5 @@
|
|||
<design:component label="Merchandise Filter">
|
||||
<design:attribute name="showSearch" label="Search" default="true"/>
|
||||
<design:attribute name="showCategory" label="Category" default="true"/>
|
||||
<design:attribute name="showSubcategory" label="Subcategory" default="true"/>
|
||||
</design:component>
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="120px" height="120px" viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>filter</title>
|
||||
<desc>filter</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="filter">
|
||||
<rect id="Rectangle" fill="#6CCDF0" x="0" y="0" width="120" height="120"></rect>
|
||||
<path d="M93.5717894,26 L25.7379747,26 C23.4103438,26 22.080269,28.6601496 23.7428625,30.3227431 L53.6695454,65.2372066 C54.3345828,66.2347627 54.9996202,67.8973562 54.9996202,69.227431 L54.9996202,91.5061838 C54.9996202,92.5037399 55.9971763,93.8338147 57.3272511,93.8338147 L61.9825129,93.8338147 C63.3125877,93.8338147 64.3101438,92.5037399 64.3101438,91.5061838 L64.3101438,69.227431 C64.3101438,67.8973562 64.6426625,66.2347627 65.6402186,65.2372066 L95.5669016,30.3227431 C97.2294951,28.6601496 95.8994203,26 93.5717894,26 L93.5717894,26 Z" id="Shape" fill="#FFFFFF"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
После Ширина: | Высота: | Размер: 1.1 KiB |
|
@ -0,0 +1,19 @@
|
|||
({
|
||||
|
||||
searchKeyChangeHandler : function(component, event) {
|
||||
var merchandiseFilterChangeEvent = $A.get("e.c:MerchandiseFilterChange");
|
||||
merchandiseFilterChangeEvent.setParams({
|
||||
"searchKey": event.getParam("value")
|
||||
});
|
||||
merchandiseFilterChangeEvent.fire();
|
||||
},
|
||||
|
||||
categoryChangeHandler : function(component, event) {
|
||||
var merchandiseFilterChangeEvent = $A.get("e.c:MerchandiseFilterChange");
|
||||
merchandiseFilterChangeEvent.setParams({
|
||||
"category": event.getParam("value")
|
||||
});
|
||||
merchandiseFilterChangeEvent.fire();
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,4 @@
|
|||
<aura:event type="APPLICATION" description="Event template" >
|
||||
<aura:attribute name="searchKey" type="String"/>
|
||||
<aura:attribute name="category" type="String"/>
|
||||
</aura:event>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="urn:metadata.tooling.soap.sforce.com" fqn="MerchandiseFilterChange">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Event Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,28 @@
|
|||
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes"
|
||||
controller="MerchandiseController" access="global">
|
||||
|
||||
<aura:attribute name="items" type="Merchandise__c[]"/>
|
||||
<aura:attribute name="filterObject" type="Object" />
|
||||
<aura:attribute name="pageSize" type="Integer" default="8"/>
|
||||
<aura:attribute name="page" type="Integer"/>
|
||||
<aura:attribute name="pages" type="Integer"/>
|
||||
<aura:attribute name="total" type="Integer"/>
|
||||
|
||||
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
|
||||
<aura:handler event="c:MerchandiseFilterChange" action="{!c.filterChangeHandler}"/>
|
||||
<aura:handler event="c:RangeChange" action="{!c.rangeChange}"/>
|
||||
|
||||
<div>
|
||||
|
||||
<aura:iteration items="{!v.items}" var="item" indexVar="index">
|
||||
<lightning:layoutitem size="12">
|
||||
<c:MerchandiseTile merchandise="{#item}" index="{#index}"/>
|
||||
</lightning:layoutitem>
|
||||
</aura:iteration>
|
||||
|
||||
<c:Paginator page="{!v.page}" pages="{!v.pages}" total="{!v.total}" label="products"
|
||||
previousPage="{!c.onPreviousPage}" nextPage="{!c.onNextPage}"/>
|
||||
|
||||
</div>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,7 @@
|
|||
.THIS {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.THIS .slds-app-launcher__tile {
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
|
@ -0,0 +1,3 @@
|
|||
<design:component label="Merchandise List">
|
||||
<design:attribute name="pageSize" default="8" label="Records per page"/>
|
||||
</design:component>
|
|
@ -0,0 +1,11 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="120px" height="120px" viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>List</title>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="filter">
|
||||
<rect id="Rectangle" fill="#6CCDF0" x="0" y="0" width="120" height="120"></rect>
|
||||
<path d="M29.4684685,33.2432432 C29.4684685,32.1216216 28.3468468,31 26.8513514,31 L21.6171171,31 C20.1216216,31 19,32.1216216 19,33.2432432 L19,38.4774775 C19,39.972973 20.1216216,41.0945946 21.6171171,41.0945946 L26.8513514,41.0945946 C28.3468468,41.0945946 29.4684685,39.972973 29.4684685,38.4774775 L29.4684685,33.2432432 L29.4684685,33.2432432 Z M102,33.2432432 C102,32.1216216 100.878378,31 99.3828829,31 L38.8153153,31 C37.6936937,31 36.1981982,32.1216216 36.1981982,33.2432432 L36.1981982,38.4774775 C36.1981982,39.972973 37.6936937,41.0945946 38.8153153,41.0945946 L99.3828829,41.0945946 C100.878378,41.0945946 102,39.972973 102,38.4774775 L102,33.2432432 L102,33.2432432 Z M29.4684685,57.545045 C29.4684685,56.0495495 28.3468468,54.9279279 26.8513514,54.9279279 L21.6171171,54.9279279 C20.1216216,54.9279279 19,56.0495495 19,57.545045 L19,62.7792793 C19,64.2747748 20.1216216,65.3963964 21.6171171,65.3963964 L26.8513514,65.3963964 C28.3468468,65.3963964 29.4684685,64.2747748 29.4684685,62.7792793 L29.4684685,57.545045 L29.4684685,57.545045 Z M94.8963964,57.545045 C94.8963964,56.0495495 93.7747748,54.9279279 92.2792793,54.9279279 L38.8153153,54.9279279 C37.6936937,54.9279279 36.1981982,56.0495495 36.1981982,57.545045 L36.1981982,62.7792793 C36.1981982,64.2747748 37.6936937,65.3963964 38.8153153,65.3963964 L92.2792793,65.3963964 C93.7747748,65.3963964 94.8963964,64.2747748 94.8963964,62.7792793 L94.8963964,57.545045 L94.8963964,57.545045 Z M29.4684685,81.8468468 C29.4684685,80.3513514 28.3468468,79.2297297 26.8513514,79.2297297 L21.6171171,79.2297297 C20.1216216,79.2297297 19,80.3513514 19,81.8468468 L19,87.0810811 C19,88.2027027 20.1216216,89.3243243 21.6171171,89.3243243 L26.8513514,89.3243243 C28.3468468,89.3243243 29.4684685,88.2027027 29.4684685,87.0810811 L29.4684685,81.8468468 L29.4684685,81.8468468 Z M102,81.8468468 C102,80.3513514 100.878378,79.2297297 99.3828829,79.2297297 L38.8153153,79.2297297 C37.6936937,79.2297297 36.1981982,80.3513514 36.1981982,81.8468468 L36.1981982,87.0810811 C36.1981982,88.2027027 37.6936937,89.3243243 38.8153153,89.3243243 L99.3828829,89.3243243 C100.878378,89.3243243 102,88.2027027 102,87.0810811 L102,81.8468468 L102,81.8468468 Z" id="Shape" fill="#FFFFFF"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
После Ширина: | Высота: | Размер: 2.6 KiB |
|
@ -0,0 +1,46 @@
|
|||
({
|
||||
doInit: function(component, event, helper) {
|
||||
var filterObject = {
|
||||
searchKey: '',
|
||||
category: ''
|
||||
};
|
||||
component.set("v.filterObject", filterObject);
|
||||
helper.loadMerchandise(component);
|
||||
},
|
||||
|
||||
onPreviousPage: function(component, event, helper) {
|
||||
var page = component.get("v.page") || 1;
|
||||
page = page - 1;
|
||||
helper.loadMerchandise(component, page);
|
||||
},
|
||||
|
||||
onNextPage: function(component, event, helper) {
|
||||
var page = component.get("v.page") || 1;
|
||||
page = page + 1;
|
||||
helper.loadMerchandise(component, page);
|
||||
},
|
||||
|
||||
filterChangeHandler: function(component, event, helper) {
|
||||
var filterObject = component.get("v.filterObject");
|
||||
if (event.getParam("searchKey") !== undefined) {
|
||||
filterObject.searchKey = event.getParam("searchKey");
|
||||
}
|
||||
if (event.getParam("category") !== undefined) {
|
||||
filterObject.category = event.getParam("category");
|
||||
}
|
||||
helper.loadMerchandise(component);
|
||||
},
|
||||
|
||||
rangeChange: function(component, event, helper) {
|
||||
var filterName = event.getParam("filterName");
|
||||
var minValue = event.getParam("minValue");
|
||||
var maxValue = event.getParam("maxValue");
|
||||
var filterObject = component.get("v.filterObject");
|
||||
if (filterName === 'MSRP') {
|
||||
filterObject.minPrice = minValue;
|
||||
filterObject.maxPrice = maxValue;
|
||||
}
|
||||
helper.loadMerchandise(component);
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,22 @@
|
|||
({
|
||||
loadMerchandise : function(component, page) {
|
||||
var action = component.get("c.getMerchandise");
|
||||
action.setStorable();
|
||||
var pageSize = component.get("v.pageSize");
|
||||
action.setParams({
|
||||
"filters": JSON.stringify(component.get("v.filterObject")),
|
||||
"pageSize": pageSize,
|
||||
"pageNumber": page || 1
|
||||
});
|
||||
action.setCallback(this, function(response) {
|
||||
console.log('# getProducts callback %f', (performance.now() - startTime));
|
||||
var result = response.getReturnValue();
|
||||
component.set("v.items", result.items);
|
||||
component.set("v.page", result.page);
|
||||
component.set("v.total", result.total);
|
||||
component.set("v.pages", Math.ceil(result.total/pageSize));
|
||||
});
|
||||
var startTime = performance.now();
|
||||
$A.enqueueAction(action);
|
||||
}
|
||||
})
|
|
@ -0,0 +1,56 @@
|
|||
<aura:component implements="flexipage:availableForAllPageTypes,force:hasRecordId" controller="MerchandiseMixController" access="global">
|
||||
|
||||
<ltng:require scripts="{!$Resource.countup}" />
|
||||
|
||||
<aura:attribute name="recordId" type="Id" />
|
||||
<aura:attribute name="mixItems" type="Mix_Item__c[]" default="[]"/>
|
||||
<aura:attribute name="totalQty" type="Integer" default="0"/>
|
||||
<aura:attribute name="totalMSRP" type="Decimal" default="0"/>
|
||||
<aura:attribute name="showChart" type="Boolean" default="false"/>
|
||||
|
||||
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
|
||||
|
||||
<div>
|
||||
<lightning:layout class="header">
|
||||
<lightning:layoutitem padding="horizontal-medium">
|
||||
<lightning:icon iconName="custom:custom17"/>
|
||||
</lightning:layoutitem>
|
||||
<lightning:layoutitem flexibility="grow">
|
||||
<lightning:layout class="header-fields">
|
||||
<lightning:layoutitem >
|
||||
<p class="slds-text-title slds-truncate slds-m-bottom_xx-small">Total MSRP</p>
|
||||
<p class="slds-text-heading_small slds-truncate total-msrp">
|
||||
$<span aura:id="totalMSRP">0</span>
|
||||
</p>
|
||||
</lightning:layoutitem>
|
||||
<lightning:layoutitem >
|
||||
<p class="slds-text-title slds-truncate slds-m-bottom_xx-small">Products</p>
|
||||
<p class="slds-text-heading_small slds-truncate ">{!v.mixItems.length}</p>
|
||||
</lightning:layoutitem>
|
||||
<lightning:layoutitem padding="horizontal-large">
|
||||
<p class="slds-text-title slds-truncate slds-m-bottom_xx-small">Qty</p>
|
||||
<p class="slds-text-heading_small slds-truncate">{!v.totalQty}</p>
|
||||
</lightning:layoutitem>
|
||||
<aura:if isTrue="{!v.showChart}">
|
||||
<lightning:layoutitem padding="horizontal-large">
|
||||
<c:MixChart mixItems="{!v.mixItems}"/>
|
||||
</lightning:layoutitem>
|
||||
</aura:if>
|
||||
</lightning:layout>
|
||||
</lightning:layoutitem>
|
||||
</lightning:layout>
|
||||
|
||||
<div aura:id="dropZone" class="drop-zone" ondrop="{!c.dropHandler}" ondragover="{!c.dragOverHandler}" ondragleave="{!c.dragLeaveHandler}">
|
||||
<lightning:layout multipleRows="true">
|
||||
<aura:iteration items="{!v.mixItems}" var="mixItem" indexVar="index">
|
||||
<lightning:layoutItem size="12" smallDeviceSize="6" mediumDeviceSize="6" largeDeviceSize="4">
|
||||
<c:MixItemTile mixItem="{#mixItem}" index="{#index}"
|
||||
onDelete="{!c.mixItemDeleteHandler}"
|
||||
onChange="{!c.mixItemChangeHandler}"/>
|
||||
</lightning:layoutItem>
|
||||
</aura:iteration>
|
||||
</lightning:layout>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,33 @@
|
|||
.THIS {
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.THIS .header {
|
||||
padding: 20px 20px 20px 0;
|
||||
border-top: solid 1px #D8DDE6;
|
||||
}
|
||||
|
||||
.THIS .header-fields>div {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.THIS .slds-icon_container {
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.THIS .total-msrp {
|
||||
width: 80px;
|
||||
color: #FF6600;
|
||||
}
|
||||
|
||||
.THIS .drop-zone {
|
||||
box-sizing: border-box;
|
||||
min-height: 200px;
|
||||
border-width: 2px;
|
||||
border-style: dashed;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.THIS .drop-zone.active {
|
||||
border-color: #D8DDE6;
|
||||
}
|
|
@ -0,0 +1,3 @@
|
|||
<design:component label="Merchandise Mix">
|
||||
<design:attribute name="showChart" label="Mix Breakdown Chart" default="true"/>
|
||||
</design:component>
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="120px" height="120px" viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>filter</title>
|
||||
<desc>Mix.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="filter">
|
||||
<rect id="Rectangle" fill="#6CCDF0" x="0" y="0" width="120" height="120"></rect>
|
||||
<path d="M50.4144144,78.1441441 C50.4144144,76.7747748 49.3873874,75.7477477 48.018018,75.7477477 L24.3963964,75.7477477 C23.027027,75.7477477 22,76.7747748 22,78.1441441 L22,95.6036036 C22,96.972973 23.027027,98 24.3963964,98 L48.018018,98 C49.3873874,98 50.4144144,96.972973 50.4144144,95.6036036 L50.4144144,78.1441441 L50.4144144,78.1441441 Z M31.5855856,53.8378378 L24.0540541,53.8378378 C22.3423423,53.8378378 21.6576577,55.2072072 22.6846847,55.8918919 L35.3513514,68.9009009 C35.6936937,69.5855856 36.7207207,69.5855856 37.4054054,68.9009009 L50.0720721,55.8918919 C51.0990991,54.8648649 50.0720721,53.8378378 48.7027027,53.8378378 L41.1711712,53.8378378 C41.1711712,45.6216216 49.045045,37.7477477 56.9189189,37.7477477 L56.9189189,28.5045045 C42.5405405,28.5045045 31.5855856,39.4594595 31.5855856,53.8378378 L31.5855856,53.8378378 Z M84.990991,51.0990991 C84.3063063,50.4144144 83.2792793,50.4144144 82.5945946,51.0990991 L70.2702703,64.1081081 C69.2432432,65.1351351 69.9279279,66.1621622 71.6396396,66.1621622 L79.1711712,66.1621622 C79.1711712,75.7477477 72.6666667,82.2522523 63.0810811,82.2522523 L63.0810811,91.4954955 C77.4594595,91.4954955 88.7567568,80.5405405 88.7567568,66.1621622 L96.2882883,66.1621622 C98,66.1621622 98.6846847,64.7927928 97.6576577,64.1081081 L84.990991,51.0990991 L84.990991,51.0990991 Z M98,24.3963964 C98,23.027027 96.972973,22 95.6036036,22 L71.981982,22 C70.6126126,22 69.5855856,23.027027 69.5855856,24.3963964 L69.5855856,41.8558559 C69.5855856,43.2252252 70.6126126,44.2522523 71.981982,44.2522523 L95.6036036,44.2522523 C96.972973,44.2522523 98,43.2252252 98,41.8558559 L98,24.3963964 L98,24.3963964 Z" id="Shape" fill="#FFFFFF"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
После Ширина: | Высота: | Размер: 2.1 KiB |
|
@ -0,0 +1,52 @@
|
|||
({
|
||||
doInit : function(component, event, helper) {
|
||||
var mixId = component.get("v.recordId");
|
||||
helper.loadMixItems(component, mixId);
|
||||
},
|
||||
|
||||
dropHandler : function(component, event, helper) {
|
||||
event.preventDefault();
|
||||
var cmpTarget= component.find("dropZone");
|
||||
$A.util.removeClass(cmpTarget, 'active');
|
||||
var mixItems = component.get("v.mixItems");
|
||||
var merchandise = JSON.parse(event.dataTransfer.getData("merchandise"));
|
||||
var mixItem = {
|
||||
Merchandising_Mix__c: component.get("v.recordId"),
|
||||
Merchandise__c: merchandise.Id,
|
||||
Qty__c: 10,
|
||||
Merchandise__r: {
|
||||
Id: merchandise.Id,
|
||||
Name: merchandise.Name,
|
||||
Price__c: merchandise.Price__c,
|
||||
Category__c: merchandise.Category__c,
|
||||
Picture_URL__c: merchandise.Picture_URL__c
|
||||
}
|
||||
};
|
||||
mixItems.push(mixItem);
|
||||
helper.addItem(component, mixItem);
|
||||
component.set("v.mixItems", mixItems);
|
||||
},
|
||||
|
||||
dragOverHandler : function(component, event) {
|
||||
event.preventDefault();
|
||||
var cmpTarget= component.find("dropZone");
|
||||
$A.util.addClass(cmpTarget, 'active');
|
||||
},
|
||||
|
||||
dragLeaveHandler : function(component, event){
|
||||
event.preventDefault();
|
||||
var cmpTarget= component.find("dropZone");
|
||||
$A.util.removeClass(cmpTarget, 'active');
|
||||
},
|
||||
|
||||
mixItemDeleteHandler : function(component, event, helper) {
|
||||
var mixItem = event.getParam("mixItem");
|
||||
helper.removeItem(component, mixItem);
|
||||
},
|
||||
|
||||
mixItemChangeHandler : function(component, event, helper) {
|
||||
var mixItem = event.getParam("mixItem");
|
||||
helper.updateItem(component, mixItem);
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,82 @@
|
|||
({
|
||||
loadMixItems : function(component, mixId) {
|
||||
var action = component.get("c.getMixItems");
|
||||
action.setStorable();
|
||||
action.setParams({
|
||||
"mixId": mixId
|
||||
});
|
||||
action.setCallback(this, function(response) {
|
||||
var result = response.getReturnValue();
|
||||
component.set("v.mixItems", result);
|
||||
this.calculateMix(component);
|
||||
});
|
||||
$A.enqueueAction(action);
|
||||
},
|
||||
|
||||
addItem : function(component, mixItem) {
|
||||
var action = component.get("c.addMixItem");
|
||||
action.setParams({
|
||||
"mixId": mixItem.Merchandising_Mix__c,
|
||||
"productId": mixItem.Merchandise__c,
|
||||
"qty": mixItem.Qty__c
|
||||
});
|
||||
action.setCallback(this, function(response) {
|
||||
var result = response.getReturnValue();
|
||||
mixItem.Id = result.Id;
|
||||
this.calculateMix(component);
|
||||
});
|
||||
$A.enqueueAction(action);
|
||||
},
|
||||
|
||||
updateItem : function(component, mixItem) {
|
||||
var action = component.get("c.updateMixItem");
|
||||
action.setParams({
|
||||
"mixItem": mixItem
|
||||
});
|
||||
action.setCallback(this, function(response) {
|
||||
this.calculateMix(component);
|
||||
});
|
||||
$A.enqueueAction(action);
|
||||
},
|
||||
|
||||
removeItem : function(component, mixItem) {
|
||||
var action = component.get("c.removeMixItem");
|
||||
action.setParams({
|
||||
"mixItemId": mixItem.Id
|
||||
});
|
||||
action.setCallback(this, function(response) {
|
||||
var result = response.getReturnValue();
|
||||
var mixItems = component.get("v.mixItems");
|
||||
for (var i=0; i<mixItems.length; i++) {
|
||||
if(mixItems[i].Id === mixItem.Id) {
|
||||
mixItems.splice(i, 1);
|
||||
component.set("v.mixItems", mixItems);
|
||||
this.calculateMix(component);
|
||||
return;
|
||||
}
|
||||
}
|
||||
});
|
||||
$A.enqueueAction(action);
|
||||
},
|
||||
|
||||
calculateMix : function(component) {
|
||||
var mixItems = component.get("v.mixItems");
|
||||
var oldTotalMSRP = component.get("v.totalMSRP");
|
||||
var totalQty = 0;
|
||||
var totalMSRP = 0;
|
||||
if (mixItems && Array.isArray(mixItems)) {
|
||||
mixItems.forEach(function(mixItem) {
|
||||
totalQty = totalQty + mixItem.Qty__c;
|
||||
totalMSRP = totalMSRP + (mixItem.Qty__c * mixItem.Merchandise__r.Price__c);
|
||||
});
|
||||
component.set("v.totalQty", totalQty);
|
||||
component.set("v.totalMSRP", totalMSRP);
|
||||
var totalMSRPEl = component.find("totalMSRP");
|
||||
if (totalMSRPEl && totalMSRPEl.getElement()) {
|
||||
var numAnim = new CountUp(totalMSRPEl.getElement(), oldTotalMSRP, totalMSRP, 0, 0.5);
|
||||
numAnim.start();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,15 @@
|
|||
<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >
|
||||
|
||||
<aura:attribute name="recordId" type="Id" />
|
||||
<aura:attribute name="record" type="Object" />
|
||||
|
||||
<force:recordData recordId="{!v.recordId}"
|
||||
targetFields="{!v.record}"
|
||||
fields="['Id', 'Name', 'Picture_URL__c']"/>
|
||||
|
||||
<div>
|
||||
<img src="{!v.record.Picture_URL__c}"/>
|
||||
<div class="title">{!v.record.Name}</div>
|
||||
</div>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="urn:metadata.tooling.soap.sforce.com" fqn="MerchandisePicture">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,3 @@
|
|||
.THIS {
|
||||
text-align: center;
|
||||
}
|
|
@ -0,0 +1,15 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="86px" height="86px" viewBox="0 0 86 86" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Generator: Sketch 45 (43475) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>Group</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="Group">
|
||||
<rect id="Rectangle" fill="#6CCDF0" x="0" y="0" width="86" height="86" rx="8"></rect>
|
||||
<g id="photo" transform="translate(13.000000, 15.000000)" fill-rule="nonzero" fill="#FFFFFF">
|
||||
<path d="M16,10 L44,10 C44.8,10 45.3,9.1 44.8,8.5 L41.5,3.4 C40.5,1.4 38.4,0.1 36.1,0.1 L23.9,0.1 C21.6,0.1 19.5,1.4 18.5,3.4 L15.2,8.5 C14.7,9.1 15.2,10 16,10 L16,10 Z M30,28 C25.6,28 22,31.6 22,36 C22,40.4 25.6,44 30,44 C34.4,44 38,40.4 38,36 C38,31.6 34.4,28 30,28 Z M54,16 L6,16 C2.7,16 0,18.7 0,22 L0,50 C0,53.3 2.7,56 6,56 L54,56 C57.3,56 60,53.3 60,50 L60,22 C60,18.7 57.3,16 54,16 Z M30,50 C22.3,50 16,43.7 16,36 C16,28.3 22.3,22 30,22 C37.7,22 44,28.3 44,36 C44,43.7 37.7,50 30,50 Z" id="Shape"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
После Ширина: | Высота: | Размер: 1.2 KiB |
|
@ -0,0 +1,5 @@
|
|||
({
|
||||
myAction : function(component, event, helper) {
|
||||
|
||||
}
|
||||
})
|
|
@ -0,0 +1,5 @@
|
|||
({
|
||||
helperMethod : function() {
|
||||
|
||||
}
|
||||
})
|
|
@ -0,0 +1,5 @@
|
|||
({
|
||||
|
||||
// Your renderer method overrides go here
|
||||
|
||||
})
|
|
@ -0,0 +1,23 @@
|
|||
<aura:component >
|
||||
|
||||
<aura:attribute name="merchandise" type="Merchandise__c"/>
|
||||
<aura:attribute name="index" type="Integer"/>
|
||||
|
||||
<aura:registerEvent name="navigateToSObject" type="force:navigateToSObject"/>
|
||||
|
||||
<div data-id="{#v.index}" draggable="true" ondragstart="{!c.dragStart}">
|
||||
<lightning:layout verticalAlign="center">
|
||||
<lightning:layoutitem >
|
||||
<lightning:icon iconName="utility:rows" size="x-small"></lightning:icon>
|
||||
</lightning:layoutitem>
|
||||
<lightning:layoutitem padding="around-small">
|
||||
<img src="{#v.merchandise.Picture_URL__c}" class="merchandise"/>
|
||||
</lightning:layoutitem>
|
||||
<lightning:layoutitem flexibility="grow">
|
||||
<div class="title slds-truncate"><a href="" onclick="{!c.titleClickHandler}">{#v.merchandise.Name}</a></div>
|
||||
<div>MSRP: <span class="price"><lightning:formattedNumber value="{#v.merchandise.Price__c}" style="currency" /></span></div>
|
||||
</lightning:layoutitem>
|
||||
</lightning:layout>
|
||||
</div>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="urn:metadata.tooling.soap.sforce.com" fqn="MerchandiseTile">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,33 @@
|
|||
.THIS {
|
||||
cursor: -webkit-grab;
|
||||
border-bottom: solid 1px #d8dde6;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.THIS a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.THIS:active {
|
||||
cursor: -webkit-grabbing;
|
||||
}
|
||||
|
||||
.THIS img.merchandise {
|
||||
height: auto;
|
||||
min-height: 50px;
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.THIS img{
|
||||
max-width: initial;
|
||||
}
|
||||
|
||||
.THIS .price,
|
||||
.THIS .title {
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.THIS .price {
|
||||
color: #FF6600;
|
||||
}
|
|
@ -0,0 +1,15 @@
|
|||
({
|
||||
titleClickHandler: function(component) {
|
||||
var navEvt = $A.get("e.force:navigateToSObject");
|
||||
navEvt.setParams({
|
||||
"recordId": component.get("v.merchandise").Id,
|
||||
"slideDevName": "detail"
|
||||
});
|
||||
navEvt.fire();
|
||||
},
|
||||
|
||||
dragStart : function(component, event) {
|
||||
var merchandise = component.get("v.merchandise");
|
||||
event.dataTransfer.setData("merchandise", JSON.stringify(merchandise));
|
||||
}
|
||||
})
|
|
@ -0,0 +1,5 @@
|
|||
({
|
||||
helperMethod : function() {
|
||||
|
||||
}
|
||||
})
|
|
@ -0,0 +1,5 @@
|
|||
({
|
||||
|
||||
// Your renderer method overrides go here
|
||||
|
||||
})
|
|
@ -0,0 +1,62 @@
|
|||
<aura:component implements="force:hasRecordId" access="global" >
|
||||
|
||||
<ltng:require scripts="{!$Resource.chartjs}"
|
||||
afterScriptsLoaded="{!c.scriptsLoaded}" />
|
||||
|
||||
<aura:attribute name="mixItems" type="Mix_Item__c[]" default="[]"/>
|
||||
|
||||
<aura:handler name="change" value="{!v.mixItems}" action="{!c.mixItemsChangeHandler}"/>
|
||||
|
||||
<lightning:layout >
|
||||
<lightning:layoutItem >
|
||||
<div class="chart">
|
||||
<canvas aura:id="chart" height="60" width="60"></canvas>
|
||||
</div>
|
||||
</lightning:layoutItem>
|
||||
<lightning:layoutItem class="slds-text-body_small">
|
||||
<lightning:layout verticalAlign="center">
|
||||
<lightning:layoutItem padding="horizontal-small">
|
||||
<div class="legend womens"/>
|
||||
</lightning:layoutItem>
|
||||
<lightning:layoutItem >
|
||||
Womens
|
||||
</lightning:layoutItem>
|
||||
</lightning:layout>
|
||||
<lightning:layout verticalAlign="center">
|
||||
<lightning:layoutItem padding="horizontal-small">
|
||||
<div class="legend mens"/>
|
||||
</lightning:layoutItem>
|
||||
<lightning:layoutItem >
|
||||
Mens
|
||||
</lightning:layoutItem>
|
||||
</lightning:layout>
|
||||
<lightning:layout verticalAlign="center">
|
||||
<lightning:layoutItem padding="horizontal-small">
|
||||
<div class="legend kids"/>
|
||||
</lightning:layoutItem>
|
||||
<lightning:layoutItem >
|
||||
Kids
|
||||
</lightning:layoutItem>
|
||||
</lightning:layout>
|
||||
</lightning:layoutItem>
|
||||
<lightning:layoutItem class="slds-text-body_small">
|
||||
<lightning:layout verticalAlign="center">
|
||||
<lightning:layoutItem padding="horizontal-small">
|
||||
<div class="legend gear"/>
|
||||
</lightning:layoutItem>
|
||||
<lightning:layoutItem >
|
||||
Gear
|
||||
</lightning:layoutItem>
|
||||
</lightning:layout>
|
||||
<lightning:layout verticalAlign="center">
|
||||
<lightning:layoutItem padding="horizontal-small">
|
||||
<div class="legend electronics"/>
|
||||
</lightning:layoutItem>
|
||||
<lightning:layoutItem >
|
||||
Electronics
|
||||
</lightning:layoutItem>
|
||||
</lightning:layout>
|
||||
</lightning:layoutItem>
|
||||
</lightning:layout>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,37 @@
|
|||
.THIS .chart{
|
||||
position: relative;
|
||||
text-align: center;
|
||||
width: 100px;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.THIS .slds-text-heading--medium {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.THIS .legend {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.THIS .legend.womens {
|
||||
background-color: rgba(126,139,228,.8);
|
||||
}
|
||||
|
||||
.THIS .legend.mens {
|
||||
background-color: rgba(84,105,141,.8);
|
||||
}
|
||||
|
||||
.THIS .legend.kids {
|
||||
background-color: rgba(254,143,96,.8);
|
||||
}
|
||||
|
||||
.THIS .legend.gear {
|
||||
background-color: rgba(125,195,125,.8);
|
||||
}
|
||||
|
||||
.THIS .legend.electronics {
|
||||
background-color: rgba(52,190,205,.8);
|
||||
}
|
|
@ -0,0 +1,68 @@
|
|||
({
|
||||
scriptsLoaded : function(component) {
|
||||
|
||||
var data = {
|
||||
labels: ["Womens", "Mens", "Kids", "Gear", "Electronics"],
|
||||
datasets: [
|
||||
{
|
||||
data: [0, 0, 0, 0, 0, 1],
|
||||
backgroundColor: [
|
||||
"rgba(126,139,228,.8)",
|
||||
"rgba(84,105,141,.8)",
|
||||
"rgba(254,143,96,.8)",
|
||||
"rgba(125,195,125,.8)",
|
||||
"rgba(52,190,205,.8)",
|
||||
"#E0E5EE"
|
||||
],
|
||||
hoverBackgroundColor: [
|
||||
"rgba(126,139,228,.8)",
|
||||
"rgba(84,105,141,.8)",
|
||||
"rgba(254,143,96,.8)",
|
||||
"rgba(125,195,125,.8)",
|
||||
"rgba(52,190,205,.8)",
|
||||
"#E0E5EE"
|
||||
]
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
var ctx = component.find("chart").getElement();
|
||||
component.chart = new Chart(ctx,{
|
||||
type: 'doughnut',
|
||||
data: data,
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
cutoutPercentage: 60,
|
||||
legend: {
|
||||
position: "right",
|
||||
display: false
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
mixItemsChangeHandler: function(component) {
|
||||
if (component.chart && component.chart.data && component.chart.data.datasets[0]) {
|
||||
var mixItems = component.get("v.mixItems");
|
||||
if (mixItems && Array.isArray(mixItems)) {
|
||||
var map = {};
|
||||
mixItems.forEach(function(mixItem) {
|
||||
map[mixItem.Merchandise__r.Category__c] = (map[mixItem.Merchandise__r.Category__c] || 0) + (mixItem.Qty__c * mixItem.Merchandise__r.Price__c);
|
||||
});
|
||||
var data = [
|
||||
map.Womens || 0,
|
||||
map.Mens || 0,
|
||||
map.Kids || 0,
|
||||
map.Gear || 0,
|
||||
map.Electronics || 0
|
||||
];
|
||||
component.chart.data.datasets[0].data = data;
|
||||
component.chart.update();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,3 @@
|
|||
<aura:event type="APPLICATION" description="Event template">
|
||||
<aura:attribute name="mixItem" type="Mix_Item__c" />
|
||||
</aura:event>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="urn:metadata.tooling.soap.sforce.com" fqn="MixItemEvent">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Event Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,26 @@
|
|||
<aura:component>
|
||||
|
||||
<aura:attribute name="mixItem" type="Mix_Item__c"/>
|
||||
<aura:attribute name="index" type="Integer"/>
|
||||
|
||||
<aura:registerEvent name="navigateToSObject" type="force:navigateToSObject"/>
|
||||
<aura:registerEvent name="onDelete" type="c:MixItemEvent"/>
|
||||
<aura:registerEvent name="onChange" type="c:MixItemEvent"/>
|
||||
|
||||
<lightning:layout >
|
||||
<lightning:layoutitem padding="around-medium" flexibility="no-grow">
|
||||
<img src="{#v.mixItem.Merchandise__r.Picture_URL__c}" class="product"/>
|
||||
</lightning:layoutitem>
|
||||
<lightning:layoutitem padding="around-medium" flexibility="grow">
|
||||
<span class="title"><a href="" onclick="{!c.titleClickHandler}">{#v.mixItem.Merchandise__r.Name}</a></span>
|
||||
<div>MSRP: <span class="price"><lightning:formattedNumber value="{#v.mixItem.Merchandise__r.Price__c}" style="currency"/></span></div>
|
||||
<div>Qty:
|
||||
<lightning:input type="number" name="qty" label="Qty" value="{#v.mixItem.Qty__c}" step="1"
|
||||
onblur="{!c.qtyChangeHandler}"/>
|
||||
<lightning:buttonIcon iconName="utility:delete" variant="bare" size="medium" class="toggle"
|
||||
onclick="{!c.deleteHandler}"/>
|
||||
</div>
|
||||
</lightning:layoutitem>
|
||||
</lightning:layout>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,55 @@
|
|||
.THIS .slds-input {
|
||||
width: 60px;
|
||||
padding: 6px;
|
||||
height:20px;
|
||||
line-height:18px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.THIS a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.THIS img.product {
|
||||
max-height: 75px;
|
||||
max-width: 75px;
|
||||
}
|
||||
|
||||
.THIS label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.THIS .price,
|
||||
.THIS .title {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.THIS .price {
|
||||
color: #FF6600;
|
||||
}
|
||||
|
||||
.THIS .slds-form-element {
|
||||
display: inline-block;
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
.THIS {
|
||||
border: solid 1px transparent;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.THIS:hover {
|
||||
border-color: rgba(18,127,178,.5);
|
||||
/*
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
||||
transition: all 0.3s cubic-bezier(.25,.8,.25,1);
|
||||
*/
|
||||
}
|
||||
|
||||
.THIS .toggle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.THIS:hover .toggle {
|
||||
display: inline;
|
||||
}
|
|
@ -0,0 +1,28 @@
|
|||
({
|
||||
titleClickHandler: function(component) {
|
||||
var navEvt = $A.get("e.force:navigateToSObject");
|
||||
navEvt.setParams({
|
||||
"recordId": component.get("v.mixItem").Merchandise__c,
|
||||
"slideDevName": "detail"
|
||||
});
|
||||
navEvt.fire();
|
||||
},
|
||||
|
||||
deleteHandler : function(component) {
|
||||
var deleteEvent = component.getEvent("onDelete");
|
||||
deleteEvent.setParam("mixItem", component.get("v.mixItem"));
|
||||
deleteEvent.fire();
|
||||
},
|
||||
|
||||
qtyChangeHandler: function(component, event) {
|
||||
var qty = event.getSource().get('v.value');
|
||||
var mixItem = component.get("v.mixItem");
|
||||
if (qty !== mixItem.Qty__c) {
|
||||
mixItem.Qty__c = parseInt(qty, 10);
|
||||
var changeEvent = component.getEvent("onChange");
|
||||
changeEvent.setParam("mixItem", mixItem);
|
||||
changeEvent.fire();
|
||||
}
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,18 @@
|
|||
<aura:component implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId"
|
||||
access="global">
|
||||
|
||||
<aura:attribute name="recordId" type="Id" />
|
||||
<aura:attribute name="record" type="Object" />
|
||||
<aura:attribute name="steps" type="String[]" default="['Draft', 'Submitted to Manufacturing', 'Approved by Manufacturing', 'Ordered']" />
|
||||
<aura:attribute name="pathName" type="String" />
|
||||
|
||||
<force:recordData aura:id="mixRecord"
|
||||
recordId="{!v.recordId}"
|
||||
targetFields="{!v.record}"
|
||||
fields="['Id', 'Status__c']"
|
||||
mode="EDIT"
|
||||
recordUpdated="{!c.onRecordUpdated}" />
|
||||
|
||||
<c:Path steps="{!v.steps}" currentStep="{!v.record.Status__c}" stepChange="{!c.onStepChange}"/>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,7 @@
|
|||
.THIS {
|
||||
margin: 0 28px;
|
||||
}
|
||||
|
||||
.THIS svg {
|
||||
fill: #FFFFFF;
|
||||
}
|
|
@ -0,0 +1,3 @@
|
|||
<design:component label="Merchandise Mix Path">
|
||||
<design:attribute name="pathName" datasource="Merchandising Mix,Order,Opportunity" label="Path Name" default="Merchandising Mix"/>
|
||||
</design:component>
|
|
@ -0,0 +1,11 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="120px" height="120px" viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>path</title>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="filter" fill-rule="nonzero">
|
||||
<rect id="Rectangle" fill="#6CCDF0" x="0" y="0" width="120" height="120"></rect>
|
||||
<path d="M13,84.7684211 L32.5263158,61.3368421 C33.0842105,60.7789474 33.0842105,59.6631579 32.5263158,58.5473684 L13,36.2315789 L13,35.1157895 C13,34.5578947 13.5578947,34 14.1157895,34 L42.0105263,34 C43.1263158,34 43.6842105,34 43.6842105,34.5578947 L63.7684211,59.1052632 C64.3263158,59.6631579 64.3263158,60.7789474 63.7684211,61.8947368 L44.2421053,85.8842105 C43.6842105,86.4421053 43.1263158,87 42.0105263,87 L14.6736842,87 C13.5578947,87 13,86.4421053 13,85.3263158 L13,84.7684211 L13,84.7684211 Z M55.4,84.7684211 L74.3684211,61.3368421 C74.9263158,60.7789474 74.9263158,59.6631579 74.3684211,58.5473684 L55.4,36.2315789 L55.4,35.1157895 C55.4,34.5578947 55.9578947,34 56.5157895,34 L84.4105263,34 C84.9684211,34 85.5263158,34 86.0842105,34.5578947 L106.168421,59.1052632 C106.726316,59.6631579 106.726316,60.7789474 106.168421,61.8947368 L86.0842105,85.8842105 C86.0842105,86.4421053 84.9684211,87 84.4105263,87 L56.5157895,87 C55.9578947,87 55.4,86.4421053 55.4,85.3263158 L55.4,84.7684211 L55.4,84.7684211 Z" id="Shape" fill="#FFFFFF"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
После Ширина: | Высота: | Размер: 1.5 KiB |
|
@ -0,0 +1,20 @@
|
|||
({
|
||||
onStepChange : function(component, event) {
|
||||
var mix = component.get("v.record");
|
||||
if (mix) {
|
||||
mix.Status__c = event.getParam("step");
|
||||
component.find("mixRecord").saveRecord($A.getCallback(function(saveResult) {
|
||||
//
|
||||
}));
|
||||
}
|
||||
},
|
||||
|
||||
onRecordUpdated : function(component, event) {
|
||||
var changeType = event.getParams().changeType;
|
||||
if (changeType === "CHANGED") {
|
||||
var service = component.find("mixRecord");
|
||||
service.reloadRecord();
|
||||
}
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,25 @@
|
|||
<aura:component >
|
||||
|
||||
<aura:attribute name="page" type="integer"/>
|
||||
<aura:attribute name="pages" type="integer"/>
|
||||
<aura:attribute name="total" type="integer"/>
|
||||
<aura:attribute name="label" type="String" default="items"/>
|
||||
|
||||
<aura:registerEvent name="nextPage" type="c:PaginatorEvent"/>
|
||||
<aura:registerEvent name="previousPage" type="c:PaginatorEvent"/>
|
||||
|
||||
<div class="container">
|
||||
<div class="left">
|
||||
<aura:if isTrue="{!v.page > 1}">
|
||||
<lightning:buttonIcon iconName="utility:left" variant="border-filled" onclick="{!c.previousPage}"/>
|
||||
</aura:if>
|
||||
</div>
|
||||
<div class="centered">{!v.total} {!v.label} • page {!v.page} of {!v.pages}</div>
|
||||
<div class="right">
|
||||
<aura:if isTrue="{!v.page < v.pages}">
|
||||
<lightning:buttonIcon iconName="utility:right" variant="border-filled" onclick="{!c.nextPage}"/>
|
||||
</aura:if>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,27 @@
|
|||
.THIS {
|
||||
margin: 8px;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-webkit-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.THIS .left {
|
||||
|
||||
}
|
||||
|
||||
.THIS .right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.THIS .centered {
|
||||
color: #999999;
|
||||
font-size: 0.9rem;
|
||||
text-align: center;
|
||||
align-self: center;
|
||||
padding: 0 12px;
|
||||
}
|
|
@ -0,0 +1,11 @@
|
|||
({
|
||||
previousPage : function(component) {
|
||||
var paginatorEvent = component.getEvent("previousPage");
|
||||
paginatorEvent.fire();
|
||||
},
|
||||
|
||||
nextPage : function(component) {
|
||||
var paginatorEvent = component.getEvent("nextPage");
|
||||
paginatorEvent.fire();
|
||||
}
|
||||
})
|
|
@ -0,0 +1,2 @@
|
|||
<aura:event type="COMPONENT" description="Event template">
|
||||
</aura:event>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,31 @@
|
|||
<aura:component >
|
||||
|
||||
<aura:attribute name="steps" type="String[]" />
|
||||
<aura:attribute name="currentStep" type="String" />
|
||||
<aura:attribute name="stepIndex" type="Integer" />
|
||||
<aura:attribute name="extraStep" type="String" />
|
||||
|
||||
<aura:handler name="change" value="{!v.steps}" action="{!c.calculateStepIndex}"/>
|
||||
<aura:handler name="change" value="{!v.currentStep}" action="{!c.calculateStepIndex}"/>
|
||||
|
||||
<aura:registerEvent name="stepChange" type="c:PathStepChange"/>
|
||||
|
||||
<div class="slds-grid">
|
||||
<div class="slds-tabs--path" role="application">
|
||||
<ul class="slds-tabs--path__nav" role="tablist">
|
||||
<aura:iteration items="{!v.steps}" var="step" indexVar="index">
|
||||
<li class="{! 'slds-tabs--path__item ' + (index<v.stepIndex ? 'slds-is-complete' : (index==v.stepIndex ? 'slds-is-current' : 'slds-is-incomplete'))}" role="presentation">
|
||||
<a class="slds-tabs--path__link" data-step="{!step}" onclick="{!c.onStepClicked}">
|
||||
<span class="slds-tabs--path__stage">
|
||||
<lightning:icon iconName="utility:check" size="x-small" class="process-icon"/>
|
||||
<span class="slds-assistive-text">Stage Complete</span>
|
||||
</span>
|
||||
<span class="slds-tabs--path__title">{!step}</span>
|
||||
</a>
|
||||
</li>
|
||||
</aura:iteration>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,3 @@
|
|||
.THIS svg {
|
||||
fill: #FFFFFF;
|
||||
}
|
|
@ -0,0 +1,16 @@
|
|||
({
|
||||
calculateStepIndex : function(component) {
|
||||
var steps = component.get("v.steps");
|
||||
var currentStep = component.get("v.currentStep");
|
||||
var stepIndex = steps.indexOf(currentStep);
|
||||
component.set("v.stepIndex", stepIndex);
|
||||
},
|
||||
|
||||
onStepClicked : function(component, event) {
|
||||
var step = event.currentTarget.dataset.step;
|
||||
component.set("v.currentStep", step);
|
||||
var stepChangeEvent = component.getEvent("stepChange");
|
||||
stepChangeEvent.setParam("step", step);
|
||||
stepChangeEvent.fire();
|
||||
}
|
||||
})
|
|
@ -0,0 +1,3 @@
|
|||
<aura:event type="COMPONENT" description="Event template">
|
||||
<aura:attribute name="step" type="String"/>
|
||||
</aura:event>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,22 @@
|
|||
<aura:component implements="flexipage:availableForAllPageTypes" access="global" >
|
||||
|
||||
<ltng:require styles="{!$Resource.nouislider + '/nouislider.css'}"
|
||||
scripts="{!$Resource.nouislider + '/nouislider.js'}"
|
||||
afterScriptsLoaded="{!c.jsLoaded}" />
|
||||
|
||||
<aura:registerEvent name="onchange" type="c:RangeChange"/>
|
||||
|
||||
<aura:attribute name="label" type="String" default="Price Range:"/>
|
||||
<aura:attribute name="filterName" type="String"/>
|
||||
<aura:attribute name="min" type="String" default="0"/>
|
||||
<aura:attribute name="max" type="String" default="1000"/>
|
||||
<aura:attribute name="step" type="String" default="10"/>
|
||||
|
||||
<lightning:layout >
|
||||
<lightning:layoutItem >{!v.field} Range:</lightning:layoutItem>
|
||||
<lightning:layoutItem >
|
||||
<div aura:id="slider" class="slider"/>
|
||||
</lightning:layoutItem>
|
||||
</lightning:layout>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,66 @@
|
|||
.THIS {
|
||||
height: 36px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
/*margin-left: -28px;*/
|
||||
margin-top: 46px;
|
||||
}
|
||||
|
||||
.THIS .label {
|
||||
position: absolute;
|
||||
top: 64px;
|
||||
left: 44px;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
max-width: 350px;
|
||||
}
|
||||
|
||||
.THIS .slider {
|
||||
/*
|
||||
position: absolute;
|
||||
top: 42px;
|
||||
left: 44px;
|
||||
right: 0;
|
||||
*/
|
||||
width: 270px;
|
||||
margin-left: 28px;
|
||||
}
|
||||
|
||||
.THIS .noUi-connect {
|
||||
/*background: #0070D2;*/
|
||||
/*background: #0070D2;*/
|
||||
background: #FF6600;
|
||||
|
||||
}
|
||||
|
||||
.THIS .noUi-tooltip {
|
||||
font-size: .8125rem;
|
||||
border: none;
|
||||
color: #FF6600;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.THIS .noUi-target,
|
||||
.THIS .noUi-handle {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.THIS .noUi-target {
|
||||
background: #FFFFFF;
|
||||
/*border: 1px solid rgb(216, 221, 230);*/
|
||||
border: 1px solid #FF6600;
|
||||
border-radius: .25rem;
|
||||
}
|
||||
/*
|
||||
.THIS .noUi-horizontal {
|
||||
height: 6px;
|
||||
border: 1px solid #EEE;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.THIS .noUi-horizontal .noUi-handle {
|
||||
height: 26px;
|
||||
left: -18px;
|
||||
top: -11px;
|
||||
}
|
||||
*/
|
|
@ -0,0 +1,3 @@
|
|||
<design:component >
|
||||
<design:attribute name="filterName" datasource="MSRP" label="Filter" default="MSRP"/>
|
||||
</design:component>
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="86px" height="86px" viewBox="0 0 86 86" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Generator: Sketch 45 (43475) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>Group</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="Group">
|
||||
<rect id="Rectangle" fill="#6CCDF0" x="0" y="0" width="86" height="86" rx="8"></rect>
|
||||
<g id="Group-2" transform="translate(10.000000, 31.000000)" fill="#FFFFFF">
|
||||
<rect id="Rectangle-2" x="0" y="7" width="66" height="10" rx="2"></rect>
|
||||
<rect id="Rectangle-3" x="10" y="0" width="8" height="24" rx="2"></rect>
|
||||
<rect id="Rectangle-3" x="47" y="0" width="8" height="24" rx="2"></rect>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
После Ширина: | Высота: | Размер: 950 B |
|
@ -0,0 +1,37 @@
|
|||
({
|
||||
jsLoaded: function(component, event, helper) {
|
||||
var min = parseInt(component.get("v.min"), 10);
|
||||
var max = parseInt(component.get("v.max"), 10);
|
||||
var step = parseInt(component.get("v.step"), 10);
|
||||
|
||||
var slider = component.find('slider').getElement();
|
||||
noUiSlider.create(slider, {
|
||||
start: [min, max],
|
||||
connect: true,
|
||||
tooltips: true,
|
||||
step: step,
|
||||
format: {
|
||||
to: function (value ) {
|
||||
return '$' + Math.round(value);
|
||||
},
|
||||
from: function ( value ) {
|
||||
return value;
|
||||
}
|
||||
},
|
||||
range: {
|
||||
'min': min,
|
||||
'max': max
|
||||
}
|
||||
});
|
||||
|
||||
slider.noUiSlider.on('change', $A.getCallback(function(range) {
|
||||
var myEvent = $A.get("e.c:RangeChange");
|
||||
myEvent.setParams({
|
||||
"filterName": component.get("v.filterName"),
|
||||
"minValue": range[0].replace('$', ''),
|
||||
"maxValue": range[1].replace('$', '')
|
||||
});
|
||||
myEvent.fire();
|
||||
}));
|
||||
}
|
||||
})
|
|
@ -0,0 +1,5 @@
|
|||
<aura:event type="APPLICATION">
|
||||
<aura:attribute name="filterName" type="String"/>
|
||||
<aura:attribute name="minValue" type="Decimal"/>
|
||||
<aura:attribute name="maxValue" type="Decimal"/>
|
||||
</aura:event>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,12 @@
|
|||
<aura:component access="global">
|
||||
|
||||
<aura:registerEvent name="onchange" type="c:ValueChange" />
|
||||
|
||||
<div class="slds-form-element">
|
||||
<label class="slds-form-element__label" for="input-unique-id">Search</label>
|
||||
<div class="slds-form-element__control">
|
||||
<input type="text" aura:id="searchKey" class="slds-input" onkeyup="{!c.keyupHandler}" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,2 @@
|
|||
.THIS {
|
||||
}
|
|
@ -0,0 +1,19 @@
|
|||
({
|
||||
keyupHandler : function(component, event) {
|
||||
var changeEvent = component.getEvent("onchange");
|
||||
changeEvent.setParams({
|
||||
"value": event.target.value
|
||||
});
|
||||
changeEvent.fire();
|
||||
},
|
||||
|
||||
clearHandler : function(component) {
|
||||
component.find("searchInput").getElement().value = "";
|
||||
var changeEvent = component.getEvent("onchange");
|
||||
changeEvent.setParams({
|
||||
"value": ""
|
||||
});
|
||||
changeEvent.fire();
|
||||
}
|
||||
|
||||
})
|
|
@ -0,0 +1,6 @@
|
|||
<aura:component access="global">
|
||||
|
||||
<lightning:select name="subCategorySelector" label="Subcategory">
|
||||
</lightning:select>
|
||||
|
||||
</aura:component>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,3 @@
|
|||
<aura:event type="APPLICATION" description="Event template">
|
||||
<aura:attribute name="value" type="Object"/>
|
||||
</aura:event>
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<description>A Lightning Component Bundle</description>
|
||||
</AuraDefinitionBundle>
|
|
@ -0,0 +1,67 @@
|
|||
global with sharing class MerchandiseController {
|
||||
|
||||
@AuraEnabled
|
||||
public static List<String> getCategories() {
|
||||
Schema.DescribeFieldResult result = Merchandise__c.Category__c.getDescribe();
|
||||
List<Schema.PicklistEntry> entries = result.getPicklistValues();
|
||||
List<String> values = new list <String>();
|
||||
for (Schema.PicklistEntry entry: entries) {
|
||||
values.add(entry.getValue());
|
||||
}
|
||||
return values;
|
||||
}
|
||||
|
||||
public class PagedResult {
|
||||
|
||||
@AuraEnabled
|
||||
public Integer pageSize { get;set; }
|
||||
|
||||
@AuraEnabled
|
||||
public Integer page { get;set; }
|
||||
|
||||
@AuraEnabled
|
||||
public Integer total { get;set; }
|
||||
|
||||
@AuraEnabled
|
||||
public List<Merchandise__c> items { get;set; }
|
||||
|
||||
}
|
||||
|
||||
public class Filter {
|
||||
|
||||
@AuraEnabled
|
||||
public String searchKey { get;set; }
|
||||
|
||||
@AuraEnabled
|
||||
public String category { get;set; }
|
||||
|
||||
@AuraEnabled
|
||||
public Decimal minPrice { get;set; }
|
||||
|
||||
@AuraEnabled
|
||||
public Decimal maxPrice { get;set; }
|
||||
|
||||
}
|
||||
|
||||
@AuraEnabled
|
||||
public static PagedResult getMerchandise(String filters, Decimal pageSize, Decimal pageNumber) {
|
||||
Filter filter = (Filter) JSON.deserializeStrict(filters, MerchandiseController.Filter.class);
|
||||
Integer pSize = (Integer)pageSize;
|
||||
String key = '%' + filter.searchKey + '%';
|
||||
Integer offset = ((Integer)pageNumber - 1) * pSize;
|
||||
PagedResult r = new PagedResult();
|
||||
r.pageSize = pSize;
|
||||
r.page = (Integer) pageNumber;
|
||||
r.total = [SELECT count() FROM Merchandise__c
|
||||
WHERE name LIKE :key
|
||||
AND Category__c like : (filter.category == '' ? '%' : filter.category)
|
||||
AND Price__c >= :filter.minPrice AND Price__c <= :filter.maxPrice];
|
||||
r.items = [SELECT id, Name, Description__c, Price__c, Category__c, Picture_URL__c FROM Merchandise__c
|
||||
WHERE Name LIKE :key
|
||||
AND Category__c like : (filter.category == '' ? '%' : filter.category)
|
||||
AND Price__c >= :filter.minPrice AND Price__c <= :filter.maxPrice
|
||||
LIMIT :pSize OFFSET :offset];
|
||||
return r;
|
||||
}
|
||||
|
||||
}
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<ApexClass xmlns="urn:metadata.tooling.soap.sforce.com" fqn="MerchandiseController">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<status>Active</status>
|
||||
</ApexClass>
|
|
@ -0,0 +1,34 @@
|
|||
global with sharing class MerchandiseMixController {
|
||||
|
||||
@AuraEnabled
|
||||
public static List<Mix_Item__c> getMixItems(Id mixId) {
|
||||
return [SELECT Id, Merchandise__r.Name, Merchandise__r.Price__c, Merchandise__r.Category__c, Merchandise__r.Picture_URL__c, Qty__c
|
||||
FROM Mix_Item__c
|
||||
WHERE Merchandising_Mix__c = :mixId];
|
||||
}
|
||||
|
||||
@AuraEnabled
|
||||
public static Mix_Item__c addMixItem(Id mixId, Id productId, Decimal qty) {
|
||||
Mix_Item__c item = new Mix_Item__c();
|
||||
item.Merchandising_Mix__c = mixId;
|
||||
item.Merchandise__c = productId;
|
||||
item.Qty__c = 10;
|
||||
insert item;
|
||||
return item;
|
||||
}
|
||||
|
||||
@AuraEnabled
|
||||
public static Mix_Item__c updateMixItem(Mix_Item__c mixItem) {
|
||||
update mixItem;
|
||||
return mixItem;
|
||||
}
|
||||
|
||||
@AuraEnabled
|
||||
public static Mix_Item__c removeMixItem(Id mixItemId) {
|
||||
Mix_Item__c item = new Mix_Item__c();
|
||||
item.Id = mixItemId;
|
||||
delete item;
|
||||
return item;
|
||||
}
|
||||
|
||||
}
|
|
@ -0,0 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<ApexClass xmlns="urn:metadata.tooling.soap.sforce.com" fqn="MerchandiseMixController">
|
||||
<apiVersion>40.0</apiVersion>
|
||||
<status>Active</status>
|
||||
</ApexClass>
|
После Ширина: | Высота: | Размер: 97 KiB |
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<ContentAsset xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<language>en_US</language>
|
||||
<masterLabel>nto_logo</masterLabel>
|
||||
<relationships>
|
||||
<organization>
|
||||
<access>VIEWER</access>
|
||||
</organization>
|
||||
</relationships>
|
||||
<versions>
|
||||
<version>
|
||||
<number>1</number>
|
||||
<pathOnClient>nto_logo.png</pathOnClient>
|
||||
</version>
|
||||
</versions>
|
||||
</ContentAsset>
|
|
@ -0,0 +1,85 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<FlexiPage xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentName>force:highlightsPanel</componentName>
|
||||
</componentInstances>
|
||||
<mode>Replace</mode>
|
||||
<name>header</name>
|
||||
<type>Region</type>
|
||||
</flexiPageRegions>
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentName>force:relatedListContainer</componentName>
|
||||
</componentInstances>
|
||||
<mode>Replace</mode>
|
||||
<name>relatedTabContent</name>
|
||||
<type>Facet</type>
|
||||
</flexiPageRegions>
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentName>force:detailPanel</componentName>
|
||||
</componentInstances>
|
||||
<mode>Replace</mode>
|
||||
<name>detailTabContent</name>
|
||||
<type>Facet</type>
|
||||
</flexiPageRegions>
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>body</name>
|
||||
<value>relatedTabContent</value>
|
||||
</componentInstanceProperties>
|
||||
<componentInstanceProperties>
|
||||
<name>title</name>
|
||||
<value>Standard.Tab.relatedLists</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>flexipage:tab</componentName>
|
||||
</componentInstances>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>active</name>
|
||||
<value>true</value>
|
||||
</componentInstanceProperties>
|
||||
<componentInstanceProperties>
|
||||
<name>body</name>
|
||||
<value>detailTabContent</value>
|
||||
</componentInstanceProperties>
|
||||
<componentInstanceProperties>
|
||||
<name>title</name>
|
||||
<value>Standard.Tab.detail</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>flexipage:tab</componentName>
|
||||
</componentInstances>
|
||||
<mode>Replace</mode>
|
||||
<name>maintabs</name>
|
||||
<type>Facet</type>
|
||||
</flexiPageRegions>
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>tabs</name>
|
||||
<value>maintabs</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>flexipage:tabset</componentName>
|
||||
</componentInstances>
|
||||
<mode>Replace</mode>
|
||||
<name>main</name>
|
||||
<type>Region</type>
|
||||
</flexiPageRegions>
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentName>MerchandisePicture</componentName>
|
||||
</componentInstances>
|
||||
<mode>Replace</mode>
|
||||
<name>sidebar</name>
|
||||
<type>Region</type>
|
||||
</flexiPageRegions>
|
||||
<masterLabel>Merchandise Record Page</masterLabel>
|
||||
<parentFlexiPage>flexipage__default_rec_L</parentFlexiPage>
|
||||
<sobjectType>Merchandise__c</sobjectType>
|
||||
<template>
|
||||
<name>flexipage:recordHomeTemplateDesktop</name>
|
||||
</template>
|
||||
<type>RecordPage</type>
|
||||
</FlexiPage>
|
|
@ -0,0 +1,82 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<FlexiPage xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>collapsed</name>
|
||||
<value>false</value>
|
||||
</componentInstanceProperties>
|
||||
<componentInstanceProperties>
|
||||
<name>numVisibleActions</name>
|
||||
<value>3</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>force:highlightsPanel</componentName>
|
||||
</componentInstances>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>pathName</name>
|
||||
<value>Merchandising Mix</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>MixPath</componentName>
|
||||
</componentInstances>
|
||||
<mode>Replace</mode>
|
||||
<name>header</name>
|
||||
<type>Region</type>
|
||||
</flexiPageRegions>
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentName>force:detailPanel</componentName>
|
||||
</componentInstances>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>showChart</name>
|
||||
<value>true</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>MerchandiseMix</componentName>
|
||||
</componentInstances>
|
||||
<mode>Replace</mode>
|
||||
<name>main</name>
|
||||
<type>Region</type>
|
||||
</flexiPageRegions>
|
||||
<flexiPageRegions>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>showCategory</name>
|
||||
<value>true</value>
|
||||
</componentInstanceProperties>
|
||||
<componentInstanceProperties>
|
||||
<name>showSearch</name>
|
||||
<value>true</value>
|
||||
</componentInstanceProperties>
|
||||
<componentInstanceProperties>
|
||||
<name>showSubcategory</name>
|
||||
<value>false</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>MerchandiseFilter</componentName>
|
||||
</componentInstances>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>filterName</name>
|
||||
<value>MSRP</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>Range</componentName>
|
||||
</componentInstances>
|
||||
<componentInstances>
|
||||
<componentInstanceProperties>
|
||||
<name>pageSize</name>
|
||||
<value>8</value>
|
||||
</componentInstanceProperties>
|
||||
<componentName>MerchandiseList</componentName>
|
||||
</componentInstances>
|
||||
<mode>Replace</mode>
|
||||
<name>sidebar</name>
|
||||
<type>Region</type>
|
||||
</flexiPageRegions>
|
||||
<masterLabel>Merchandising Mix Record Page</masterLabel>
|
||||
<parentFlexiPage>flexipage__default_rec_L</parentFlexiPage>
|
||||
<sobjectType>Merchandising_Mix__c</sobjectType>
|
||||
<template>
|
||||
<name>flexipage:recordHomeTemplateDesktop</name>
|
||||
</template>
|
||||
<type>RecordPage</type>
|
||||
</FlexiPage>
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<FlexiPage xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<flexiPageRegions>
|
||||
<name>utilityItems</name>
|
||||
<type>Region</type>
|
||||
</flexiPageRegions>
|
||||
<masterLabel>Northern Trail UtilityBar</masterLabel>
|
||||
<template>
|
||||
<name>one:utilityBarTemplateDesktop</name>
|
||||
</template>
|
||||
<type>UtilityBar</type>
|
||||
</FlexiPage>
|
|
@ -0,0 +1,4 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<FlowDefinition xmlns="http://soap.sforce.com/2006/04/metadata">
|
||||
<activeVersionNumber>3</activeVersionNumber>
|
||||
</FlowDefinition>
|