108 lines
7.3 KiB
HTML
108 lines
7.3 KiB
HTML
<template>
|
|
<div class="slds-box dd-card">
|
|
<!-- OBJECT NAME BARS -->
|
|
<lightning-layout multiple-rows="true" class="dd-header-wrap">
|
|
<lightning-layout-item size=12 onclick={handleClick} class="objectContainer dd-header-row">
|
|
<!-- Object icon (was 2-letter initials). Same brand SVGs as the
|
|
Field Mapping / Object Setup pages; stroke="currentColor"
|
|
picks up .dd-avatar's white colour over its gradient. -->
|
|
<span class="dd-avatar">
|
|
<template lwc:if={isProductIcon}>
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M21 16V8a2 2 0 0 0-1-1.7l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.7l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path>
|
|
<path d="M3.3 7L12 12l8.7-5M12 22V12"></path>
|
|
</svg>
|
|
</template>
|
|
<template lwc:elseif={isCustomerIcon}>
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
|
|
<circle cx="12" cy="7" r="4"></circle>
|
|
</svg>
|
|
</template>
|
|
<template lwc:elseif={isCollectionIcon}>
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M12 2l9 5-9 5-9-5 9-5z"></path>
|
|
<path d="M3 12l9 5 9-5M3 17l9 5 9-5"></path>
|
|
</svg>
|
|
</template>
|
|
<template lwc:elseif={isOrderIcon}>
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round">
|
|
<circle cx="9" cy="21" r="1"></circle>
|
|
<circle cx="20" cy="21" r="1"></circle>
|
|
<path d="M1 1h4l2.7 13.4a2 2 0 0 0 2 1.6h9.7a2 2 0 0 0 2-1.6L23 6H6"></path>
|
|
</svg>
|
|
</template>
|
|
<template lwc:elseif={isDraftOrderIcon}>
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
|
|
<path d="M14 2v6h6M16 13H8M16 17H8M10 9H8"></path>
|
|
</svg>
|
|
</template>
|
|
<template lwc:elseif={isLocationIcon}>
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M21 10c0 6-9 12-9 12s-9-6-9-12a9 9 0 0 1 18 0z"></path>
|
|
<circle cx="12" cy="10" r="3"></circle>
|
|
</svg>
|
|
</template>
|
|
<!-- Fallback: keep the initials if the object is not one of the six -->
|
|
<template lwc:else>{objectInitials}</template>
|
|
</span>
|
|
<span class="dd-object-name">{objectName}</span>
|
|
<span class="dd-count-pill">{recordCount}</span>
|
|
<span class="dd-chevron-wrap">
|
|
<lightning-icon icon-name="utility:chevronup" size="xx-small" class="change iconColor" lwc:if={showDetail}></lightning-icon>
|
|
<lightning-icon icon-name="utility:chevrondown" class="iconColor" size="xx-small" lwc:else></lightning-icon>
|
|
</span>
|
|
</lightning-layout-item>
|
|
|
|
<!-- SHOW OBJECT'S DETAIL-->
|
|
<lightning-layout-item size=12 lwc:if={showDetail} class="slds-m-bottom_small text-color textClass slds-m-top_small">
|
|
<template lwc:if={errorMessage}>
|
|
<lightning-layout style="word-wrap: break-word;" class="tabs">
|
|
<lightning-layout-item size="3" class="slds-m-vertical_xx-small dd-col-header">
|
|
<span class="dd-col-label">Shopify Id</span>
|
|
</lightning-layout-item>
|
|
<lightning-layout-item size="1" class="slds-m-vertical_xx-small dd-col-header">
|
|
<span class="dd-col-label">{column3}</span>
|
|
</lightning-layout-item>
|
|
<lightning-layout-item size="3" class="slds-m-vertical_xx-small dd-col-header">
|
|
<span class="dd-col-label">{column4}</span>
|
|
</lightning-layout-item>
|
|
<lightning-layout-item size="3" class="slds-m-vertical_xx-small dd-col-header">
|
|
<span class="dd-col-label">{column5}</span>
|
|
</lightning-layout-item>
|
|
<lightning-layout-item size="2" class="dd-json-header-col">
|
|
<span class="dd-col-label">JSON</span>
|
|
</lightning-layout-item>
|
|
</lightning-layout>
|
|
|
|
<template for:each={objectList} for:item="obj" for:index="index">
|
|
<lightning-layout key={obj.srNumber} data-index={index} style="word-wrap: break-word;background-color: #f5f5f5;" class="list">
|
|
<lightning-layout-item size="3" class="slds-m-vertical_xx-small dd-col-shopifyid">
|
|
{obj.shopifyId}
|
|
</lightning-layout-item>
|
|
<lightning-layout-item size="1" class="slds-m-vertical_xx-small dd-col-title">
|
|
{obj.column3}
|
|
</lightning-layout-item>
|
|
<lightning-layout-item size="3" class="slds-m-vertical_xx-small dd-col-date">
|
|
{obj.column4}
|
|
</lightning-layout-item>
|
|
<lightning-layout-item size="3" class="slds-m-vertical_xx-small dd-col-date">
|
|
{obj.column5}
|
|
</lightning-layout-item>
|
|
<lightning-layout-item size="2" class="dd-json-btn-col">
|
|
<!-- <lightning-button variant="success" label="JSON" style="float: left;" value={obj.jsonBody} onclick={jsonClick}></lightning-button> -->
|
|
<button class="dd-json-btn" value={obj.jsonBody} onclick={jsonClick}>JSON</button>
|
|
</lightning-layout-item>
|
|
|
|
</lightning-layout>
|
|
|
|
</template>
|
|
</template>
|
|
<template lwc:else>
|
|
<div class="slds-p-left_small" style="color: red;">{label.No_records_to_display}</div>
|
|
</template>
|
|
</lightning-layout-item>
|
|
</lightning-layout>
|
|
</div>
|
|
</template> |