| | |
| | | <basic-container :cradStyle="cradStyle" cardBodyStyle="height:100%;box-sizing: border-box;padding-bottom:5px;"> |
| | | <el-tabs style="height: 100%;" class="UITabs" v-if="areasData.length>1" v-model="activeName" type="card" @tab-click="tabHandleClick"> |
| | | <el-tab-pane style="height:100%;overflow: auto" v-for="(areaItem,index) in areasData" :key="areaItem.oid" :label="areaItem.name" :name="areasName+'-Tab-'+index"> |
| | | <el-collapse class="UI-collapse" v-model="collapseActiveNames" v-if="areaItem.componentVOs.length>1"> |
| | | <el-collapse class="UI-collapse" v-model="collapseActiveNames" v-if="areaItem.componentVOs.length>1" @change="handleChange"> |
| | | <el-collapse-item v-for="(componentVO,componentIndex) in areaItem.componentVOs" :name="areasName+'-collapse-'+componentIndex"> |
| | | <template slot="title"> |
| | | {{componentVO.name}} |
| | |
| | | :componentVO="componentVO" |
| | | :sourceData="sourceData" |
| | | :areasName="areasName" |
| | | :paramVOS="paramVOS"></compoent-index> |
| | | :paramVOS="paramVOS" |
| | | :isShow="collapseActiveNames.indexOf(areasName+'-collapse-'+componentIndex)!=-1?true:false"></compoent-index> |
| | | </div> |
| | | </el-collapse-item> |
| | | </el-collapse> |
| | |
| | | :componentVO="areaItem.componentVOs[0]" |
| | | :sourceData="sourceData" |
| | | :areasName="areasName" |
| | | :paramVOS="paramVOS"></compoent-index> |
| | | :paramVOS="paramVOS" |
| | | :isShow="activeName==(areasName+'-Tab-'+index)?true:false"></compoent-index> |
| | | </div> |
| | | </el-tab-pane> |
| | | </el-tabs> |
| | | <div v-else style="height:100%;overflow: auto"> |
| | | <el-collapse class="UI-collapse" v-model="collapseActiveNames" v-if="areasData[0].componentVOs.length>1"> |
| | | <el-collapse class="UI-collapse" v-model="collapseActiveNames" v-if="areasData[0].componentVOs.length>1" @change="handleChange"> |
| | | <el-collapse-item v-for="(componentVO,componentIndex) in areasData[0].componentVOs" :name="areasName+'-collapse-'+componentIndex"> |
| | | <template slot="title"> |
| | | {{componentVO.name}} |
| | |
| | | :componentVO="componentVO" |
| | | :sourceData="sourceData" |
| | | :areasName="areasName" |
| | | :paramVOS="paramVOS"></compoent-index> |
| | | :paramVOS="paramVOS" |
| | | :isShow="collapseActiveNames.indexOf(areasName+'-collapse-'+componentIndex)!=-1?true:false"></compoent-index> |
| | | </div> |
| | | </el-collapse-item> |
| | | </el-collapse> |
| | |
| | | :componentVO="areasData[0].componentVOs[0]" |
| | | :sourceData="sourceData" |
| | | :areasName="areasName" |
| | | :paramVOS="paramVOS"></compoent-index> |
| | | :paramVOS="paramVOS" |
| | | :isShow="true"></compoent-index> |
| | | </div> |
| | | </div> |
| | | </basic-container> |
| | |
| | | tabHandleClick(tab, event) { |
| | | // console.log(tab, event); |
| | | }, |
| | | handleChange(val) { |
| | | //console.log(val); |
| | | } |
| | | } |
| | | } |
| | | </script> |