代码提交
This commit is contained in:
parent
f88d4fa80f
commit
463c57f135
|
|
@ -4,56 +4,45 @@
|
|||
<el-col :span="collapsed ? 1 : 5" class="tree-column" style="">
|
||||
<div class="card-container" v-if="!collapsed" style="min-width: 100%">
|
||||
<div class="card-header" v-if="!collapsed">
|
||||
<!-- 只有在未折叠状态显示标题 -->
|
||||
<span class="card-title">装备分类</span>
|
||||
</div>
|
||||
|
||||
|
||||
<el-form
|
||||
ref="queryFormLeft"
|
||||
v-show="showSearch"
|
||||
:model="queryParams"
|
||||
:rules="queryRules"
|
||||
style="margin-top: 20px; padding: 0 15px;"
|
||||
@submit.native.prevent
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-form-item prop="name" style="margin-bottom: 0;">
|
||||
<el-form-item prop="name" style="margin-bottom: unset">
|
||||
<el-input
|
||||
v-model="treeSearchKey"
|
||||
placeholder="搜索"
|
||||
@keyup.enter.native="getDeviceListByTreeSearch"
|
||||
class="tree-search-input"
|
||||
|
||||
|
||||
>
|
||||
<template #suffix>
|
||||
<div class="tree-search-buttons">
|
||||
<el-button
|
||||
icon="el-icon-search"
|
||||
size="mini"
|
||||
type="text"
|
||||
@click="getDeviceListByTreeSearch"
|
||||
title="查询"
|
||||
class="search-btn-embedded"
|
||||
@keyup.enter.native="getDeviceListByTreeSearch"
|
||||
style="margin-left: 10px;font-size: 16px;color: #C0C4CC"
|
||||
/>
|
||||
<el-button
|
||||
icon="el-icon-refresh"
|
||||
size="mini"
|
||||
@click="resetTreeSearch"
|
||||
title="重置"
|
||||
class="search-btn-embedded"
|
||||
style="margin-left: 0;"
|
||||
type="text"
|
||||
style="margin-left: 10px;font-size: 16px;color: #C0C4CC"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 树组件,折叠时隐藏 -->
|
||||
<el-tree
|
||||
|
|
@ -68,8 +57,6 @@
|
|||
:loading="treeLoading"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
<div style="position: relative; width: 20px; height: calc(100vh - 130px); margin-left: 5px">
|
||||
<!-- 右侧折叠/展开按钮 -->
|
||||
<el-button
|
||||
|
|
@ -397,6 +384,7 @@
|
|||
:key="Date.now()"
|
||||
@selection-change="handleSelectionChange"
|
||||
v-loading="tableLoading"
|
||||
border stripe
|
||||
>
|
||||
<el-table-column align="center" show-overflow-tooltip type="selection" width="50"/>
|
||||
<el-table-column align="center" show-overflow-tooltip type="index" label="序号" width="50"/>
|
||||
|
|
@ -1656,9 +1644,7 @@ export default {
|
|||
|
||||
|
||||
|
||||
<style scoped>
|
||||
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 20px;
|
||||
background-color: #f5f7fa;
|
||||
|
|
@ -1947,49 +1933,29 @@ export default {
|
|||
flex-direction: row;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 简洁紧凑版树搜索输入框样式 */
|
||||
.tree-search-input ::v-deep .el-input__inner {
|
||||
padding-right: 65px;
|
||||
border-radius: 4px;
|
||||
::v-deep .el-table {
|
||||
// 启用斑马纹
|
||||
&.el-table--striped .el-table__body {
|
||||
tr.el-table__row--striped td {
|
||||
background-color: #F6FBFA !important; // 浅紫色
|
||||
}
|
||||
}
|
||||
|
||||
.tree-search-input ::v-deep .el-input__suffix {
|
||||
right: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.el-table__header {
|
||||
background: #E9F0EE;
|
||||
|
||||
th {
|
||||
background: #E9F0EE !important;
|
||||
color: #606266;
|
||||
font-weight: 600;
|
||||
height: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.tree-search-buttons {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
gap: 0; /* 关键:移除按钮间距 */
|
||||
&.el-table--striped .el-table__body tr.el-table__row:hover>td.el-table__cell {
|
||||
background-color: #CCF1E9 !important;
|
||||
}
|
||||
|
||||
.search-btn-embedded {
|
||||
border: none !important;
|
||||
background: transparent !important;
|
||||
color: #909399 !important;
|
||||
border-radius: 0 !important;
|
||||
padding: 11px 8px !important; /* 适中的内边距 */
|
||||
height: 100% !important;
|
||||
min-width: 24px !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
}
|
||||
|
||||
.search-btn-embedded:hover {
|
||||
color: #409EFF !important;
|
||||
background-color: #f5f7fa !important;
|
||||
}
|
||||
|
||||
.tree-search-input ::v-deep .el-input__clear {
|
||||
right: 55px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue