modal-upload-card-comp.vue
2.34 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<template>
<div class="comp" :class="{'hide' : !visible }">
<div @click="onOverLayHandler()" class="overlay" v-if="overlayShow"></div>
<div class="modal">
<div class="modal-title">
{{$t('form.modalUploadCard.tit')}}
<img @click="onCloseHandler()" class="close-btn pointer" :src="require('@assets/images/common/icon-modal-simple-close.png')">
</div>
<div class="modal-content" v-if="showType == 'owner' || showType == 'both'">
<div class="gird-g upload">
<div class="pure-u-1 pure-u-md-1-2 upload-item">
<div class="tit"> {{$t('policyChangeInformation.owner')}} {{$t('form.modalUploadCard.front')}}</div>
<img class="poster pointer" :src="ownerFrontPicSrc || require('@assets/images/common/card-front.png')" alt="" @click="handlePicSelect('ownerFront')">
</div>
<div class="pure-u-1 pure-u-md-1-2 upload-item">
<div class="tit"> {{$t('policyChangeInformation.owner')}} {{$t('form.modalUploadCard.back')}}</div>
<img class="poster pointer" :src="ownerBackPicSrc || require('@assets/images/common/card-back.png')" alt="" @click="handlePicSelect('ownerBack')">
</div>
</div>
</div>
<div class="modal-content" v-if="showType == 'insured' || showType == 'both'">
<div class="gird-g upload">
<div class="pure-u-1 pure-u-md-1-2 upload-item">
<div class="tit"> {{$t('policyChangeInformation.insured')}} {{$t('form.modalUploadCard.front')}}</div>
<img class="poster pointer" :src="insuredFrontPicSrc || require('@assets/images/common/card-front.png')" alt="" @click="handlePicSelect('insuredFront')">
</div>
<div class="pure-u-1 pure-u-md-1-2 upload-item">
<div class="tit"> {{$t('policyChangeInformation.insured')}} {{$t('form.modalUploadCard.back')}}</div>
<img class="poster pointer" :src="insuredBackPicSrc || require('@assets/images/common/card-back.png')" alt="" @click="handlePicSelect('insuredBack')">
</div>
</div>
</div>
<div class="modal-btn-wrap">
<div @click="onCancelHandler()" v-if="showCancel" class="btn">{{ $t("common.Confirm") }}</div>
<div @click="onConfirmHandler()" v-if="showConfirm" class="btn" :class="{disabled: submitBtnDisabled}">{{$t("common.Confirm")}}</div>
</div>
</div>
</div>
</template>
<script src="./modal-upload-card-comp.js"></script>
<style lang="scss" scoped>
@import "./modal-upload-card-comp.scss";
</style>