jbangjia_admin/src/views/diypage/module/window.vue

<template>
  <div class="module-item-window" style="margin-top:0">
    <div class="item-window-con"
      :style="'padding-top:' + module.base.paddingTop + 'px;padding-bottom:' + module.base.paddingBottom + 'px;margin-top:' + module.base.marginTop + 'px;margin-bottom:' + module.base.marginBottom + 'px;padding-left:'+ module.base.paddingLeft + 'px;padding-right:'+module.base.paddingLeft + 'px;'">
      <moduleBg :base="module.base" />
      <!--样式一-->
      <div class="item-window-style1" :class="'col' + module.base.column">
        <div class="display">
          <div class="display-left" style="padding: 0px 0px;">
            <div v-if="module.list[0] && module.list[0].type">
              <windowmodule ref="windowmodule" :element="module.list[0].windowbody"
                @windowbodyClick="windowbodyClick" />
            </div>
            <div v-else>
              <img v-if="module.list[0] && module.list[0].img" :src="module.list[0].img"><img v-else :src="$util.icon('window_01.jpg')">
            </div>
          </div>
          <div class="display-right">
            <div v-if="module.base.style == 'style3'" class="display-right1-style3" style="padding: 0px 0px;">
              <div v-if="module.list[1] && module.list[1].type">
                <windowmodule ref="windowmodule"  :element="module.list[1].windowbody"
                  @windowbodyClick="windowbodyClick" />
              </div>
              <div v-else>
                <img v-if="module.list[1] && module.list[1].img" :src="module.list[1].img"><img v-else :src="$util.icon('window_02_1.jpg')">
              </div>
            </div>
            <div v-else class="display-right1" style="padding: 0px 0px;">
              <div v-if="module.list[1] && module.list[1].type">
                <windowmodule ref="windowmodule"  :element="module.list[1].windowbody"
                  @windowbodyClick="windowbodyClick" />
              </div>
              <div v-else>
                <img v-if="module.list[1] && module.list[1].img" :src="module.list[1].img"><img v-else :src="$util.icon('window_02.jpg')">
              </div>
            </div>
            <!--样式二-->
            <div v-if="module.base.style == 'style1'" class="display-right2">
              <div class="left" style="padding: 0px 0px;">
                <diy v-if="module.list[2] && module.list[2].type">
                  <windowmodule ref="windowmodule" :element="module.list[2].windowbody"
                    @windowbodyClick="windowbodyClick" />
                </diy>
                <div v-else>
                  <img v-if="module.list[2] && module.list[2].img" :src="module.list[2].img"><img v-else
                    :src="$util.icon('window_03.jpg')">
                </div>
              </div>
              <div class="right" style="padding: 0px 0px;">
                <div v-if="module.list[3] && module.list[3].type">
                  <windowmodule ref="windowmodule" :element="module.list[3].windowbody"
                    @windowbodyClick="windowbodyClick" />
                </div>

                <div v-else>
                  <img v-if="module.list[3] && module.list[3].img" :src="module.list[3].img"><img v-else
                    :src="$util.icon('window_04.jpg')">
                </div>
              </div>
            </div>
            <div v-else-if="module.base.style == 'style2'" class="display-right2" style="padding: 0px 0px;">
              <div v-if="module.list[2] && module.list[2].type">
                <windowmodule ref="windowmodule"  :element="module.list[2].windowbody"
                  @windowbodyClick="windowbodyClick" />
              </div>
              <div v-else>
                <img v-if="module.list[2] && module.list[2].img" :src="module.list[2].img"><img v-else :src="$util.icon('window_03_1.jpg')">
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  import windowmodule from '@/views/diypage/module/windowmodule.vue'
  import moduleBg from '@/views/diypage/module/bg.vue'
  import moduleDuo from '@/views/diypage/module/duo.vue'
  export default {
    components: {
      moduleBg,
      moduleDuo,
      windowmodule,
    },
    props: ['module'],
    data() {
      return {}
    },

    computed: {},

    created() {},

    mounted() {},
    methods: {
      // 模块点击
      windowbodyClick(item) {
        this.$emit('windowbodyClick', item)
      },
    }
  }
</script>