<template>
  <div class="application">
    <div v-for="item in list" :key="item.name">
      <img :src="require(`@/assets/images/${item.icon}`)" />
      <p>{{item.name}}</p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Application',
  data() {
    return {
      list: [
        {name: '会议系统', icon: 'app1.png'},
        {name: '派单系统', icon: 'app2.png'},
        {name: '气象系统', icon: 'app3.png'},
        {name: '网格系统', icon: 'app4.png'},
      ]
    }
  },
}
</script>

<style lang="stylus" scoped>
.application
  display flex
  align-items center
  justify-content space-around
  >div
    text-align center
    img
      height .3rem
      width auto
      margin .05rem 0
</style>
