<template>
    <div class="out_list">
        <p class="list_title">
            <span>服务信息</span>
            <span>规格</span>
            <span>购买时长</span>
            <span>小计</span>
            <span>操作</span>
        </p>
        <apply-service-state  ref="apply_service_state" v-for="(item,index) in service_arr" :idx="index" :key="index+5000" :data="item"></apply-service-state>
        
    </div>
</template>

<script>
import applyServiceState from './apply_service_state'

export default {
    props: ['service_arr'],
    components: {
        applyServiceState,
        
    },
    data() {
        return {
            
            
        };
    },
    watch: {
        
    },
    computed: {

    },
    created() {

    },
    mounted() {

    },
    methods: {

    },
};
</script>

<style>

</style>
<style scoped>
.out_list{
    width: 100%;
    overflow: hidden;
    background-color: rgba(255, 255, 255, 1);
	box-shadow: 0px 3px 6px 0px 
		rgba(244, 247, 252, 1);
	border-radius: 12px;
}
.list_title{
    height: 48px;
    line-height: 48px;
	background-color: rgba(229, 240, 255, 1);
    padding: 0 40px;
}
.list_title span{
    color: rgba(36, 44, 67, 1);
    font-weight: bold;
}
.list_title span:nth-of-type(1){
    margin-right: 414px;
}
.list_title span:nth-of-type(2){
    margin-right: 246px;
}
.list_title span:nth-of-type(3){
    margin-right: 96px;
}
.list_title span:nth-of-type(4){
    margin-right: 124px;
}
</style>
