<script setup>
const props = defineProps({
  params: Object
})
</script>

<template>
  <div >
<!--    <img v-if="props.params.data.orderSourceId === 1000000" src="/assets/marketplaces/phone.svg">-->
<!--    <img class="smalllogo2" v-if="props.params.data.orderSourceId === 1000001" src="/assets/marketplaces/ebay.svg">-->
<!--    <img class="smalllogo2" v-if="props.params.data.orderSourceId === 1000002" src="/assets/marketplaces/amazon.svg">-->
<!--    <img v-if="props.params.data.orderSourceId === 1000003" src="/assets/marketplaces/person.svg">-->
<!--    <img class="smalllogo3" v-if="props.params.data.orderSourceId === 1000004" src="/assets/marketplaces/shopware.svg">-->

<!--    <img v-if="!props.params.data.marketplaceKey" src="/assets/marketplaces/phone.svg">-->
    <img class="smalllogo2" v-if="props.params.data.marketplaceKey === 'ebay'" src="/assets/marketplaces-short/ebay.svg">
    <img class="smalllogo2" v-if="props.params.data.marketplaceKey === 'amazon'" src="/assets/marketplaces-short/amazon_icon.png">
    <img class="smalllogo3" v-if="props.params.data.marketplaceKey === 'shopware6'" src="/assets/marketplaces-short/shopware.png">
    <img class="smalllogo3" v-if="props.params.data.marketplaceKey === 'shopify'" src="/assets/marketplaces-short/shopify.png">
    <img class="phone" v-if="props.params.data.marketplaceKey === 'telefon'" src="/assets/marketplaces-short/phone.svg">
    <img class="smalllogo3" v-if="props.params.data.marketplaceKey === 'xentral'" src="/assets/marketplaces-short/xentral_logo.png">
    <img class="smalllogo3" v-if="props.params.data.marketplaceKey === 'plenty'" src="/assets/marketplaces-short/plentyone_logo.png">
    <span alt="Unkown Order-Source" class="unkownlogo" v-if="!props.params.data.marketplaceKey">?</span>

<!--    {{props.params.data.marketplaceKey}}-->
  </div>
</template>

<style>
.smalllogo2,
.smalllogo3 {
  padding-top: 8px;
  transform: scale(1.5);
}

.phone {
  transform: scale(0.7);
}

</style>