103 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			103 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			Vue
		
	
	
	
 | 
						|
<template>
 | 
						|
  <div class="Content " :style="curStyle">
 | 
						|
    <div class="content-box" :style="{padding}" :class="{ noneEvent }">
 | 
						|
      <slot></slot>
 | 
						|
    </div>
 | 
						|
  </div>
 | 
						|
</template>
 | 
						|
 | 
						|
<script>
 | 
						|
import {getSize} from "@/utils/tools";
 | 
						|
  export default {
 | 
						|
    name: 'ModuleContent',
 | 
						|
    components: {},
 | 
						|
    mixins: [],
 | 
						|
    inject: [],
 | 
						|
    provide() {
 | 
						|
      return {
 | 
						|
        Content: this
 | 
						|
      }
 | 
						|
    },
 | 
						|
    props: {
 | 
						|
      noneEvent: {
 | 
						|
        type: Boolean,
 | 
						|
        default: false
 | 
						|
      },
 | 
						|
      height: {
 | 
						|
        type: [Number, String],
 | 
						|
        default: 'auto'
 | 
						|
      },
 | 
						|
      scroll: {
 | 
						|
        type: Boolean,
 | 
						|
        default: true
 | 
						|
      },
 | 
						|
      padding: {
 | 
						|
        type: String,
 | 
						|
        default: '20px 50px'
 | 
						|
      },
 | 
						|
     unShowBackground: {
 | 
						|
        type: Boolean,
 | 
						|
        default: true
 | 
						|
      },
 | 
						|
      border: {
 | 
						|
        type: Boolean,
 | 
						|
        default: true
 | 
						|
      }
 | 
						|
    },
 | 
						|
    data() {
 | 
						|
      return {}
 | 
						|
    },
 | 
						|
    computed: {
 | 
						|
      curStyle () {
 | 
						|
        if (this.height === 'auto') {
 | 
						|
          return {
 | 
						|
            flex: 1
 | 
						|
          }
 | 
						|
        }
 | 
						|
        return {
 | 
						|
          height: getSize(this.height)
 | 
						|
        }
 | 
						|
      }
 | 
						|
    },
 | 
						|
    watch: {},
 | 
						|
    created() {
 | 
						|
    },
 | 
						|
    beforeDestroy() {
 | 
						|
    },
 | 
						|
    mounted() {
 | 
						|
    },
 | 
						|
    methods: {},
 | 
						|
  }
 | 
						|
</script>
 | 
						|
 | 
						|
<style scoped lang="less">
 | 
						|
@import "assets/styles/mixin";
 | 
						|
  .Content {
 | 
						|
    width: 100%;
 | 
						|
    box-sizing: border-box;
 | 
						|
    overflow: hidden;
 | 
						|
    position: relative;
 | 
						|
    pointer-events: none;
 | 
						|
    .content-border {
 | 
						|
 | 
						|
    }
 | 
						|
    .content-header {
 | 
						|
    }
 | 
						|
 | 
						|
    .content-body {
 | 
						|
    }
 | 
						|
    .content-box {
 | 
						|
      height: 100%;
 | 
						|
      @include clearfix;
 | 
						|
      position: relative;
 | 
						|
      padding: 8px;
 | 
						|
      box-sizing: border-box;
 | 
						|
      pointer-events: auto;
 | 
						|
      &.noneEvent {
 | 
						|
        pointer-events: none;
 | 
						|
      }
 | 
						|
    }
 | 
						|
  }
 | 
						|
</style>
 |