refactor(front): 重构前端组件和 API

- 更新了多个组件的样式和结构
- 重命名了一些 API 文件
- 添加了新的 API 接口
- 优化了部分代码的可读性和性能
This commit is contained in:
2025-07-23 20:58:15 +08:00
parent 091c056cd0
commit 902173a9e9
111 changed files with 1841 additions and 1198 deletions
+45 -15
View File
@@ -4,9 +4,25 @@
<div class="head-container">
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<el-input v-model="query.name" clearable size="small" placeholder="输入部门名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<el-input
v-model="query.name"
clearable
size="small"
placeholder="输入部门名称搜索"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
/>
<date-range-picker v-model="query.createTime" class="date-item" />
<el-select v-model="query.enabled" clearable size="small" placeholder="状态" class="filter-item" style="width: 90px" @change="crud.toQuery">
<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 />
@@ -14,7 +30,14 @@
<crudOperation :permission="permission" />
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="500px">
<el-dialog
append-to-body
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
width="500px"
>
<el-form ref="form" inline :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="部门名称" prop="name">
<el-input v-model="form.name" style="width: 370px;" />
@@ -44,7 +67,9 @@
/>
</el-form-item>
<el-form-item label="状态" prop="enabled">
<el-radio v-for="item in dict.dept_status" :key="item.id" v-model="form.enabled" :label="item.value">{{ item.label }}</el-radio>
<el-radio v-for="item in dict.dept_status" :key="item.id" v-model="form.enabled" :label="item.value">
{{ item.label }}
</el-radio>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@@ -80,7 +105,13 @@
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建日期" />
<el-table-column v-if="checkPer(['admin','dept:edit','dept:del'])" label="操作" width="130px" align="center" fixed="right">
<el-table-column
v-if="checkPer(['admin','dept:edit','dept:del'])"
label="操作"
width="130px"
align="center"
fixed="right"
>
<template slot-scope="scope">
<udOperation
:data="scope.row"
@@ -96,10 +127,9 @@
<script>
import crudDept from '@/api/system/dept'
import Treeselect from '@riophae/vue-treeselect'
import Treeselect, { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
@@ -254,13 +284,13 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .vue-treeselect__control,::v-deep .vue-treeselect__placeholder,::v-deep .vue-treeselect__single-value {
height: 30px;
line-height: 30px;
}
::v-deep .vue-treeselect__control, ::v-deep .vue-treeselect__placeholder, ::v-deep .vue-treeselect__single-value {
height: 30px;
line-height: 30px;
}
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
</style>
@@ -8,12 +8,27 @@
<div class="head-container">
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<el-input v-model="query.label" clearable size="small" placeholder="输入字典标签查询" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" />
<el-input
v-model="query.label"
clearable
size="small"
placeholder="输入字典标签查询"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="toQuery"
/>
<rrOperation />
</div>
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title" width="500px">
<el-dialog
append-to-body
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible="crud.status.cu > 0"
:title="crud.status.title"
width="500px"
>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="字典标签" prop="label">
<el-input v-model="form.label" style="width: 370px;" />
@@ -22,7 +37,13 @@
<el-input v-model="form.value" style="width: 370px;" />
</el-form-item>
<el-form-item label="排序" prop="dictSort">
<el-input-number v-model.number="form.dictSort" :min="0" :max="999" controls-position="right" style="width: 370px;" />
<el-input-number
v-model.number="form.dictSort"
:min="0"
:max="999"
controls-position="right"
style="width: 370px;"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@@ -31,14 +52,27 @@
</div>
</el-dialog>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" highlight-current-row style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table
ref="table"
v-loading="crud.loading"
:data="crud.data"
highlight-current-row
style="width: 100%;"
@selection-change="crud.selectionChangeHandler"
>
<el-table-column label="所属字典">
{{ query.dictName }}
</el-table-column>
<el-table-column prop="label" label="字典标签" />
<el-table-column prop="value" label="字典值" />
<el-table-column prop="dictSort" label="排序" />
<el-table-column v-if="checkPer(['admin','dict:edit','dict:del'])" label="操作" width="130px" align="center" fixed="right">
<el-table-column
v-if="checkPer(['admin','dict:edit','dict:del'])"
label="操作"
width="130px"
align="center"
fixed="right"
>
<template slot-scope="scope">
<udOperation
:data="scope.row"
@@ -55,7 +89,7 @@
<script>
import crudDictDetail from '@/api/system/dictDetail'
import CRUD, { presenter, header, form } from '@crud/crud'
import CRUD, { form, header, presenter } from '@crud/crud'
import pagination from '@crud/Pagination'
import rrOperation from '@crud/RR.operation'
import udOperation from '@crud/UD.operation'
@@ -66,7 +100,8 @@ export default {
components: { pagination, rrOperation, udOperation },
cruds() {
return [
CRUD({ title: '字典详情', url: 'api/dictDetail', query: { dictName: '' },
CRUD({
title: '字典详情', url: 'api/dictDetail', query: { dictName: '' },
crudMethod: { ...crudDictDetail },
optShow: {
add: true,
@@ -109,7 +144,7 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
</style>
+36 -6
View File
@@ -1,7 +1,14 @@
<template>
<div class="app-container">
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title" width="500px">
<el-dialog
append-to-body
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible="crud.status.cu > 0"
:title="crud.status.title"
width="500px"
>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="字典名称" prop="name">
<el-input v-model="form.name" style="width: 370px;" />
@@ -23,17 +30,39 @@
<div class="head-container">
<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" />
<el-input
v-model="query.blurry"
clearable
size="small"
placeholder="输入名称或者描述搜索"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
/>
<rrOperation />
</div>
<crudOperation :permission="permission" />
</div>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" highlight-current-row style="width: 100%;" @selection-change="crud.selectionChangeHandler" @current-change="handleCurrentChange">
<el-table
ref="table"
v-loading="crud.loading"
:data="crud.data"
highlight-current-row
style="width: 100%;"
@selection-change="crud.selectionChangeHandler"
@current-change="handleCurrentChange"
>
<el-table-column type="selection" width="55" />
<el-table-column :show-overflow-tooltip="true" prop="name" label="名称" />
<el-table-column :show-overflow-tooltip="true" prop="description" label="描述" />
<el-table-column v-if="checkPer(['admin','dict:edit','dict:del'])" label="操作" width="130px" align="center" fixed="right">
<el-table-column
v-if="checkPer(['admin','dict:edit','dict:del'])"
label="操作"
width="130px"
align="center"
fixed="right"
>
<template slot-scope="scope">
<udOperation
:data="scope.row"
@@ -59,7 +88,8 @@
type="primary"
icon="el-icon-plus"
@click="$refs.dictDetail && $refs.dictDetail.crud.toAdd()"
>新增</el-button>
>新增
</el-button>
</div>
<dictDetail ref="dictDetail" :permission="permission" />
</el-card>
@@ -71,7 +101,7 @@
<script>
import dictDetail from './dictDetail'
import crudDict from '@/api/system/dict'
import CRUD, { presenter, header, form } from '@crud/crud'
import CRUD, { form, header, presenter } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import rrOperation from '@crud/RR.operation'
@@ -4,6 +4,7 @@
<script>
import { mapGetters } from 'vuex'
import elFrame from '@/components/Iframe/index'
export default {
name: 'DruidSqlConsole',
components: { elFrame },
@@ -28,6 +28,7 @@
<script>
import { getLastEmailConfig, modifyEmailConfig } from '@/api/system/email'
export default {
name: 'Config',
data() {
@@ -17,7 +17,11 @@
# 密码(注意,某些邮箱需要为SMTP服务单独设置密码,如QQ和163等等)
# 是否开启ssl,默认开启</pre>
<blockquote class="my-blockquote">更多帮助</blockquote>
<pre class="my-code">更多帮助请查看文档:<a style="color:#009688" href="http://hutool.mydoc.io/#text_319499" target="_black">hutool工具包</a></pre>
<pre class="my-code">更多帮助请查看文档:<a
style="color:#009688"
href="http://hutool.mydoc.io/#text_319499"
target="_black"
>hutool工具包</a></pre>
</div>
</el-tab-pane>
</el-tabs>
@@ -26,6 +30,7 @@
<script>
import Config from './config.vue'
import Send from './send.vue'
export default {
name: 'Email',
components: { Config, Send },
+20 -11
View File
@@ -8,16 +8,24 @@
<el-input v-model="form.tos" style="width: 646px" placeholder="请输入收件地址,多个地址英文逗号,隔开" />
</el-form-item>
<div ref="editor" class="editor" />
<el-button :loading="loading" style="margin-left:1.6%;margin-bottom: 30px" size="medium" type="primary" @click="doSubmit">发送邮件</el-button>
<el-button
:loading="loading"
style="margin-left:1.6%;margin-bottom: 30px"
size="medium"
type="primary"
@click="doSubmit"
>发送邮件
</el-button>
</el-form>
</div>
</template>
<script>
import { sendEmail } from '@/api/system/email'
import { upload } from '@/utils/upload'
import { mapGetters } from 'vuex'
import E from 'wangeditor'
import { UploadFile } from '@/utils/CsDomUtil'
export default {
name: 'Index',
data() {
@@ -49,7 +57,7 @@ export default {
// files 是 input 中选中的文件列表
// insert 是获取图片 url 后,插入到编辑器的方法
files.forEach(image => {
upload(_this.imagesUploadApi, image).then(res => {
UploadFile(_this.imagesUploadApi, image).then(res => {
const data = res.data
const url = _this.baseApi + '/file/' + data.type + '/' + data.realName
insert(url)
@@ -87,12 +95,13 @@ export default {
</script>
<style scoped>
.editor{
text-align:left;
margin: 20px;
width: 730px;
}
::v-deep .w-e-text-container {
height: 360px !important;
}
.editor {
text-align: left;
margin: 20px;
width: 730px;
}
::v-deep .w-e-text-container {
height: 360px !important;
}
</style>
+11 -4
View File
@@ -6,7 +6,13 @@
<crudOperation :permission="permission" />
</div>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<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 prop="name" label="名称" />
<el-table-column prop="jobSort" label="排序">
@@ -56,6 +62,7 @@ import CRUD, { presenter } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import udOperation from '@crud/UD.operation'
export default {
name: 'Job',
components: { eHeader, eForm, crudOperation, pagination, udOperation },
@@ -103,7 +110,7 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
</style>
@@ -104,7 +104,7 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
</style>
@@ -2,9 +2,25 @@
<div
v-if="crud.props.searchToggle"
>
<el-input v-model="query.name" clearable size="small" placeholder="输入岗位名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<el-input
v-model="query.name"
clearable
size="small"
placeholder="输入岗位名称搜索"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
/>
<date-range-picker v-model="query.createTime" class="date-item" />
<el-select v-model="query.enabled" clearable size="small" placeholder="状态" class="filter-item" style="width: 90px" @change="crud.toQuery">
<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 />
@@ -15,6 +31,7 @@
import { header } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import DateRangePicker from '@/components/DateRangePicker'
export default {
components: { rrOperation, DateRangePicker },
mixins: [header()],
+85 -20
View File
@@ -4,14 +4,29 @@
<div class="head-container">
<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" />
<el-input
v-model="query.blurry"
clearable
size="small"
placeholder="模糊搜索"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
/>
<date-range-picker v-model="query.createTime" class="date-item" />
<rrOperation />
</div>
<crudOperation :permission="permission" />
</div>
<!--表单渲染-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="580px">
<el-dialog
append-to-body
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
width="580px"
>
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="菜单类型" prop="type">
<el-radio-group v-model="form.type" size="mini" style="width: 178px">
@@ -29,7 +44,13 @@
>
<IconSelect ref="iconSelect" @selected="selected" />
<el-input slot="reference" v-model="form.icon" style="width: 450px;" placeholder="点击选择图标" readonly>
<svg-icon v-if="form.icon" slot="prefix" :icon-class="form.icon" class="el-input__icon" style="height: 32px;width: 16px;" />
<svg-icon
v-if="form.icon"
slot="prefix"
:icon-class="form.icon"
class="el-input__icon"
style="height: 32px;width: 16px;"
/>
<i v-else slot="prefix" class="el-icon-search el-input__icon" />
</el-input>
</el-popover>
@@ -53,24 +74,47 @@
</el-radio-group>
</el-form-item>
<el-form-item v-if="form.type.toString() !== '2'" label="菜单标题" prop="title">
<el-input v-model="form.title" :style=" form.type.toString() === '0' ? 'width: 450px' : 'width: 178px'" placeholder="菜单标题" />
<el-input
v-model="form.title"
:style=" form.type.toString() === '0' ? 'width: 450px' : 'width: 178px'"
placeholder="菜单标题"
/>
</el-form-item>
<el-form-item v-if="form.type.toString() === '2'" label="按钮名称" prop="title">
<el-input v-model="form.title" placeholder="按钮名称" style="width: 178px;" />
</el-form-item>
<el-form-item v-show="form.type.toString() !== '0'" label="权限标识" prop="permission">
<el-input v-model="form.permission" :disabled="form.iFrame.toString() === 'true'" placeholder="权限标识" style="width: 178px;" />
<el-input
v-model="form.permission"
:disabled="form.iFrame.toString() === 'true'"
placeholder="权限标识"
style="width: 178px;"
/>
</el-form-item>
<el-form-item v-if="form.type.toString() !== '2'" label="路由地址" prop="path">
<el-input v-model="form.path" placeholder="路由地址" style="width: 178px;" />
</el-form-item>
<el-form-item label="菜单排序" prop="menuSort">
<el-input-number v-model.number="form.menuSort" :min="0" :max="999" controls-position="right" style="width: 178px;" />
<el-input-number
v-model.number="form.menuSort"
:min="0"
:max="999"
controls-position="right"
style="width: 178px;"
/>
</el-form-item>
<el-form-item v-show="form.iFrame.toString() !== 'true' && form.type.toString() === '1'" label="组件名称" prop="componentName">
<el-form-item
v-show="form.iFrame.toString() !== 'true' && form.type.toString() === '1'"
label="组件名称"
prop="componentName"
>
<el-input v-model="form.componentName" style="width: 450px;" placeholder="匹配组件内Name字段" />
</el-form-item>
<el-form-item v-show="form.iFrame.toString() !== 'true' && form.type.toString() === '1'" label="组件路径" prop="component">
<el-form-item
v-show="form.iFrame.toString() !== 'true' && form.type.toString() === '1'"
label="组件路径"
prop="component"
>
<el-input v-model="form.component" style="width: 450px;" placeholder="组件路径" />
</el-form-item>
<el-form-item label="上级类目" prop="pid">
@@ -134,7 +178,13 @@
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建日期" width="135px" />
<el-table-column v-if="checkPer(['admin','menu:edit','menu:del'])" label="操作" width="130px" align="center" fixed="right">
<el-table-column
v-if="checkPer(['admin','menu:edit','menu:del'])"
label="操作"
width="130px"
align="center"
fixed="right"
>
<template slot-scope="scope">
<udOperation
:data="scope.row"
@@ -150,17 +200,31 @@
<script>
import crudMenu from '@/api/system/menu'
import IconSelect from '@/components/IconSelect'
import Treeselect from '@riophae/vue-treeselect'
import Treeselect, { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import DateRangePicker from '@/components/DateRangePicker'
// crud交由presenter持有
const defaultForm = { id: null, title: null, menuSort: 999, path: null, component: null, componentName: null, iFrame: false, roles: [], pid: 0, icon: null, cache: false, hidden: false, type: 0, permission: null }
const defaultForm = {
id: null,
title: null,
menuSort: 999,
path: null,
component: null,
componentName: null,
iFrame: false,
roles: [],
pid: 0,
icon: null,
cache: false,
hidden: false,
type: 0,
permission: null
}
export default {
name: 'Menu',
components: { Treeselect, IconSelect, crudOperation, rrOperation, udOperation, DateRangePicker },
@@ -246,11 +310,12 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::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__single-value {
height: 30px;
line-height: 30px;
}
::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__single-value {
height: 30px;
line-height: 30px;
}
</style>
@@ -2,7 +2,15 @@
<div class="app-container">
<div class="head-container">
<div v-if="crud.props.searchToggle">
<el-input v-model="query.userName" clearable size="small" placeholder="输入用户名称查询" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<el-input
v-model="query.userName"
clearable
size="small"
placeholder="输入用户名称查询"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
/>
<rrOperation />
</div>
<crudOperation>
@@ -21,7 +29,13 @@
</crudOperation>
</div>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<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 :show-overflow-tooltip="true" prop="uid" label="会话编号" />
<el-table-column prop="userName" label="用户名" />
@@ -42,7 +56,13 @@
<p>确定强制退出该用户吗?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="$refs[scope.$index].doClose()">取消</el-button>
<el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.key, scope.$index)">确定</el-button>
<el-button
:loading="delLoading"
type="primary"
size="mini"
@click="delMethod(scope.row.key, scope.$index)"
>确定
</el-button>
</div>
<el-button slot="reference" size="mini" type="text">强退</el-button>
</el-popover>
@@ -56,7 +76,7 @@
<script>
import { kickOutUser } from '@/api/system/online'
import CRUD, { presenter, header, crud } from '@crud/crud'
import CRUD, { crud, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
@@ -91,7 +111,8 @@ export default {
type: 'warning'
}).then(() => {
this.delMethod(datas)
}).catch(() => {})
}).catch(() => {
})
},
// 踢出用户
delMethod(key, index) {
@@ -4,7 +4,15 @@
<div class="head-container">
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<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" />
<rrOperation />
</div>
@@ -17,12 +25,20 @@
type="info"
icon="el-icon-tickets"
@click="doLog"
>日志</el-button>
>日志
</el-button>
</crudOperation>
<Log ref="log" />
</div>
<!--Form表单-->
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" append-to-body width="730px">
<el-dialog
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
append-to-body
width="730px"
>
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="100px">
<el-form-item label="任务名称" prop="jobName">
<el-input v-model="form.jobName" style="width: 220px;" />
@@ -70,7 +86,13 @@
</div>
</el-dialog>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<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 :show-overflow-tooltip="true" prop="id" label="任务ID" />
<el-table-column :show-overflow-tooltip="true" prop="jobName" label="任务名称" />
@@ -80,16 +102,45 @@
<el-table-column :show-overflow-tooltip="true" prop="cronExpression" 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>
<el-tag :type="scope.row.isPause ? 'warning' : 'success'">{{
scope.row.isPause ? '已暂停' : '运行中'
}}
</el-tag>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" prop="description" width="150px" label="描述" />
<el-table-column :show-overflow-tooltip="true" prop="createTime" width="136px" label="创建日期" />
<el-table-column v-if="checkPer(['admin','quartzJob:edit','quartzJob:del'])" label="操作" width="170px" align="center" fixed="right">
<el-table-column
v-if="checkPer(['admin','quartzJob:edit','quartzJob:del'])"
label="操作"
width="170px"
align="center"
fixed="right"
>
<template slot-scope="scope">
<el-button v-permission="['admin','quartzJob:edit']" size="mini" style="margin-right: 3px;" type="text" @click="crud.toEdit(scope.row)">编辑</el-button>
<el-button v-permission="['admin','quartzJob:edit']" style="margin-left: -2px" type="text" size="mini" @click="execute(scope.row.id)">执行</el-button>
<el-button v-permission="['admin','quartzJob:edit']" style="margin-left: 3px" type="text" size="mini" @click="updateStatus(scope.row.id,scope.row.isPause ? '恢复' : '暂停')">
<el-button
v-permission="['admin','quartzJob:edit']"
size="mini"
style="margin-right: 3px;"
type="text"
@click="crud.toEdit(scope.row)"
>编辑
</el-button>
<el-button
v-permission="['admin','quartzJob:edit']"
style="margin-left: -2px"
type="text"
size="mini"
@click="execute(scope.row.id)"
>执行
</el-button>
<el-button
v-permission="['admin','quartzJob:edit']"
style="margin-left: 3px"
type="text"
size="mini"
@click="updateStatus(scope.row.id,scope.row.isPause ? '恢复' : '暂停')"
>
{{ scope.row.isPause ? '恢复' : '暂停' }}
</el-button>
<el-popover
@@ -101,7 +152,8 @@
<p>确定停止并删除该任务吗?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button>
<el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.id)">确定</el-button>
<el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.id)">确定
</el-button>
</div>
<el-button slot="reference" type="text" size="mini">删除</el-button>
</el-popover>
@@ -116,13 +168,26 @@
<script>
import crudJob from '@/api/system/quartzJob'
import Log from './log'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import DateRangePicker from '@/components/DateRangePicker'
const defaultForm = { id: null, jobName: null, subTask: null, beanName: null, methodName: null, params: null, cronExpression: null, pauseAfterFailure: true, isPause: false, personInCharge: null, email: null, description: null }
const defaultForm = {
id: null,
jobName: null,
subTask: null,
beanName: null,
methodName: null,
params: null,
cronExpression: null,
pauseAfterFailure: true,
isPause: false,
personInCharge: null,
email: null,
description: null
}
export default {
name: 'QuartzJob',
components: { Log, pagination, crudOperation, rrOperation, DateRangePicker },
@@ -2,9 +2,25 @@
<el-dialog :visible.sync="dialog" append-to-body title="执行日志" width="88%">
<!-- 搜索 -->
<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" />
<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.displayName" :value="item.key" />
</el-select>
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
@@ -17,7 +33,8 @@
type="warning"
icon="el-icon-download"
@click="downloadMethod"
>导出</el-button>
>导出
</el-button>
</div>
</div>
<!--表格渲染-->
@@ -29,13 +46,22 @@
<el-table-column :show-overflow-tooltip="true" prop="cronExpression" label="cron表达式" />
<el-table-column prop="createTime" label="异常详情" width="110px">
<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>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" prop="time" width="100px" label="耗时(毫秒)" />
<el-table-column align="center" prop="isSuccess" width="80px" label="状态">
<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>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" prop="createTime" label="创建日期" />
@@ -59,6 +85,7 @@
<script>
import crud from '@/mixins/crud'
import DateRangePicker from '@/components/DateRangePicker'
export default {
components: { DateRangePicker },
// Mixins 是一种包含多个组件选项的对象。可以将 mixin 作为组件的一个选项引入,从而在该组件中“混入”这个对象的选项。通过这种方式,mixins 可以帮助你实现功能复用,减少重复代码。
@@ -96,11 +123,12 @@ export default {
</script>
<style scoped>
.java.hljs{
color: #444;
background: #ffffff !important;
}
::v-deep .el-dialog__body{
padding: 0 20px 10px 20px !important;
}
.java.hljs {
color: #444;
background: #ffffff !important;
}
::v-deep .el-dialog__body {
padding: 0 20px 10px 20px !important;
}
</style>
+55 -23
View File
@@ -4,14 +4,29 @@
<div class="head-container">
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<el-input v-model="query.blurry" size="small" clearable placeholder="输入名称或者描述搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<el-input
v-model="query.blurry"
size="small"
clearable
placeholder="输入名称或者描述搜索"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
/>
<date-range-picker v-model="query.createTime" class="date-item" />
<rrOperation />
</div>
<crudOperation :permission="permission" />
</div>
<!-- 表单渲染 -->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="520px">
<el-dialog
append-to-body
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
width="520px"
>
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="角色名称" prop="name">
<el-input v-model="form.name" style="width: 380px;" />
@@ -58,7 +73,15 @@
<div slot="header" class="clearfix">
<span class="role-span">角色列表</span>
</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
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 prop="name" label="名称" />
<el-table-column prop="dataScope" label="数据权限" />
@@ -69,7 +92,13 @@
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" width="135px" prop="createTime" label="创建日期" />
<el-table-column v-if="checkPer(['admin','roles:edit','roles:del'])" label="操作" width="130px" align="center" fixed="right">
<el-table-column
v-if="checkPer(['admin','roles:edit','roles:del'])"
label="操作"
width="130px"
align="center"
fixed="right"
>
<template slot-scope="scope">
<udOperation
v-if="scope.row.level >= level"
@@ -99,7 +128,8 @@
style="float: right; padding: 6px 9px"
type="primary"
@click="saveMenu"
>保存</el-button>
>保存
</el-button>
</div>
<el-tree
ref="menu"
@@ -123,15 +153,14 @@
<script>
import crudRoles from '@/api/system/role'
import { queryDeptList, queryDeptSuperiorTree } from '@/api/system/dept'
import { queryMenuListByPid, queryChildMenuSet } from '@/api/system/menu'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import { queryChildMenuSet, queryMenuListByPid } from '@/api/system/menu'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import Treeselect from '@riophae/vue-treeselect'
import Treeselect, { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import DateRangePicker from '@/components/DateRangePicker'
const defaultForm = { id: null, name: null, depts: [], description: null, dataScope: '全部', level: 3 }
@@ -352,21 +381,24 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss">
.role-span {
font-weight: bold;color: #303133;
font-size: 15px;
}
.role-span {
font-weight: bold;
color: #303133;
font-size: 15px;
}
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
::v-deep .vue-treeselect__multi-value{
margin-bottom: 0;
}
::v-deep .vue-treeselect__multi-value-item{
border: 0;
padding: 0;
}
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
::v-deep .vue-treeselect__multi-value {
margin-bottom: 0;
}
::v-deep .vue-treeselect__multi-value-item {
border: 0;
padding: 0;
}
</style>
@@ -1,5 +1,10 @@
<template>
<div v-loading="!show" element-loading-text="数据加载中..." :style="!show ? 'height: 500px' : 'height: 100%'" class="app-container">
<div
v-loading="!show"
element-loading-text="数据加载中..."
:style="!show ? 'height: 500px' : 'height: 100%'"
class="app-container"
>
<div v-if="show">
<el-card class="box-card">
<div style="color: #666;font-size: 13px;">
@@ -139,6 +144,7 @@ import ECharts from 'vue-echarts'
import 'echarts/lib/chart/line'
import 'echarts/lib/component/polar'
import { initDataByPost } from '@/api/data'
export default {
name: 'ServerMonitor',
components: {
@@ -251,41 +257,47 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .box-card {
margin-bottom: 5px;
span {
margin-right: 28px;
}
.el-icon-refresh {
margin-right: 10px;
float: right;
cursor:pointer;
}
::v-deep .box-card {
margin-bottom: 5px;
span {
margin-right: 28px;
}
.cpu, .memory, .swap, .disk {
width: 20%;
float: left;
padding-bottom: 20px;
margin-right: 5%;
}
.title {
text-align: center;
font-size: 15px;
font-weight: 500;
color: #999;
margin-bottom: 16px;
}
.footer {
text-align: center;
font-size: 15px;
font-weight: 500;
color: #999;
margin-top: -5px;
margin-bottom: 10px;
}
.content {
text-align: center;
margin-top: 5px;
margin-bottom: 5px;
.el-icon-refresh {
margin-right: 10px;
float: right;
cursor: pointer;
}
}
.cpu, .memory, .swap, .disk {
width: 20%;
float: left;
padding-bottom: 20px;
margin-right: 5%;
}
.title {
text-align: center;
font-size: 15px;
font-weight: 500;
color: #999;
margin-bottom: 16px;
}
.footer {
text-align: center;
font-size: 15px;
font-weight: 500;
color: #999;
margin-top: -5px;
margin-bottom: 10px;
}
.content {
text-align: center;
margin-top: 5px;
margin-bottom: 5px;
}
</style>
@@ -12,6 +12,7 @@
<script>
import Local from './local/index.vue'
import Oss from './oss/index.vue'
export default {
name: 'Storage',
components: { Local, Oss },
@@ -4,7 +4,15 @@
<div class="head-container">
<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" />
<el-input
v-model="query.blurry"
clearable
size="small"
placeholder="输入内容模糊搜索"
style="width: 200px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"
/>
<date-range-picker v-model="query.createTime" class="date-item" />
<rrOperation />
</div>
@@ -23,7 +31,14 @@
</crudOperation>
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.add ? '文件上传' : '编辑文件'" width="500px">
<el-dialog
append-to-body
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.add ? '文件上传' : '编辑文件'"
width="500px"
>
<el-form ref="form" :model="form" size="small" label-width="80px">
<el-form-item label="文件名">
<el-input v-model="form.name" style="width: 370px;" />
@@ -52,7 +67,13 @@
</div>
</el-dialog>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<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 prop="name" label="文件名">
<template slot-scope="scope">
@@ -105,7 +126,7 @@
import { mapGetters } from 'vuex'
import { getToken } from '@/utils/auth'
import crudFile from '@/api/system/localStorage'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
@@ -175,10 +196,11 @@ export default {
</script>
<style scoped>
::v-deep .el-image__error, .el-image__placeholder{
background: none;
}
::v-deep .el-image-viewer__wrapper{
top: 55px;
}
::v-deep .el-image__error, .el-image__placeholder {
background: none;
}
::v-deep .el-image-viewer__wrapper {
top: 55px;
}
</style>
@@ -95,7 +95,7 @@
import { mapGetters } from 'vuex'
import { getToken } from '@/utils/auth'
import crudFile from '@/api/system/ossStorage'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
+76 -30
View File
@@ -9,7 +9,12 @@
<div>
<div style="text-align: center">
<div class="el-upload">
<img :src="user.avatarName ? baseApi + '/avatar/' + user.avatarName : Avatar" title="点击上传头像" class="avatar" @click="toggleShow">
<img
:src="user.avatarName ? baseApi + '/avatar/' + user.avatarName : Avatar"
title="点击上传头像"
class="avatar"
@click="toggleShow"
>
<myUpload
v-model="show"
:headers="headers"
@@ -19,13 +24,36 @@
</div>
</div>
<ul class="user-info">
<li><div style="height: 100%"><svg-icon icon-class="login" /> 登录账号<div class="user-right">{{ user.username }}</div></div></li>
<li><svg-icon icon-class="user1" /> 用户昵称 <div class="user-right">{{ user.nickName }}</div></li>
<li><svg-icon icon-class="dept" /> 所属部门 <div class="user-right"> {{ user.dept.name }}</div></li>
<li><svg-icon icon-class="phone" /> 手机号码 <div class="user-right">{{ user.phone }}</div></li>
<li><svg-icon icon-class="email" /> 用户邮箱 <div class="user-right">{{ user.email }}</div></li>
<li>
<svg-icon icon-class="anq" /> 安全设置
<div style="height: 100%">
<svg-icon icon-class="login" />
登录账号
<div class="user-right">{{ user.username }}</div>
</div>
</li>
<li>
<svg-icon icon-class="user1" />
用户昵称
<div class="user-right">{{ user.nickName }}</div>
</li>
<li>
<svg-icon icon-class="dept" />
所属部门
<div class="user-right"> {{ user.dept.name }}</div>
</li>
<li>
<svg-icon icon-class="phone" />
手机号码
<div class="user-right">{{ user.phone }}</div>
</li>
<li>
<svg-icon icon-class="email" />
用户邮箱
<div class="user-right">{{ user.email }}</div>
</li>
<li>
<svg-icon icon-class="anq" />
安全设置
<div class="user-right">
<a @click="$refs.pass.dialog = true">修改密码</a>
<a @click="$refs.email.dialog = true">修改邮箱</a>
@@ -40,7 +68,14 @@
<el-card class="box-card">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="用户资料" name="first">
<el-form ref="form" :model="form" :rules="rules" style="margin-top: 10px;" size="small" label-width="65px">
<el-form
ref="form"
:model="form"
:rules="rules"
style="margin-top: 10px;"
size="small"
label-width="65px"
>
<el-form-item label="昵称" prop="nickName">
<el-input v-model="form.nickName" style="width: 35%" />
<span style="color: #C0C0C0;margin-left: 10px;">用户昵称不作为登录使用</span>
@@ -78,7 +113,10 @@
align="right"
>
<template slot="header">
<div style="display:inline-block;float: right;cursor: pointer" @click="init">创建日期<i class="el-icon-refresh" style="margin-left: 40px" /></div>
<div style="display:inline-block;float: right;cursor: pointer" @click="init">创建日期<i
class="el-icon-refresh"
style="margin-left: 40px"
/></div>
</template>
<template slot-scope="scope">
<span>{{ scope.row.createTime }}</span>
@@ -111,10 +149,11 @@ import updatePass from './center/updatePass'
import updateEmail from './center/updateEmail'
import { getToken } from '@/utils/auth'
import store from '@/store'
import { isvalidPhone } from '@/utils/validate'
import { isvalidPhone } from '@/utils/CsValidateUtil'
import crud from '@/mixins/crud'
import { editUser } from '@/api/system/user'
import Avatar from '@/assets/images/avatar.png'
export default {
name: 'Center',
components: { updatePass, updateEmail, myUpload },
@@ -159,7 +198,8 @@ export default {
},
created() {
this.form = { id: this.user.id, nickName: this.user.nickName, gender: this.user.gender, phone: this.user.phone }
store.dispatch('GetInfo').then(() => {})
store.dispatch('GetInfo').then(() => {
})
},
methods: {
toggleShow() {
@@ -175,7 +215,8 @@ export default {
return true
},
cropUploadSuccess(jsonData, field) {
store.dispatch('GetInfo').then(() => {})
store.dispatch('GetInfo').then(() => {
})
},
doSubmit() {
if (this.$refs['form']) {
@@ -184,7 +225,8 @@ export default {
this.saveLoading = true
editUser(this.form).then(() => {
this.editSuccessNotify()
store.dispatch('GetInfo').then(() => {})
store.dispatch('GetInfo').then(() => {
})
this.saveLoading = false
}).catch(() => {
this.saveLoading = false
@@ -198,24 +240,28 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss">
.avatar {
width: 120px;
height: 120px;
border-radius: 50%;
.avatar {
width: 120px;
height: 120px;
border-radius: 50%;
}
.user-info {
padding-left: 0;
list-style: none;
li {
border-bottom: 1px solid #F0F3F4;
padding: 11px 0;
font-size: 13px;
}
.user-info {
padding-left: 0;
list-style: none;
li{
border-bottom: 1px solid #F0F3F4;
padding: 11px 0;
font-size: 13px;
}
.user-right {
float: right;
a{
color: #317EF3;
}
.user-right {
float: right;
a {
color: #317EF3;
}
}
}
</style>
@@ -1,10 +1,21 @@
<template>
<div style="display: inline-block;">
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" :title="title" append-to-body width="475px" @close="cancel">
<el-dialog
:visible.sync="dialog"
:close-on-click-modal="false"
:before-close="cancel"
:title="title"
append-to-body
width="475px"
@close="cancel"
>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="88px">
<el-form-item label="新邮箱" prop="email">
<el-input v-model="form.email" auto-complete="on" style="width: 200px;" />
<el-button :loading="codeLoading" :disabled="isDisabled" size="small" @click="sendCode">{{ buttonName }}</el-button>
<el-button :loading="codeLoading" :disabled="isDisabled" size="small" @click="sendCode">{{
buttonName
}}
</el-button>
</el-form-item>
<el-form-item label="验证码" prop="code">
<el-input v-model="form.code" style="width: 320px;" />
@@ -23,9 +34,10 @@
<script>
import store from '@/store'
import { validEmail } from '@/utils/validate'
import { validEmail } from '@/utils/CsValidateUtil'
import { updateEmail } from '@/api/system/user'
import { sendResetEmailCaptcha } from '@/api/system/code'
export default {
props: {
email: {
@@ -109,7 +121,8 @@ export default {
type: 'success',
duration: 1500
})
store.dispatch('GetInfo').then(() => {})
store.dispatch('GetInfo').then(() => {
})
}).catch(err => {
this.loading = false
console.log(err.response.data.message)
@@ -1,6 +1,14 @@
<template>
<div style="display: inline-block">
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" :title="title" append-to-body width="500px" @close="cancel">
<el-dialog
:visible.sync="dialog"
:close-on-click-modal="false"
:before-close="cancel"
:title="title"
append-to-body
width="500px"
@close="cancel"
>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="88px">
<el-form-item label="旧密码" prop="oldPass">
<el-input v-model="form.oldPass" type="password" auto-complete="on" style="width: 370px;" />
@@ -23,6 +31,7 @@
<script>
import store from '@/store'
import { updatePass } from '@/api/system/user'
export default {
data() {
const confirmPass = (rule, value, callback) => {
+46 -17
View File
@@ -52,7 +52,14 @@
</crudOperation>
</div>
<!--表单渲染-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="555px">
<el-dialog
append-to-body
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
width="555px"
>
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="66px">
<el-form-item label="用户名" prop="username">
<el-input v-model="form.username" @keydown.native="keydown($event)" />
@@ -104,7 +111,8 @@
v-for="item in dict.user_status"
:key="item.id"
:label="item.value"
>{{ item.label }}</el-radio>
>{{ item.label }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item style="margin-bottom: 0;" label="角色" prop="roleDatas" class="is-required">
@@ -133,7 +141,13 @@
</div>
</el-dialog>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<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 :show-overflow-tooltip="true" prop="username" label="用户名" />
<el-table-column :show-overflow-tooltip="true" prop="nickName" label="昵称" />
@@ -182,24 +196,35 @@
<script>
import crudUser from '@/api/system/user'
import { isvalidPhone } from '@/utils/validate'
import { isvalidPhone } from '@/utils/CsValidateUtil'
import { queryDeptList, queryDeptSuperiorTree } from '@/api/system/dept'
import { queryRoleList, getLevel } from '@/api/system/role'
import { getLevel, queryRoleList } from '@/api/system/role'
import { queryAllEnableJob } from '@/api/system/job'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import DateRangePicker from '@/components/DateRangePicker'
import Treeselect from '@riophae/vue-treeselect'
import Treeselect, { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import { mapGetters } from 'vuex'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import CuteDeptTree from '@/views/components/business/CuteDeptTree'
let userRoles = []
let userJobs = []
const defaultForm = { id: null, username: null, nickName: null, gender: '男', email: null, enabled: 'false', roles: [], jobs: [], dept: { id: null }, phone: null }
const defaultForm = {
id: null,
username: null,
nickName: null,
gender: '男',
email: null,
enabled: 'false',
roles: [],
jobs: [],
dept: { id: null },
phone: null
}
export default {
name: 'User',
components: { CuteDeptTree, Treeselect, crudOperation, rrOperation, udOperation, pagination, DateRangePicker },
@@ -446,19 +471,22 @@ export default {
getRoles() {
queryRoleList().then(res => {
this.roles = res
}).catch(() => { })
}).catch(() => {
})
},
// 获取弹窗内岗位数据
getJobs() {
queryAllEnableJob().then(res => {
this.jobs = res.content
}).catch(() => { })
}).catch(() => {
})
},
// 获取权限级别
getRoleLevel() {
getLevel().then(res => {
this.level = res.level
}).catch(() => { })
}).catch(() => {
})
},
checkboxT(row, rowIndex) {
return row.id !== this.user.id
@@ -476,7 +504,8 @@ export default {
console.log(ids)
crudUser.resetPwd(ids).then(() => {
this.crud.notify('重置成功, 用户新密码:123456', CRUD.NOTIFICATION_TYPE.SUCCESS)
}).catch(() => {})
}).catch(() => {
})
}).catch(() => {
})
}
@@ -485,8 +514,8 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .vue-treeselect__control,::v-deep .vue-treeselect__placeholder,::v-deep .vue-treeselect__single-value {
height: 30px;
line-height: 30px;
}
::v-deep .vue-treeselect__control, ::v-deep .vue-treeselect__placeholder, ::v-deep .vue-treeselect__single-value {
height: 30px;
line-height: 30px;
}
</style>