修改数据字典回显

This commit is contained in:
马小法 2021-08-30 16:53:16 +08:00
parent c628aa5be8
commit 8040ad8c03
9 changed files with 2893 additions and 2911 deletions

File diff suppressed because it is too large Load Diff

View File

@ -110,10 +110,18 @@
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="日志编号" width="80" align="center" prop="jobLogId" /> <el-table-column label="日志编号" width="80" align="center" prop="jobLogId" />
<el-table-column label="任务名称" align="center" prop="jobName" :show-overflow-tooltip="true" /> <el-table-column label="任务名称" align="center" prop="jobName" :show-overflow-tooltip="true" />
<el-table-column label="任务组名" align="center" prop="jobGroup" :formatter="jobGroupFormat" :show-overflow-tooltip="true" /> <el-table-column label="任务组名" align="center" prop="jobGroup" :show-overflow-tooltip="true">
<template slot-scope="scope">
<dict-tag :options="jobGroupOptions" :value="scope.row.jobGroup"/>
</template>
</el-table-column>
<el-table-column label="调用目标字符串" align="center" prop="invokeTarget" :show-overflow-tooltip="true" /> <el-table-column label="调用目标字符串" align="center" prop="invokeTarget" :show-overflow-tooltip="true" />
<el-table-column label="日志信息" align="center" prop="jobMessage" :show-overflow-tooltip="true" /> <el-table-column label="日志信息" align="center" prop="jobMessage" :show-overflow-tooltip="true" />
<el-table-column label="执行状态" align="center" prop="status" :formatter="statusFormat" /> <el-table-column label="执行状态" align="center" prop="status">
<template slot-scope="scope">
<dict-tag :options="statusOptions" :value="scope.row.status"/>
</template>
</el-table-column>
<el-table-column label="执行时间" align="center" prop="createTime" width="180"> <el-table-column label="执行时间" align="center" prop="createTime" width="180">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span> <span>{{ parseTime(scope.row.createTime) }}</span>
@ -247,14 +255,6 @@ export default {
} }
); );
}, },
//
statusFormat(row, column) {
return this.selectDictLabel(this.statusOptions, row.status);
},
//
jobGroupFormat(row, column) {
return this.selectDictLabel(this.jobGroupOptions, row.jobGroup);
},
// //
handleClose() { handleClose() {
this.$store.dispatch("tagsView/delView", this.$route); this.$store.dispatch("tagsView/delView", this.$route);
@ -325,4 +325,4 @@ export default {
} }
} }
}; };
</script> </script>

View File

@ -1,247 +1,247 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="登录地址" prop="ipaddr"> <el-form-item label="登录地址" prop="ipaddr">
<el-input <el-input
v-model="queryParams.ipaddr" v-model="queryParams.ipaddr"
placeholder="请输入登录地址" placeholder="请输入登录地址"
clearable clearable
style="width: 240px;" style="width: 240px;"
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="用户名称" prop="userName"> <el-form-item label="用户名称" prop="userName">
<el-input <el-input
v-model="queryParams.userName" v-model="queryParams.userName"
placeholder="请输入用户名称" placeholder="请输入用户名称"
clearable clearable
style="width: 240px;" style="width: 240px;"
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="状态" prop="status"> <el-form-item label="状态" prop="status">
<el-select <el-select
v-model="queryParams.status" v-model="queryParams.status"
placeholder="登录状态" placeholder="登录状态"
clearable clearable
size="small" size="small"
style="width: 240px" style="width: 240px"
> >
<el-option <el-option
v-for="dict in statusOptions" v-for="dict in statusOptions"
:key="dict.dictValue" :key="dict.dictValue"
:label="dict.dictLabel" :label="dict.dictLabel"
:value="dict.dictValue" :value="dict.dictValue"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="登录时间"> <el-form-item label="登录时间">
<el-date-picker <el-date-picker
v-model="dateRange" v-model="dateRange"
size="small" size="small"
style="width: 240px" style="width: 240px"
value-format="yyyy-MM-dd" value-format="yyyy-MM-dd"
type="daterange" type="daterange"
range-separator="-" range-separator="-"
start-placeholder="开始日期" start-placeholder="开始日期"
end-placeholder="结束日期" end-placeholder="结束日期"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
plain plain
icon="el-icon-delete" icon="el-icon-delete"
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete" @click="handleDelete"
v-hasPermi="['monitor:logininfor:remove']" v-hasPermi="['monitor:logininfor:remove']"
>删除</el-button> >删除</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
plain plain
icon="el-icon-delete" icon="el-icon-delete"
size="mini" size="mini"
@click="handleClean" @click="handleClean"
v-hasPermi="['monitor:logininfor:remove']" v-hasPermi="['monitor:logininfor:remove']"
>清空</el-button> >清空</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="warning" type="warning"
plain plain
icon="el-icon-download" icon="el-icon-download"
size="mini" size="mini"
:loading="exportLoading" :loading="exportLoading"
@click="handleExport" @click="handleExport"
v-hasPermi="['monitor:logininfor:export']" v-hasPermi="['monitor:logininfor:export']"
>导出</el-button> >导出</el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table ref="tables" v-loading="loading" :data="list" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange"> <el-table ref="tables" v-loading="loading" :data="list" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="访问编号" align="center" prop="infoId" /> <el-table-column label="访问编号" align="center" prop="infoId" />
<el-table-column label="用户名称" align="center" prop="userName" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" /> <el-table-column label="用户名称" align="center" prop="userName" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" />
<el-table-column label="登录地址" align="center" prop="ipaddr" width="130" :show-overflow-tooltip="true" /> <el-table-column label="登录地址" align="center" prop="ipaddr" width="130" :show-overflow-tooltip="true" />
<el-table-column label="登录地点" align="center" prop="loginLocation" :show-overflow-tooltip="true" /> <el-table-column label="登录地点" align="center" prop="loginLocation" :show-overflow-tooltip="true" />
<el-table-column label="浏览器" align="center" prop="browser" :show-overflow-tooltip="true" /> <el-table-column label="浏览器" align="center" prop="browser" :show-overflow-tooltip="true" />
<el-table-column label="操作系统" align="center" prop="os" /> <el-table-column label="操作系统" align="center" prop="os" />
<el-table-column label="登录状态" align="center" prop="status" :formatter="statusFormat" /> <el-table-column label="登录状态" align="center" prop="status">
<el-table-column label="操作信息" align="center" prop="msg" /> <template slot-scope="scope">
<el-table-column label="登录日期" align="center" prop="loginTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180"> <dict-tag :options="statusOptions" :value="scope.row.status"/>
<template slot-scope="scope"> </template>
<span>{{ parseTime(scope.row.loginTime) }}</span> </el-table-column>
</template> <el-table-column label="操作信息" align="center" prop="msg" />
</el-table-column> <el-table-column label="登录日期" align="center" prop="loginTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180">
</el-table> <template slot-scope="scope">
<span>{{ parseTime(scope.row.loginTime) }}</span>
<pagination </template>
v-show="total>0" </el-table-column>
:total="total" </el-table>
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" <pagination
@pagination="getList" v-show="total>0"
/> :total="total"
</div> :page.sync="queryParams.pageNum"
</template> :limit.sync="queryParams.pageSize"
@pagination="getList"
<script> />
import { list, delLogininfor, cleanLogininfor, exportLogininfor } from "@/api/monitor/logininfor"; </div>
</template>
export default {
name: "Logininfor", <script>
data() { import { list, delLogininfor, cleanLogininfor, exportLogininfor } from "@/api/monitor/logininfor";
return {
// export default {
loading: true, name: "Logininfor",
// data() {
exportLoading: false, return {
// //
ids: [], loading: true,
// //
multiple: true, exportLoading: false,
// //
showSearch: true, ids: [],
// //
total: 0, multiple: true,
// //
list: [], showSearch: true,
// //
statusOptions: [], total: 0,
// //
dateRange: [], list: [],
// //
defaultSort: {prop: 'loginTime', order: 'descending'}, statusOptions: [],
// //
queryParams: { dateRange: [],
pageNum: 1, //
pageSize: 10, defaultSort: {prop: 'loginTime', order: 'descending'},
ipaddr: undefined, //
userName: undefined, queryParams: {
status: undefined pageNum: 1,
} pageSize: 10,
}; ipaddr: undefined,
}, userName: undefined,
created() { status: undefined
this.getList(); }
this.getDicts("sys_common_status").then(response => { };
this.statusOptions = response.data; },
}); created() {
}, this.getList();
methods: { this.getDicts("sys_common_status").then(response => {
/** 查询登录日志列表 */ this.statusOptions = response.data;
getList() { });
this.loading = true; },
list(this.addDateRange(this.queryParams, this.dateRange)).then(response => { methods: {
this.list = response.rows; /** 查询登录日志列表 */
this.total = response.total; getList() {
this.loading = false; this.loading = true;
} list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
); this.list = response.rows;
}, this.total = response.total;
// this.loading = false;
statusFormat(row, column) { }
return this.selectDictLabel(this.statusOptions, row.status); );
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.queryParams.pageNum = 1; this.queryParams.pageNum = 1;
this.getList(); this.getList();
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
this.dateRange = []; this.dateRange = [];
this.resetForm("queryForm"); this.resetForm("queryForm");
this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order) this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order)
this.handleQuery(); this.handleQuery();
}, },
/** 多选框选中数据 */ /** 多选框选中数据 */
handleSelectionChange(selection) { handleSelectionChange(selection) {
this.ids = selection.map(item => item.infoId) this.ids = selection.map(item => item.infoId)
this.multiple = !selection.length this.multiple = !selection.length
}, },
/** 排序触发事件 */ /** 排序触发事件 */
handleSortChange(column, prop, order) { handleSortChange(column, prop, order) {
this.queryParams.orderByColumn = column.prop; this.queryParams.orderByColumn = column.prop;
this.queryParams.isAsc = column.order; this.queryParams.isAsc = column.order;
this.getList(); this.getList();
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { handleDelete(row) {
const infoIds = row.infoId || this.ids; const infoIds = row.infoId || this.ids;
this.$confirm('是否确认删除访问编号为"' + infoIds + '"的数据项?', "警告", { this.$confirm('是否确认删除访问编号为"' + infoIds + '"的数据项?', "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning" type: "warning"
}).then(function() { }).then(function() {
return delLogininfor(infoIds); return delLogininfor(infoIds);
}).then(() => { }).then(() => {
this.getList(); this.getList();
this.msgSuccess("删除成功"); this.msgSuccess("删除成功");
}).catch(() => {}); }).catch(() => {});
}, },
/** 清空按钮操作 */ /** 清空按钮操作 */
handleClean() { handleClean() {
this.$confirm('是否确认清空所有登录日志数据项?', "警告", { this.$confirm('是否确认清空所有登录日志数据项?', "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning" type: "warning"
}).then(function() { }).then(function() {
return cleanLogininfor(); return cleanLogininfor();
}).then(() => { }).then(() => {
this.getList(); this.getList();
this.msgSuccess("清空成功"); this.msgSuccess("清空成功");
}).catch(() => {}); }).catch(() => {});
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { handleExport() {
const queryParams = this.queryParams; const queryParams = this.queryParams;
this.$confirm('是否确认导出所有操作日志数据项?', "警告", { this.$confirm('是否确认导出所有操作日志数据项?', "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning" type: "warning"
}).then(() => { }).then(() => {
this.exportLoading = true; this.exportLoading = true;
return exportLogininfor(queryParams); return exportLogininfor(queryParams);
}).then(response => { }).then(response => {
this.download(response.msg); this.download(response.msg);
this.exportLoading = false; this.exportLoading = false;
}).catch(() => {}); }).catch(() => {});
} }
} }
}; };
</script> </script>

View File

@ -1,335 +1,339 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="系统模块" prop="title"> <el-form-item label="系统模块" prop="title">
<el-input <el-input
v-model="queryParams.title" v-model="queryParams.title"
placeholder="请输入系统模块" placeholder="请输入系统模块"
clearable clearable
style="width: 240px;" style="width: 240px;"
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="操作人员" prop="operName"> <el-form-item label="操作人员" prop="operName">
<el-input <el-input
v-model="queryParams.operName" v-model="queryParams.operName"
placeholder="请输入操作人员" placeholder="请输入操作人员"
clearable clearable
style="width: 240px;" style="width: 240px;"
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="类型" prop="businessType"> <el-form-item label="类型" prop="businessType">
<el-select <el-select
v-model="queryParams.businessType" v-model="queryParams.businessType"
placeholder="操作类型" placeholder="操作类型"
clearable clearable
size="small" size="small"
style="width: 240px" style="width: 240px"
> >
<el-option <el-option
v-for="dict in typeOptions" v-for="dict in typeOptions"
:key="dict.dictValue" :key="dict.dictValue"
:label="dict.dictLabel" :label="dict.dictLabel"
:value="dict.dictValue" :value="dict.dictValue"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="状态" prop="status"> <el-form-item label="状态" prop="status">
<el-select <el-select
v-model="queryParams.status" v-model="queryParams.status"
placeholder="操作状态" placeholder="操作状态"
clearable clearable
size="small" size="small"
style="width: 240px" style="width: 240px"
> >
<el-option <el-option
v-for="dict in statusOptions" v-for="dict in statusOptions"
:key="dict.dictValue" :key="dict.dictValue"
:label="dict.dictLabel" :label="dict.dictLabel"
:value="dict.dictValue" :value="dict.dictValue"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="操作时间"> <el-form-item label="操作时间">
<el-date-picker <el-date-picker
v-model="dateRange" v-model="dateRange"
size="small" size="small"
style="width: 240px" style="width: 240px"
value-format="yyyy-MM-dd" value-format="yyyy-MM-dd"
type="daterange" type="daterange"
range-separator="-" range-separator="-"
start-placeholder="开始日期" start-placeholder="开始日期"
end-placeholder="结束日期" end-placeholder="结束日期"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
plain plain
icon="el-icon-delete" icon="el-icon-delete"
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete" @click="handleDelete"
v-hasPermi="['monitor:operlog:remove']" v-hasPermi="['monitor:operlog:remove']"
>删除</el-button> >删除</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
plain plain
icon="el-icon-delete" icon="el-icon-delete"
size="mini" size="mini"
@click="handleClean" @click="handleClean"
v-hasPermi="['monitor:operlog:remove']" v-hasPermi="['monitor:operlog:remove']"
>清空</el-button> >清空</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="warning" type="warning"
plain plain
icon="el-icon-download" icon="el-icon-download"
size="mini" size="mini"
:loading="exportLoading" :loading="exportLoading"
@click="handleExport" @click="handleExport"
v-hasPermi="['monitor:operlog:export']" v-hasPermi="['monitor:operlog:export']"
>导出</el-button> >导出</el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table ref="tables" v-loading="loading" :data="list" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange"> <el-table ref="tables" v-loading="loading" :data="list" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="日志编号" align="center" prop="operId" /> <el-table-column label="日志编号" align="center" prop="operId" />
<el-table-column label="系统模块" align="center" prop="title" /> <el-table-column label="系统模块" align="center" prop="title" />
<el-table-column label="操作类型" align="center" prop="businessType" :formatter="typeFormat" /> <el-table-column label="操作类型" align="center" prop="businessType">
<el-table-column label="请求方式" align="center" prop="requestMethod" /> <template slot-scope="scope">
<el-table-column label="操作人员" align="center" prop="operName" width="100" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" /> <dict-tag :options="typeOptions" :value="scope.row.businessType"/>
<el-table-column label="操作地址" align="center" prop="operIp" width="130" :show-overflow-tooltip="true" /> </template>
<el-table-column label="操作地点" align="center" prop="operLocation" :show-overflow-tooltip="true" /> </el-table-column>
<el-table-column label="操作状态" align="center" prop="status" :formatter="statusFormat" /> <el-table-column label="请求方式" align="center" prop="requestMethod" />
<el-table-column label="操作日期" align="center" prop="operTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180"> <el-table-column label="操作人员" align="center" prop="operName" width="100" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" />
<template slot-scope="scope"> <el-table-column label="操作地址" align="center" prop="operIp" width="130" :show-overflow-tooltip="true" />
<span>{{ parseTime(scope.row.operTime) }}</span> <el-table-column label="操作地点" align="center" prop="operLocation" :show-overflow-tooltip="true" />
</template> <el-table-column label="操作状态" align="center" prop="status">
</el-table-column> <template slot-scope="scope">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <dict-tag :options="statusOptions" :value="scope.row.status"/>
<template slot-scope="scope"> </template>
<el-button </el-table-column>
size="mini" <el-table-column label="操作日期" align="center" prop="operTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180">
type="text" <template slot-scope="scope">
icon="el-icon-view" <span>{{ parseTime(scope.row.operTime) }}</span>
@click="handleView(scope.row,scope.index)" </template>
v-hasPermi="['monitor:operlog:query']" </el-table-column>
>详细</el-button> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
</template> <template slot-scope="scope">
</el-table-column> <el-button
</el-table> size="mini"
type="text"
<pagination icon="el-icon-view"
v-show="total>0" @click="handleView(scope.row,scope.index)"
:total="total" v-hasPermi="['monitor:operlog:query']"
:page.sync="queryParams.pageNum" >详细</el-button>
:limit.sync="queryParams.pageSize" </template>
@pagination="getList" </el-table-column>
/> </el-table>
<!-- 操作日志详细 --> <pagination
<el-dialog title="操作日志详细" :visible.sync="open" width="700px" append-to-body> v-show="total>0"
<el-form ref="form" :model="form" label-width="100px" size="mini"> :total="total"
<el-row> :page.sync="queryParams.pageNum"
<el-col :span="12"> :limit.sync="queryParams.pageSize"
<el-form-item label="操作模块:">{{ form.title }} / {{ typeFormat(form) }}</el-form-item> @pagination="getList"
<el-form-item />
label="登录信息:"
>{{ form.operName }} / {{ form.operIp }} / {{ form.operLocation }}</el-form-item> <!-- 操作日志详细 -->
</el-col> <el-dialog title="操作日志详细" :visible.sync="open" width="700px" append-to-body>
<el-col :span="12"> <el-form ref="form" :model="form" label-width="100px" size="mini">
<el-form-item label="请求地址:">{{ form.operUrl }}</el-form-item> <el-row>
<el-form-item label="请求方式:">{{ form.requestMethod }}</el-form-item> <el-col :span="12">
</el-col> <el-form-item label="操作模块:">{{ form.title }} / {{ typeFormat(form) }}</el-form-item>
<el-col :span="24"> <el-form-item
<el-form-item label="操作方法:">{{ form.method }}</el-form-item> label="登录信息:"
</el-col> >{{ form.operName }} / {{ form.operIp }} / {{ form.operLocation }}</el-form-item>
<el-col :span="24"> </el-col>
<el-form-item label="请求参数:">{{ form.operParam }}</el-form-item> <el-col :span="12">
</el-col> <el-form-item label="请求地址:">{{ form.operUrl }}</el-form-item>
<el-col :span="24"> <el-form-item label="请求方式:">{{ form.requestMethod }}</el-form-item>
<el-form-item label="返回参数:">{{ form.jsonResult }}</el-form-item> </el-col>
</el-col> <el-col :span="24">
<el-col :span="12"> <el-form-item label="操作方法:">{{ form.method }}</el-form-item>
<el-form-item label="操作状态:"> </el-col>
<div v-if="form.status === 0">正常</div> <el-col :span="24">
<div v-else-if="form.status === 1">失败</div> <el-form-item label="请求参数:">{{ form.operParam }}</el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :span="24">
<el-col :span="12"> <el-form-item label="返回参数:">{{ form.jsonResult }}</el-form-item>
<el-form-item label="操作时间:">{{ parseTime(form.operTime) }}</el-form-item> </el-col>
</el-col> <el-col :span="12">
<el-col :span="24"> <el-form-item label="操作状态:">
<el-form-item label="异常信息:" v-if="form.status === 1">{{ form.errorMsg }}</el-form-item> <div v-if="form.status === 0">正常</div>
</el-col> <div v-else-if="form.status === 1">失败</div>
</el-row> </el-form-item>
</el-form> </el-col>
<div slot="footer" class="dialog-footer"> <el-col :span="12">
<el-button @click="open = false"> </el-button> <el-form-item label="操作时间:">{{ parseTime(form.operTime) }}</el-form-item>
</div> </el-col>
</el-dialog> <el-col :span="24">
</div> <el-form-item label="异常信息:" v-if="form.status === 1">{{ form.errorMsg }}</el-form-item>
</template> </el-col>
</el-row>
<script> </el-form>
import { list, delOperlog, cleanOperlog, exportOperlog } from "@/api/monitor/operlog"; <div slot="footer" class="dialog-footer">
<el-button @click="open = false"> </el-button>
export default { </div>
name: "Operlog", </el-dialog>
data() { </div>
return { </template>
//
loading: true, <script>
// import { list, delOperlog, cleanOperlog, exportOperlog } from "@/api/monitor/operlog";
exportLoading: false,
// export default {
ids: [], name: "Operlog",
// data() {
multiple: true, return {
// //
showSearch: true, loading: true,
// //
total: 0, exportLoading: false,
// //
list: [], ids: [],
// //
open: false, multiple: true,
// //
typeOptions: [], showSearch: true,
// //
statusOptions: [], total: 0,
// //
dateRange: [], list: [],
// //
defaultSort: {prop: 'operTime', order: 'descending'}, open: false,
// //
form: {}, typeOptions: [],
// //
queryParams: { statusOptions: [],
pageNum: 1, //
pageSize: 10, dateRange: [],
title: undefined, //
operName: undefined, defaultSort: {prop: 'operTime', order: 'descending'},
businessType: undefined, //
status: undefined form: {},
} //
}; queryParams: {
}, pageNum: 1,
created() { pageSize: 10,
this.getList(); title: undefined,
this.getDicts("sys_oper_type").then(response => { operName: undefined,
this.typeOptions = response.data; businessType: undefined,
}); status: undefined
this.getDicts("sys_common_status").then(response => { }
this.statusOptions = response.data; };
}); },
}, created() {
methods: { this.getList();
/** 查询登录日志 */ this.getDicts("sys_oper_type").then(response => {
getList() { this.typeOptions = response.data;
this.loading = true; });
list(this.addDateRange(this.queryParams, this.dateRange)).then( response => { this.getDicts("sys_common_status").then(response => {
this.list = response.rows; this.statusOptions = response.data;
this.total = response.total; });
this.loading = false; },
} methods: {
); /** 查询登录日志 */
}, getList() {
// this.loading = true;
statusFormat(row, column) { list(this.addDateRange(this.queryParams, this.dateRange)).then( response => {
return this.selectDictLabel(this.statusOptions, row.status); this.list = response.rows;
}, this.total = response.total;
// this.loading = false;
typeFormat(row, column) { }
return this.selectDictLabel(this.typeOptions, row.businessType); );
}, },
/** 搜索按钮操作 */ //
handleQuery() { typeFormat(row, column) {
this.queryParams.pageNum = 1; return this.selectDictLabel(this.typeOptions, row.businessType);
this.getList(); },
}, /** 搜索按钮操作 */
/** 重置按钮操作 */ handleQuery() {
resetQuery() { this.queryParams.pageNum = 1;
this.dateRange = []; this.getList();
this.resetForm("queryForm"); },
this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order) /** 重置按钮操作 */
this.handleQuery(); resetQuery() {
}, this.dateRange = [];
/** 多选框选中数据 */ this.resetForm("queryForm");
handleSelectionChange(selection) { this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order)
this.ids = selection.map(item => item.operId) this.handleQuery();
this.multiple = !selection.length },
}, /** 多选框选中数据 */
/** 排序触发事件 */ handleSelectionChange(selection) {
handleSortChange(column, prop, order) { this.ids = selection.map(item => item.operId)
this.queryParams.orderByColumn = column.prop; this.multiple = !selection.length
this.queryParams.isAsc = column.order; },
this.getList(); /** 排序触发事件 */
}, handleSortChange(column, prop, order) {
/** 详细按钮操作 */ this.queryParams.orderByColumn = column.prop;
handleView(row) { this.queryParams.isAsc = column.order;
this.open = true; this.getList();
this.form = row; },
}, /** 详细按钮操作 */
/** 删除按钮操作 */ handleView(row) {
handleDelete(row) { this.open = true;
const operIds = row.operId || this.ids; this.form = row;
this.$confirm('是否确认删除日志编号为"' + operIds + '"的数据项?', "警告", { },
confirmButtonText: "确定", /** 删除按钮操作 */
cancelButtonText: "取消", handleDelete(row) {
type: "warning" const operIds = row.operId || this.ids;
}).then(function() { this.$confirm('是否确认删除日志编号为"' + operIds + '"的数据项?', "警告", {
return delOperlog(operIds); confirmButtonText: "确定",
}).then(() => { cancelButtonText: "取消",
this.getList(); type: "warning"
this.msgSuccess("删除成功"); }).then(function() {
}).catch(() => {}); return delOperlog(operIds);
}, }).then(() => {
/** 清空按钮操作 */ this.getList();
handleClean() { this.msgSuccess("删除成功");
this.$confirm('是否确认清空所有操作日志数据项?', "警告", { }).catch(() => {});
confirmButtonText: "确定", },
cancelButtonText: "取消", /** 清空按钮操作 */
type: "warning" handleClean() {
}).then(function() { this.$confirm('是否确认清空所有操作日志数据项?', "警告", {
return cleanOperlog(); confirmButtonText: "确定",
}).then(() => { cancelButtonText: "取消",
this.getList(); type: "warning"
this.msgSuccess("清空成功"); }).then(function() {
}).catch(() => {}); return cleanOperlog();
}, }).then(() => {
/** 导出按钮操作 */ this.getList();
handleExport() { this.msgSuccess("清空成功");
const queryParams = this.queryParams; }).catch(() => {});
this.$confirm('是否确认导出所有操作日志数据项?', "警告", { },
confirmButtonText: "确定", /** 导出按钮操作 */
cancelButtonText: "取消", handleExport() {
type: "warning" const queryParams = this.queryParams;
}).then(() => { this.$confirm('是否确认导出所有操作日志数据项?', "警告", {
this.exportLoading = true; confirmButtonText: "确定",
return exportOperlog(queryParams); cancelButtonText: "取消",
}).then(response => { type: "warning"
this.download(response.msg); }).then(() => {
this.exportLoading = false; this.exportLoading = true;
}).catch(() => {}); return exportOperlog(queryParams);
} }).then(response => {
} this.download(response.msg);
}; this.exportLoading = false;
</script> }).catch(() => {});
}
}
};
</script>

View File

@ -1,366 +1,366 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="参数名称" prop="configName"> <el-form-item label="参数名称" prop="configName">
<el-input <el-input
v-model="queryParams.configName" v-model="queryParams.configName"
placeholder="请输入参数名称" placeholder="请输入参数名称"
clearable clearable
size="small" size="small"
style="width: 240px" style="width: 240px"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="参数键名" prop="configKey"> <el-form-item label="参数键名" prop="configKey">
<el-input <el-input
v-model="queryParams.configKey" v-model="queryParams.configKey"
placeholder="请输入参数键名" placeholder="请输入参数键名"
clearable clearable
size="small" size="small"
style="width: 240px" style="width: 240px"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="系统内置" prop="configType"> <el-form-item label="系统内置" prop="configType">
<el-select v-model="queryParams.configType" placeholder="系统内置" clearable size="small"> <el-select v-model="queryParams.configType" placeholder="系统内置" clearable size="small">
<el-option <el-option
v-for="dict in typeOptions" v-for="dict in typeOptions"
:key="dict.dictValue" :key="dict.dictValue"
:label="dict.dictLabel" :label="dict.dictLabel"
:value="dict.dictValue" :value="dict.dictValue"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="创建时间"> <el-form-item label="创建时间">
<el-date-picker <el-date-picker
v-model="dateRange" v-model="dateRange"
size="small" size="small"
style="width: 240px" style="width: 240px"
value-format="yyyy-MM-dd" value-format="yyyy-MM-dd"
type="daterange" type="daterange"
range-separator="-" range-separator="-"
start-placeholder="开始日期" start-placeholder="开始日期"
end-placeholder="结束日期" end-placeholder="结束日期"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="primary" type="primary"
plain plain
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:config:add']" v-hasPermi="['system:config:add']"
>新增</el-button> >新增</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="success" type="success"
plain plain
icon="el-icon-edit" icon="el-icon-edit"
size="mini" size="mini"
:disabled="single" :disabled="single"
@click="handleUpdate" @click="handleUpdate"
v-hasPermi="['system:config:edit']" v-hasPermi="['system:config:edit']"
>修改</el-button> >修改</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
plain plain
icon="el-icon-delete" icon="el-icon-delete"
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete" @click="handleDelete"
v-hasPermi="['system:config:remove']" v-hasPermi="['system:config:remove']"
>删除</el-button> >删除</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="warning" type="warning"
plain plain
icon="el-icon-download" icon="el-icon-download"
size="mini" size="mini"
:loading="exportLoading" :loading="exportLoading"
@click="handleExport" @click="handleExport"
v-hasPermi="['system:config:export']" v-hasPermi="['system:config:export']"
>导出</el-button> >导出</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
plain plain
icon="el-icon-refresh" icon="el-icon-refresh"
size="mini" size="mini"
@click="handleRefreshCache" @click="handleRefreshCache"
v-hasPermi="['system:config:remove']" v-hasPermi="['system:config:remove']"
>刷新缓存</el-button> >刷新缓存</el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table v-loading="loading" :data="configList" @selection-change="handleSelectionChange"> <el-table v-loading="loading" :data="configList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="参数主键" align="center" prop="configId" /> <el-table-column label="参数主键" align="center" prop="configId" />
<el-table-column label="参数名称" align="center" prop="configName" :show-overflow-tooltip="true" /> <el-table-column label="参数名称" align="center" prop="configName" :show-overflow-tooltip="true" />
<el-table-column label="参数键名" align="center" prop="configKey" :show-overflow-tooltip="true" /> <el-table-column label="参数键名" align="center" prop="configKey" :show-overflow-tooltip="true" />
<el-table-column label="参数键值" align="center" prop="configValue" /> <el-table-column label="参数键值" align="center" prop="configValue" />
<el-table-column label="系统内置" align="center" prop="configType" :formatter="typeFormat" /> <el-table-column label="系统内置" align="center" prop="configType">
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" /> <template slot-scope="scope">
<el-table-column label="创建时间" align="center" prop="createTime" width="180"> <dict-tag :options="typeOptions" :value="scope.row.configType"/>
<template slot-scope="scope"> </template>
<span>{{ parseTime(scope.row.createTime) }}</span> </el-table-column>
</template> <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
</el-table-column> <el-table-column label="创建时间" align="center" prop="createTime" width="180">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <template slot-scope="scope">
<template slot-scope="scope"> <span>{{ parseTime(scope.row.createTime) }}</span>
<el-button </template>
size="mini" </el-table-column>
type="text" <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
icon="el-icon-edit" <template slot-scope="scope">
@click="handleUpdate(scope.row)" <el-button
v-hasPermi="['system:config:edit']" size="mini"
>修改</el-button> type="text"
<el-button icon="el-icon-edit"
size="mini" @click="handleUpdate(scope.row)"
type="text" v-hasPermi="['system:config:edit']"
icon="el-icon-delete" >修改</el-button>
@click="handleDelete(scope.row)" <el-button
v-hasPermi="['system:config:remove']" size="mini"
>删除</el-button> type="text"
</template> icon="el-icon-delete"
</el-table-column> @click="handleDelete(scope.row)"
</el-table> v-hasPermi="['system:config:remove']"
>删除</el-button>
<pagination </template>
v-show="total>0" </el-table-column>
:total="total" </el-table>
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" <pagination
@pagination="getList" v-show="total>0"
/> :total="total"
:page.sync="queryParams.pageNum"
<!-- 添加或修改参数配置对话框 --> :limit.sync="queryParams.pageSize"
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> @pagination="getList"
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> />
<el-form-item label="参数名称" prop="configName">
<el-input v-model="form.configName" placeholder="请输入参数名称" /> <!-- 添加或修改参数配置对话框 -->
</el-form-item> <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form-item label="参数键名" prop="configKey"> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-input v-model="form.configKey" placeholder="请输入参数键名" /> <el-form-item label="参数名称" prop="configName">
</el-form-item> <el-input v-model="form.configName" placeholder="请输入参数名称" />
<el-form-item label="参数键值" prop="configValue"> </el-form-item>
<el-input v-model="form.configValue" placeholder="请输入参数键值" /> <el-form-item label="参数键名" prop="configKey">
</el-form-item> <el-input v-model="form.configKey" placeholder="请输入参数键名" />
<el-form-item label="系统内置" prop="configType"> </el-form-item>
<el-radio-group v-model="form.configType"> <el-form-item label="参数键值" prop="configValue">
<el-radio <el-input v-model="form.configValue" placeholder="请输入参数键值" />
v-for="dict in typeOptions" </el-form-item>
:key="dict.dictValue" <el-form-item label="系统内置" prop="configType">
:label="dict.dictValue" <el-radio-group v-model="form.configType">
>{{dict.dictLabel}}</el-radio> <el-radio
</el-radio-group> v-for="dict in typeOptions"
</el-form-item> :key="dict.dictValue"
<el-form-item label="备注" prop="remark"> :label="dict.dictValue"
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" /> >{{dict.dictLabel}}</el-radio>
</el-form-item> </el-radio-group>
</el-form> </el-form-item>
<div slot="footer" class="dialog-footer"> <el-form-item label="备注" prop="remark">
<el-button type="primary" @click="submitForm"> </el-button> <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
<el-button @click="cancel"> </el-button> </el-form-item>
</div> </el-form>
</el-dialog> <div slot="footer" class="dialog-footer">
</div> <el-button type="primary" @click="submitForm"> </el-button>
</template> <el-button @click="cancel"> </el-button>
</div>
<script> </el-dialog>
import { listConfig, getConfig, delConfig, addConfig, updateConfig, exportConfig, refreshCache } from "@/api/system/config"; </div>
</template>
export default {
name: "Config", <script>
data() { import { listConfig, getConfig, delConfig, addConfig, updateConfig, exportConfig, refreshCache } from "@/api/system/config";
return {
// export default {
loading: true, name: "Config",
// data() {
exportLoading: false, return {
// //
ids: [], loading: true,
// //
single: true, exportLoading: false,
// //
multiple: true, ids: [],
// //
showSearch: true, single: true,
// //
total: 0, multiple: true,
// //
configList: [], showSearch: true,
// //
title: "", total: 0,
// //
open: false, configList: [],
// //
typeOptions: [], title: "",
// //
dateRange: [], open: false,
// //
queryParams: { typeOptions: [],
pageNum: 1, //
pageSize: 10, dateRange: [],
configName: undefined, //
configKey: undefined, queryParams: {
configType: undefined pageNum: 1,
}, pageSize: 10,
// configName: undefined,
form: {}, configKey: undefined,
// configType: undefined
rules: { },
configName: [ //
{ required: true, message: "参数名称不能为空", trigger: "blur" } form: {},
], //
configKey: [ rules: {
{ required: true, message: "参数键名不能为空", trigger: "blur" } configName: [
], { required: true, message: "参数名称不能为空", trigger: "blur" }
configValue: [ ],
{ required: true, message: "参数键值不能为空", trigger: "blur" } configKey: [
] { required: true, message: "参数键名不能为空", trigger: "blur" }
} ],
}; configValue: [
}, { required: true, message: "参数键值不能为空", trigger: "blur" }
created() { ]
this.getList(); }
this.getDicts("sys_yes_no").then(response => { };
this.typeOptions = response.data; },
}); created() {
}, this.getList();
methods: { this.getDicts("sys_yes_no").then(response => {
/** 查询参数列表 */ this.typeOptions = response.data;
getList() { });
this.loading = true; },
listConfig(this.addDateRange(this.queryParams, this.dateRange)).then(response => { methods: {
this.configList = response.rows; /** 查询参数列表 */
this.total = response.total; getList() {
this.loading = false; this.loading = true;
} listConfig(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
); this.configList = response.rows;
}, this.total = response.total;
// this.loading = false;
typeFormat(row, column) { }
return this.selectDictLabel(this.typeOptions, row.configType); );
}, },
// //
cancel() { cancel() {
this.open = false; this.open = false;
this.reset(); this.reset();
}, },
// //
reset() { reset() {
this.form = { this.form = {
configId: undefined, configId: undefined,
configName: undefined, configName: undefined,
configKey: undefined, configKey: undefined,
configValue: undefined, configValue: undefined,
configType: "Y", configType: "Y",
remark: undefined remark: undefined
}; };
this.resetForm("form"); this.resetForm("form");
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.queryParams.pageNum = 1; this.queryParams.pageNum = 1;
this.getList(); this.getList();
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
this.dateRange = []; this.dateRange = [];
this.resetForm("queryForm"); this.resetForm("queryForm");
this.handleQuery(); this.handleQuery();
}, },
/** 新增按钮操作 */ /** 新增按钮操作 */
handleAdd() { handleAdd() {
this.reset(); this.reset();
this.open = true; this.open = true;
this.title = "添加参数"; this.title = "添加参数";
}, },
// //
handleSelectionChange(selection) { handleSelectionChange(selection) {
this.ids = selection.map(item => item.configId) this.ids = selection.map(item => item.configId)
this.single = selection.length!=1 this.single = selection.length!=1
this.multiple = !selection.length this.multiple = !selection.length
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
this.reset(); this.reset();
const configId = row.configId || this.ids const configId = row.configId || this.ids
getConfig(configId).then(response => { getConfig(configId).then(response => {
this.form = response.data; this.form = response.data;
this.open = true; this.open = true;
this.title = "修改参数"; this.title = "修改参数";
}); });
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm: function() { submitForm: function() {
this.$refs["form"].validate(valid => { this.$refs["form"].validate(valid => {
if (valid) { if (valid) {
if (this.form.configId != undefined) { if (this.form.configId != undefined) {
updateConfig(this.form).then(response => { updateConfig(this.form).then(response => {
this.msgSuccess("修改成功"); this.msgSuccess("修改成功");
this.open = false; this.open = false;
this.getList(); this.getList();
}); });
} else { } else {
addConfig(this.form).then(response => { addConfig(this.form).then(response => {
this.msgSuccess("新增成功"); this.msgSuccess("新增成功");
this.open = false; this.open = false;
this.getList(); this.getList();
}); });
} }
} }
}); });
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { handleDelete(row) {
const configIds = row.configId || this.ids; const configIds = row.configId || this.ids;
this.$confirm('是否确认删除参数编号为"' + configIds + '"的数据项?', "警告", { this.$confirm('是否确认删除参数编号为"' + configIds + '"的数据项?', "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning" type: "warning"
}).then(function() { }).then(function() {
return delConfig(configIds); return delConfig(configIds);
}).then(() => { }).then(() => {
this.getList(); this.getList();
this.msgSuccess("删除成功"); this.msgSuccess("删除成功");
}).catch(() => {}); }).catch(() => {});
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { handleExport() {
const queryParams = this.queryParams; const queryParams = this.queryParams;
this.$confirm('是否确认导出所有参数数据项?', "警告", { this.$confirm('是否确认导出所有参数数据项?', "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning" type: "warning"
}).then(() => { }).then(() => {
this.exportLoading = true; this.exportLoading = true;
return exportConfig(queryParams); return exportConfig(queryParams);
}).then(response => { }).then(response => {
this.download(response.msg); this.download(response.msg);
this.exportLoading = false; this.exportLoading = false;
}).catch(() => {}); }).catch(() => {});
}, },
/** 刷新缓存按钮操作 */ /** 刷新缓存按钮操作 */
handleRefreshCache() { handleRefreshCache() {
refreshCache().then(() => { refreshCache().then(() => {
this.msgSuccess("刷新成功"); this.msgSuccess("刷新成功");
}); });
} }
} }
}; };
</script> </script>

View File

@ -1,317 +1,317 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch"> <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
<el-form-item label="部门名称" prop="deptName"> <el-form-item label="部门名称" prop="deptName">
<el-input <el-input
v-model="queryParams.deptName" v-model="queryParams.deptName"
placeholder="请输入部门名称" placeholder="请输入部门名称"
clearable clearable
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="状态" prop="status"> <el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" placeholder="部门状态" clearable size="small"> <el-select v-model="queryParams.status" placeholder="部门状态" clearable size="small">
<el-option <el-option
v-for="dict in statusOptions" v-for="dict in statusOptions"
:key="dict.dictValue" :key="dict.dictValue"
:label="dict.dictLabel" :label="dict.dictLabel"
:value="dict.dictValue" :value="dict.dictValue"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="primary" type="primary"
plain plain
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:dept:add']" v-hasPermi="['system:dept:add']"
>新增</el-button> >新增</el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table <el-table
v-loading="loading" v-loading="loading"
:data="deptList" :data="deptList"
row-key="deptId" row-key="deptId"
default-expand-all default-expand-all
:tree-props="{children: 'children', hasChildren: 'hasChildren'}" :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
> >
<el-table-column prop="deptName" label="部门名称" width="260"></el-table-column> <el-table-column prop="deptName" label="部门名称" width="260"></el-table-column>
<el-table-column prop="orderNum" label="排序" width="200"></el-table-column> <el-table-column prop="orderNum" label="排序" width="200"></el-table-column>
<el-table-column prop="status" label="状态" :formatter="statusFormat" width="100"></el-table-column> <el-table-column prop="status" label="状态" width="100">
<el-table-column label="创建时间" align="center" prop="createTime" width="200"> <template slot-scope="scope">
<template slot-scope="scope"> <dict-tag :options="statusOptions" :value="scope.row.status"/>
<span>{{ parseTime(scope.row.createTime) }}</span> </template>
</template> </el-table-column>
</el-table-column> <el-table-column label="创建时间" align="center" prop="createTime" width="200">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <template slot-scope="scope">
<template slot-scope="scope"> <span>{{ parseTime(scope.row.createTime) }}</span>
<el-button </template>
size="mini" </el-table-column>
type="text" <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
icon="el-icon-edit" <template slot-scope="scope">
@click="handleUpdate(scope.row)" <el-button
v-hasPermi="['system:dept:edit']" size="mini"
>修改</el-button> type="text"
<el-button icon="el-icon-edit"
size="mini" @click="handleUpdate(scope.row)"
type="text" v-hasPermi="['system:dept:edit']"
icon="el-icon-plus" >修改</el-button>
@click="handleAdd(scope.row)" <el-button
v-hasPermi="['system:dept:add']" size="mini"
>新增</el-button> type="text"
<el-button icon="el-icon-plus"
v-if="scope.row.parentId != 0" @click="handleAdd(scope.row)"
size="mini" v-hasPermi="['system:dept:add']"
type="text" >新增</el-button>
icon="el-icon-delete" <el-button
@click="handleDelete(scope.row)" v-if="scope.row.parentId != 0"
v-hasPermi="['system:dept:remove']" size="mini"
>删除</el-button> type="text"
</template> icon="el-icon-delete"
</el-table-column> @click="handleDelete(scope.row)"
</el-table> v-hasPermi="['system:dept:remove']"
>删除</el-button>
<!-- 添加或修改部门对话框 --> </template>
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body> </el-table-column>
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> </el-table>
<el-row>
<el-col :span="24" v-if="form.parentId !== 0"> <!-- 添加或修改部门对话框 -->
<el-form-item label="上级部门" prop="parentId"> <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
<treeselect v-model="form.parentId" :options="deptOptions" :normalizer="normalizer" placeholder="选择上级部门" /> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
</el-form-item> <el-row>
</el-col> <el-col :span="24" v-if="form.parentId !== 0">
<el-col :span="12"> <el-form-item label="上级部门" prop="parentId">
<el-form-item label="部门名称" prop="deptName"> <treeselect v-model="form.parentId" :options="deptOptions" :normalizer="normalizer" placeholder="选择上级部门" />
<el-input v-model="form.deptName" placeholder="请输入部门名称" /> </el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :span="12">
<el-col :span="12"> <el-form-item label="部门名称" prop="deptName">
<el-form-item label="显示排序" prop="orderNum"> <el-input v-model="form.deptName" placeholder="请输入部门名称" />
<el-input-number v-model="form.orderNum" controls-position="right" :min="0" /> </el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :span="12">
<el-col :span="12"> <el-form-item label="显示排序" prop="orderNum">
<el-form-item label="负责人" prop="leader"> <el-input-number v-model="form.orderNum" controls-position="right" :min="0" />
<el-input v-model="form.leader" placeholder="请输入负责人" maxlength="20" /> </el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :span="12">
<el-col :span="12"> <el-form-item label="负责人" prop="leader">
<el-form-item label="联系电话" prop="phone"> <el-input v-model="form.leader" placeholder="请输入负责人" maxlength="20" />
<el-input v-model="form.phone" placeholder="请输入联系电话" maxlength="11" /> </el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :span="12">
<el-col :span="12"> <el-form-item label="联系电话" prop="phone">
<el-form-item label="邮箱" prop="email"> <el-input v-model="form.phone" placeholder="请输入联系电话" maxlength="11" />
<el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" /> </el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :span="12">
<el-col :span="12"> <el-form-item label="邮箱" prop="email">
<el-form-item label="部门状态"> <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
<el-radio-group v-model="form.status"> </el-form-item>
<el-radio </el-col>
v-for="dict in statusOptions" <el-col :span="12">
:key="dict.dictValue" <el-form-item label="部门状态">
:label="dict.dictValue" <el-radio-group v-model="form.status">
>{{dict.dictLabel}}</el-radio> <el-radio
</el-radio-group> v-for="dict in statusOptions"
</el-form-item> :key="dict.dictValue"
</el-col> :label="dict.dictValue"
</el-row> >{{dict.dictLabel}}</el-radio>
</el-form> </el-radio-group>
<div slot="footer" class="dialog-footer"> </el-form-item>
<el-button type="primary" @click="submitForm"> </el-button> </el-col>
<el-button @click="cancel"> </el-button> </el-row>
</div> </el-form>
</el-dialog> <div slot="footer" class="dialog-footer">
</div> <el-button type="primary" @click="submitForm"> </el-button>
</template> <el-button @click="cancel"> </el-button>
</div>
<script> </el-dialog>
import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept"; </div>
import Treeselect from "@riophae/vue-treeselect"; </template>
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
<script>
export default { import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept";
name: "Dept", import Treeselect from "@riophae/vue-treeselect";
components: { Treeselect }, import "@riophae/vue-treeselect/dist/vue-treeselect.css";
data() {
return { export default {
// name: "Dept",
loading: true, components: { Treeselect },
// data() {
showSearch: true, return {
// //
deptList: [], loading: true,
// //
deptOptions: [], showSearch: true,
// //
title: "", deptList: [],
// //
open: false, deptOptions: [],
// //
statusOptions: [], title: "",
// //
queryParams: { open: false,
deptName: undefined, //
status: undefined statusOptions: [],
}, //
// queryParams: {
form: {}, deptName: undefined,
// status: undefined
rules: { },
parentId: [ //
{ required: true, message: "上级部门不能为空", trigger: "blur" } form: {},
], //
deptName: [ rules: {
{ required: true, message: "部门名称不能为空", trigger: "blur" } parentId: [
], { required: true, message: "上级部门不能为空", trigger: "blur" }
orderNum: [ ],
{ required: true, message: "显示排序不能为空", trigger: "blur" } deptName: [
], { required: true, message: "部门名称不能为空", trigger: "blur" }
email: [ ],
{ orderNum: [
type: "email", { required: true, message: "显示排序不能为空", trigger: "blur" }
message: "'请输入正确的邮箱地址", ],
trigger: ["blur", "change"] email: [
} {
], type: "email",
phone: [ message: "'请输入正确的邮箱地址",
{ trigger: ["blur", "change"]
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, }
message: "请输入正确的手机号码", ],
trigger: "blur" phone: [
} {
] pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
} message: "请输入正确的手机号码",
}; trigger: "blur"
}, }
created() { ]
this.getList(); }
this.getDicts("sys_normal_disable").then(response => { };
this.statusOptions = response.data; },
}); created() {
}, this.getList();
methods: { this.getDicts("sys_normal_disable").then(response => {
/** 查询部门列表 */ this.statusOptions = response.data;
getList() { });
this.loading = true; },
listDept(this.queryParams).then(response => { methods: {
this.deptList = this.handleTree(response.data, "deptId"); /** 查询部门列表 */
this.loading = false; getList() {
}); this.loading = true;
}, listDept(this.queryParams).then(response => {
/** 转换部门数据结构 */ this.deptList = this.handleTree(response.data, "deptId");
normalizer(node) { this.loading = false;
if (node.children && !node.children.length) { });
delete node.children; },
} /** 转换部门数据结构 */
return { normalizer(node) {
id: node.deptId, if (node.children && !node.children.length) {
label: node.deptName, delete node.children;
children: node.children }
}; return {
}, id: node.deptId,
// label: node.deptName,
statusFormat(row, column) { children: node.children
return this.selectDictLabel(this.statusOptions, row.status); };
}, },
// //
cancel() { cancel() {
this.open = false; this.open = false;
this.reset(); this.reset();
}, },
// //
reset() { reset() {
this.form = { this.form = {
deptId: undefined, deptId: undefined,
parentId: undefined, parentId: undefined,
deptName: undefined, deptName: undefined,
orderNum: undefined, orderNum: undefined,
leader: undefined, leader: undefined,
phone: undefined, phone: undefined,
email: undefined, email: undefined,
status: "0" status: "0"
}; };
this.resetForm("form"); this.resetForm("form");
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.getList(); this.getList();
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
this.resetForm("queryForm"); this.resetForm("queryForm");
this.handleQuery(); this.handleQuery();
}, },
/** 新增按钮操作 */ /** 新增按钮操作 */
handleAdd(row) { handleAdd(row) {
this.reset(); this.reset();
if (row != undefined) { if (row != undefined) {
this.form.parentId = row.deptId; this.form.parentId = row.deptId;
} }
this.open = true; this.open = true;
this.title = "添加部门"; this.title = "添加部门";
listDept().then(response => { listDept().then(response => {
this.deptOptions = this.handleTree(response.data, "deptId"); this.deptOptions = this.handleTree(response.data, "deptId");
}); });
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
this.reset(); this.reset();
getDept(row.deptId).then(response => { getDept(row.deptId).then(response => {
this.form = response.data; this.form = response.data;
this.open = true; this.open = true;
this.title = "修改部门"; this.title = "修改部门";
}); });
listDeptExcludeChild(row.deptId).then(response => { listDeptExcludeChild(row.deptId).then(response => {
this.deptOptions = this.handleTree(response.data, "deptId"); this.deptOptions = this.handleTree(response.data, "deptId");
}); });
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm: function() { submitForm: function() {
this.$refs["form"].validate(valid => { this.$refs["form"].validate(valid => {
if (valid) { if (valid) {
if (this.form.deptId != undefined) { if (this.form.deptId != undefined) {
updateDept(this.form).then(response => { updateDept(this.form).then(response => {
this.msgSuccess("修改成功"); this.msgSuccess("修改成功");
this.open = false; this.open = false;
this.getList(); this.getList();
}); });
} else { } else {
addDept(this.form).then(response => { addDept(this.form).then(response => {
this.msgSuccess("新增成功"); this.msgSuccess("新增成功");
this.open = false; this.open = false;
this.getList(); this.getList();
}); });
} }
} }
}); });
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { handleDelete(row) {
this.$confirm('是否确认删除名称为"' + row.deptName + '"的数据项?', "警告", { this.$confirm('是否确认删除名称为"' + row.deptName + '"的数据项?', "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning" type: "warning"
}).then(function() { }).then(function() {
return delDept(row.deptId); return delDept(row.deptId);
}).then(() => { }).then(() => {
this.getList(); this.getList();
this.msgSuccess("删除成功"); this.msgSuccess("删除成功");
}).catch(() => {}); }).catch(() => {});
} }
} }
}; };
</script> </script>

View File

@ -1,442 +1,432 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch"> <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
<el-form-item label="菜单名称" prop="menuName"> <el-form-item label="菜单名称" prop="menuName">
<el-input <el-input
v-model="queryParams.menuName" v-model="queryParams.menuName"
placeholder="请输入菜单名称" placeholder="请输入菜单名称"
clearable clearable
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="状态" prop="status"> <el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" placeholder="菜单状态" clearable size="small"> <el-select v-model="queryParams.status" placeholder="菜单状态" clearable size="small">
<el-option <el-option
v-for="dict in statusOptions" v-for="dict in statusOptions"
:key="dict.dictValue" :key="dict.dictValue"
:label="dict.dictLabel" :label="dict.dictLabel"
:value="dict.dictValue" :value="dict.dictValue"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="primary" type="primary"
plain plain
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:menu:add']" v-hasPermi="['system:menu:add']"
>新增</el-button> >新增</el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table <el-table
v-loading="loading" v-loading="loading"
:data="menuList" :data="menuList"
row-key="menuId" row-key="menuId"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}" :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
> >
<el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column> <el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>
<el-table-column prop="icon" label="图标" align="center" width="100"> <el-table-column prop="icon" label="图标" align="center" width="100">
<template slot-scope="scope"> <template slot-scope="scope">
<svg-icon :icon-class="scope.row.icon" /> <svg-icon :icon-class="scope.row.icon" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="orderNum" label="排序" width="60"></el-table-column> <el-table-column prop="orderNum" label="排序" width="60"></el-table-column>
<el-table-column prop="perms" label="权限标识" :show-overflow-tooltip="true"></el-table-column> <el-table-column prop="perms" label="权限标识" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="component" label="组件路径" :show-overflow-tooltip="true"></el-table-column> <el-table-column prop="component" label="组件路径" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="status" label="状态" :formatter="statusFormat" width="80"></el-table-column> <el-table-column prop="status" label="状态" width="80">
<el-table-column label="创建时间" align="center" prop="createTime"> <template slot-scope="scope">
<template slot-scope="scope"> <dict-tag :options="statusOptions" :value="scope.row.status"/>
<span>{{ parseTime(scope.row.createTime) }}</span> </template>
</template> </el-table-column>
</el-table-column> <el-table-column label="创建时间" align="center" prop="createTime">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <template slot-scope="scope">
<template slot-scope="scope"> <span>{{ parseTime(scope.row.createTime) }}</span>
<el-button size="mini" </template>
type="text" </el-table-column>
icon="el-icon-edit" <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
@click="handleUpdate(scope.row)" <template slot-scope="scope">
v-hasPermi="['system:menu:edit']" <el-button size="mini"
>修改</el-button> type="text"
<el-button icon="el-icon-edit"
size="mini" @click="handleUpdate(scope.row)"
type="text" v-hasPermi="['system:menu:edit']"
icon="el-icon-plus" >修改</el-button>
@click="handleAdd(scope.row)" <el-button
v-hasPermi="['system:menu:add']" size="mini"
>新增</el-button> type="text"
<el-button icon="el-icon-plus"
size="mini" @click="handleAdd(scope.row)"
type="text" v-hasPermi="['system:menu:add']"
icon="el-icon-delete" >新增</el-button>
@click="handleDelete(scope.row)" <el-button
v-hasPermi="['system:menu:remove']" size="mini"
>删除</el-button> type="text"
</template> icon="el-icon-delete"
</el-table-column> @click="handleDelete(scope.row)"
</el-table> v-hasPermi="['system:menu:remove']"
>删除</el-button>
<!-- 添加或修改菜单对话框 --> </template>
<el-dialog :title="title" :visible.sync="open" width="680px" append-to-body> </el-table-column>
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> </el-table>
<el-row>
<el-col :span="24"> <!-- 添加或修改菜单对话框 -->
<el-form-item label="上级菜单"> <el-dialog :title="title" :visible.sync="open" width="680px" append-to-body>
<treeselect <el-form ref="form" :model="form" :rules="rules" label-width="100px">
v-model="form.parentId" <el-row>
:options="menuOptions" <el-col :span="24">
:normalizer="normalizer" <el-form-item label="上级菜单">
:show-count="true" <treeselect
placeholder="选择上级菜单" v-model="form.parentId"
/> :options="menuOptions"
</el-form-item> :normalizer="normalizer"
</el-col> :show-count="true"
<el-col :span="24"> placeholder="选择上级菜单"
<el-form-item label="菜单类型" prop="menuType"> />
<el-radio-group v-model="form.menuType"> </el-form-item>
<el-radio label="M">目录</el-radio> </el-col>
<el-radio label="C">菜单</el-radio> <el-col :span="24">
<el-radio label="F">按钮</el-radio> <el-form-item label="菜单类型" prop="menuType">
</el-radio-group> <el-radio-group v-model="form.menuType">
</el-form-item> <el-radio label="M">目录</el-radio>
</el-col> <el-radio label="C">菜单</el-radio>
<el-col :span="24"> <el-radio label="F">按钮</el-radio>
<el-form-item v-if="form.menuType != 'F'" label="菜单图标"> </el-radio-group>
<el-popover </el-form-item>
placement="bottom-start" </el-col>
width="460" <el-col :span="24">
trigger="click" <el-form-item v-if="form.menuType != 'F'" label="菜单图标">
@show="$refs['iconSelect'].reset()" <el-popover
> placement="bottom-start"
<IconSelect ref="iconSelect" @selected="selected" /> width="460"
<el-input slot="reference" v-model="form.icon" placeholder="点击选择图标" readonly> trigger="click"
<svg-icon @show="$refs['iconSelect'].reset()"
v-if="form.icon" >
slot="prefix" <IconSelect ref="iconSelect" @selected="selected" />
:icon-class="form.icon" <el-input slot="reference" v-model="form.icon" placeholder="点击选择图标" readonly>
class="el-input__icon" <svg-icon
style="height: 32px;width: 16px;" v-if="form.icon"
/> slot="prefix"
<i v-else slot="prefix" class="el-icon-search el-input__icon" /> :icon-class="form.icon"
</el-input> class="el-input__icon"
</el-popover> style="height: 32px;width: 16px;"
</el-form-item> />
</el-col> <i v-else slot="prefix" class="el-icon-search el-input__icon" />
<el-col :span="12"> </el-input>
<el-form-item label="菜单名称" prop="menuName"> </el-popover>
<el-input v-model="form.menuName" placeholder="请输入菜单名称" /> </el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :span="12">
<el-col :span="12"> <el-form-item label="菜单名称" prop="menuName">
<el-form-item label="显示排序" prop="orderNum"> <el-input v-model="form.menuName" placeholder="请输入菜单名称" />
<el-input-number v-model="form.orderNum" controls-position="right" :min="0" /> </el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :span="12">
<el-col :span="12"> <el-form-item label="显示排序" prop="orderNum">
<el-form-item v-if="form.menuType != 'F'"> <el-input-number v-model="form.orderNum" controls-position="right" :min="0" />
<span slot="label"> </el-form-item>
<el-tooltip content="选择是外链则路由地址需要以`http(s)://`开头" placement="top"> </el-col>
<i class="el-icon-question"></i> <el-col :span="12">
</el-tooltip> <el-form-item v-if="form.menuType != 'F'">
是否外链 <span slot="label">
</span> <el-tooltip content="选择是外链则路由地址需要以`http(s)://`开头" placement="top">
<el-radio-group v-model="form.isFrame"> <i class="el-icon-question"></i>
<el-radio label="0"></el-radio> </el-tooltip>
<el-radio label="1"></el-radio> 是否外链
</el-radio-group> </span>
</el-form-item> <el-radio-group v-model="form.isFrame">
</el-col> <el-radio label="0"></el-radio>
<el-col :span="12"> <el-radio label="1"></el-radio>
<el-form-item v-if="form.menuType != 'F'" prop="path"> </el-radio-group>
<span slot="label"> </el-form-item>
<el-tooltip content="访问的路由地址,如:`user`,如外网地址需内链访问则以`http(s)://`开头" placement="top"> </el-col>
<i class="el-icon-question"></i> <el-col :span="12">
</el-tooltip> <el-form-item v-if="form.menuType != 'F'" prop="path">
路由地址 <span slot="label">
</span> <el-tooltip content="访问的路由地址,如:`user`,如外网地址需内链访问则以`http(s)://`开头" placement="top">
<el-input v-model="form.path" placeholder="请输入路由地址" /> <i class="el-icon-question"></i>
</el-form-item> </el-tooltip>
</el-col> 路由地址
<el-col :span="12" v-if="form.menuType == 'C'"> </span>
<el-form-item prop="component"> <el-input v-model="form.path" placeholder="请输入路由地址" />
<span slot="label"> </el-form-item>
<el-tooltip content="访问的组件路径,如:`system/user/index`,默认在`views`目录下" placement="top"> </el-col>
<i class="el-icon-question"></i> <el-col :span="12" v-if="form.menuType == 'C'">
</el-tooltip> <el-form-item prop="component">
组件路径 <span slot="label">
</span> <el-tooltip content="访问的组件路径,如:`system/user/index`,默认在`views`目录下" placement="top">
<el-input v-model="form.component" placeholder="请输入组件路径" /> <i class="el-icon-question"></i>
</el-form-item> </el-tooltip>
</el-col> 组件路径
<el-col :span="12"> </span>
<el-form-item v-if="form.menuType != 'M'"> <el-input v-model="form.component" placeholder="请输入组件路径" />
<el-input v-model="form.perms" placeholder="请输入权限标识" maxlength="100" /> </el-form-item>
<span slot="label"> </el-col>
<el-tooltip content="控制器中定义的权限字符,如:@PreAuthorize(`@ss.hasPermi('system:user:list')`)" placement="top"> <el-col :span="12">
<i class="el-icon-question"></i> <el-form-item v-if="form.menuType != 'M'">
</el-tooltip> <el-input v-model="form.perms" placeholder="请输入权限标识" maxlength="100" />
权限字符 <span slot="label">
</span> <el-tooltip content="控制器中定义的权限字符,如:@PreAuthorize(`@ss.hasPermi('system:user:list')`)" placement="top">
</el-form-item> <i class="el-icon-question"></i>
</el-col> </el-tooltip>
<el-col :span="12"> 权限字符
<el-form-item v-if="form.menuType != 'F'"> </span>
<span slot="label"> </el-form-item>
<el-tooltip content="选择隐藏则路由将不会出现在侧边栏,但仍然可以访问" placement="top"> </el-col>
<i class="el-icon-question"></i> <el-col :span="12">
</el-tooltip> <el-form-item v-if="form.menuType != 'F'">
显示状态 <span slot="label">
</span> <el-tooltip content="选择隐藏则路由将不会出现在侧边栏,但仍然可以访问" placement="top">
<el-radio-group v-model="form.visible"> <i class="el-icon-question"></i>
<el-radio </el-tooltip>
v-for="dict in visibleOptions" 显示状态
:key="dict.dictValue" </span>
:label="dict.dictValue" <el-radio-group v-model="form.visible">
>{{dict.dictLabel}}</el-radio> <el-radio
</el-radio-group> v-for="dict in visibleOptions"
</el-form-item> :key="dict.dictValue"
</el-col> :label="dict.dictValue"
<el-col :span="12"> >{{dict.dictLabel}}</el-radio>
<el-form-item v-if="form.menuType != 'F'"> </el-radio-group>
<span slot="label"> </el-form-item>
<el-tooltip content="选择停用则路由将不会出现在侧边栏,也不能被访问" placement="top"> </el-col>
<i class="el-icon-question"></i> <el-col :span="12">
</el-tooltip> <el-form-item v-if="form.menuType != 'F'">
菜单状态 <span slot="label">
</span> <el-tooltip content="选择停用则路由将不会出现在侧边栏,也不能被访问" placement="top">
<el-radio-group v-model="form.status"> <i class="el-icon-question"></i>
<el-radio </el-tooltip>
v-for="dict in statusOptions" 菜单状态
:key="dict.dictValue" </span>
:label="dict.dictValue" <el-radio-group v-model="form.status">
>{{dict.dictLabel}}</el-radio> <el-radio
</el-radio-group> v-for="dict in statusOptions"
</el-form-item> :key="dict.dictValue"
</el-col> :label="dict.dictValue"
<el-col :span="12"> >{{dict.dictLabel}}</el-radio>
<el-form-item v-if="form.menuType == 'C'"> </el-radio-group>
<span slot="label"> </el-form-item>
<el-tooltip content="选择是则会被`keep-alive`缓存,需要匹配组件的`name`和地址保持一致" placement="top"> </el-col>
<i class="el-icon-question"></i> <el-col :span="12">
</el-tooltip> <el-form-item v-if="form.menuType == 'C'">
是否缓存 <span slot="label">
</span> <el-tooltip content="选择是则会被`keep-alive`缓存,需要匹配组件的`name`和地址保持一致" placement="top">
<el-radio-group v-model="form.isCache"> <i class="el-icon-question"></i>
<el-radio label="0">缓存</el-radio> </el-tooltip>
<el-radio label="1">不缓存</el-radio> 是否缓存
</el-radio-group> </span>
</el-form-item> <el-radio-group v-model="form.isCache">
</el-col> <el-radio label="0">缓存</el-radio>
</el-row> <el-radio label="1">不缓存</el-radio>
</el-form> </el-radio-group>
<div slot="footer" class="dialog-footer"> </el-form-item>
<el-button type="primary" @click="submitForm"> </el-button> </el-col>
<el-button @click="cancel"> </el-button> </el-row>
</div> </el-form>
</el-dialog> <div slot="footer" class="dialog-footer">
</div> <el-button type="primary" @click="submitForm"> </el-button>
</template> <el-button @click="cancel"> </el-button>
</div>
<script> </el-dialog>
import { listMenu, getMenu, delMenu, addMenu, updateMenu } from "@/api/system/menu"; </div>
import Treeselect from "@riophae/vue-treeselect"; </template>
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import IconSelect from "@/components/IconSelect"; <script>
import { listMenu, getMenu, delMenu, addMenu, updateMenu } from "@/api/system/menu";
export default { import Treeselect from "@riophae/vue-treeselect";
name: "Menu", import "@riophae/vue-treeselect/dist/vue-treeselect.css";
components: { Treeselect, IconSelect }, import IconSelect from "@/components/IconSelect";
data() {
return { export default {
// name: "Menu",
loading: true, components: { Treeselect, IconSelect },
// data() {
showSearch: true, return {
// //
menuList: [], loading: true,
// //
menuOptions: [], showSearch: true,
// //
title: "", menuList: [],
// //
open: false, menuOptions: [],
// //
visibleOptions: [], title: "",
// //
statusOptions: [], open: false,
// //
queryParams: { visibleOptions: [],
menuName: undefined, //
visible: undefined statusOptions: [],
}, //
// queryParams: {
form: {}, menuName: undefined,
// visible: undefined
rules: { },
menuName: [ //
{ required: true, message: "菜单名称不能为空", trigger: "blur" } form: {},
], //
orderNum: [ rules: {
{ required: true, message: "菜单顺序不能为空", trigger: "blur" } menuName: [
], { required: true, message: "菜单名称不能为空", trigger: "blur" }
path: [ ],
{ required: true, message: "路由地址不能为空", trigger: "blur" } orderNum: [
] { required: true, message: "菜单顺序不能为空", trigger: "blur" }
} ],
}; path: [
}, { required: true, message: "路由地址不能为空", trigger: "blur" }
created() { ]
this.getList(); }
this.getDicts("sys_show_hide").then(response => { };
this.visibleOptions = response.data; },
}); created() {
this.getDicts("sys_normal_disable").then(response => { this.getList();
this.statusOptions = response.data; this.getDicts("sys_show_hide").then(response => {
}); this.visibleOptions = response.data;
}, });
methods: { this.getDicts("sys_normal_disable").then(response => {
// this.statusOptions = response.data;
selected(name) { });
this.form.icon = name; },
}, methods: {
/** 查询菜单列表 */ //
getList() { selected(name) {
this.loading = true; this.form.icon = name;
listMenu(this.queryParams).then(response => { },
this.menuList = this.handleTree(response.data, "menuId"); /** 查询菜单列表 */
this.loading = false; getList() {
}); this.loading = true;
}, listMenu(this.queryParams).then(response => {
/** 转换菜单数据结构 */ this.menuList = this.handleTree(response.data, "menuId");
normalizer(node) { this.loading = false;
if (node.children && !node.children.length) { });
delete node.children; },
} /** 转换菜单数据结构 */
return { normalizer(node) {
id: node.menuId, if (node.children && !node.children.length) {
label: node.menuName, delete node.children;
children: node.children }
}; return {
}, id: node.menuId,
/** 查询菜单下拉树结构 */ label: node.menuName,
getTreeselect() { children: node.children
listMenu().then(response => { };
this.menuOptions = []; },
const menu = { menuId: 0, menuName: '主类目', children: [] }; /** 查询菜单下拉树结构 */
menu.children = this.handleTree(response.data, "menuId"); getTreeselect() {
this.menuOptions.push(menu); listMenu().then(response => {
}); this.menuOptions = [];
}, const menu = { menuId: 0, menuName: '主类目', children: [] };
// menu.children = this.handleTree(response.data, "menuId");
visibleFormat(row, column) { this.menuOptions.push(menu);
if (row.menuType == "F") { });
return ""; },
} //
return this.selectDictLabel(this.visibleOptions, row.visible); cancel() {
}, this.open = false;
// this.reset();
statusFormat(row, column) { },
if (row.menuType == "F") { //
return ""; reset() {
} this.form = {
return this.selectDictLabel(this.statusOptions, row.status); menuId: undefined,
}, parentId: 0,
// menuName: undefined,
cancel() { icon: undefined,
this.open = false; menuType: "M",
this.reset(); orderNum: undefined,
}, isFrame: "1",
// isCache: "0",
reset() { visible: "0",
this.form = { status: "0"
menuId: undefined, };
parentId: 0, this.resetForm("form");
menuName: undefined, },
icon: undefined, /** 搜索按钮操作 */
menuType: "M", handleQuery() {
orderNum: undefined, this.getList();
isFrame: "1", },
isCache: "0", /** 重置按钮操作 */
visible: "0", resetQuery() {
status: "0" this.resetForm("queryForm");
}; this.handleQuery();
this.resetForm("form"); },
}, /** 新增按钮操作 */
/** 搜索按钮操作 */ handleAdd(row) {
handleQuery() { this.reset();
this.getList(); this.getTreeselect();
}, if (row != null && row.menuId) {
/** 重置按钮操作 */ this.form.parentId = row.menuId;
resetQuery() { } else {
this.resetForm("queryForm"); this.form.parentId = 0;
this.handleQuery(); }
}, this.open = true;
/** 新增按钮操作 */ this.title = "添加菜单";
handleAdd(row) { },
this.reset(); /** 修改按钮操作 */
this.getTreeselect(); handleUpdate(row) {
if (row != null && row.menuId) { this.reset();
this.form.parentId = row.menuId; this.getTreeselect();
} else { getMenu(row.menuId).then(response => {
this.form.parentId = 0; this.form = response.data;
} this.open = true;
this.open = true; this.title = "修改菜单";
this.title = "添加菜单"; });
}, },
/** 修改按钮操作 */ /** 提交按钮 */
handleUpdate(row) { submitForm: function() {
this.reset(); this.$refs["form"].validate(valid => {
this.getTreeselect(); if (valid) {
getMenu(row.menuId).then(response => { if (this.form.menuId != undefined) {
this.form = response.data; updateMenu(this.form).then(response => {
this.open = true; this.msgSuccess("修改成功");
this.title = "修改菜单"; this.open = false;
}); this.getList();
}, });
/** 提交按钮 */ } else {
submitForm: function() { addMenu(this.form).then(response => {
this.$refs["form"].validate(valid => { this.msgSuccess("新增成功");
if (valid) { this.open = false;
if (this.form.menuId != undefined) { this.getList();
updateMenu(this.form).then(response => { });
this.msgSuccess("修改成功"); }
this.open = false; }
this.getList(); });
}); },
} else { /** 删除按钮操作 */
addMenu(this.form).then(response => { handleDelete(row) {
this.msgSuccess("新增成功"); this.$confirm('是否确认删除名称为"' + row.menuName + '"的数据项?', "警告", {
this.open = false; confirmButtonText: "确定",
this.getList(); cancelButtonText: "取消",
}); type: "warning"
} }).then(function() {
} return delMenu(row.menuId);
}); }).then(() => {
}, this.getList();
/** 删除按钮操作 */ this.msgSuccess("删除成功");
handleDelete(row) { }).catch(() => {});
this.$confirm('是否确认删除名称为"' + row.menuName + '"的数据项?', "警告", { }
confirmButtonText: "确定", }
cancelButtonText: "取消", };
type: "warning" </script>
}).then(function() {
return delMenu(row.menuId);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(() => {});
}
}
};
</script>

View File

@ -1,339 +1,327 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="公告标题" prop="noticeTitle"> <el-form-item label="公告标题" prop="noticeTitle">
<el-input <el-input
v-model="queryParams.noticeTitle" v-model="queryParams.noticeTitle"
placeholder="请输入公告标题" placeholder="请输入公告标题"
clearable clearable
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="操作人员" prop="createBy"> <el-form-item label="操作人员" prop="createBy">
<el-input <el-input
v-model="queryParams.createBy" v-model="queryParams.createBy"
placeholder="请输入操作人员" placeholder="请输入操作人员"
clearable clearable
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="类型" prop="noticeType"> <el-form-item label="类型" prop="noticeType">
<el-select v-model="queryParams.noticeType" placeholder="公告类型" clearable size="small"> <el-select v-model="queryParams.noticeType" placeholder="公告类型" clearable size="small">
<el-option <el-option
v-for="dict in typeOptions" v-for="dict in typeOptions"
:key="dict.dictValue" :key="dict.dictValue"
:label="dict.dictLabel" :label="dict.dictLabel"
:value="dict.dictValue" :value="dict.dictValue"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="primary" type="primary"
plain plain
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:notice:add']" v-hasPermi="['system:notice:add']"
>新增</el-button> >新增</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="success" type="success"
plain plain
icon="el-icon-edit" icon="el-icon-edit"
size="mini" size="mini"
:disabled="single" :disabled="single"
@click="handleUpdate" @click="handleUpdate"
v-hasPermi="['system:notice:edit']" v-hasPermi="['system:notice:edit']"
>修改</el-button> >修改</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
plain plain
icon="el-icon-delete" icon="el-icon-delete"
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete" @click="handleDelete"
v-hasPermi="['system:notice:remove']" v-hasPermi="['system:notice:remove']"
>删除</el-button> >删除</el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table v-loading="loading" :data="noticeList" @selection-change="handleSelectionChange"> <el-table v-loading="loading" :data="noticeList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" align="center" prop="noticeId" width="100" /> <el-table-column label="序号" align="center" prop="noticeId" width="100" />
<el-table-column <el-table-column
label="公告标题" label="公告标题"
align="center" align="center"
prop="noticeTitle" prop="noticeTitle"
:show-overflow-tooltip="true" :show-overflow-tooltip="true"
/> />
<el-table-column <el-table-column label="公告类型" align="center" prop="noticeType" width="100">
label="公告类型" <template slot-scope="scope">
align="center" <dict-tag :options="typeOptions" :value="scope.row.noticeType"/>
prop="noticeType" </template>
:formatter="typeFormat" </el-table-column>
width="100" <el-table-column label="状态" align="center" prop="status" width="100">
/> <template slot-scope="scope">
<el-table-column <dict-tag :options="statusOptions" :value="scope.row.status"/>
label="状态" </template>
align="center" </el-table-column>
prop="status" <el-table-column label="创建者" align="center" prop="createBy" width="100" />
:formatter="statusFormat" <el-table-column label="创建时间" align="center" prop="createTime" width="100">
width="100" <template slot-scope="scope">
/> <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
<el-table-column label="创建者" align="center" prop="createBy" width="100" /> </template>
<el-table-column label="创建时间" align="center" prop="createTime" width="100"> </el-table-column>
<template slot-scope="scope"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span> <template slot-scope="scope">
</template> <el-button
</el-table-column> size="mini"
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> type="text"
<template slot-scope="scope"> icon="el-icon-edit"
<el-button @click="handleUpdate(scope.row)"
size="mini" v-hasPermi="['system:notice:edit']"
type="text" >修改</el-button>
icon="el-icon-edit" <el-button
@click="handleUpdate(scope.row)" size="mini"
v-hasPermi="['system:notice:edit']" type="text"
>修改</el-button> icon="el-icon-delete"
<el-button @click="handleDelete(scope.row)"
size="mini" v-hasPermi="['system:notice:remove']"
type="text" >删除</el-button>
icon="el-icon-delete" </template>
@click="handleDelete(scope.row)" </el-table-column>
v-hasPermi="['system:notice:remove']" </el-table>
>删除</el-button>
</template> <pagination
</el-table-column> v-show="total>0"
</el-table> :total="total"
:page.sync="queryParams.pageNum"
<pagination :limit.sync="queryParams.pageSize"
v-show="total>0" @pagination="getList"
:total="total" />
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" <!-- 添加或修改公告对话框 -->
@pagination="getList" <el-dialog :title="title" :visible.sync="open" width="780px" append-to-body>
/> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-row>
<!-- 添加或修改公告对话框 --> <el-col :span="12">
<el-dialog :title="title" :visible.sync="open" width="780px" append-to-body> <el-form-item label="公告标题" prop="noticeTitle">
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <el-input v-model="form.noticeTitle" placeholder="请输入公告标题" />
<el-row> </el-form-item>
<el-col :span="12"> </el-col>
<el-form-item label="公告标题" prop="noticeTitle"> <el-col :span="12">
<el-input v-model="form.noticeTitle" placeholder="请输入公告标题" /> <el-form-item label="公告类型" prop="noticeType">
</el-form-item> <el-select v-model="form.noticeType" placeholder="请选择">
</el-col> <el-option
<el-col :span="12"> v-for="dict in typeOptions"
<el-form-item label="公告类型" prop="noticeType"> :key="dict.dictValue"
<el-select v-model="form.noticeType" placeholder="请选择"> :label="dict.dictLabel"
<el-option :value="dict.dictValue"
v-for="dict in typeOptions" ></el-option>
:key="dict.dictValue" </el-select>
:label="dict.dictLabel" </el-form-item>
:value="dict.dictValue" </el-col>
></el-option> <el-col :span="24">
</el-select> <el-form-item label="状态">
</el-form-item> <el-radio-group v-model="form.status">
</el-col> <el-radio
<el-col :span="24"> v-for="dict in statusOptions"
<el-form-item label="状态"> :key="dict.dictValue"
<el-radio-group v-model="form.status"> :label="dict.dictValue"
<el-radio >{{dict.dictLabel}}</el-radio>
v-for="dict in statusOptions" </el-radio-group>
:key="dict.dictValue" </el-form-item>
:label="dict.dictValue" </el-col>
>{{dict.dictLabel}}</el-radio> <el-col :span="24">
</el-radio-group> <el-form-item label="内容">
</el-form-item> <editor v-model="form.noticeContent" :min-height="192"/>
</el-col> </el-form-item>
<el-col :span="24"> </el-col>
<el-form-item label="内容"> </el-row>
<editor v-model="form.noticeContent" :min-height="192"/> </el-form>
</el-form-item> <div slot="footer" class="dialog-footer">
</el-col> <el-button type="primary" @click="submitForm"> </el-button>
</el-row> <el-button @click="cancel"> </el-button>
</el-form> </div>
<div slot="footer" class="dialog-footer"> </el-dialog>
<el-button type="primary" @click="submitForm"> </el-button> </div>
<el-button @click="cancel"> </el-button> </template>
</div>
</el-dialog> <script>
</div> import { listNotice, getNotice, delNotice, addNotice, updateNotice } from "@/api/system/notice";
</template>
export default {
<script> name: "Notice",
import { listNotice, getNotice, delNotice, addNotice, updateNotice } from "@/api/system/notice"; data() {
return {
export default { //
name: "Notice", loading: true,
data() { //
return { ids: [],
// //
loading: true, single: true,
// //
ids: [], multiple: true,
// //
single: true, showSearch: true,
// //
multiple: true, total: 0,
// //
showSearch: true, noticeList: [],
// //
total: 0, title: "",
// //
noticeList: [], open: false,
// //
title: "", statusOptions: [],
// //
open: false, typeOptions: [],
// //
statusOptions: [], queryParams: {
// pageNum: 1,
typeOptions: [], pageSize: 10,
// noticeTitle: undefined,
queryParams: { createBy: undefined,
pageNum: 1, status: undefined
pageSize: 10, },
noticeTitle: undefined, //
createBy: undefined, form: {},
status: undefined //
}, rules: {
// noticeTitle: [
form: {}, { required: true, message: "公告标题不能为空", trigger: "blur" }
// ],
rules: { noticeType: [
noticeTitle: [ { required: true, message: "公告类型不能为空", trigger: "change" }
{ required: true, message: "公告标题不能为空", trigger: "blur" } ]
], }
noticeType: [ };
{ required: true, message: "公告类型不能为空", trigger: "change" } },
] created() {
} this.getList();
}; this.getDicts("sys_notice_status").then(response => {
}, this.statusOptions = response.data;
created() { });
this.getList(); this.getDicts("sys_notice_type").then(response => {
this.getDicts("sys_notice_status").then(response => { this.typeOptions = response.data;
this.statusOptions = response.data; });
}); },
this.getDicts("sys_notice_type").then(response => { methods: {
this.typeOptions = response.data; /** 查询公告列表 */
}); getList() {
}, this.loading = true;
methods: { listNotice(this.queryParams).then(response => {
/** 查询公告列表 */ this.noticeList = response.rows;
getList() { this.total = response.total;
this.loading = true; this.loading = false;
listNotice(this.queryParams).then(response => { });
this.noticeList = response.rows; },
this.total = response.total; //
this.loading = false; cancel() {
}); this.open = false;
}, this.reset();
// },
statusFormat(row, column) { //
return this.selectDictLabel(this.statusOptions, row.status); reset() {
}, this.form = {
// noticeId: undefined,
typeFormat(row, column) { noticeTitle: undefined,
return this.selectDictLabel(this.typeOptions, row.noticeType); noticeType: undefined,
}, noticeContent: undefined,
// status: "0"
cancel() { };
this.open = false; this.resetForm("form");
this.reset(); },
}, /** 搜索按钮操作 */
// handleQuery() {
reset() { this.queryParams.pageNum = 1;
this.form = { this.getList();
noticeId: undefined, },
noticeTitle: undefined, /** 重置按钮操作 */
noticeType: undefined, resetQuery() {
noticeContent: undefined, this.resetForm("queryForm");
status: "0" this.handleQuery();
}; },
this.resetForm("form"); //
}, handleSelectionChange(selection) {
/** 搜索按钮操作 */ this.ids = selection.map(item => item.noticeId)
handleQuery() { this.single = selection.length!=1
this.queryParams.pageNum = 1; this.multiple = !selection.length
this.getList(); },
}, /** 新增按钮操作 */
/** 重置按钮操作 */ handleAdd() {
resetQuery() { this.reset();
this.resetForm("queryForm"); this.open = true;
this.handleQuery(); this.title = "添加公告";
}, },
// /** 修改按钮操作 */
handleSelectionChange(selection) { handleUpdate(row) {
this.ids = selection.map(item => item.noticeId) this.reset();
this.single = selection.length!=1 const noticeId = row.noticeId || this.ids
this.multiple = !selection.length getNotice(noticeId).then(response => {
}, this.form = response.data;
/** 新增按钮操作 */ this.open = true;
handleAdd() { this.title = "修改公告";
this.reset(); });
this.open = true; },
this.title = "添加公告"; /** 提交按钮 */
}, submitForm: function() {
/** 修改按钮操作 */ this.$refs["form"].validate(valid => {
handleUpdate(row) { if (valid) {
this.reset(); if (this.form.noticeId != undefined) {
const noticeId = row.noticeId || this.ids updateNotice(this.form).then(response => {
getNotice(noticeId).then(response => { this.msgSuccess("修改成功");
this.form = response.data; this.open = false;
this.open = true; this.getList();
this.title = "修改公告"; });
}); } else {
}, addNotice(this.form).then(response => {
/** 提交按钮 */ this.msgSuccess("新增成功");
submitForm: function() { this.open = false;
this.$refs["form"].validate(valid => { this.getList();
if (valid) { });
if (this.form.noticeId != undefined) { }
updateNotice(this.form).then(response => { }
this.msgSuccess("修改成功"); });
this.open = false; },
this.getList(); /** 删除按钮操作 */
}); handleDelete(row) {
} else { const noticeIds = row.noticeId || this.ids
addNotice(this.form).then(response => { this.$confirm('是否确认删除公告编号为"' + noticeIds + '"的数据项?', "警告", {
this.msgSuccess("新增成功"); confirmButtonText: "确定",
this.open = false; cancelButtonText: "取消",
this.getList(); type: "warning"
}); }).then(function() {
} return delNotice(noticeIds);
} }).then(() => {
}); this.getList();
}, this.msgSuccess("删除成功");
/** 删除按钮操作 */ }).catch(() => {});
handleDelete(row) { }
const noticeIds = row.noticeId || this.ids }
this.$confirm('是否确认删除公告编号为"' + noticeIds + '"的数据项?', "警告", { };
confirmButtonText: "确定", </script>
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return delNotice(noticeIds);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(() => {});
}
}
};
</script>

View File

@ -1,331 +1,331 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="岗位编码" prop="postCode"> <el-form-item label="岗位编码" prop="postCode">
<el-input <el-input
v-model="queryParams.postCode" v-model="queryParams.postCode"
placeholder="请输入岗位编码" placeholder="请输入岗位编码"
clearable clearable
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="岗位名称" prop="postName"> <el-form-item label="岗位名称" prop="postName">
<el-input <el-input
v-model="queryParams.postName" v-model="queryParams.postName"
placeholder="请输入岗位名称" placeholder="请输入岗位名称"
clearable clearable
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="状态" prop="status"> <el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" placeholder="岗位状态" clearable size="small"> <el-select v-model="queryParams.status" placeholder="岗位状态" clearable size="small">
<el-option <el-option
v-for="dict in statusOptions" v-for="dict in statusOptions"
:key="dict.dictValue" :key="dict.dictValue"
:label="dict.dictLabel" :label="dict.dictLabel"
:value="dict.dictValue" :value="dict.dictValue"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="primary" type="primary"
plain plain
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:post:add']" v-hasPermi="['system:post:add']"
>新增</el-button> >新增</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="success" type="success"
plain plain
icon="el-icon-edit" icon="el-icon-edit"
size="mini" size="mini"
:disabled="single" :disabled="single"
@click="handleUpdate" @click="handleUpdate"
v-hasPermi="['system:post:edit']" v-hasPermi="['system:post:edit']"
>修改</el-button> >修改</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
plain plain
icon="el-icon-delete" icon="el-icon-delete"
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete" @click="handleDelete"
v-hasPermi="['system:post:remove']" v-hasPermi="['system:post:remove']"
>删除</el-button> >删除</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="warning" type="warning"
plain plain
icon="el-icon-download" icon="el-icon-download"
size="mini" size="mini"
:loading="exportLoading" :loading="exportLoading"
@click="handleExport" @click="handleExport"
v-hasPermi="['system:post:export']" v-hasPermi="['system:post:export']"
>导出</el-button> >导出</el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table v-loading="loading" :data="postList" @selection-change="handleSelectionChange"> <el-table v-loading="loading" :data="postList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="岗位编号" align="center" prop="postId" /> <el-table-column label="岗位编号" align="center" prop="postId" />
<el-table-column label="岗位编码" align="center" prop="postCode" /> <el-table-column label="岗位编码" align="center" prop="postCode" />
<el-table-column label="岗位名称" align="center" prop="postName" /> <el-table-column label="岗位名称" align="center" prop="postName" />
<el-table-column label="岗位排序" align="center" prop="postSort" /> <el-table-column label="岗位排序" align="center" prop="postSort" />
<el-table-column label="状态" align="center" prop="status" :formatter="statusFormat" /> <el-table-column label="状态" align="center" prop="status">
<el-table-column label="创建时间" align="center" prop="createTime" width="180"> <template slot-scope="scope">
<template slot-scope="scope"> <dict-tag :options="statusOptions" :value="scope.row.status"/>
<span>{{ parseTime(scope.row.createTime) }}</span> </template>
</template> </el-table-column>
</el-table-column> <el-table-column label="创建时间" align="center" prop="createTime" width="180">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <template slot-scope="scope">
<template slot-scope="scope"> <span>{{ parseTime(scope.row.createTime) }}</span>
<el-button </template>
size="mini" </el-table-column>
type="text" <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
icon="el-icon-edit" <template slot-scope="scope">
@click="handleUpdate(scope.row)" <el-button
v-hasPermi="['system:post:edit']" size="mini"
>修改</el-button> type="text"
<el-button icon="el-icon-edit"
size="mini" @click="handleUpdate(scope.row)"
type="text" v-hasPermi="['system:post:edit']"
icon="el-icon-delete" >修改</el-button>
@click="handleDelete(scope.row)" <el-button
v-hasPermi="['system:post:remove']" size="mini"
>删除</el-button> type="text"
</template> icon="el-icon-delete"
</el-table-column> @click="handleDelete(scope.row)"
</el-table> v-hasPermi="['system:post:remove']"
>删除</el-button>
<pagination </template>
v-show="total>0" </el-table-column>
:total="total" </el-table>
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" <pagination
@pagination="getList" v-show="total>0"
/> :total="total"
:page.sync="queryParams.pageNum"
<!-- 添加或修改岗位对话框 --> :limit.sync="queryParams.pageSize"
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> @pagination="getList"
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> />
<el-form-item label="岗位名称" prop="postName">
<el-input v-model="form.postName" placeholder="请输入岗位名称" /> <!-- 添加或修改岗位对话框 -->
</el-form-item> <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form-item label="岗位编码" prop="postCode"> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-input v-model="form.postCode" placeholder="请输入编码名称" /> <el-form-item label="岗位名称" prop="postName">
</el-form-item> <el-input v-model="form.postName" placeholder="请输入岗位名称" />
<el-form-item label="岗位顺序" prop="postSort"> </el-form-item>
<el-input-number v-model="form.postSort" controls-position="right" :min="0" /> <el-form-item label="岗位编码" prop="postCode">
</el-form-item> <el-input v-model="form.postCode" placeholder="请输入编码名称" />
<el-form-item label="岗位状态" prop="status"> </el-form-item>
<el-radio-group v-model="form.status"> <el-form-item label="岗位顺序" prop="postSort">
<el-radio <el-input-number v-model="form.postSort" controls-position="right" :min="0" />
v-for="dict in statusOptions" </el-form-item>
:key="dict.dictValue" <el-form-item label="岗位状态" prop="status">
:label="dict.dictValue" <el-radio-group v-model="form.status">
>{{dict.dictLabel}}</el-radio> <el-radio
</el-radio-group> v-for="dict in statusOptions"
</el-form-item> :key="dict.dictValue"
<el-form-item label="备注" prop="remark"> :label="dict.dictValue"
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" /> >{{dict.dictLabel}}</el-radio>
</el-form-item> </el-radio-group>
</el-form> </el-form-item>
<div slot="footer" class="dialog-footer"> <el-form-item label="备注" prop="remark">
<el-button type="primary" @click="submitForm"> </el-button> <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
<el-button @click="cancel"> </el-button> </el-form-item>
</div> </el-form>
</el-dialog> <div slot="footer" class="dialog-footer">
</div> <el-button type="primary" @click="submitForm"> </el-button>
</template> <el-button @click="cancel"> </el-button>
</div>
<script> </el-dialog>
import { listPost, getPost, delPost, addPost, updatePost, exportPost } from "@/api/system/post"; </div>
</template>
export default {
name: "Post", <script>
data() { import { listPost, getPost, delPost, addPost, updatePost, exportPost } from "@/api/system/post";
return {
// export default {
loading: true, name: "Post",
// data() {
exportLoading: false, return {
// //
ids: [], loading: true,
// //
single: true, exportLoading: false,
// //
multiple: true, ids: [],
// //
showSearch: true, single: true,
// //
total: 0, multiple: true,
// //
postList: [], showSearch: true,
// //
title: "", total: 0,
// //
open: false, postList: [],
// //
statusOptions: [], title: "",
// //
queryParams: { open: false,
pageNum: 1, //
pageSize: 10, statusOptions: [],
postCode: undefined, //
postName: undefined, queryParams: {
status: undefined pageNum: 1,
}, pageSize: 10,
// postCode: undefined,
form: {}, postName: undefined,
// status: undefined
rules: { },
postName: [ //
{ required: true, message: "岗位名称不能为空", trigger: "blur" } form: {},
], //
postCode: [ rules: {
{ required: true, message: "岗位编码不能为空", trigger: "blur" } postName: [
], { required: true, message: "岗位名称不能为空", trigger: "blur" }
postSort: [ ],
{ required: true, message: "岗位顺序不能为空", trigger: "blur" } postCode: [
] { required: true, message: "岗位编码不能为空", trigger: "blur" }
} ],
}; postSort: [
}, { required: true, message: "岗位顺序不能为空", trigger: "blur" }
created() { ]
this.getList(); }
this.getDicts("sys_normal_disable").then(response => { };
this.statusOptions = response.data; },
}); created() {
}, this.getList();
methods: { this.getDicts("sys_normal_disable").then(response => {
/** 查询岗位列表 */ this.statusOptions = response.data;
getList() { });
this.loading = true; },
listPost(this.queryParams).then(response => { methods: {
this.postList = response.rows; /** 查询岗位列表 */
this.total = response.total; getList() {
this.loading = false; this.loading = true;
}); listPost(this.queryParams).then(response => {
}, this.postList = response.rows;
// this.total = response.total;
statusFormat(row, column) { this.loading = false;
return this.selectDictLabel(this.statusOptions, row.status); });
}, },
// //
cancel() { cancel() {
this.open = false; this.open = false;
this.reset(); this.reset();
}, },
// //
reset() { reset() {
this.form = { this.form = {
postId: undefined, postId: undefined,
postCode: undefined, postCode: undefined,
postName: undefined, postName: undefined,
postSort: 0, postSort: 0,
status: "0", status: "0",
remark: undefined remark: undefined
}; };
this.resetForm("form"); this.resetForm("form");
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.queryParams.pageNum = 1; this.queryParams.pageNum = 1;
this.getList(); this.getList();
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
this.resetForm("queryForm"); this.resetForm("queryForm");
this.handleQuery(); this.handleQuery();
}, },
// //
handleSelectionChange(selection) { handleSelectionChange(selection) {
this.ids = selection.map(item => item.postId) this.ids = selection.map(item => item.postId)
this.single = selection.length!=1 this.single = selection.length!=1
this.multiple = !selection.length this.multiple = !selection.length
}, },
/** 新增按钮操作 */ /** 新增按钮操作 */
handleAdd() { handleAdd() {
this.reset(); this.reset();
this.open = true; this.open = true;
this.title = "添加岗位"; this.title = "添加岗位";
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
this.reset(); this.reset();
const postId = row.postId || this.ids const postId = row.postId || this.ids
getPost(postId).then(response => { getPost(postId).then(response => {
this.form = response.data; this.form = response.data;
this.open = true; this.open = true;
this.title = "修改岗位"; this.title = "修改岗位";
}); });
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm: function() { submitForm: function() {
this.$refs["form"].validate(valid => { this.$refs["form"].validate(valid => {
if (valid) { if (valid) {
if (this.form.postId != undefined) { if (this.form.postId != undefined) {
updatePost(this.form).then(response => { updatePost(this.form).then(response => {
this.msgSuccess("修改成功"); this.msgSuccess("修改成功");
this.open = false; this.open = false;
this.getList(); this.getList();
}); });
} else { } else {
addPost(this.form).then(response => { addPost(this.form).then(response => {
this.msgSuccess("新增成功"); this.msgSuccess("新增成功");
this.open = false; this.open = false;
this.getList(); this.getList();
}); });
} }
} }
}); });
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { handleDelete(row) {
const postIds = row.postId || this.ids; const postIds = row.postId || this.ids;
this.$confirm('是否确认删除岗位编号为"' + postIds + '"的数据项?', "警告", { this.$confirm('是否确认删除岗位编号为"' + postIds + '"的数据项?', "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning" type: "warning"
}).then(function() { }).then(function() {
return delPost(postIds); return delPost(postIds);
}).then(() => { }).then(() => {
this.getList(); this.getList();
this.msgSuccess("删除成功"); this.msgSuccess("删除成功");
}).catch(() => {}); }).catch(() => {});
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { handleExport() {
const queryParams = this.queryParams; const queryParams = this.queryParams;
this.$confirm('是否确认导出所有岗位数据项?', "警告", { this.$confirm('是否确认导出所有岗位数据项?', "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning" type: "warning"
}).then(() => { }).then(() => {
this.exportLoading = true; this.exportLoading = true;
return exportPost(queryParams); return exportPost(queryParams);
}).then(response => { }).then(response => {
this.download(response.msg); this.download(response.msg);
this.exportLoading = false; this.exportLoading = false;
}).catch(() => {}); }).catch(() => {});
} }
} }
}; };
</script> </script>