| | |
| | | } |
| | | |
| | | .tag>.el-icon-s-unfold, |
| | | .el-icon-s-fold, |
| | | .el-icon-delete { |
| | | .el-icon-s-fold{ |
| | | font-size: 16px; |
| | | cursor: pointer; |
| | | margin: 0 8px; |
| | |
| | | .active_tab i { |
| | | display: inline; |
| | | color: #3A7BFA; |
| | | border-radius: 50%; |
| | | } |
| | | |
| | | .active_tab i:hover{ |
| | | background-color: rgba(0, 0, 0, 0.08); |
| | | } |
| | | |
| | | .component_view { |
| | |
| | | } |
| | | |
| | | .right_key_menu { |
| | | width: 120px; |
| | | width: 130px; |
| | | position: absolute; |
| | | top: 0; |
| | | left: 0; |
| | |
| | | } |
| | | |
| | | .right_key_menu li i { |
| | | margin-right: 14px; |
| | | margin-right: 10px; |
| | | } |
| | | |
| | | .right_key_menu li:hover { |
| | |
| | | <i :class="a.i"></i> |
| | | <div>{{a.v}}</div> |
| | | </div> |
| | | <el-popover placement="right-start" trigger="click" v-if="a.self != true && getPower(a.p)"> |
| | | <el-popover ref="popoverName" placement="right-start" trigger="click" v-if="a.self != true && getPower(a.p)"> |
| | | <div :class="`box ${activeBox == a.k ? 'active_box' : ''}`" slot="reference"> |
| | | <i :class="a.i"></i> |
| | | <div style="text-align: center;">{{ a.v }}</div> |
| | |
| | | </div> |
| | | </div> |
| | | </el-popover> |
| | | </el-popover> |
| | | </div> |
| | | </div> |
| | | <div class="right" :style="`width: calc(100% - ${leftOpen?'92':'0'}px);`"> |
| | |
| | | <i class="el-icon-close" @click="removeTab(ai)" v-if="tabActive!=0"></i> |
| | | </div> |
| | | </div> |
| | | <i class="el-icon-delete" @click="allDel" title="删除所有标签页"></i> |
| | | </div> |
| | | <div class="component_view"> |
| | | <component class="com_index" v-for="(com, index) in tabs" :is="com.u" :key="com.k" v-show="com.k == tabActive" |
| | |
| | | <el-col :span="24"> |
| | | <el-card :body-style="{padding: '6px'}"> |
| | | <ul> |
| | | <li style="color: red;" @click="removeTab(activeIndex)"><i class="el-icon-close"></i>关闭</li> |
| | | <li @click="removeTab(activeIndex)"><i class="el-icon-close"></i>关闭</li> |
| | | <li @click="allDel"><i class="el-icon-delete"></i>关闭所有</li> |
| | | <li @click="rightDel(activeIndex)"><i class="el-icon-d-arrow-right"></i>关闭右侧页签</li> |
| | | <el-divider></el-divider> |
| | | <li @click="refreshTable"><i class="el-icon-refresh"></i>刷新</li> |
| | | </ul> |
| | |
| | | if (ob.u == "") ob.u = "nullFace" |
| | | this.tabs.push(ob); |
| | | } |
| | | this.$refs['popoverName'].forEach(a=>{ |
| | | a.doClose() |
| | | }) |
| | | this.saveClick() |
| | | }, |
| | | removeTab(index) { |
| | | this.tabs.splice(index, 1); |
| | | let data = this.tabs[this.tabs.length - 1] |
| | | this.activeP = data.k; |
| | | this.tabActive = data.k; |
| | | this.activeBox = data.k |
| | | this.saveClick() |
| | | this.upTabActive(data.k) |
| | | }, |
| | | rightDel(index){ |
| | | for (var i = this.tabs.length - 1; i > index; i--) { |
| | | this.tabs.splice(i, 1); |
| | | } |
| | | let data = this.tabs[this.tabs.length - 1] |
| | | this.upTabActive(data.k) |
| | | }, |
| | | allDel() { |
| | | this.activeBox = 0 |