<template>
  <el-dialog
    :visible.sync="visible"
    :append-to-body="false"
    :modal="false"
    title="原图预览"
    top="5vh"
    width="60%"
    @close="closeDialog"
    v-if="visible">
    <el-form
      :model="dataForm"
      size="small">
      <el-row>
        <el-col :span="12">
          <el-form-item label="正面原图">
            <el-image
              style="width: 421px; height: 645px"
              :src="dataForm.frontOrgPic.indexOf('https://') !== -1? dataForm.frontOrgPic : resourcesUrl + dataForm.frontOrgPic"
              v-if="dataForm.frontOrgPic"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="背面原图">
            <el-image
              style="width: 421px; height: 645px"
              :src="dataForm.backOrgPic.indexOf('https://') !== -1? dataForm.backOrgPic : resourcesUrl + dataForm.backOrgPic"
              v-if="dataForm.backOrgPic"/>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </el-dialog>

</template>

<script>
  export default {
    name: "YuyinPreview",
    data() {
      return {
        visible: false,
        dataForm:{},
        resourcesUrl: process.env.VUE_APP_RESOURCES_URL,
      };
    },
    mounted() {
    },
    methods: {
      init(cardItem){
        this.dataForm = cardItem;
        this.visible = true;
      },
      closeDialog(){
        this.visible = false
        this.dataForm = {}
      }
    },
  }
</script>

<style scoped>

</style>
