feat: clickable WooCommerce product links in mapping UI

Product names in the mapped table are now links that open the WC product
page in a new tab. Added woo_permalink field, stored during fetch,
returned by search endpoint.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
gsinghpal
2026-03-31 23:06:27 -04:00
parent 0e84b97c89
commit b1e4ed5ec8
5 changed files with 32 additions and 1 deletions

View File

@@ -587,6 +587,24 @@ html[style*="color-scheme: dark"] {
color: var(--woo-accent);
background: var(--woo-bg-hover);
}
/* Product link to WooCommerce */
.woo-product-link {
color: var(--woo-accent);
text-decoration: none;
transition: color 0.15s;
}
.woo-product-link:hover {
color: var(--woo-accent-hover);
text-decoration: underline;
}
.woo-external-icon {
font-size: 0.7rem;
opacity: 0.5;
}
.woo-product-link:hover .woo-external-icon {
opacity: 1;
}
.woo-price-sync-col {
width: 60px;
white-space: nowrap;

View File

@@ -156,7 +156,15 @@
t-att-checked="isMappedSelected(p.id)"
t-on-change="() => this.toggleSelectMapped(p.id)"/>
</td>
<td><t t-esc="p.woo_product_name"/></td>
<td>
<t t-if="p.woo_permalink">
<a t-att-href="p.woo_permalink" target="_blank" class="woo-product-link">
<t t-esc="p.woo_product_name"/>
<i class="fa fa-external-link ms-1 woo-external-icon"/>
</a>
</t>
<t t-else=""><t t-esc="p.woo_product_name"/></t>
</td>
<td><span class="woo-code"><t t-esc="p.woo_sku"/></span></td>
<td><t t-esc="p.odoo_product_name"/></td>
<td class="text-end" t-esc="this.formatPrice(p.woo_price)"/>