小更新
parent
aeba0a5793
commit
28f81ff73c
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,411 +1,412 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<!--工具栏-->
|
<!--工具栏-->
|
||||||
<div class="head-container">
|
<div class="head-container">
|
||||||
<div v-if="crud.props.searchToggle">
|
<div v-if="crud.props.searchToggle">
|
||||||
<!-- 搜索 -->
|
<!-- 搜索 -->
|
||||||
<el-input
|
<el-input
|
||||||
v-model="query.blurry"
|
v-model="query.blurry"
|
||||||
clearable
|
clearable
|
||||||
size="small"
|
size="small"
|
||||||
placeholder="模糊搜索"
|
placeholder="模糊搜索"
|
||||||
style="width: 200px;"
|
style="width: 200px;"
|
||||||
class="filter-item"
|
class="filter-item"
|
||||||
@keyup.enter.native="crud.toQuery"
|
@keyup.enter.native="crud.toQuery"
|
||||||
/>
|
/>
|
||||||
<date-range-picker v-model="query.createTime" class="date-item" />
|
<date-range-picker v-model="query.createTime" class="date-item" />
|
||||||
<rrOperation />
|
<rrOperation />
|
||||||
</div>
|
</div>
|
||||||
<crudOperation :permission="permission" />
|
<crudOperation :permission="permission" />
|
||||||
</div>
|
</div>
|
||||||
<!--表单渲染-->
|
<!--表单渲染-->
|
||||||
<el-dialog
|
<el-dialog
|
||||||
append-to-body
|
append-to-body
|
||||||
:close-on-click-modal="false"
|
:close-on-click-modal="false"
|
||||||
:before-close="crud.cancelCU"
|
:before-close="crud.cancelCU"
|
||||||
:visible.sync="crud.status.cu > 0"
|
:visible.sync="crud.status.cu > 0"
|
||||||
:title="crud.status.title"
|
:title="crud.status.title"
|
||||||
width="580px"
|
width="580px"
|
||||||
>
|
>
|
||||||
<el-form
|
<el-form
|
||||||
ref="form"
|
ref="form"
|
||||||
:inline="true"
|
:inline="true"
|
||||||
:model="form"
|
:model="form"
|
||||||
:rules="rules"
|
:rules="rules"
|
||||||
size="small"
|
size="small"
|
||||||
label-width="80px"
|
label-width="80px"
|
||||||
>
|
>
|
||||||
<el-form-item label="菜单类型" prop="type">
|
<el-form-item label="菜单类型" prop="type">
|
||||||
<el-radio-group v-model="form.type" size="mini" style="width: 178px">
|
<el-radio-group v-model="form.type" size="mini" style="width: 178px">
|
||||||
<el-radio-button label="0">目录</el-radio-button>
|
<el-radio-button label="0">目录</el-radio-button>
|
||||||
<el-radio-button label="1">菜单</el-radio-button>
|
<el-radio-button label="1">菜单</el-radio-button>
|
||||||
<el-radio-button label="2">按钮</el-radio-button>
|
<el-radio-button label="2">按钮</el-radio-button>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-show="form.type.toString() !== '2'"
|
v-show="form.type.toString() !== '2'"
|
||||||
label="菜单图标"
|
label="菜单图标"
|
||||||
prop="icon"
|
prop="icon"
|
||||||
>
|
>
|
||||||
<el-popover
|
<el-popover
|
||||||
placement="bottom-start"
|
placement="bottom-start"
|
||||||
width="450"
|
width="450"
|
||||||
trigger="click"
|
trigger="click"
|
||||||
@show="$refs['iconSelect'].reset()"
|
@show="$refs['iconSelect'].reset()"
|
||||||
>
|
>
|
||||||
<IconSelect ref="iconSelect" @selected="selected" />
|
<IconSelect ref="iconSelect" @selected="selected" />
|
||||||
<el-input
|
<el-input
|
||||||
slot="reference"
|
slot="reference"
|
||||||
v-model="form.icon"
|
v-model="form.icon"
|
||||||
style="width: 450px;"
|
style="width: 450px;"
|
||||||
placeholder="点击选择图标"
|
placeholder="点击选择图标"
|
||||||
readonly
|
readonly
|
||||||
clearable
|
clearable
|
||||||
>
|
>
|
||||||
<svg-icon
|
<svg-icon
|
||||||
v-if="form.icon"
|
v-if="form.icon"
|
||||||
slot="prefix"
|
slot="prefix"
|
||||||
:icon-class="form.icon"
|
:icon-class="form.icon"
|
||||||
class="el-input__icon"
|
class="el-input__icon"
|
||||||
style="height: 32px;width: 16px;"
|
style="height: 32px;width: 16px;"
|
||||||
/>
|
/>
|
||||||
<i v-else slot="prefix" class="el-icon-search el-input__icon" />
|
<i v-else slot="prefix" class="el-icon-search el-input__icon" />
|
||||||
</el-input>
|
</el-input>
|
||||||
</el-popover>
|
</el-popover>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-show="form.type.toString() !== '2'"
|
v-show="form.type.toString() !== '2'"
|
||||||
label="外链菜单"
|
label="外链菜单"
|
||||||
prop="iframe"
|
prop="iframe"
|
||||||
>
|
>
|
||||||
<el-radio-group v-model="form.iframe" size="mini">
|
<el-radio-group v-model="form.iframe" size="mini">
|
||||||
<el-radio-button label="true">是</el-radio-button>
|
<el-radio-button label="true">是</el-radio-button>
|
||||||
<el-radio-button label="false">否</el-radio-button>
|
<el-radio-button label="false">否</el-radio-button>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-show="form.type.toString() === '1'"
|
v-show="form.type.toString() === '1'"
|
||||||
label="菜单缓存"
|
label="菜单缓存"
|
||||||
prop="cache"
|
prop="cache"
|
||||||
>
|
>
|
||||||
<el-radio-group v-model="form.cache" size="mini">
|
<el-radio-group v-model="form.cache" size="mini">
|
||||||
<el-radio-button label="true">是</el-radio-button>
|
<el-radio-button label="true">是</el-radio-button>
|
||||||
<el-radio-button label="false">否</el-radio-button>
|
<el-radio-button label="false">否</el-radio-button>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-show="form.type.toString() !== '2'"
|
v-show="form.type.toString() !== '2'"
|
||||||
label="菜单可见"
|
label="菜单可见"
|
||||||
prop="hidden"
|
prop="hidden"
|
||||||
>
|
>
|
||||||
<el-radio-group v-model="form.hidden" size="mini">
|
<el-radio-group v-model="form.hidden" size="mini">
|
||||||
<el-radio-button label="false">是</el-radio-button>
|
<el-radio-button label="false">是</el-radio-button>
|
||||||
<el-radio-button label="true">否</el-radio-button>
|
<el-radio-button label="true">否</el-radio-button>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-if="form.type.toString() !== '2'"
|
v-if="form.type.toString() !== '2'"
|
||||||
label="菜单标题"
|
label="菜单标题"
|
||||||
prop="title"
|
prop="title"
|
||||||
>
|
>
|
||||||
<el-input
|
<el-input
|
||||||
v-model="form.title"
|
v-model="form.title"
|
||||||
:style="
|
:style="
|
||||||
form.type.toString() === '0' ? 'width: 450px' : 'width: 178px'
|
form.type.toString() === '0' ? 'width: 450px' : 'width: 178px'
|
||||||
"
|
"
|
||||||
placeholder="菜单标题"
|
placeholder="菜单标题"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-if="form.type.toString() === '2'"
|
v-if="form.type.toString() === '2'"
|
||||||
label="按钮名称"
|
label="按钮名称"
|
||||||
prop="title"
|
prop="title"
|
||||||
>
|
>
|
||||||
<el-input
|
<el-input
|
||||||
v-model="form.title"
|
v-model="form.title"
|
||||||
placeholder="按钮名称"
|
placeholder="按钮名称"
|
||||||
style="width: 178px;"
|
style="width: 178px;"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-show="form.type.toString() !== '0'"
|
v-show="form.type.toString() !== '0'"
|
||||||
label="权限标识"
|
label="权限标识"
|
||||||
prop="permission"
|
prop="permission"
|
||||||
>
|
>
|
||||||
<el-input
|
<el-input
|
||||||
v-model="form.permission"
|
v-model="form.permission"
|
||||||
:disabled="form.iframe.toString() === 'true'"
|
:disabled="form.iframe.toString() === 'true'"
|
||||||
placeholder="权限标识"
|
placeholder="权限标识"
|
||||||
style="width: 178px;"
|
style="width: 178px;"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-if="form.type.toString() !== '2'"
|
v-if="form.type.toString() !== '2'"
|
||||||
label="路由地址"
|
label="路由地址"
|
||||||
prop="path"
|
prop="path"
|
||||||
>
|
>
|
||||||
<el-input
|
<el-input
|
||||||
v-model="form.path"
|
v-model="form.path"
|
||||||
placeholder="路由地址"
|
placeholder="路由地址"
|
||||||
style="width: 178px;"
|
style="width: 178px;"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="菜单排序" prop="menuSort">
|
<el-form-item label="菜单排序" prop="menuSort">
|
||||||
<el-input-number
|
<el-input-number
|
||||||
v-model.number="form.menuSort"
|
v-model.number="form.menuSort"
|
||||||
:min="0"
|
:min="0"
|
||||||
:max="999"
|
:max="999"
|
||||||
controls-position="right"
|
controls-position="right"
|
||||||
style="width: 178px;"
|
style="width: 178px;"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-show="
|
v-show="
|
||||||
form.iframe.toString() !== 'true' && form.type.toString() === '1'
|
form.iframe.toString() !== 'true' && form.type.toString() === '1'
|
||||||
"
|
"
|
||||||
label="组件名称"
|
label="组件名称"
|
||||||
prop="componentName"
|
prop="componentName"
|
||||||
>
|
>
|
||||||
<el-input
|
<el-input
|
||||||
v-model="form.componentName"
|
v-model="form.componentName"
|
||||||
style="width: 178px;"
|
style="width: 178px;"
|
||||||
placeholder="匹配组件内Name字段"
|
placeholder="匹配组件内Name字段"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-show="
|
v-show="
|
||||||
form.iframe.toString() !== 'true' && form.type.toString() === '1'
|
form.iframe.toString() !== 'true' && form.type.toString() === '1'
|
||||||
"
|
"
|
||||||
label="组件路径"
|
label="组件路径"
|
||||||
prop="component"
|
prop="component"
|
||||||
>
|
>
|
||||||
<el-input
|
<el-input
|
||||||
v-model="form.component"
|
v-model="form.component"
|
||||||
style="width: 178px;"
|
style="width: 178px;"
|
||||||
placeholder="组件路径"
|
placeholder="组件路径"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="上级类目" prop="pid">
|
<el-form-item label="上级类目" prop="pid">
|
||||||
<treeselect
|
<treeselect
|
||||||
v-model="form.pid"
|
v-model="form.pid"
|
||||||
:options="menus"
|
:options="menus"
|
||||||
:load-options="loadMenus"
|
:load-options="loadMenus"
|
||||||
style="width: 450px;"
|
style="width: 450px;"
|
||||||
placeholder="选择上级类目"
|
placeholder="选择上级类目"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div slot="footer" class="dialog-footer">
|
<div slot="footer" class="dialog-footer">
|
||||||
<el-button type="text" @click="crud.cancelCU">取消</el-button>
|
<el-button type="text" @click="crud.cancelCU">取消</el-button>
|
||||||
<el-button
|
<el-button
|
||||||
:loading="crud.status.cu === 2"
|
:loading="crud.status.cu === 2"
|
||||||
type="primary"
|
type="primary"
|
||||||
@click="crud.submitCU"
|
@click="crud.submitCU"
|
||||||
>确认</el-button>
|
>确认</el-button>
|
||||||
</div>
|
</div>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
<!--表格渲染-->
|
<!--表格渲染-->
|
||||||
<el-table
|
<el-table
|
||||||
ref="table"
|
ref="table"
|
||||||
v-loading="crud.loading"
|
v-loading="crud.loading"
|
||||||
lazy
|
lazy
|
||||||
:load="getMenus"
|
:load="getMenus"
|
||||||
:data="crud.data"
|
:data="crud.data"
|
||||||
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
||||||
row-key="id"
|
row-key="id"
|
||||||
@select="crud.selectChange"
|
:header-cell-style="{'text-align':'left'}"
|
||||||
@select-all="crud.selectAllChange"
|
@select="crud.selectChange"
|
||||||
@selection-change="crud.selectionChangeHandler"
|
@select-all="crud.selectAllChange"
|
||||||
>
|
@selection-change="crud.selectionChangeHandler"
|
||||||
<el-table-column type="selection" width="55" />
|
>
|
||||||
<el-table-column
|
<el-table-column type="selection" width="55" />
|
||||||
:show-overflow-tooltip="true"
|
<el-table-column
|
||||||
label="菜单标题"
|
:show-overflow-tooltip="true"
|
||||||
width="125px"
|
label="菜单标题"
|
||||||
prop="title"
|
width="125px"
|
||||||
/>
|
prop="title"
|
||||||
<el-table-column prop="icon" label="图标" align="center" width="60px">
|
/>
|
||||||
<template slot-scope="scope">
|
<el-table-column prop="icon" label="图标" align="center" width="60px">
|
||||||
<svg-icon :icon-class="scope.row.icon ? scope.row.icon : ''" />
|
<template slot-scope="scope">
|
||||||
</template>
|
<svg-icon :icon-class="scope.row.icon ? scope.row.icon : ''" />
|
||||||
</el-table-column>
|
</template>
|
||||||
<el-table-column prop="menuSort" align="center" label="排序">
|
</el-table-column>
|
||||||
<template slot-scope="scope">
|
<el-table-column prop="menuSort" align="center" label="排序">
|
||||||
{{ scope.row.menuSort }}
|
<template slot-scope="scope">
|
||||||
</template>
|
{{ scope.row.menuSort }}
|
||||||
</el-table-column>
|
</template>
|
||||||
<el-table-column
|
</el-table-column>
|
||||||
:show-overflow-tooltip="true"
|
<el-table-column
|
||||||
prop="permission"
|
:show-overflow-tooltip="true"
|
||||||
label="权限标识"
|
prop="permission"
|
||||||
/>
|
label="权限标识"
|
||||||
<el-table-column
|
/>
|
||||||
:show-overflow-tooltip="true"
|
<el-table-column
|
||||||
prop="component"
|
:show-overflow-tooltip="true"
|
||||||
label="组件路径"
|
prop="component"
|
||||||
/>
|
label="组件路径"
|
||||||
<el-table-column prop="iframe" label="外链" width="75px">
|
/>
|
||||||
<template slot-scope="scope">
|
<el-table-column prop="iframe" label="外链" width="75px">
|
||||||
<span v-if="scope.row.iframe">是</span>
|
<template slot-scope="scope">
|
||||||
<span v-else>否</span>
|
<span v-if="scope.row.iframe">是</span>
|
||||||
</template>
|
<span v-else>否</span>
|
||||||
</el-table-column>
|
</template>
|
||||||
<el-table-column prop="cache" label="缓存" width="75px">
|
</el-table-column>
|
||||||
<template slot-scope="scope">
|
<el-table-column prop="cache" label="缓存" width="75px">
|
||||||
<span v-if="scope.row.cache">是</span>
|
<template slot-scope="scope">
|
||||||
<span v-else>否</span>
|
<span v-if="scope.row.cache">是</span>
|
||||||
</template>
|
<span v-else>否</span>
|
||||||
</el-table-column>
|
</template>
|
||||||
<el-table-column prop="hidden" label="可见" width="75px">
|
</el-table-column>
|
||||||
<template slot-scope="scope">
|
<el-table-column prop="hidden" label="可见" width="75px">
|
||||||
<span v-if="scope.row.hidden">否</span>
|
<template slot-scope="scope">
|
||||||
<span v-else>是</span>
|
<span v-if="scope.row.hidden">否</span>
|
||||||
</template>
|
<span v-else>是</span>
|
||||||
</el-table-column>
|
</template>
|
||||||
<el-table-column prop="createTime" label="创建日期" width="135px" />
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column prop="createTime" label="创建日期" width="135px" />
|
||||||
v-if="checkPer(['admin', 'menu:edit', 'menu:del'])"
|
<el-table-column
|
||||||
label="操作"
|
v-if="checkPer(['admin', 'menu:edit', 'menu:del'])"
|
||||||
width="130px"
|
label="操作"
|
||||||
align="center"
|
width="130px"
|
||||||
fixed="right"
|
align="center"
|
||||||
>
|
fixed="right"
|
||||||
<template slot-scope="scope">
|
>
|
||||||
<udOperation
|
<template slot-scope="scope">
|
||||||
:data="scope.row"
|
<udOperation
|
||||||
:permission="permission"
|
:data="scope.row"
|
||||||
msg="确定删除吗,如果存在下级节点则一并删除，此操作不能撤销！"
|
:permission="permission"
|
||||||
/>
|
msg="确定删除吗,如果存在下级节点则一并删除，此操作不能撤销！"
|
||||||
</template>
|
/>
|
||||||
</el-table-column>
|
</template>
|
||||||
</el-table>
|
</el-table-column>
|
||||||
</div>
|
</el-table>
|
||||||
</template>
|
</div>
|
||||||
|
</template>
|
||||||
<script>
|
|
||||||
import crudMenu from '@/api/system/menu'
|
<script>
|
||||||
import IconSelect from '@/components/IconSelect'
|
import crudMenu from '@/api/system/menu'
|
||||||
import Treeselect from '@riophae/vue-treeselect'
|
import IconSelect from '@/components/IconSelect'
|
||||||
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
|
import Treeselect from '@riophae/vue-treeselect'
|
||||||
import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
|
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
|
||||||
import CRUD, { presenter, header, form, crud } from '@crud/crud'
|
import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
|
||||||
import rrOperation from '@crud/RR.operation'
|
import CRUD, { presenter, header, form, crud } from '@crud/crud'
|
||||||
import crudOperation from '@crud/CRUD.operation'
|
import rrOperation from '@crud/RR.operation'
|
||||||
import udOperation from '@crud/UD.operation'
|
import crudOperation from '@crud/CRUD.operation'
|
||||||
import DateRangePicker from '@/components/DateRangePicker'
|
import udOperation from '@crud/UD.operation'
|
||||||
|
import DateRangePicker from '@/components/DateRangePicker'
|
||||||
// crud交由presenter持有
|
|
||||||
const defaultForm = {
|
// crud交由presenter持有
|
||||||
id: null,
|
const defaultForm = {
|
||||||
title: null,
|
id: null,
|
||||||
menuSort: 999,
|
title: null,
|
||||||
path: null,
|
menuSort: 999,
|
||||||
component: null,
|
path: null,
|
||||||
componentName: null,
|
component: null,
|
||||||
iframe: false,
|
componentName: null,
|
||||||
roles: [],
|
iframe: false,
|
||||||
pid: 0,
|
roles: [],
|
||||||
icon: null,
|
pid: 0,
|
||||||
cache: false,
|
icon: null,
|
||||||
hidden: false,
|
cache: false,
|
||||||
type: 0,
|
hidden: false,
|
||||||
permission: null
|
type: 0,
|
||||||
}
|
permission: null
|
||||||
export default {
|
}
|
||||||
name: 'Menu',
|
export default {
|
||||||
components: {
|
name: 'Menu',
|
||||||
Treeselect,
|
components: {
|
||||||
IconSelect,
|
Treeselect,
|
||||||
crudOperation,
|
IconSelect,
|
||||||
rrOperation,
|
crudOperation,
|
||||||
udOperation,
|
rrOperation,
|
||||||
DateRangePicker
|
udOperation,
|
||||||
},
|
DateRangePicker
|
||||||
cruds() {
|
},
|
||||||
return CRUD({
|
cruds() {
|
||||||
title: '菜单',
|
return CRUD({
|
||||||
url: 'api-management/api/menus',
|
title: '菜单',
|
||||||
crudMethod: { ...crudMenu }
|
url: 'api-management/api/menus',
|
||||||
})
|
crudMethod: { ...crudMenu }
|
||||||
},
|
})
|
||||||
mixins: [presenter(), header(), form(defaultForm), crud()],
|
},
|
||||||
data() {
|
mixins: [presenter(), header(), form(defaultForm), crud()],
|
||||||
return {
|
data() {
|
||||||
menus: [],
|
return {
|
||||||
permission: {
|
menus: [],
|
||||||
add: ['admin', 'menu:add'],
|
permission: {
|
||||||
edit: ['admin', 'menu:edit'],
|
add: ['admin', 'menu:add'],
|
||||||
del: ['admin', 'menu:del']
|
edit: ['admin', 'menu:edit'],
|
||||||
},
|
del: ['admin', 'menu:del']
|
||||||
rules: {
|
},
|
||||||
title: [{ required: true, message: '请输入标题', trigger: 'blur' }],
|
rules: {
|
||||||
path: [{ required: true, message: '请输入地址', trigger: 'blur' }]
|
title: [{ required: true, message: '请输入标题', trigger: 'blur' }],
|
||||||
}
|
path: [{ required: true, message: '请输入地址', trigger: 'blur' }]
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
methods: {
|
},
|
||||||
// 新增与编辑前做的操作
|
methods: {
|
||||||
[CRUD.HOOK.afterToCU](crud, form) {
|
// 新增与编辑前做的操作
|
||||||
this.menus = []
|
[CRUD.HOOK.afterToCU](crud, form) {
|
||||||
if (form.id != null) {
|
this.menus = []
|
||||||
if (form.pid === null) {
|
if (form.id != null) {
|
||||||
form.pid = 0
|
if (form.pid === null) {
|
||||||
}
|
form.pid = 0
|
||||||
this.getSupDepts(form.id)
|
}
|
||||||
} else {
|
this.getSupDepts(form.id)
|
||||||
this.menus.push({ id: 0, label: '顶级类目', children: null })
|
} else {
|
||||||
}
|
this.menus.push({ id: 0, label: '顶级类目', children: null })
|
||||||
},
|
}
|
||||||
getMenus(tree, treeNode, resolve) {
|
},
|
||||||
const params = { pid: tree.id }
|
getMenus(tree, treeNode, resolve) {
|
||||||
setTimeout(() => {
|
const params = { pid: tree.id }
|
||||||
crudMenu.getMenus(params).then(res => {
|
setTimeout(() => {
|
||||||
resolve(res.content)
|
crudMenu.getMenus(params).then(res => {
|
||||||
})
|
resolve(res.content)
|
||||||
}, 100)
|
})
|
||||||
},
|
}, 100)
|
||||||
getSupDepts(id) {
|
},
|
||||||
crudMenu.getMenuSuperior(id).then(res => {
|
getSupDepts(id) {
|
||||||
const children = res.map(function(obj) {
|
crudMenu.getMenuSuperior(id).then(res => {
|
||||||
if (!obj.leaf && !obj.children) {
|
const children = res.map(function(obj) {
|
||||||
obj.children = null
|
if (!obj.leaf && !obj.children) {
|
||||||
}
|
obj.children = null
|
||||||
return obj
|
}
|
||||||
})
|
return obj
|
||||||
this.menus = [{ id: 0, label: '顶级类目', children: children }]
|
})
|
||||||
})
|
this.menus = [{ id: 0, label: '顶级类目', children: children }]
|
||||||
},
|
})
|
||||||
loadMenus({ action, parentNode, callback }) {
|
},
|
||||||
if (action === LOAD_CHILDREN_OPTIONS) {
|
loadMenus({ action, parentNode, callback }) {
|
||||||
crudMenu.getMenusTree(parentNode.id).then(res => {
|
if (action === LOAD_CHILDREN_OPTIONS) {
|
||||||
parentNode.children = res.map(function(obj) {
|
crudMenu.getMenusTree(parentNode.id).then(res => {
|
||||||
if (!obj.leaf) {
|
parentNode.children = res.map(function(obj) {
|
||||||
obj.children = null
|
if (!obj.leaf) {
|
||||||
}
|
obj.children = null
|
||||||
return obj
|
}
|
||||||
})
|
return obj
|
||||||
setTimeout(() => {
|
})
|
||||||
callback()
|
setTimeout(() => {
|
||||||
}, 100)
|
callback()
|
||||||
})
|
}, 100)
|
||||||
}
|
})
|
||||||
},
|
}
|
||||||
// 选中图标
|
},
|
||||||
selected(name) {
|
// 选中图标
|
||||||
this.form.icon = name
|
selected(name) {
|
||||||
}
|
this.form.icon = name
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
}
|
||||||
|
</script>
|
||||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
||||||
::v-deep .el-input-number .el-input__inner {
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||||
text-align: left;
|
::v-deep .el-input-number .el-input__inner {
|
||||||
}
|
text-align: left;
|
||||||
::v-deep .vue-treeselect__control,
|
}
|
||||||
::v-deep .vue-treeselect__placeholder,
|
::v-deep .vue-treeselect__control,
|
||||||
::v-deep .vue-treeselect__single-value {
|
::v-deep .vue-treeselect__placeholder,
|
||||||
height: 30px;
|
::v-deep .vue-treeselect__single-value {
|
||||||
line-height: 30px;
|
height: 30px;
|
||||||
}
|
line-height: 30px;
|
||||||
</style>
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@ -1,104 +1,104 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog :visible.sync="dialog" append-to-body title="执行日志" width="88%">
|
<el-dialog :visible.sync="dialog" append-to-body title="执行日志" width="88%">
|
||||||
<!-- 搜索 -->
|
<!-- 搜索 -->
|
||||||
<div class="head-container">
|
<div class="head-container">
|
||||||
<el-input v-model="query.jobName" clearable size="small" placeholder="输入任务名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" />
|
<el-input v-model="query.jobName" clearable size="small" placeholder="输入任务名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" />
|
||||||
<date-range-picker v-model="query.createTime" class="date-item" />
|
<date-range-picker v-model="query.createTime" class="date-item" />
|
||||||
<el-select v-model="query.isSuccess" placeholder="日志状态" clearable size="small" class="filter-item" style="width: 110px" @change="toQuery">
|
<el-select v-model="query.isSuccess" placeholder="日志状态" clearable size="small" class="filter-item" style="width: 110px" @change="toQuery">
|
||||||
<el-option v-for="item in enabledTypeOptions" :key="item.key" :label="item.display_name" :value="item.key" />
|
<el-option v-for="item in enabledTypeOptions" :key="item.key" :label="item.display_name" :value="item.key" />
|
||||||
</el-select>
|
</el-select>
|
||||||
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
|
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
|
||||||
<!-- 导出 -->
|
<!-- 导出 -->
|
||||||
<div style="display: inline-block;">
|
<div style="display: inline-block;">
|
||||||
<el-button
|
<el-button
|
||||||
:loading="downloadLoading"
|
:loading="downloadLoading"
|
||||||
size="mini"
|
size="mini"
|
||||||
class="filter-item"
|
class="filter-item"
|
||||||
type="warning"
|
type="warning"
|
||||||
icon="el-icon-download"
|
icon="el-icon-download"
|
||||||
@click="downloadMethod"
|
@click="downloadMethod"
|
||||||
>导出</el-button>
|
>导出</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!--表格渲染-->
|
<!--表格渲染-->
|
||||||
<el-table v-loading="loading" :data="data" style="width: 100%;margin-top: -10px;">
|
<el-table v-loading="loading" :data="data" style="width: 100%;margin-top: -10px;" :header-cell-style="{'text-align':'left'}">
|
||||||
<el-table-column :show-overflow-tooltip="true" prop="jobName" label="任务名称" />
|
<el-table-column :show-overflow-tooltip="true" prop="jobName" label="任务名称" />
|
||||||
<el-table-column :show-overflow-tooltip="true" prop="beanName" label="Bean名称" />
|
<el-table-column :show-overflow-tooltip="true" prop="beanName" label="Bean名称" />
|
||||||
<el-table-column :show-overflow-tooltip="true" prop="methodName" label="执行方法" />
|
<el-table-column :show-overflow-tooltip="true" prop="methodName" label="执行方法" />
|
||||||
<el-table-column :show-overflow-tooltip="true" prop="params" width="120px" label="参数" />
|
<el-table-column :show-overflow-tooltip="true" prop="params" width="120px" label="参数" />
|
||||||
<el-table-column :show-overflow-tooltip="true" prop="cronExpression" label="cron表达式" />
|
<el-table-column :show-overflow-tooltip="true" prop="cronExpression" label="cron表达式" />
|
||||||
<el-table-column prop="createTime" label="异常详情" width="110px">
|
<el-table-column prop="createTime" label="异常详情" width="110px">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button v-show="scope.row.exceptionDetail" size="mini" type="text" @click="info(scope.row.exceptionDetail)">查看详情</el-button>
|
<el-button v-show="scope.row.exceptionDetail" size="mini" type="text" @click="info(scope.row.exceptionDetail)">查看详情</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column :show-overflow-tooltip="true" align="center" prop="time" width="100px" label="耗时(毫秒)" />
|
<el-table-column :show-overflow-tooltip="true" align="center" prop="time" width="100px" label="耗时(毫秒)" />
|
||||||
<el-table-column align="center" prop="isSuccess" width="80px" label="状态">
|
<el-table-column align="center" prop="isSuccess" width="80px" label="状态">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-tag :type="scope.row.isSuccess ? 'success' : 'danger'">{{ scope.row.isSuccess ? '成功' : '失败' }}</el-tag>
|
<el-tag :type="scope.row.isSuccess ? 'success' : 'danger'">{{ scope.row.isSuccess ? '成功' : '失败' }}</el-tag>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column :show-overflow-tooltip="true" prop="createTime" label="创建日期" />
|
<el-table-column :show-overflow-tooltip="true" prop="createTime" label="创建日期" />
|
||||||
</el-table>
|
</el-table>
|
||||||
<el-dialog :visible.sync="errorDialog" append-to-body title="异常详情" width="85%">
|
<el-dialog :visible.sync="errorDialog" append-to-body title="异常详情" width="85%">
|
||||||
<pre v-highlightjs="errorInfo"><code class="java" /></pre>
|
<pre v-highlightjs="errorInfo"><code class="java" /></pre>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
<!--分页组件-->
|
<!--分页组件-->
|
||||||
<el-pagination
|
<el-pagination
|
||||||
:total="total"
|
:total="total"
|
||||||
:current-page="page + 1"
|
:current-page="page + 1"
|
||||||
:page-size="6"
|
:page-size="6"
|
||||||
style="margin-top:8px;"
|
style="margin-top:8px;"
|
||||||
layout="total, prev, pager, next"
|
layout="total, prev, pager, next"
|
||||||
@size-change="sizeChange"
|
@size-change="sizeChange"
|
||||||
@current-change="pageChange"
|
@current-change="pageChange"
|
||||||
/>
|
/>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import crud from '@/mixins/crud'
|
import crud from '@/mixins/crud'
|
||||||
import DateRangePicker from '@/components/DateRangePicker'
|
import DateRangePicker from '@/components/DateRangePicker'
|
||||||
export default {
|
export default {
|
||||||
components: { DateRangePicker },
|
components: { DateRangePicker },
|
||||||
mixins: [crud],
|
mixins: [crud],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
title: '任务日志',
|
title: '任务日志',
|
||||||
errorInfo: '', errorDialog: false,
|
errorInfo: '', errorDialog: false,
|
||||||
enabledTypeOptions: [
|
enabledTypeOptions: [
|
||||||
{ key: 'true', display_name: '成功' },
|
{ key: 'true', display_name: '成功' },
|
||||||
{ key: 'false', display_name: '失败' }
|
{ key: 'false', display_name: '失败' }
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
doInit() {
|
doInit() {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.init()
|
this.init()
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
// 获取数据前设置好接口地址
|
// 获取数据前设置好接口地址
|
||||||
beforeInit() {
|
beforeInit() {
|
||||||
this.url = 'api-management/api/jobs/logs'
|
this.url = 'api-management/api/jobs/logs'
|
||||||
this.size = 6
|
this.size = 6
|
||||||
return true
|
return true
|
||||||
},
|
},
|
||||||
// 异常详情
|
// 异常详情
|
||||||
info(errorInfo) {
|
info(errorInfo) {
|
||||||
this.errorInfo = errorInfo
|
this.errorInfo = errorInfo
|
||||||
this.errorDialog = true
|
this.errorDialog = true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.java.hljs{
|
.java.hljs{
|
||||||
color: #444;
|
color: #444;
|
||||||
background: #ffffff !important;
|
background: #ffffff !important;
|
||||||
}
|
}
|
||||||
::v-deep .el-dialog__body{
|
::v-deep .el-dialog__body{
|
||||||
padding: 0 20px 10px 20px !important;
|
padding: 0 20px 10px 20px !important;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue