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

@@ -19,7 +19,7 @@
<el-select v-model="query.enabled" clearable size="small" placeholder="状态" class="filter-item" style="width: 90px" @change="crud.toQuery">
<el-option v-for="item in enabledTypeOptions" :key="item.key" :label="item.display_name" :value="item.key" />
</el-select>
<rrOperation :crud="crud" />
<rrOperation />
</div>
<crudOperation :permission="permission" />
</div>
@@ -44,8 +44,8 @@
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" default-expand-all :data="crud.data" row-key="id" @select="crud.selectChange" @select-all="crud.selectAllChange" @selection-change="crud.selectionChangeHandler">
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column v-if="columns.visible('name')" label="名称" prop="name" />
<el-table-column v-if="columns.visible('enabled')" label="状态" align="center" prop="enabled">
<el-table-column label="名称" prop="name" />
<el-table-column label="状态" align="center" prop="enabled">
<template slot-scope="scope">
<el-switch
v-model="scope.row.enabled"
@@ -56,7 +56,7 @@
/>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('createTime')" prop="createTime" label="创建日期">
<el-table-column prop="createTime" label="创建日期">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>

View File

@@ -8,18 +8,18 @@
<!--表格渲染-->
<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('name')" prop="name" label="名称" />
<el-table-column v-if="columns.visible('dept')" prop="dept" label="所属部门">
<el-table-column prop="name" label="名称" />
<el-table-column prop="dept" label="所属部门">
<template slot-scope="scope">
<div>{{ scope.row.deptSuperiorName ? scope.row.deptSuperiorName + ' / ' : '' }}{{ scope.row.dept.name }}</div>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('sort')" prop="sort" label="排序">
<el-table-column prop="sort" label="排序">
<template slot-scope="scope">
{{ scope.row.sort }}
</template>
</el-table-column>
<el-table-column v-if="columns.visible('status')" prop="status" label="状态" align="center">
<el-table-column prop="status" label="状态" align="center">
<template slot-scope="scope">
<el-switch
v-model="scope.row.enabled"
@@ -29,7 +29,7 @@
/>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('createTime')" prop="createTime" label="创建日期">
<el-table-column prop="createTime" label="创建日期">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>

View File

@@ -17,9 +17,7 @@
<el-select v-model="query.enabled" clearable size="small" placeholder="状态" class="filter-item" style="width: 90px" @change="crud.toQuery">
<el-option v-for="item in dict.dict.job_status" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<rrOperation
:crud="crud"
/>
<rrOperation />
</div>
</template>

View File

@@ -16,7 +16,7 @@
start-placeholder="开始日期"
end-placeholder="结束日期"
/>
<rrOperation :crud="crud" />
<rrOperation />
</div>
<crudOperation :permission="permission" />
</div>
@@ -95,39 +95,39 @@
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" row-key="id" @select="crud.selectChange" @select-all="crud.selectAllChange" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column v-if="columns.visible('name')" :show-overflow-tooltip="true" label="菜单名称" width="125px" prop="name" />
<el-table-column v-if="columns.visible('icon')" prop="icon" label="图标" align="center" width="60px">
<el-table-column :show-overflow-tooltip="true" label="菜单名称" width="125px" prop="name" />
<el-table-column prop="icon" label="图标" align="center" width="60px">
<template slot-scope="scope">
<svg-icon :icon-class="scope.row.icon" />
</template>
</el-table-column>
<el-table-column v-if="columns.visible('sort')" prop="sort" align="center" label="排序">
<el-table-column prop="sort" align="center" label="排序">
<template slot-scope="scope">
{{ scope.row.sort }}
</template>
</el-table-column>
<el-table-column v-if="columns.visible('path')" :show-overflow-tooltip="true" prop="path" label="路由地址" />
<el-table-column v-if="columns.visible('permission')" :show-overflow-tooltip="true" prop="permission" label="权限标识" />
<el-table-column v-if="columns.visible('component')" :show-overflow-tooltip="true" prop="component" label="组件路径" />
<el-table-column v-if="columns.visible('iframe')" prop="iframe" label="外链" width="75px">
<el-table-column :show-overflow-tooltip="true" prop="path" label="路由地址" />
<el-table-column :show-overflow-tooltip="true" prop="permission" label="权限标识" />
<el-table-column :show-overflow-tooltip="true" prop="component" label="组件路径" />
<el-table-column prop="iframe" label="外链" width="75px">
<template slot-scope="scope">
<span v-if="scope.row.iframe">是</span>
<span v-else>否</span>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('cache')" prop="cache" label="缓存" width="75px">
<el-table-column prop="cache" label="缓存" width="75px">
<template slot-scope="scope">
<span v-if="scope.row.cache">是</span>
<span v-else>否</span>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('hidden')" prop="hidden" label="可见" width="75px">
<el-table-column prop="hidden" label="可见" width="75px">
<template slot-scope="scope">
<span v-if="scope.row.hidden">否</span>
<span v-else>是</span>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('createTime')" prop="createTime" label="创建日期" width="135px">
<el-table-column prop="createTime" label="创建日期" width="135px">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>

View File

@@ -16,7 +16,7 @@
start-placeholder="开始日期"
end-placeholder="结束日期"
/>
<rrOperation :crud="crud" />
<rrOperation />
</div>
<crudOperation :permission="permission" />
</div>
@@ -63,12 +63,12 @@
</div>
<el-table ref="table" v-loading="crud.loading" highlight-current-row style="width: 100%;" :data="crud.data" @selection-change="crud.selectionChangeHandler" @current-change="handleCurrentChange">
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column v-if="columns.visible('name')" prop="name" label="名称" />
<el-table-column v-if="columns.visible('dataScope')" prop="dataScope" label="数据权限" />
<el-table-column v-if="columns.visible('permission')" prop="permission" label="角色权限" />
<el-table-column v-if="columns.visible('level')" prop="level" label="角色级别" />
<el-table-column v-if="columns.visible('remark')" :show-overflow-tooltip="true" prop="remark" label="描述" />
<el-table-column v-if="columns.visible('createTime')" :show-overflow-tooltip="true" width="135px" prop="createTime" label="创建日期">
<el-table-column prop="name" label="名称" />
<el-table-column prop="dataScope" label="数据权限" />
<el-table-column prop="permission" label="角色权限" />
<el-table-column prop="level" label="角色级别" />
<el-table-column :show-overflow-tooltip="true" prop="remark" label="描述" />
<el-table-column :show-overflow-tooltip="true" width="135px" prop="createTime" label="创建日期">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>

View File

@@ -16,7 +16,7 @@
start-placeholder="开始日期"
end-placeholder="结束日期"
/>
<rrOperation :crud="crud" />
<rrOperation />
</div>
<crudOperation :permission="permission">
<!-- 任务日志 -->
@@ -65,18 +65,18 @@
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column v-if="columns.visible('jobName')" :show-overflow-tooltip="true" prop="jobName" width="100px" label="任务名称" />
<el-table-column v-if="columns.visible('beanName')" :show-overflow-tooltip="true" prop="beanName" label="Bean名称" />
<el-table-column v-if="columns.visible('methodName')" :show-overflow-tooltip="true" prop="methodName" width="90px" label="执行方法" />
<el-table-column v-if="columns.visible('params')" :show-overflow-tooltip="true" prop="params" width="80px" label="参数" />
<el-table-column v-if="columns.visible('cronExpression')" :show-overflow-tooltip="true" prop="cronExpression" width="100px" label="cron表达式" />
<el-table-column v-if="columns.visible('isPause')" :show-overflow-tooltip="true" prop="isPause" width="90px" label="状态">
<el-table-column :show-overflow-tooltip="true" prop="jobName" width="100px" label="任务名称" />
<el-table-column :show-overflow-tooltip="true" prop="beanName" label="Bean名称" />
<el-table-column :show-overflow-tooltip="true" prop="methodName" width="90px" label="执行方法" />
<el-table-column :show-overflow-tooltip="true" prop="params" width="80px" label="参数" />
<el-table-column :show-overflow-tooltip="true" prop="cronExpression" width="100px" label="cron表达式" />
<el-table-column :show-overflow-tooltip="true" prop="isPause" width="90px" label="状态">
<template slot-scope="scope">
<el-tag :type="scope.row.isPause ? 'warning' : 'success'">{{ scope.row.isPause ? '已暂停' : '运行中' }}</el-tag>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('remark')" :show-overflow-tooltip="true" prop="remark" label="描述" />
<el-table-column v-if="columns.visible('createTime')" :show-overflow-tooltip="true" prop="createTime" label="创建日期">
<el-table-column :show-overflow-tooltip="true" prop="remark" label="描述" />
<el-table-column :show-overflow-tooltip="true" prop="createTime" label="创建日期">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>

View File

@@ -64,7 +64,7 @@
:value="item.key"
/>
</el-select>
<rrOperation :crud="crud" />
<rrOperation />
</div>
<crudOperation show="" :permission="permission" />
</div>
@@ -144,17 +144,17 @@
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column v-if="columns.visible('username')" :show-overflow-tooltip="true" prop="username" label="用户名" />
<el-table-column v-if="columns.visible('nickName')" :show-overflow-tooltip="true" prop="nickName" label="昵称" />
<el-table-column v-if="columns.visible('sex')" prop="sex" label="性别" />
<el-table-column v-if="columns.visible('phone')" :show-overflow-tooltip="true" prop="phone" width="100" label="电话" />
<el-table-column v-if="columns.visible('email')" :show-overflow-tooltip="true" width="125" prop="email" label="邮箱" />
<el-table-column v-if="columns.visible('dept')" :show-overflow-tooltip="true" width="110" prop="dept" label="部门 / 岗位">
<el-table-column :show-overflow-tooltip="true" prop="username" label="用户名" />
<el-table-column :show-overflow-tooltip="true" prop="nickName" label="昵称" />
<el-table-column prop="sex" label="性别" />
<el-table-column :show-overflow-tooltip="true" prop="phone" width="100" label="电话" />
<el-table-column :show-overflow-tooltip="true" width="125" prop="email" label="邮箱" />
<el-table-column :show-overflow-tooltip="true" width="110" prop="dept" label="部门 / 岗位">
<template slot-scope="scope">
<div>{{ scope.row.dept.name }} / {{ scope.row.job.name }}</div>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('enabled')" label="状态" align="center" prop="enabled">
<el-table-column label="状态" align="center" prop="enabled">
<template slot-scope="scope">
<el-switch
v-model="scope.row.enabled"
@@ -165,7 +165,7 @@
/>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('createTime')" :show-overflow-tooltip="true" prop="createTime" width="140" label="创建日期">
<el-table-column :show-overflow-tooltip="true" prop="createTime" width="140" label="创建日期">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>