CN-926 列表页样式改版
This commit is contained in:
@@ -7,23 +7,24 @@
|
||||
<div class="top-tools">
|
||||
<div class="top-tool-left" style="min-width: 300px">
|
||||
<slot name="top-tool-left"></slot>
|
||||
</div>
|
||||
<div class="top-tool-right">
|
||||
<!-- <el-input v-model="keyWord" value="keyWord"></el-input>
|
||||
<el-button @click="onSearch" icon="el-icon-search" type="info" size="mini" style="margin-right: 10px"></el-button>-->
|
||||
<div v-if="showLayout.indexOf('search') > -1" class="top-tool-search margin-r-20">
|
||||
<div style="display: flex">
|
||||
<el-input v-model="keyWord" size="small" @keyup.enter="onSearch"></el-input>
|
||||
<!-- <el-button icon="el-icon-search" @click="onSearch" size="small"></el-button>-->
|
||||
<button class="top-tool-btn" style="border-radius: 0" @click="onSearch">
|
||||
<!-- <el-button icon="el-icon-search" @click="onSearch" size="small"></el-button>-->
|
||||
<button class="top-tool-btn top-tool-btn--search" style="border-radius: 0 2px 2px 0 !important;" @click="onSearch">
|
||||
<i class="el-icon-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="top-tool-right">
|
||||
<!-- <el-input v-model="keyWord" value="keyWord"></el-input>
|
||||
<el-button @click="onSearch" icon="el-icon-search" type="info" size="mini" style="margin-right: 10px"></el-button>-->
|
||||
|
||||
<slot name="top-tool-right"></slot>
|
||||
<button v-if="showLayout.indexOf('elementSet') > -1" class="top-tool-btn" @click="tools.showCustomTableTitle = true">
|
||||
<i class="cn-icon-gear cn-icon"></i>
|
||||
</button>
|
||||
<div v-if="showLayout.indexOf('elementSet') > -1" class="btn-customize" @click="tools.showCustomTableTitle = true">
|
||||
<i class="cn-icon-gear cn-icon icon-gear"></i> <span> {{$t('network.customize')}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cn-table">
|
||||
|
||||
@@ -47,29 +47,6 @@
|
||||
<span v-else>{{scope.row[item.prop]}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="false"
|
||||
:width="operationWidth"
|
||||
fixed="right">
|
||||
<template #header>
|
||||
<div class="table-operation-title">{{$t('overall.option')}}</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="table-operation-items">
|
||||
<button class="table-operation-item" @click="tableOperation(['edit', scope.row])"><i class="cn-icon cn-icon-edit"></i></button>
|
||||
<el-dropdown size="medium" trigger="hover" @command="tableOperation">
|
||||
<div class="table-operation-item table-operation-item--more">
|
||||
<i class="cn-icon cn-icon-more-arrow-down"></i>
|
||||
</div>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu >
|
||||
<el-dropdown-item :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="cn-icon cn-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -62,29 +62,6 @@
|
||||
<span v-else>{{scope.row[item.prop]}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="false"
|
||||
:width="operationWidth"
|
||||
fixed="right">
|
||||
<template #header>
|
||||
<div class="table-operation-title">{{$t('overall.option')}}</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="table-operation-items">
|
||||
<button class="table-operation-item" @click="tableOperation(['edit', scope.row])"><i class="cn-icon cn-icon-edit"></i></button>
|
||||
<el-dropdown size="medium" trigger="hover" @command="tableOperation">
|
||||
<div class="table-operation-item table-operation-item--more">
|
||||
<i class="cn-icon cn-icon-more-arrow-down"></i>
|
||||
</div>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu >
|
||||
<el-dropdown-item :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="cn-icon cn-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -188,22 +188,6 @@
|
||||
<span v-else>{{ scope.row[item.prop] || '-' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="false"
|
||||
:width="operationWidth"
|
||||
fixed="right">
|
||||
<template #header>
|
||||
<div class="table-operation-title">{{ $t('overall.option') }}</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="table-operation-items">
|
||||
<button class="table-operation-item" @click="tableOperation(['edit', scope.row])"><i
|
||||
class="cn-icon cn-icon-bianji"></i></button>
|
||||
<button class="table-operation-item" @click="tableOperation(['delete', scope.row])"><i
|
||||
class="cn-icon cn-icon-shanchu"></i></button>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="table-operation-all">
|
||||
<el-checkbox v-model="checkboxAll" :indeterminate="isIndeterminate" @change="selectAll(tableData)"></el-checkbox>
|
||||
@@ -308,6 +292,7 @@ export default {
|
||||
loadingTableId: '',
|
||||
loadingPreviewId: '',
|
||||
downDataList: [],
|
||||
disableEdit:false,//编辑按钮是否不可用,当选择多条记录的时候你,编辑按钮不可用
|
||||
// pageObj: {
|
||||
// pageNo: 1,
|
||||
// pageSize: 20,
|
||||
@@ -556,6 +541,12 @@ export default {
|
||||
})
|
||||
// this.selectIds = selectIds
|
||||
}
|
||||
this.batchDeleteObjs = objs
|
||||
if(objs.length > 1) {
|
||||
this.disableEdit = true
|
||||
}else {
|
||||
this.disableEdit = false
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 全选按钮
|
||||
@@ -574,6 +565,13 @@ export default {
|
||||
this.$refs.dataTable.clearSelection()
|
||||
}
|
||||
|
||||
this.batchDeleteObjs = objs
|
||||
if(objs.length > 1) {
|
||||
this.disableEdit = true
|
||||
}else {
|
||||
this.disableEdit = false
|
||||
}
|
||||
|
||||
// this.selectIds = selectIds
|
||||
},
|
||||
/**
|
||||
|
||||
@@ -66,29 +66,6 @@
|
||||
<span v-else>{{scope.row[item.prop] || '-'}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="false"
|
||||
:width="operationWidth"
|
||||
fixed="right">
|
||||
<template #header>
|
||||
<div class="table-operation-title">{{$t('overall.option')}}</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="table-operation-items">
|
||||
<!-- <button class="table-operation-item" @click="tableOperation(['edit', scope.row])"><i class="cn-icon cn-icon-edit"></i></button>-->
|
||||
<el-dropdown size="medium" trigger="hover" @command="tableOperation">
|
||||
<div class="table-operation-item table-operation-item--more">
|
||||
<i class="cn-icon cn-icon-more-arrow-down"></i>
|
||||
</div>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu >
|
||||
<el-dropdown-item :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="cn-icon cn-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user