<template>
    <div>
        <el-descriptions :column="4">
            <el-descriptions-item label="客户编号">{{detail.customerId}}</el-descriptions-item>
            <el-descriptions-item label="客户名称">{{detail.customerName}}</el-descriptions-item>
            <el-descriptions-item label="跟进客服">{{detail.followUpSalesmanName}}</el-descriptions-item>
            <el-descriptions-item label="创建时间">{{detail.createTime|parseTime}}</el-descriptions-item>
            <el-descriptions-item label="申请凭证" :span="4">
                <el-image v-for="(item, index) in pictures" :key="index" :src="item" style="width:100px; height:100px" :preview-src-list="pictures"></el-image>
            </el-descriptions-item>
            <el-descriptions-item label="申请原因" :span="4">{{detail.reason}}</el-descriptions-item>
        </el-descriptions>
    </div>
</template>
<script>
import { getApproval } from '@/api/ecw/customer';
import {parseTime} from '@/utils/ruoyi'
export default {
    filters: {parseTime},
    props:{
        id: [String, Number]
    },
    data(){
        return {
            info: null
        }
    },
    computed:{
        detail(){
            if(!this.info) return null
            return JSON.parse(this.info.details)
        },
        pictures(){
            if(!this.detail || !this.detail.voucher) return []
            return this.detail.voucher.split(',').filter(item => !!item)
        }
    },
    created(){
        getApproval(this.id).then(res => {
            this.info = res.data
        })
    }
}
</script>