<!-- home -->
<template>
  <swiper>
    <swiper-slide v-for="item in list" :key="item.image">
      <pure-image :bg-color="item.color" :bg-image="item.image"></pure-image>
    </swiper-slide>
  </swiper>
</template>

<script>

export default {
  components: {
    PureImage: () => import('./components/PureImage.vue')
  },
  data() {
    return {
      list: [
        {
          image: require('@/assets/images/apartment/1.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/2-2.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/3-1.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/4-1.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/5-1.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/6-1.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/7-1.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/7-2.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/7-3.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/7-4.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/7-5.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/7-6.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/7-7.jpg'),
          color: '#f0f0f0'
        },
        {
          image: require('@/assets/images/apartment/7-8.jpg'),
          color: '#f0f0f0'
        }
      ]
    }
  },

  methods: {}
}
</script>

<style lang="scss" scoped>
</style>
