realtorEasier-webSite/mobile/src/pages/service/useimg.vue

<template>
  <div class="img-layout" :class="{agreement:$route.params.name==='agreement'}">
    <img :src="images" alt="">
    <!-- <img v-if="$route.params.name==='agreement'" :src="`${$cdn}images/agreement/eight/${language === 'en' ? 'en' : 'zh'}/2-more.jpg`" alt=""> -->
  </div>
</template>

<script>
import data from './temp/config'
import {mapState} from 'vuex'
let current = {
  0: 'eight',
  1: 'binocular'
}
export default {
  data () {
    return {
    }
  },

  computed: {
    ...mapState({
      language: state => state.language.current
    }),
    images () {
      let use = parseInt(this.$route.params.type) === 0 ? data.use.data.pro : data.use.data.lite
      let name = this.$route.params.name

      let img = ''
      for (let i = 0; i < use.length; i++) {
        let item = use[i]
        if (!item.sub) {
          if (parseInt(item.img) === parseInt(this.$route.params.id)) {
            img = this.$cdn + `images/${name}/${current[this.$route.params.type]}/${this.language === 'en' ? 'en' : 'zh'}/${item.img}.jpg`
            return img
          }
        }
        if (item.sub) {
          for (let j = 0; j < item.sub.length; j++) {
            let sub = item.sub[j]
            if (parseInt(sub.img) === parseInt(this.$route.params.id)) {
              img = this.$cdn + `images/${name}/${current[this.$route.params.type]}/${this.language === 'en' ? 'en' : 'zh'}/${sub.img}.jpg`
              return img
            }
          }
        }
      }

      return img
    }
  }
}
</script>

<style lang="scss" scoped>
.img-layout{
  width: 100%;
  background-color: #fff;
  min-height: 400px;
  img{
    margin: 30px 0;
    width:100%;
  }
}

.agreement{
  img{
    margin: 0;
  }
}
</style>