<template>
  <view 
    class="d-flex flex-row justify-between shadow-s radius-base mt-3 p-2 pt-3 pb-3"
    @click="$emit('click')"
  >
    <view class="d-flex flex-row">
      <image class="width-100 height-100 radius-base" :src="image" mode="aspectFill" />
      <view class="d-flex flex-col ml-3 flex-one">
        <text class="color-primary">{{ title }}</text>
        <text class="color-second mt-2">{{ desc }}</text>
      </view>
    </view>
    <text class="color-primary-second-text size-ss">{{ right }}</text>
  </view>
</template>

<script setup lang="ts">
defineProps({
  title: String,
  desc: String,
  right: String,
  image: String,
})
</script>