修改新版样式

This commit is contained in:
蒋吉兆
2021-09-18 00:10:17 +08:00
parent fbd5fcbefd
commit 5e3df6c742
20 changed files with 948 additions and 1964 deletions

View File

@@ -1,6 +1,6 @@
<template>
<div>
<div class="search-term">
<div class="gva-search-box">
<el-form :inline="true" :model="searchInfo">
<el-form-item label="路径">
<el-input v-model="searchInfo.path" placeholder="路径" />
@@ -21,9 +21,14 @@
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
<div class="gva-table-box">
<div class="gva-btn-list">
<el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
<el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
<el-popover v-model:visible="deleteVisible" placement="top" width="160">
<p>确定要删除吗</p>
@@ -32,56 +37,51 @@
<el-button size="mini" type="primary" @click="onDelete">确定</el-button>
</div>
<template #reference>
<el-button icon="el-icon-delete" size="mini" type="danger" style="margin-left: 10px;">批量删除</el-button>
<el-button icon="el-icon-delete" size="mini" style="margin-left: 10px;">删除</el-button>
</template>
</el-popover>
</div>
</div>
<el-table :data="tableData" border stripe @sort-change="sortChange" @selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="55"
/>
<el-table-column label="id" min-width="60" prop="ID" sortable="custom" />
<el-table-column label="api路径" min-width="150" prop="path" sortable="custom" />
<el-table-column label="api分组" min-width="150" prop="apiGroup" sortable="custom" />
<el-table-column label="api简介" min-width="150" prop="description" sortable="custom" />
<el-table-column label="请求" min-width="150" prop="method" sortable="custom">
<template #default="scope">
<div>
{{ scope.row.method }}
<el-tag
:key="scope.row.methodFiletr"
:type="tagTypeFiletr(scope.row.method)"
effect="dark"
size="mini"
>{{ methodFiletr(scope.row.method) }}</el-tag>
</div>
</template>
</el-table-column>
<el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="55"
/>
<el-table-column label="id" min-width="60" prop="ID" sortable="custom" />
<el-table-column label="api路径" min-width="150" prop="path" sortable="custom" />
<el-table-column label="api分组" min-width="150" prop="apiGroup" sortable="custom" />
<el-table-column label="api简介" min-width="150" prop="description" sortable="custom" />
<el-table-column label="请求" min-width="150" prop="method" sortable="custom">
<template #default="scope">
<div>
{{ scope.row.method }} / {{ methodFiletr(scope.row.method) }}
</div>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="200">
<template #default="scope">
<el-button size="small" type="primary" icon="el-icon-edit" @click="editApi(scope.row)">编辑</el-button>
<el-button
size="small"
type="danger"
icon="el-icon-delete"
@click="deleteApi(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
:current-page="page"
:page-size="pageSize"
:page-sizes="[10, 30, 50, 100]"
:style="{float:'right',padding:'20px'}"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
/>
<el-table-column fixed="right" label="操作" width="200">
<template #default="scope">
<el-button size="small" type="text" @click="editApi(scope.row)">编辑</el-button>
<el-button
size="small"
type="text"
@click="deleteApi(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="gva-pagination">
<el-pagination
:current-page="page"
:page-size="pageSize"
:page-sizes="[10, 30, 50, 100]"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
/>
</div>
</div>
<el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle">
<el-form ref="apiForm" :inline="true" :model="form" :rules="rules" label-width="80px">
@@ -345,9 +345,6 @@ export default {
float: right;
}
}
.el-tag--mini {
margin-left: 5px;
}
.warning {
color: #dc143c;
}