1. 为CRUD.operation注入curd,免去属性传递 2. 表格界面零配置实现“表格列过滤显示”功能,弃用v-if方式 (#59)

 CRUD优化
为CRUD.operation注入curd,免去属性传递
表格界面零配置实现“表格列过滤显示”功能,弃用v-if方式
This commit is contained in:
Moxun
2019-12-24 16:47:26 +08:00
committed by elunez
parent fafa2a7e06
commit cedb7c6c2f
24 changed files with 174 additions and 165 deletions

View File

@@ -13,7 +13,7 @@
@click="confirmDelAll()"
>
清空
</el-button> v-if="columns.visible('username')"
</el-button>
</crudOperation>
</div>
<!--表格渲染-->
@@ -30,12 +30,12 @@
</el-form>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('username')" prop="username" label="用户名" />
<el-table-column v-if="columns.visible('requestIp')" prop="requestIp" label="IP" />
<el-table-column v-if="columns.visible('address')" :show-overflow-tooltip="true" prop="address" label="IP来源" />
<el-table-column v-if="columns.visible('description')" prop="description" label="描述" />
<el-table-column v-if="columns.visible('browser')" prop="browser" label="浏览器" />
<el-table-column v-if="columns.visible('createTime')" prop="createTime" label="创建日期">
<el-table-column prop="username" label="用户名" />
<el-table-column prop="requestIp" label="IP" />
<el-table-column :show-overflow-tooltip="true" prop="address" label="IP来源" />
<el-table-column prop="description" label="描述" />
<el-table-column prop="browser" label="浏览器" />
<el-table-column prop="createTime" label="创建日期">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>

View File

@@ -30,19 +30,19 @@
</el-form>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('username')" prop="username" label="用户名" />
<el-table-column v-if="columns.visible('requestIp')" prop="requestIp" label="IP" />
<el-table-column v-if="columns.visible('address')" :show-overflow-tooltip="true" prop="address" label="IP来源" />
<el-table-column v-if="columns.visible('description')" prop="description" label="描述" />
<el-table-column v-if="columns.visible('browser')" prop="browser" label="浏览器" />
<el-table-column v-if="columns.visible('time')" prop="time" label="请求耗时" align="center">
<el-table-column prop="username" label="用户名" />
<el-table-column prop="requestIp" label="IP" />
<el-table-column :show-overflow-tooltip="true" prop="address" label="IP来源" />
<el-table-column prop="description" label="描述" />
<el-table-column prop="browser" label="浏览器" />
<el-table-column prop="time" label="请求耗时" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.time <= 300">{{ scope.row.time }}ms</el-tag>
<el-tag v-else-if="scope.row.time <= 1000" type="warning">{{ scope.row.time }}ms</el-tag>
<el-tag v-else type="danger">{{ scope.row.time }}ms</el-tag>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('createTime')" prop="createTime" label="创建日期" width="180px">
<el-table-column prop="createTime" label="创建日期" width="180px">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>

View File

@@ -19,9 +19,7 @@
start-placeholder="开始日期"
end-placeholder="结束日期"
/>
<rrOperation
:crud="crud"
/>
<rrOperation />
</div>
</template>

View File

@@ -3,7 +3,7 @@
<div class="head-container">
<div v-if="crud.props.searchToggle">
<el-input v-model="query.filter" clearable size="small" placeholder="全表模糊搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<rrOperation :crud="crud" />
<rrOperation />
</div>
<crudOperation>
<el-button
@@ -23,13 +23,13 @@
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column v-if="columns.visible('userName')" prop="userName" label="用户名" />
<el-table-column v-if="columns.visible('nickName')" prop="nickName" label="用户昵称" />
<el-table-column v-if="columns.visible('job')" prop="job" label="岗位" />
<el-table-column v-if="columns.visible('ip')" prop="ip" label="登录IP" />
<el-table-column v-if="columns.visible('address')" :show-overflow-tooltip="true" prop="address" label="登录地点" />
<el-table-column v-if="columns.visible('browser')" prop="browser" label="浏览器" />
<el-table-column v-if="columns.visible('loginTime')" prop="loginTime" label="登录时间">
<el-table-column prop="userName" label="用户名" />
<el-table-column prop="nickName" label="用户昵称" />
<el-table-column prop="job" label="岗位" />
<el-table-column prop="ip" label="登录IP" />
<el-table-column :show-overflow-tooltip="true" prop="address" label="登录地点" />
<el-table-column prop="browser" label="浏览器" />
<el-table-column prop="loginTime" label="登录时间">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.loginTime) }}</span>
</template>

View File

@@ -5,7 +5,7 @@
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<el-input v-model="query.blurry" clearable size="small" placeholder="输入名称或者服务地址" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<rrOperation :crud="crud" />
<rrOperation />
</div>
<crudOperation :permission="permission" />
</div>
@@ -33,7 +33,7 @@
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column v-if="columns.visible('state')" prop="state" label="状态" width="50px">
<el-table-column prop="state" label="状态" width="50px">
<template slot-scope="scope">
<el-tag
:type="scope.row.state === '1' ? 'success' : 'info'"
@@ -44,12 +44,12 @@
</el-tag>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('name')" prop="name" label="名称" />
<el-table-column v-if="columns.visible('address')" prop="address" label="地址" />
<el-table-column v-if="columns.visible('port')" prop="port" label="端口" width="80px" align="center" />
<el-table-column v-if="columns.visible('cpuRate')" :formatter="formatCpuRate" prop="cpuRate" label="CPU使用率" width="100px" align="center" />
<el-table-column v-if="columns.visible('cpuCore')" prop="cpuCore" label="CPU内核数" width="100px" align="center" />
<el-table-column v-if="columns.visible('memTotal')" prop="memTotal" label="物理内存" align="center">
<el-table-column prop="name" label="名称" />
<el-table-column prop="address" label="地址" />
<el-table-column prop="port" label="端口" width="80px" align="center" />
<el-table-column :formatter="formatCpuRate" prop="cpuRate" label="CPU使用率" width="100px" align="center" />
<el-table-column prop="cpuCore" label="CPU内核数" width="100px" align="center" />
<el-table-column prop="memTotal" label="物理内存" align="center">
<template slot-scope="scope">
<el-row>
<el-col :span="24">{{ formatMem(scope.row) }}</el-col>
@@ -61,7 +61,7 @@
</el-row>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('diskTotal')" prop="diskTotal" :formatter="formatDisk" label="磁盘使用情况" align="center">
<el-table-column prop="diskTotal" :formatter="formatDisk" label="磁盘使用情况" align="center">
<template slot-scope="scope">
<el-row>
<el-col :span="24">{{ formatDisk(scope.row) }}</el-col>
@@ -73,7 +73,7 @@
</el-row>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('swapTotal')" prop="swapTotal" label="交换空间" align="center">
<el-table-column prop="swapTotal" label="交换空间" align="center">
<template slot-scope="scope">
<el-row>
<el-col :span="24">{{ formatSwap(scope.row) }}</el-col>
@@ -91,7 +91,7 @@
:data="scope.row"
:permission="permission"
/>
</template> v-if="columns.visible('name')"
</template>
</el-table-column>
</el-table>
<!--分页组件-->