@icvdeveloper/common-module 1.4.13 → 2.0.0

package/dist/runtime/components/affiliates/AffiliateModal.vue

@@ -0,0 +1,66 @@
+<script lang="ts" setup>
+import { refs, toRefs, computed } from "vue";
+import { storeToRefs } from "pinia";
+import { useTemplateConfigsStore } from "../../store/templateConfigs";
+import type { Affiliate } from "../../models/conference";
+import ModalButton from "../core/ModalButton.vue";
+
+type Props = {
+  affiliate: Affiliate;
+  buttonStyle?: string;
+};
+
+const props = withDefaults(defineProps<Props>(), {
+  buttonStyle: "button",
+});
+
+const { affiliate, buttonStyle } = toRefs(props);
+
+const { globalConfigValue } = storeToRefs(useTemplateConfigsStore());
+
+// computed
+const viewButtonText = computed(() => {
+  return globalConfigValue.value("affiliate_page_button_alias", "View Details");
+});
+</script>
+
+<template>
+  <ModalButton
+    :close-on-click="false"
+    modal-size="xl"
+  >
+    <template #body>
+      <CommonAffiliatePage :affiliate-id="affiliate.id" />
+    </template>
+    <template #button>
+      <div
+        v-if="buttonStyle == 'button'"
+        class="mt-3"
+      >
+        <button class="btn">
+          {{ viewButtonText }}
+        </button>
+      </div>
+      <div
+        v-if="buttonStyle == 'logo'"
+        class="mt-1 presenter-icon cursor-pointer flex justify-center"
+      >
+        <img
+          v-if="affiliate.photo"
+          :src="affiliate.photo"
+          class="max-w-sm w-4/5 lg:w-full px-2"
+        >
+      </div>
+      <div
+        v-if="buttonStyle == 'text'"
+        class="mt-1 cursor-pointer h-full flex"
+      >
+        <h2 class="pb-2 font-light mx-auto flex-1 self-center">
+          {{ affiliate.name }}
+        </h2>
+      </div>
+    </template>
+  </ModalButton>
+</template>
+
+<style></style>