feat:asset搜素部分添加

This commit is contained in:
zhangyu
2021-10-12 12:25:20 +08:00
parent f4b3fcb7ee
commit b591445d91
6 changed files with 134 additions and 16 deletions

View File

@@ -30,7 +30,7 @@
></cabinet-table> ></cabinet-table>
</template> </template>
<template v-slot:top-tool-right> <template v-slot:top-tool-right>
<button id="asset-create-asset" v-has="'dc_add'" class="top-tool-btn margin-r-10" @click.stop="add"> <button id="asset-create-asset" v-has="'dc_add'" class="top-tool-btn margin-r-10 margin-l-10" @click.stop="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options

View File

@@ -11,6 +11,7 @@
border: 1px solid #E7EAED; border: 1px solid #E7EAED;
/deep/ .data-detail { /deep/ .data-detail {
flex: 1; flex: 1;
height: calc(100% - 100px);
} }
.nz-detail-view-pagination { .nz-detail-view-pagination {
height: 30px; height: 30px;

View File

@@ -1,4 +1,6 @@
<template> <template>
<div class="detail-left-box">
<div style="height:40px">123</div>
<ul class="detail-row-box"> <ul class="detail-row-box">
<li v-for="(item,index) in tableData" :key="index" class="detail-row" @click="detailViewRightShow(item)" :class="item.id === detailViewRightObj.id ? 'selected' : ''"> <li v-for="(item,index) in tableData" :key="index" class="detail-row" @click="detailViewRightShow(item)" :class="item.id === detailViewRightObj.id ? 'selected' : ''">
<div class="detail-row-info"> <div class="detail-row-info">
@@ -14,6 +16,7 @@
</div> </div>
</li> </li>
</ul> </ul>
</div>
</template> </template>
<script> <script>
@@ -26,6 +29,85 @@ export default {
props: { props: {
detailViewRightObj: {} detailViewRightObj: {}
}, },
data () {
return {
tableTitle: [
{
label: 'ID',
prop: 'id',
show: true,
width: 110,
sortable: 'custom'
}, {
label: this.$t('overall.name'),
prop: 'name',
show: true,
minWidth: 150,
sortable: 'custom'
}, {
label: this.$t('asset.manageIp'),
prop: 'manageIp',
show: true,
minWidth: 140,
sortable: 'custom'
}, {
label: this.$t('overall.type'),
prop: 'type',
show: true,
minWidth: 140,
sortable: 'custom'
}, {
label: this.$t('asset.state'),
prop: 'state',
show: true,
minWidth: 110,
sortable: 'custom'
}, {
label: this.$t('overall.dc'),
prop: 'dc',
show: true,
minWidth: 140,
sortable: 'custom'
}, {
label: this.$t('asset.cabinet'),
prop: 'cabinet',
show: true,
minWidth: 110,
sortable: 'custom'
}, {
label: this.$t('asset.alertNum'),
prop: 'alertNum',
show: true,
minWidth: 140,
sortable: 'custom'
}, {
label: this.$t('asset.endpointNum2'),
prop: 'endpointNum',
show: true,
minWidth: 160,
sortable: 'custom'
}, {
label: this.$t('asset.brand'),
prop: 'brand',
show: true,
minWidth: 120,
sortable: 'custom'
}, {
label: this.$t('asset.model'),
prop: 'model',
show: true,
minWidth: 110,
sortable: 'custom'
}, {
label: 'Talon',
prop: 'clientState',
show: true,
sortable: 'custom',
minWidth: 150
}
]
}
},
methods: { methods: {
detailViewRightShow (item) { detailViewRightShow (item) {
this.$emit('detailViewRightShow', item) this.$emit('detailViewRightShow', item)
@@ -36,7 +118,7 @@ export default {
<style scoped lang="scss"> <style scoped lang="scss">
.detail-row-box{ .detail-row-box{
/*height: 100%;*/ height: calc(100% - 40px);
overflow: hidden; overflow: hidden;
overflow-y: auto; overflow-y: auto;
} }

View File

@@ -8,6 +8,9 @@
<div class="top-tools"> <div class="top-tools">
<div class="top-tool-left" style="min-width: 300px"> <div class="top-tool-left" style="min-width: 300px">
<slot name="top-tool-left"></slot> <slot name="top-tool-left"></slot>
<div v-if="showLayout.indexOf('searchInput') > -1" class="top-tool-search margin-r-20" :class="{'project-search alert-table asset-table endpoint-table': searchRight}">
<search-input ref="searchInput" :from="from" :inTransform="bottomBox.inTransform" :searchMsg="searchMsg" @search="search"></search-input>
</div>
</div> </div>
<div :class="{'top-tool-main-right-to-left': bottomBox.showSubList}" class="top-tool-right"> <div :class="{'top-tool-main-right-to-left': bottomBox.showSubList}" class="top-tool-right">
<slot name="top-tool-right"></slot> <slot name="top-tool-right"></slot>

View File

@@ -94,10 +94,18 @@ export default {
}, // resize时用v-show="subResizeShow"控制页面内容是否显示 }, // resize时用v-show="subResizeShow"控制页面内容是否显示
obj: Object, // 关联的实体对象 obj: Object, // 关联的实体对象
from: String, // 来自哪个页面 from: String, // 来自哪个页面
tabList: Array, // 动态页签列表 tabList: Array // 动态页签列表
targetTab: String // 展示哪个页签 // targetTab: String // 展示哪个页签
}, },
watch: { watch: {
from: {
immediate: true,
handler (n) {
if (n === fromRoute.asset) {
this.targetTab = 'panelTab'
}
}
},
obj: { obj: {
immediate: true, immediate: true,
handler (n) { handler (n) {
@@ -124,6 +132,7 @@ export default {
data () { data () {
return { return {
fromRoute: fromRoute, fromRoute: fromRoute,
targetTab: '',
tabs: { tabs: {
terminalLog: { terminalLog: {
monitor: [ monitor: [
@@ -339,4 +348,7 @@ export default {
.sub-box /deep/ .pagination-bottom { .sub-box /deep/ .pagination-bottom {
bottom: -3px; bottom: -3px;
} }
.sub-box /deep/ .sub-list-tab{
cursor: pointer;
}
</style> </style>

View File

@@ -77,16 +77,36 @@
</template> </template>
</nz-data-list> </nz-data-list>
<nzDetailView <nzDetailView
v-loading="detailViewLoading" v-loading="detailViewLoading || tools.loading"
v-show="detailType !== 'list'" v-show="detailType !== 'list'"
:api="url" :api="url"
:layout="dataListLayout" :layout="dataListLayout"
:from="fromRoute.asset" :from="fromRoute.asset"
:search-msg="searchMsg"
:detailType="detailType" :detailType="detailType"
:detailViewRightObj="detailViewRightObj" :detailViewRightObj="detailViewRightObj"
@search="searchDetail" @search="searchDetail"
@changeDetailType="changeDetailType" @changeDetailType="changeDetailType"
> >
<template v-slot:top-tool-left>
<div style="display: inline-block">
<span>Data center :</span>
<span>
<el-dropdown
type="primary"
@command="changeDetailType">
<button class="top-tool-btn table-column-setting"
type="button">
<i class="nz-icon nz-icon-arrow-down" />
</button>
<el-dropdown-menu slot="dropdown" >
<el-dropdown-item :command="[item.id,dc]" v-for="(item,index) in dcData" :key="index"><el-checkbox ></el-checkbox>{{item.name}}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</span>
</div>
</template>
<template v-slot:top-tool-right> <template v-slot:top-tool-right>
<button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add"> <button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>