resaults table redesign

This commit is contained in:
2024-01-10 19:06:19 +01:00
parent 64c0b726ea
commit 416ce7964d

View File

@@ -95,7 +95,7 @@ const hrates = ref([
// { "country": "AT", "code": "50161321", "url": "https://www.ikea.com/at/de/p/hol-aufbewahrungstisch-akazie-50161321/", "name": "HOL", "typeName": "Aufbewahrungstisch", "mainImageUrl": "https://www.ikea.com/at/de/images/products/hol-aufbewahrungstisch-akazie__0104310_pe251255_s5.jpg", "itemNoGlobal": "50161321", "salesPrice": "80.99", "tag": "FAMILY_PRICE", "last_mod": "2023-12-03 16:44:24" }, // { "country": "AT", "code": "50161321", "url": "https://www.ikea.com/at/de/p/hol-aufbewahrungstisch-akazie-50161321/", "name": "HOL", "typeName": "Aufbewahrungstisch", "mainImageUrl": "https://www.ikea.com/at/de/images/products/hol-aufbewahrungstisch-akazie__0104310_pe251255_s5.jpg", "itemNoGlobal": "50161321", "salesPrice": "80.99", "tag": "FAMILY_PRICE", "last_mod": "2023-12-03 16:44:24" },
const hproducts = ref([ const hproducts = ref([
{ text: "Country", value: "countryName", sortable: true }, { text: "Country", value: "countryName", sortable: true },
{ text: "Name", value: "name", sortable: true }, // { text: "Name", value: "name", sortable: true },
{ text: "Local Price", value: "salesPrice", sortable: true }, { text: "Local Price", value: "salesPrice", sortable: true },
{ text: "Cur", value: "currency", sortable: false}, { text: "Cur", value: "currency", sortable: false},
{ text: "Rate", value: "rate" }, { text: "Rate", value: "rate" },
@@ -112,7 +112,7 @@ const hresults = ref([
]) ])
const rates = ref([]); const rates = ref([]);
const options_items = ref([]); const options_items = ref([]);
const selected_item = ref(null); const itemCode = ref(null);
const options = { const options = {
region: 150, region: 150,
@@ -261,7 +261,7 @@ onMounted(fetch_ccodes);
const showRow = async (item) => { const showRow = async (item) => {
console.log('ITEM=', item); console.log('ITEM=', item);
console.log('FORM=', form); console.log('FORM=', form);
itemCode.value = item.code;
try { try {
const response = await axios.post(route('products.compare'), { codes: item.code, countries: form.countries, currency: form.currency }) const response = await axios.post(route('products.compare'), { codes: item.code, countries: form.countries, currency: form.currency })
@@ -318,12 +318,12 @@ const submit = () => {
:searchable="true" :options="currency" @select="onSelectCurrency" /> :searchable="true" :options="currency" @select="onSelectCurrency" />
</div> </div>
<div class="flex flex-col start-0"> <div class="flex flex-col start-0">
<span class="font-extrabold font-mono">Results</span> <span class="font-extrabold font-mono">Results <b v-if="itemCode">for {{ itemCode }}</b> </span>
</div> </div>
<div> <div>
<EasyTable :rows-per-page=15 :headers="hproducts" :items="tproducts" alternating> <EasyTable :rows-per-page=25 :headers="hproducts" :items="tproducts" alternating>
<template #item-name="{ name, url }"> <template #item-countryName="{ countryName, url }">
<a class="underline" target="_blank" :href="url">{{ name }}</a> <a class="underline" target="_blank" :href="url">{{ countryName }}</a>
</template> </template>
</EasyTable> </EasyTable>
</div> </div>