ncs_board_ssr/components/templates/common/text-display-hospital.vue

<script>
import DragTool from "../DragTool";
import mixin from '../../mixinnew'

export default {
  name: 'text-display-hospital',
  components: {DragTool},
  mixins:[mixin],
  title:'院级统计信息',//医院信息显示
  computed:{
    displayText(){
      if(this.data.moduleConfig.dataConfig&&this.data.moduleConfig.dataConfig.displayPartItem&&!!this.data.moduleConfig.dataConfig.displayPartItem.length){ //看板项内容
        let customItem =this.$store.state.partStatisticSummary.filter(p=>p.value===this.data.moduleConfig.dataConfig.displayPartItem[0])[0]
        if(customItem){
          var childItem = customItem.children.filter(p=>p.value===this.data.moduleConfig.dataConfig.displayPartItem[1])[0];
          if(childItem){
            return childItem.summary
          }
        }
      }
      return ''
    },
    titleText(){
      //重写自定看板项标题
      if(this.data.moduleConfig.dataConfig&&this.data.moduleConfig.dataConfig.titleText!=='') {
        return  this.data.moduleConfig.dataConfig.titleText
      }

      if(this.data.moduleConfig.dataConfig&&this.data.moduleConfig.dataConfig.displayPartItem&&!!this.data.moduleConfig.dataConfig.displayPartItem.length){ //看板项内容

        let customItem = this.$store.state.partStatisticSummary.filter(p=>p.value===this.data.moduleConfig.dataConfig.displayPartItem[0])[0]
        if(customItem){
          var childItem = customItem.children.filter(p=>p.value===this.data.moduleConfig.dataConfig.displayPartItem[1])[0];
          if(childItem){
            return childItem.label
          }
        }
      }
      return '标题'
    }

  },
  dataTpl:{
    tpl_id: 12,
    tpl_type: 'HOSPITAL_ITEM',
    templateName:'text-display-hospital',
    isEdit:true,
    unique:'',
    moduleIconClass:'icon-Text',
    moduleConfig:{
      moduleStyle: {
        borderColor: '',
        borderRadius:'0px',
        borderStyle:'solid',
        backgroundColor:'',
        borderTopWidth:'0px',
        borderRightWidth:'0px',
        borderBottomWidth:'0px',
        borderLeftWidth:'0px',
        margin:'0px',
        padding:'0px',
        height:'40px'
      },
      styleConfig:{

      },
      titleStyle:{ //标题样式
        fontSize:'14px',
        color:'',
        fontWeight:'normal',
        marginLeft:'0px',
        marginRight:'0px',
        border:'0px',
        width:'auto',
        borderColor:'',
        paddingRight:'10px',
        paddingLeft:'10px',
        borderStyle: 'solid',
        borderRightWidth: '0px'
      },
      textStyle:{ //内容样式
        fontSize:'14px',
        color:'',
        fontWeight:'normal',
        marginLeft:'0px',
        marginRight:'0px',
        textAlign:'center'
      },
      dataConfig:{
        displayPartItem:[],
        titleText:''
      },
      showTitle:true, //显示标题,
    },
    children:([])
  }
}
</script>

<template>
  <drag-tool  :unique="data.unique" @delete="deleteModule" :is-edit="isEdit" @copy="copyModule" @active="activeModule">
    <div :style="moduleComputedStyle" class="flex">

      <div :style="titleComputedStyle" v-if="data.moduleConfig.showTitle"   class="titlewrap"> <div class="titleStyle">{{titleText}}</div>
      </div>
      <div class="flex-sub flex"  > <div class="contentStyle" :style="textComputedStyle">{{displayText}}</div>
      </div>
    </div>
  </drag-tool>
</template>

<style scoped>
.content_item{
  align-self: center;
}
.titlewrap{
  align-items: center;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  overflow-wrap: break-word;
}
.titleStyle{
  height: 100%;
  display: inline-flex;
  align-items: center;
  flex-direction: row-reverse;
  width: 100%;
  overflow-wrap: break-word;
  word-break: break-all;
}
.contentStyle{
  flex:1;
  align-self: center;
}
</style>