Emit multiple event from child to parent Vue.js

Question

I have a list item, which it can emit 2 events to its parent. The first event works well. But the second one doesn't. The parent component cannot listen to it.

Parent

<review-product-list 
  @showModal="showModalById" 
  @showReportModal="reportModal" 
  lass="grid grid-cols-1 gap-3" 
  :product="product" 
  :reviews="reviews" 
/>

    showModalById(imageId) {
        var index = this.reviewImages
            .map(function (e) {
                return e.id;
            })
            .indexOf(imageId);

        this.indexImage = index;
        this.$modal.show("review-modal");
    },
    reportModal(review_id) {
        this.formReport.review_id = review_id;
        this.$modal.show("report-modal");
    },

Child it works

 <div 
  @click="$emit('showModal', imageId)"
  class="cursor-pointer col-span-12 lg:col-span-3 pb-3 mb-3 lg:pb-0 lg:mb-0 md:border-b lg:border-b-0 lg:border-r border-grey-40 lg:pr-20"
>

it doesn't

<span 
  class="inline-block bg-grey-20 rounded-sm px-3 py-2 text-xs font-medium text-grey-60 cursor-pointer" 
  v-on:click="$emit('showReportModal', review.id)"> 
  Laporkan
</span>