多模块重构 12：修改项目名字，按照新的规则
This commit is contained in:
YunaiV
305
yudao-ui-admin/src/views/system/dept/index.vue
Normal file
305
yudao-ui-admin/src/views/system/dept/index.vue
Normal file
@@ -0,0 +1,305 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
|
||||
<el-form-item label="部门名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入部门名称" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="菜单状态" clearable size="small">
|
||||
<el-option v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:dept:create']">新增</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="deptList" row-key="id" default-expand-all
|
||||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
|
||||
<el-table-column prop="name" label="部门名称" width="260"></el-table-column>
|
||||
<el-table-column prop="status" label="负责人" :formatter="userNicknameFormat" width="120"/>
|
||||
<el-table-column prop="sort" label="排序" width="200"></el-table-column>
|
||||
<el-table-column prop="status" label="状态" :formatter="statusFormat" width="100"/>
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:dept:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-plus" @click="handleAdd(scope.row)"
|
||||
v-hasPermi="['system:dept:create']">新增</el-button>
|
||||
<el-button v-if="scope.row.parentId !== 0" size="mini" type="text" icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)" v-hasPermi="['system:dept:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 添加或修改部门对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-row>
|
||||
<el-col :span="24" v-if="form.parentId !== 0">
|
||||
<el-form-item label="上级部门" prop="parentId">
|
||||
<treeselect v-model="form.parentId" :options="deptOptions" :normalizer="normalizer" placeholder="选择上级部门" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="部门名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入部门名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="显示排序" prop="sort">
|
||||
<el-input-number v-model="form.sort" controls-position="right" :min="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="负责人" prop="leaderUserId">
|
||||
<el-select v-model="form.leaderUserId" placeholder="请输入负责人" clearable style="width: 100%">
|
||||
<el-option v-for="item in users" :key="parseInt(item.id)" :label="item.nickname" :value="parseInt(item.id)" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="联系电话" prop="phone">
|
||||
<el-input v-model="form.phone" placeholder="请输入联系电话" maxlength="11" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="部门状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="parseInt(dict.value)">
|
||||
{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listDept, getDept, delDept, addDept, updateDept } from "@/api/system/dept";
|
||||
import Treeselect from "@riophae/vue-treeselect";
|
||||
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||
|
||||
import {CommonStatusEnum} from '@/utils/constants'
|
||||
import { getDictDataLabel, getDictDatas, DICT_TYPE } from '@/utils/dict'
|
||||
import {listSimpleUsers} from "@/api/system/user";
|
||||
|
||||
export default {
|
||||
name: "Dept",
|
||||
components: { Treeselect },
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 表格树数据
|
||||
deptList: [],
|
||||
// 部门树选项
|
||||
deptOptions: [],
|
||||
// 用户下拉列表
|
||||
users: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
name: undefined,
|
||||
status: undefined
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
parentId: [
|
||||
{ required: true, message: "上级部门不能为空", trigger: "blur" }
|
||||
],
|
||||
name: [
|
||||
{ required: true, message: "部门名称不能为空", trigger: "blur" }
|
||||
],
|
||||
sort: [
|
||||
{ required: true, message: "显示排序不能为空", trigger: "blur" }
|
||||
],
|
||||
email: [
|
||||
{
|
||||
type: "email",
|
||||
message: "'请输入正确的邮箱地址",
|
||||
trigger: ["blur", "change"]
|
||||
}
|
||||
],
|
||||
phone: [
|
||||
{
|
||||
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
||||
message: "请输入正确的手机号码",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
status: [
|
||||
{ required: true, message: "状态不能为空", trigger: "blur" }
|
||||
]
|
||||
},
|
||||
|
||||
// 枚举
|
||||
CommonStatusEnum: CommonStatusEnum,
|
||||
// 数据字典
|
||||
statusDictDatas: getDictDatas(DICT_TYPE.COMMON_STATUS)
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
// 获得用户列表
|
||||
listSimpleUsers().then(response => {
|
||||
this.users = response.data;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
/** 查询部门列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listDept(this.queryParams).then(response => {
|
||||
this.deptList = this.handleTree(response.data, "id");
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 转换部门数据结构 */
|
||||
normalizer(node) {
|
||||
if (node.children && !node.children.length) {
|
||||
delete node.children;
|
||||
}
|
||||
return {
|
||||
id: node.id,
|
||||
label: node.name,
|
||||
children: node.children
|
||||
};
|
||||
},
|
||||
// 字典状态字典翻译
|
||||
statusFormat(row, column) {
|
||||
return getDictDataLabel(DICT_TYPE.COMMON_STATUS, row.status)
|
||||
},
|
||||
// 用户昵称展示
|
||||
userNicknameFormat(row, column) {
|
||||
if (!row.leaderUserId) {
|
||||
return '未设置';
|
||||
}
|
||||
for (const user of this.users) {
|
||||
if (row.leaderUserId === user.id) {
|
||||
return user.nickname;
|
||||
}
|
||||
}
|
||||
return '未知【' + row.leaderUserId + '】';
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
parentId: undefined,
|
||||
name: undefined,
|
||||
sort: undefined,
|
||||
leaderUserId: undefined,
|
||||
phone: undefined,
|
||||
email: undefined,
|
||||
status: CommonStatusEnum.ENABLE,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd(row) {
|
||||
this.reset();
|
||||
if (row !== undefined) {
|
||||
this.form.parentId = row.id;
|
||||
}
|
||||
this.open = true;
|
||||
this.title = "添加部门";
|
||||
listDept().then(response => {
|
||||
this.deptOptions = this.handleTree(response.data, "id");
|
||||
});
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
getDept(row.id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改部门";
|
||||
});
|
||||
listDept(row.id).then(response => {
|
||||
this.deptOptions = this.handleTree(response.data, "id");
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id !== undefined) {
|
||||
updateDept(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addDept(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
this.$confirm('是否确认删除名称为"' + row.name + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delDept(row.id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
277
yudao-ui-admin/src/views/system/dict/data.vue
Normal file
277
yudao-ui-admin/src/views/system/dict/data.vue
Normal file
@@ -0,0 +1,277 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="字典名称" prop="dictType">
|
||||
<el-select v-model="queryParams.dictType" size="small">
|
||||
<el-option v-for="item in typeOptions" :key="item.id" :label="item.name" :value="item.type"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="字典标签" prop="label">
|
||||
<el-input v-model="queryParams.label" placeholder="请输入字典标签" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="数据状态" clearable size="small">
|
||||
<el-option v-for="dict in statusOptions" :key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:dict:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:dict:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="dataList" >
|
||||
<el-table-column label="字典编码" align="center" prop="id" />
|
||||
<el-table-column label="字典标签" align="center" prop="label" />
|
||||
<el-table-column label="字典键值" align="center" prop="value" />
|
||||
<el-table-column label="字典排序" align="center" prop="sort" />
|
||||
<el-table-column label="状态" align="center" prop="status" :formatter="statusFormat" />
|
||||
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:dict:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:dict:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 添加或修改参数配置对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="字典类型">
|
||||
<el-input v-model="form.dictType" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item label="数据标签" prop="label">
|
||||
<el-input v-model="form.label" placeholder="请输入数据标签" />
|
||||
</el-form-item>
|
||||
<el-form-item label="数据键值" prop="value">
|
||||
<el-input v-model="form.value" placeholder="请输入数据键值" />
|
||||
</el-form-item>
|
||||
<el-form-item label="显示排序" prop="sort">
|
||||
<el-input-number v-model="form.sort" controls-position="right" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="parseInt(dict.value)">{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listData, getData, delData, addData, updateData, exportData } from "@/api/system/dict/data";
|
||||
import { listAllSimple, getType } from "@/api/system/dict/type";
|
||||
|
||||
import { CommonStatusEnum } from '@/utils/constants'
|
||||
import { getDictDataLabel, getDictDatas, DICT_TYPE } from '@/utils/dict'
|
||||
|
||||
export default {
|
||||
name: "Data",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 字典表格数据
|
||||
dataList: [],
|
||||
// 默认字典类型
|
||||
defaultDictType: "",
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 类型数据字典
|
||||
typeOptions: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
dictName: undefined,
|
||||
dictType: undefined,
|
||||
status: undefined
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
label: [
|
||||
{ required: true, message: "数据标签不能为空", trigger: "blur" }
|
||||
],
|
||||
value: [
|
||||
{ required: true, message: "数据键值不能为空", trigger: "blur" }
|
||||
],
|
||||
sort: [
|
||||
{ required: true, message: "数据顺序不能为空", trigger: "blur" }
|
||||
]
|
||||
},
|
||||
|
||||
// 枚举
|
||||
CommonStatusEnum: CommonStatusEnum,
|
||||
// 数据字典
|
||||
statusDictDatas: getDictDatas(DICT_TYPE.COMMON_STATUS)
|
||||
};
|
||||
},
|
||||
created() {
|
||||
const dictId = this.$route.params && this.$route.params.dictId;
|
||||
this.getType(dictId);
|
||||
this.getTypeList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询字典类型详细 */
|
||||
getType(dictId) {
|
||||
getType(dictId).then(response => {
|
||||
this.queryParams.dictType = response.data.type;
|
||||
this.defaultDictType = response.data.type;
|
||||
this.getList();
|
||||
});
|
||||
},
|
||||
/** 查询字典类型列表 */
|
||||
getTypeList() {
|
||||
listAllSimple().then(response => {
|
||||
this.typeOptions = response.data;
|
||||
});
|
||||
},
|
||||
/** 查询字典数据列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listData(this.queryParams).then(response => {
|
||||
this.dataList = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 数据状态字典翻译
|
||||
statusFormat(row, column) {
|
||||
return getDictDataLabel(DICT_TYPE.COMMON_STATUS, row.status)
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
label: undefined,
|
||||
value: undefined,
|
||||
sort: 0,
|
||||
status: CommonStatusEnum.ENABLE,
|
||||
remark: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.queryParams.dictType = this.defaultDictType;
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加字典数据";
|
||||
this.form.dictType = this.queryParams.dictType;
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id || this.ids
|
||||
getData(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改字典数据";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id !== undefined) {
|
||||
updateData(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addData(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id;
|
||||
this.$confirm('是否确认删除字典编码为"' + ids + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delData(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
const queryParams = this.queryParams;
|
||||
this.$confirm('是否确认导出所有数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportData(queryParams);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '字典数据.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
263
yudao-ui-admin/src/views/system/dict/index.vue
Normal file
263
yudao-ui-admin/src/views/system/dict/index.vue
Normal file
@@ -0,0 +1,263 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="字典名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入字典名称" clearable size="small" style="width: 240px" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="字典类型" prop="type">
|
||||
<el-input v-model="queryParams.type" placeholder="请输入字典类型" clearable size="small" style="width: 240px" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="字典状态" clearable size="small" style="width: 240px">
|
||||
<el-option v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRangeCreateTime" size="small" style="width: 240px" value-format="yyyy-MM-dd" type="daterange"
|
||||
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:dict:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:dict:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="typeList">
|
||||
<el-table-column label="字典编号" align="center" prop="id" />
|
||||
<el-table-column label="字典名称" align="center" prop="name" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="字典类型" align="center" :show-overflow-tooltip="true">
|
||||
<template slot-scope="scope">
|
||||
<router-link :to="'/dict/type/data/' + scope.row.id" class="link-type">
|
||||
<span>{{ scope.row.type }}</span>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center" prop="status" :formatter="statusFormat" />
|
||||
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:dict:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:dict:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 添加或修改参数配置对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="字典名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入字典名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="字典类型" prop="type">
|
||||
<el-input v-model="form.type" placeholder="请输入字典类型" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="parseInt(dict.value)">{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listType, getType, delType, addType, updateType, exportType } from "@/api/system/dict/type";
|
||||
|
||||
import { CommonStatusEnum } from '@/utils/constants'
|
||||
import { getDictDataLabel, getDictDatas, DICT_TYPE } from '@/utils/dict'
|
||||
|
||||
export default {
|
||||
name: "Dict",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 字典表格数据
|
||||
typeList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 日期范围
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
name: undefined,
|
||||
type: undefined,
|
||||
status: undefined
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: "字典名称不能为空", trigger: "blur" }
|
||||
],
|
||||
type: [
|
||||
{ required: true, message: "字典类型不能为空", trigger: "blur" }
|
||||
]
|
||||
},
|
||||
|
||||
// 枚举
|
||||
CommonStatusEnum: CommonStatusEnum,
|
||||
// 数据字典
|
||||
statusDictDatas: getDictDatas(DICT_TYPE.COMMON_STATUS)
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询字典类型列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
listType(params).then(response => {
|
||||
this.typeList = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 字典状态字典翻译
|
||||
statusFormat(row, column) {
|
||||
return getDictDataLabel(DICT_TYPE.COMMON_STATUS, row.status)
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
type: undefined,
|
||||
status: CommonStatusEnum.ENABLE,
|
||||
remark: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加字典类型";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id;
|
||||
getType(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改字典类型";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id !== undefined) {
|
||||
updateType(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addType(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$confirm('是否确认删除字典编号为"' + ids + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delType(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行导出
|
||||
this.$confirm('是否确认导出所有字典类型数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportType(params);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '字典类型.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
256
yudao-ui-admin/src/views/system/errorCode/index.vue
Normal file
256
yudao-ui-admin/src/views/system/errorCode/index.vue
Normal file
@@ -0,0 +1,256 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
|
||||
<el-form-item label="错误码类型" prop="type">
|
||||
<el-select v-model="queryParams.type" placeholder="请选择错误码类型" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.SYSTEM_ERROR_CODE_TYPE)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="应用名" prop="applicationName">
|
||||
<el-input v-model="queryParams.applicationName" placeholder="请输入应用名" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="错误码编码" prop="code">
|
||||
<el-input v-model="queryParams.code" placeholder="请输入错误码编码" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="错误码提示" prop="message">
|
||||
<el-input v-model="queryParams.message" placeholder="请输入错误码提示" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRangeCreateTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<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-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:error-code:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:error-code:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="编号" align="center" prop="id" />
|
||||
<el-table-column label="类型" align="center" prop="type" width="80">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.SYSTEM_ERROR_CODE_TYPE, scope.row.type) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="应用名" align="center" prop="applicationName" width="200" />
|
||||
<el-table-column label="错误码编码" align="center" prop="code" width="100" />
|
||||
<el-table-column label="错误码提示" align="center" prop="message" width="300" />
|
||||
<el-table-column label="备注" align="center" prop="memo" width="200" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:error-code:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:error-code:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
|
||||
<el-form-item label="应用名" prop="applicationName">
|
||||
<el-input v-model="form.applicationName" placeholder="请输入应用名" />
|
||||
</el-form-item>
|
||||
<el-form-item label="错误码编码" prop="code">
|
||||
<el-input v-model="form.code" placeholder="请输入错误码编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="错误码提示" prop="message">
|
||||
<el-input v-model="form.message" placeholder="请输入错误码提示" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="memo">
|
||||
<el-input v-model="form.memo" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createErrorCode, updateErrorCode, deleteErrorCode, getErrorCode, getErrorCodePage, exportErrorCodeExcel } from "@/api/system/errorCode";
|
||||
|
||||
export default {
|
||||
name: "ErrorCode",
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 错误码列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
type: null,
|
||||
applicationName: null,
|
||||
code: null,
|
||||
message: null,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
applicationName: [{ required: true, message: "应用名不能为空", trigger: "blur" }],
|
||||
code: [{ required: true, message: "错误码编码不能为空", trigger: "blur" }],
|
||||
message: [{ required: true, message: "错误码提示不能为空", trigger: "blur" }],
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
getErrorCodePage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
applicationName: undefined,
|
||||
code: undefined,
|
||||
message: undefined,
|
||||
memo: undefined,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加错误码";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id;
|
||||
getErrorCode(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改错误码";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateErrorCode(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createErrorCode(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$confirm('是否确认删除错误码编号为"' + id + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return deleteErrorCode(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行导出
|
||||
this.$confirm('是否确认导出所有错误码数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportErrorCodeExcel(params);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '错误码.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
141
yudao-ui-admin/src/views/system/loginlog/index.vue
Normal file
141
yudao-ui-admin/src/views/system/loginlog/index.vue
Normal file
@@ -0,0 +1,141 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="登录地址" prop="userIp">
|
||||
<el-input v-model="queryParams.userIp" placeholder="请输入登录地址" clearable style="width: 240px;" size="small"
|
||||
@keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户名称" prop="username">
|
||||
<el-input v-model="queryParams.username" placeholder="请输入用户名称" clearable style="width: 240px;" size="small"
|
||||
@keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="结果" clearable size="small" style="width: 240px">
|
||||
<el-option :key="true" label="成功" :value="true"/>
|
||||
<el-option :key="false" label="失败" :value="false"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="登录时间">
|
||||
<el-date-picker v-model="dateRange" size="small" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:login-log:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="访问编号" align="center" prop="id" />
|
||||
<el-table-column label="日志类型" align="center" prop="logType">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.SYSTEM_LOGIN_TYPE, scope.row.logType) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="用户名称" align="center" prop="username" />
|
||||
<el-table-column label="登录地址" align="center" prop="userIp" width="130" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="userAgent" align="center" prop="userAgent" width="400" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="结果" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.result === 0">成功</span>
|
||||
<span v-if="scope.row.result > 0">失败：{{ getDictDataLabel(DICT_TYPE.SYSTEM_LOGIN_RESULT, scope.row.result) }} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="登录日期" align="center" prop="loginTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { list, exportLoginLog } from "@/api/system/loginlog";
|
||||
|
||||
export default {
|
||||
name: "Logininfor",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 表格数据
|
||||
list: [],
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
userIp: undefined,
|
||||
username: undefined,
|
||||
status: undefined
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询登录日志列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
list(this.addDateRange(this.queryParams, [
|
||||
this.dateRange[0] ? this.dateRange[0] + ' 00:00:00' : undefined,
|
||||
this.dateRange[1] ? this.dateRange[1] + ' 23:59:59' : undefined,
|
||||
])).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
}
|
||||
);
|
||||
},
|
||||
// 登录状态字典翻译
|
||||
statusFormat(row, column) {
|
||||
return this.selectDictLabel(this.statusOptions, row.status);
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
const queryParams = this.queryParams;
|
||||
this.$confirm('是否确认导出所有操作日志数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportLoginLog(queryParams);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '登录日志.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
327
yudao-ui-admin/src/views/system/menu/index.vue
Normal file
327
yudao-ui-admin/src/views/system/menu/index.vue
Normal file
@@ -0,0 +1,327 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
|
||||
<el-form-item label="菜单名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入菜单名称" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="菜单状态" clearable size="small">
|
||||
<el-option v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:menu:create']">新增</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="menuList" row-key="id"
|
||||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
|
||||
<el-table-column prop="name" label="菜单名称" :show-overflow-tooltip="true" width="250"></el-table-column>
|
||||
<el-table-column prop="icon" label="图标" align="center" width="100">
|
||||
<template slot-scope="scope">
|
||||
<svg-icon :icon-class="scope.row.icon" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sort" label="排序" width="60"></el-table-column>
|
||||
<el-table-column prop="permission" 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 label="创建时间" align="center" prop="createTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:menu:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-plus" @click="handleAdd(scope.row)"
|
||||
v-hasPermi="['system:menu:create']">新增</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:menu:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 添加或修改菜单对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="上级菜单">
|
||||
<treeselect v-model="form.parentId" :options="menuOptions" :normalizer="normalizer" :show-count="true"
|
||||
placeholder="选择上级菜单"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="菜单类型" prop="type">
|
||||
<el-radio-group v-model="form.type">
|
||||
<el-radio v-for="dict in menuTypeDictDatas" :key="parseInt(dict.value)" :label="parseInt(dict.value)">
|
||||
{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item v-if="form.type != '3'" label="菜单图标">
|
||||
<el-popover placement="bottom-start" width="460" trigger="click" @show="$refs['iconSelect'].reset()">
|
||||
<IconSelect ref="iconSelect" @selected="selected" />
|
||||
<el-input slot="reference" v-model="form.icon" placeholder="点击选择图标" readonly>
|
||||
<svg-icon v-if="form.icon" slot="prefix" :icon-class="form.icon" class="el-input__icon"
|
||||
style="height: 32px;width: 16px;"/>
|
||||
<i v-else slot="prefix" class="el-icon-search el-input__icon" />
|
||||
</el-input>
|
||||
</el-popover>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="菜单名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入菜单名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="显示排序" prop="sort">
|
||||
<el-input-number v-model="form.sort" controls-position="right" :min="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item v-if="form.type != '3'" label="路由地址" prop="path">
|
||||
<el-input v-model="form.path" placeholder="请输入路由地址" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" v-if="form.type == '2'">
|
||||
<el-form-item label="组件路径" prop="component">
|
||||
<el-input v-model="form.component" placeholder="请输入组件路径" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item v-if="form.type != '1'" label="权限标识">
|
||||
<el-input v-model="form.permission" placeholder="请权限标识" maxlength="50" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="菜单状态">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="parseInt(dict.value)">{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listMenu, getMenu, delMenu, addMenu, updateMenu } from "@/api/system/menu";
|
||||
import Treeselect from "@riophae/vue-treeselect";
|
||||
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||
import IconSelect from "@/components/IconSelect";
|
||||
|
||||
import { SystemMenuTypeEnum, CommonStatusEnum } from '@/utils/constants'
|
||||
import { getDictDataLabel, getDictDatas, DICT_TYPE } from '@/utils/dict'
|
||||
|
||||
export default {
|
||||
name: "Menu",
|
||||
components: { Treeselect, IconSelect },
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 菜单表格树数据
|
||||
menuList: [],
|
||||
// 菜单树选项
|
||||
menuOptions: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
name: undefined,
|
||||
visible: undefined
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: "菜单名称不能为空", trigger: "blur" }
|
||||
],
|
||||
sort: [
|
||||
{ required: true, message: "菜单顺序不能为空", trigger: "blur" }
|
||||
],
|
||||
path: [
|
||||
{ required: true, message: "路由地址不能为空", trigger: "blur" }
|
||||
],
|
||||
status: [
|
||||
{ required: true, message: "状态不能为空", trigger: "blur" }
|
||||
]
|
||||
},
|
||||
|
||||
// 枚举
|
||||
MenuTypeEnum: SystemMenuTypeEnum,
|
||||
CommonStatusEnum: CommonStatusEnum,
|
||||
// 数据字典
|
||||
menuTypeDictDatas: getDictDatas(DICT_TYPE.SYSTEM_MENU_TYPE),
|
||||
statusDictDatas: getDictDatas(DICT_TYPE.COMMON_STATUS)
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
// 选择图标
|
||||
selected(name) {
|
||||
this.form.icon = name;
|
||||
},
|
||||
/** 查询菜单列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listMenu(this.queryParams).then(response => {
|
||||
this.menuList = this.handleTree(response.data, "id");
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 转换菜单数据结构 */
|
||||
normalizer(node) {
|
||||
if (node.children && !node.children.length) {
|
||||
delete node.children;
|
||||
}
|
||||
return {
|
||||
id: node.id,
|
||||
label: node.name,
|
||||
children: node.children
|
||||
};
|
||||
},
|
||||
/** 查询菜单下拉树结构 */
|
||||
getTreeselect() {
|
||||
listMenu().then(response => {
|
||||
this.menuOptions = [];
|
||||
const menu = { id: 0, name: '主类目', children: [] };
|
||||
menu.children = this.handleTree(response.data, "id");
|
||||
this.menuOptions.push(menu);
|
||||
});
|
||||
},
|
||||
// 菜单状态字典翻译
|
||||
statusFormat(row, column) {
|
||||
return getDictDataLabel(DICT_TYPE.COMMON_STATUS, row.status)
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
parentId: 0,
|
||||
name: undefined,
|
||||
icon: undefined,
|
||||
type: SystemMenuTypeEnum.DIR,
|
||||
sort: undefined,
|
||||
status: CommonStatusEnum.ENABLE
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd(row) {
|
||||
this.reset();
|
||||
this.getTreeselect();
|
||||
if (row != null && row.id) {
|
||||
this.form.parentId = row.id;
|
||||
} else {
|
||||
this.form.parentId = 0;
|
||||
}
|
||||
this.open = true;
|
||||
this.title = "添加菜单";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
this.getTreeselect();
|
||||
getMenu(row.id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改菜单";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
// 若权限类型为目录或者菜单时，进行 path 的校验，避免后续拼接出来的路由无法跳转
|
||||
if (this.form.type === SystemMenuTypeEnum.DIR
|
||||
|| this.form.type === SystemMenuTypeEnum.MENU) {
|
||||
// 如果是外链，则不进行校验
|
||||
const path = this.form.path
|
||||
if (path.indexOf('http://') === -1 || path.indexOf('https://') === -1) {
|
||||
// 父权限为根节点，path 必须以 / 开头
|
||||
if (this.form.parentId === 0 && path.charAt(0) !== '/') {
|
||||
this.msgSuccess('前端必须以 / 开头')
|
||||
return
|
||||
} else if (this.form.parentId !== 0 && path.charAt(0) === '/') {
|
||||
this.msgSuccess('前端不能以 / 开头')
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 提交
|
||||
if (this.form.id !== undefined) {
|
||||
updateMenu(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addMenu(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
this.$confirm('是否确认删除名称为"' + row.name + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delMenu(row.id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
251
yudao-ui-admin/src/views/system/notice/index.vue
Normal file
251
yudao-ui-admin/src/views/system/notice/index.vue
Normal file
@@ -0,0 +1,251 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="公告标题" prop="title">
|
||||
<el-input v-model="queryParams.title" placeholder="请输入公告标题" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="操作人员" prop="createBy">
|
||||
<el-input v-model="queryParams.createBy" placeholder="请输入操作人员" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="类型" prop="type">
|
||||
<el-select v-model="queryParams.type" placeholder="公告类型" clearable size="small">
|
||||
<el-option v-for="dict in noticeTypeDictDatas" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:notice:create']"s>新增</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="noticeList">
|
||||
<el-table-column label="序号" align="center" prop="id" width="100" />
|
||||
<el-table-column label="公告标题" align="center" prop="title" :show-overflow-tooltip="true"/>
|
||||
<el-table-column label="公告类型" align="center" prop="type" :formatter="typeFormat" width="100"/>
|
||||
<el-table-column label="状态" align="center" prop="status" :formatter="statusFormat" width="100"/>
|
||||
<el-table-column label="创建者" align="center" prop="createBy" width="100" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="100">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:notice:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:notice:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :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-form-item label="公告标题" prop="title">
|
||||
<el-input v-model="form.title" placeholder="请输入公告标题" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="公告类型" prop="type">
|
||||
<el-select v-model="form.type" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="dict in noticeTypeDictDatas"
|
||||
:key="parseInt(dict.value)"
|
||||
:label="dict.label"
|
||||
:value="parseInt(dict.value)"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="状态">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio
|
||||
v-for="dict in statusDictDatas"
|
||||
:key="parseInt(dict.value)"
|
||||
:label="parseInt(dict.value)"
|
||||
>{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="内容">
|
||||
<editor v-model="form.content" :min-height="192"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listNotice, getNotice, delNotice, addNotice, updateNotice } from "@/api/system/notice";
|
||||
import Editor from '@/components/Editor';
|
||||
|
||||
import {CommonStatusEnum} from '@/utils/constants'
|
||||
import { getDictDataLabel, getDictDatas, DICT_TYPE } from '@/utils/dict'
|
||||
|
||||
export default {
|
||||
name: "Notice",
|
||||
components: {
|
||||
Editor
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 公告表格数据
|
||||
noticeList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
title: undefined,
|
||||
createBy: undefined,
|
||||
status: undefined
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
title: [
|
||||
{ required: true, message: "公告标题不能为空", trigger: "blur" }
|
||||
],
|
||||
type: [
|
||||
{ required: true, message: "公告类型不能为空", trigger: "change" }
|
||||
]
|
||||
},
|
||||
|
||||
// 枚举
|
||||
CommonStatusEnum: CommonStatusEnum,
|
||||
// 数据字典
|
||||
noticeTypeDictDatas: getDictDatas(DICT_TYPE.SYSTEM_NOTICE_TYPE),
|
||||
statusDictDatas: getDictDatas(DICT_TYPE.COMMON_STATUS)
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询公告列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listNotice(this.queryParams).then(response => {
|
||||
this.noticeList = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 公告状态字典翻译
|
||||
statusFormat(row, column) {
|
||||
return getDictDataLabel(DICT_TYPE.COMMON_STATUS, row.status)
|
||||
},
|
||||
// 公告状态字典翻译
|
||||
typeFormat(row, column) {
|
||||
return getDictDataLabel(DICT_TYPE.SYSTEM_NOTICE_TYPE, row.type)
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
title: undefined,
|
||||
type: undefined,
|
||||
content: undefined,
|
||||
status: CommonStatusEnum.ENABLE
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加公告";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id || this.ids
|
||||
getNotice(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改公告";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id !== undefined) {
|
||||
updateNotice(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addNotice(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids
|
||||
this.$confirm('是否确认删除公告编号为"' + ids + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delNotice(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
228
yudao-ui-admin/src/views/system/operatelog/index.vue
Normal file
228
yudao-ui-admin/src/views/system/operatelog/index.vue
Normal file
@@ -0,0 +1,228 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="系统模块" prop="title">
|
||||
<el-input v-model="queryParams.title" placeholder="请输入系统模块" clearable style="width: 240px;" size="small"
|
||||
@keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="操作人员" prop="operName">
|
||||
<el-input v-model="queryParams.operName" placeholder="请输入操作人员" clearable style="width: 240px;" size="small"
|
||||
@keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="类型" prop="type">
|
||||
<el-select v-model="queryParams.type" placeholder="操作类型" clearable size="small" style="width: 240px">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.SYSTEM_OPERATE_TYPE)" :key="parseInt(dict.value)"
|
||||
:label="dict.label" :value="parseInt(dict.value)"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.success" placeholder="操作状态" clearable size="small" style="width: 240px">
|
||||
<el-option :key="true" label="成功" :value="true"/>
|
||||
<el-option :key="false" label="失败" :value="false"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="操作时间">
|
||||
<el-date-picker v-model="dateRange" size="small" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:operate-log:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="日志编号" align="center" prop="id" />
|
||||
<el-table-column label="操作模块" align="center" prop="module" />
|
||||
<el-table-column label="操作名" align="center" prop="name" width="180" />
|
||||
<el-table-column label="操作类型" align="center" prop="type">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.SYSTEM_OPERATE_TYPE, scope.row.type) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作人" align="center" prop="userNickname" />
|
||||
<el-table-column label="操作结果" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.resultCode === 0 ? '成功' : '失败' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作日期" align="center" prop="startTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.startTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="执行时长" align="center" prop="startTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.duration }} ms</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row,scope.index)"
|
||||
v-hasPermi="['system:operate-log:query']">详细</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNo"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 操作日志详细 -->
|
||||
<el-dialog title="访问日志详细" :visible.sync="open" width="700px" append-to-body>
|
||||
<el-form ref="form" :model="form" label-width="100px" size="mini">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="日志主键：">{{ form.id }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="链路追踪：">{{ form.traceId }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="用户信息：">{{ form.userId }} | {{ form.userNickname }} | {{ form.userIp }} | {{ form.userAgent}} </el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="操作信息：">
|
||||
{{ form.module }} | {{ form.name }} | {{ getDictDataLabel(DICT_TYPE.SYSTEM_OPERATE_TYPE, form.type) }}
|
||||
<br /> {{ form.content }}
|
||||
<br /> {{ form.exts }}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="请求信息：">{{ form.requestMethod }} | {{ form.requestUrl }} </el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="方法名：">{{ form.javaMethod }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="方法参数：">{{ form.javaMethodArgs }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="开始时间：">
|
||||
{{ parseTime(form.startTime) }} | {{ form.duration }} ms
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="操作结果：">
|
||||
<div v-if="form.resultCode === 0">正常 | {{ form.resultData}} </div>
|
||||
<div v-else-if="form.resultCode > 0">失败 | {{ form.resultCode }} || {{ form.resultMsg}}</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="open = false">关 闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listOperateLog, exportOperateLog } from "@/api/system/operatelog";
|
||||
|
||||
export default {
|
||||
name: "Operlog",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 表格数据
|
||||
list: [],
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 类型数据字典
|
||||
typeOptions: [],
|
||||
// 类型数据字典
|
||||
statusOptions: [],
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
title: undefined,
|
||||
operName: undefined,
|
||||
businessType: undefined,
|
||||
status: undefined
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询登录日志 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listOperateLog(this.addDateRange(this.queryParams, [
|
||||
this.dateRange[0] ? this.dateRange[0] + ' 00:00:00' : undefined,
|
||||
this.dateRange[1] ? this.dateRange[1] + ' 23:59:59' : undefined,
|
||||
])).then( response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
}
|
||||
);
|
||||
},
|
||||
// 操作日志状态字典翻译
|
||||
statusFormat(row, column) {
|
||||
return this.selectDictLabel(this.statusOptions, row.status);
|
||||
},
|
||||
// 操作日志类型字典翻译
|
||||
typeFormat(row, column) {
|
||||
return this.selectDictLabel(this.typeOptions, row.businessType);
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 详细按钮操作 */
|
||||
handleView(row) {
|
||||
this.open = true;
|
||||
this.form = row;
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
const queryParams = this.addDateRange(this.queryParams, [
|
||||
this.dateRange[0] ? this.dateRange[0] + ' 00:00:00' : undefined,
|
||||
this.dateRange[1] ? this.dateRange[1] + ' 23:59:59' : undefined,
|
||||
])
|
||||
this.$confirm('是否确认导出所有操作日志数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportOperateLog(queryParams);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '操作日志.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
249
yudao-ui-admin/src/views/system/post/index.vue
Normal file
249
yudao-ui-admin/src/views/system/post/index.vue
Normal file
@@ -0,0 +1,249 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="岗位编码" prop="code">
|
||||
<el-input v-model="queryParams.code" placeholder="请输入岗位编码" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="岗位名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入岗位名称" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="岗位状态" clearable size="small">
|
||||
<el-option v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:post:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:post:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="postList">
|
||||
<el-table-column label="岗位编号" align="center" prop="id" />
|
||||
<el-table-column label="岗位编码" align="center" prop="code" />
|
||||
<el-table-column label="岗位名称" align="center" prop="name" />
|
||||
<el-table-column label="岗位排序" align="center" prop="sort" />
|
||||
<el-table-column label="状态" align="center" prop="status" :formatter="statusFormat" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:post:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:post:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 添加或修改岗位对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="岗位名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入岗位名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="岗位编码" prop="code">
|
||||
<el-input v-model="form.code" placeholder="请输入编码名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="岗位顺序" prop="sort">
|
||||
<el-input-number v-model="form.sort" controls-position="right" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="岗位状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="parseInt(dict.value)">
|
||||
{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listPost, getPost, delPost, addPost, updatePost, exportPost } from "@/api/system/post";
|
||||
|
||||
import {CommonStatusEnum} from '@/utils/constants'
|
||||
import { getDictDataLabel, getDictDatas, DICT_TYPE } from '@/utils/dict'
|
||||
|
||||
export default {
|
||||
name: "Post",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 岗位表格数据
|
||||
postList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
code: undefined,
|
||||
name: undefined,
|
||||
status: undefined
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: "岗位名称不能为空", trigger: "blur" }
|
||||
],
|
||||
code: [
|
||||
{ required: true, message: "岗位编码不能为空", trigger: "blur" }
|
||||
],
|
||||
sort: [
|
||||
{ required: true, message: "岗位顺序不能为空", trigger: "blur" }
|
||||
]
|
||||
},
|
||||
|
||||
// 枚举
|
||||
CommonStatusEnum: CommonStatusEnum,
|
||||
// 数据字典
|
||||
statusDictDatas: getDictDatas(DICT_TYPE.COMMON_STATUS)
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询岗位列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listPost(this.queryParams).then(response => {
|
||||
this.postList = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 岗位状态字典翻译
|
||||
statusFormat(row, column) {
|
||||
return getDictDataLabel(DICT_TYPE.COMMON_STATUS, row.status)
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
code: undefined,
|
||||
name: undefined,
|
||||
sort: 0,
|
||||
status: CommonStatusEnum.ENABLE,
|
||||
remark: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加岗位";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id
|
||||
getPost(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改岗位";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id !== undefined) {
|
||||
updatePost(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addPost(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id;
|
||||
this.$confirm('是否确认删除岗位编号为"' + ids + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delPost(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
const queryParams = this.queryParams;
|
||||
this.$confirm('是否确认导出所有岗位数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportPost(queryParams);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '岗位数据.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
514
yudao-ui-admin/src/views/system/role/index.vue
Normal file
514
yudao-ui-admin/src/views/system/role/index.vue
Normal file
@@ -0,0 +1,514 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" v-show="showSearch" :inline="true">
|
||||
<el-form-item label="角色名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入角色名称" clearable size="small" style="width: 240px"
|
||||
@keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色标识" prop="code">
|
||||
<el-input v-model="queryParams.code" placeholder="请输入角色标识" clearable size="small" style="width: 240px"
|
||||
@keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="角色状态" clearable size="small" style="width: 240px">
|
||||
<el-option v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRange" size="small" style="width: 240px" value-format="yyyy-MM-dd" type="daterange"
|
||||
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:role:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:role:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="roleList">
|
||||
<el-table-column label="角色编号" prop="id" width="120" />
|
||||
<el-table-column label="角色名称" prop="name" :show-overflow-tooltip="true" width="150" />
|
||||
<el-table-column label="角色标识" prop="code" :show-overflow-tooltip="true" width="150" />
|
||||
<el-table-column label="角色类型" prop="type" :formatter="typeFormat" width="80"></el-table-column>
|
||||
<el-table-column label="显示顺序" prop="sort" width="100" />
|
||||
<el-table-column label="状态" align="center" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-switch v-model="scope.row.status" :active-value="0" :inactive-value="1" @change="handleStatusChange(scope.row)"></el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:role:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-circle-check" @click="handleMenu(scope.row)"
|
||||
v-hasPermi="['system:permission:assign-role-menu']">菜单权限</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-circle-check" @click="handleDataScope(scope.row)"
|
||||
v-hasPermi="['system:permission:assign-role-data-scope']">数据权限</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:role:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 添加或修改角色配置对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="角色名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入角色名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="角色标识" prop="code">
|
||||
<el-input v-model="form.code" placeholder="请输入角色标识" />
|
||||
</el-form-item>
|
||||
<el-form-item label="角色顺序" prop="sort">
|
||||
<el-input-number v-model="form.sort" controls-position="right" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 分配角色的数据权限对话框 -->
|
||||
<el-dialog title="分配数据权限" :visible.sync="openDataScope" width="500px" append-to-body>
|
||||
<el-form :model="form" label-width="80px">
|
||||
<el-form-item label="角色名称">
|
||||
<el-input v-model="form.name" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item label="角色标识">
|
||||
<el-input v-model="form.code" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item label="权限范围">
|
||||
<el-select v-model="form.dataScope">
|
||||
<el-option
|
||||
v-for="item in dataScopeDictDatas"
|
||||
:key="parseInt(item.value)"
|
||||
:label="item.label"
|
||||
:value="parseInt(item.value)"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据权限" v-show="form.dataScope === SysDataScopeEnum.DEPT_CUSTOM">
|
||||
<el-checkbox :checked="!form.deptCheckStrictly" @change="handleCheckedTreeConnect($event, 'dept')">父子联动(选中父节点，自动选择子节点)</el-checkbox>
|
||||
<el-checkbox v-model="deptExpand" @change="handleCheckedTreeExpand($event, 'dept')">展开/折叠</el-checkbox>
|
||||
<el-checkbox v-model="deptNodeAll" @change="handleCheckedTreeNodeAll($event, 'dept')">全选/全不选</el-checkbox>
|
||||
<el-tree
|
||||
class="tree-border"
|
||||
:data="deptOptions"
|
||||
show-checkbox
|
||||
default-expand-all
|
||||
ref="dept"
|
||||
node-key="id"
|
||||
:check-strictly="form.deptCheckStrictly"
|
||||
empty-text="加载中，请稍后"
|
||||
:props="defaultProps"
|
||||
></el-tree>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitDataScope">确 定</el-button>
|
||||
<el-button @click="cancelDataScope">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 分配角色的菜单权限对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="openMenu" width="500px" append-to-body>
|
||||
<el-form :model="form" label-width="80px">
|
||||
<el-form-item label="角色名称">
|
||||
<el-input v-model="form.name" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item label="角色标识">
|
||||
<el-input v-model="form.code" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item label="菜单权限">
|
||||
<el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>
|
||||
<el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox>
|
||||
<el-tree
|
||||
class="tree-border"
|
||||
:data="menuOptions"
|
||||
show-checkbox
|
||||
ref="menu"
|
||||
node-key="id"
|
||||
:check-strictly="form.menuCheckStrictly"
|
||||
empty-text="加载中，请稍后"
|
||||
:props="defaultProps"
|
||||
></el-tree>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitMenu">确 定</el-button>
|
||||
<el-button @click="cancelMenu">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
addRole,
|
||||
changeRoleStatus,
|
||||
dataScope,
|
||||
delRole,
|
||||
exportRole,
|
||||
getRole,
|
||||
listRole,
|
||||
updateRole
|
||||
} from "@/api/system/role";
|
||||
import {listSimpleMenus} from "@/api/system/menu";
|
||||
import {assignRoleMenu, listRoleMenus, assignRoleDataScope} from "@/api/system/permission";
|
||||
import {listSimpleDepts} from "@/api/system/dept";
|
||||
import {CommonStatusEnum, SystemDataScopeEnum} from "@/utils/constants";
|
||||
import {DICT_TYPE, getDictDataLabel, getDictDatas} from "@/utils/dict";
|
||||
|
||||
export default {
|
||||
name: "Role",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 角色表格数据
|
||||
roleList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 是否显示弹出层（数据权限）
|
||||
openDataScope: false,
|
||||
// 是否显示弹出层（菜单权限）
|
||||
openMenu: false,
|
||||
menuExpand: false,
|
||||
menuNodeAll: false,
|
||||
deptExpand: true,
|
||||
deptNodeAll: false,
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 菜单列表
|
||||
menuOptions: [],
|
||||
// 部门列表
|
||||
deptOptions: [], // 部门属性结构
|
||||
depts: [], // 部门列表
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
name: undefined,
|
||||
code: undefined,
|
||||
status: undefined
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
defaultProps: {
|
||||
label: "name",
|
||||
children: "children"
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: "角色名称不能为空", trigger: "blur" }
|
||||
],
|
||||
code: [
|
||||
{ required: true, message: "角色标识不能为空", trigger: "blur" }
|
||||
],
|
||||
sort: [
|
||||
{ required: true, message: "角色顺序不能为空", trigger: "blur" }
|
||||
]
|
||||
},
|
||||
|
||||
// 枚举
|
||||
SysCommonStatusEnum: CommonStatusEnum,
|
||||
SysDataScopeEnum: SystemDataScopeEnum,
|
||||
// 数据字典
|
||||
roleTypeDictDatas: getDictDatas(DICT_TYPE.SYSTEM_ROLE_TYPE),
|
||||
statusDictDatas: getDictDatas(DICT_TYPE.COMMON_STATUS),
|
||||
dataScopeDictDatas: getDictDatas(DICT_TYPE.SYSTEM_DATA_SCOPE)
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询角色列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listRole(this.addDateRange(this.queryParams, [
|
||||
this.dateRange[0] ? this.dateRange[0] + ' 00:00:00' : undefined,
|
||||
this.dateRange[1] ? this.dateRange[1] + ' 23:59:59' : undefined,
|
||||
])).then(
|
||||
response => {
|
||||
this.roleList = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
}
|
||||
);
|
||||
},
|
||||
// 角色状态修改
|
||||
handleStatusChange(row) {
|
||||
// 此时，row 已经变成目标状态了，所以可以直接提交请求和提示
|
||||
let text = row.status === CommonStatusEnum.ENABLE ? "启用" : "停用";
|
||||
this.$confirm('确认要"' + text + '""' + row.name + '"角色吗?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return changeRoleStatus(row.id, row.status);
|
||||
}).then(() => {
|
||||
this.msgSuccess(text + "成功");
|
||||
}).catch(function() {
|
||||
// 异常时，需要将 row.status 状态重置回之前的
|
||||
row.status = row.status === CommonStatusEnum.ENABLE ? CommonStatusEnum.DISABLE
|
||||
: CommonStatusEnum.ENABLE;
|
||||
});
|
||||
},
|
||||
// 角色类型字典翻译
|
||||
typeFormat(row, column) {
|
||||
return getDictDataLabel(DICT_TYPE.SYSTEM_ROLE_TYPE, row.type)
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 取消按钮（数据权限）
|
||||
cancelDataScope() {
|
||||
this.openDataScope = false;
|
||||
this.reset();
|
||||
},
|
||||
// 取消按钮（菜单权限）
|
||||
cancelMenu() {
|
||||
this.openMenu = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
if (this.$refs.menu !== undefined) {
|
||||
this.$refs.menu.setCheckedKeys([]);
|
||||
}
|
||||
this.menuExpand = false;
|
||||
this.menuNodeAll = false;
|
||||
this.deptExpand = true;
|
||||
this.deptNodeAll = false;
|
||||
this.form = {
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
code: undefined,
|
||||
sort: 0,
|
||||
deptIds: [],
|
||||
menuIds: [],
|
||||
dataScope: undefined,
|
||||
deptCheckStrictly: false,
|
||||
menuCheckStrictly: true,
|
||||
remark: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 树权限（展开/折叠）
|
||||
handleCheckedTreeExpand(value, type) {
|
||||
if (type === 'menu') {
|
||||
let treeList = this.menuOptions;
|
||||
for (let i = 0; i < treeList.length; i++) {
|
||||
this.$refs.menu.store.nodesMap[treeList[i].id].expanded = value;
|
||||
}
|
||||
} else if (type === 'dept') {
|
||||
let treeList = this.deptOptions;
|
||||
for (let i = 0; i < treeList.length; i++) {
|
||||
this.$refs.dept.store.nodesMap[treeList[i].id].expanded = value;
|
||||
}
|
||||
}
|
||||
},
|
||||
// 树权限（全选/全不选）
|
||||
handleCheckedTreeNodeAll(value, type) {
|
||||
if (type === 'menu') {
|
||||
this.$refs.menu.setCheckedNodes(value ? this.menuOptions: []);
|
||||
} else if (type === 'dept') {
|
||||
// this.$refs.dept.setCheckedNodes(value ? this.deptOptions: []);
|
||||
this.$refs.dept.setCheckedNodes(value ? this.depts: []);
|
||||
}
|
||||
},
|
||||
// 树权限（父子联动）
|
||||
handleCheckedTreeConnect(value, type) {
|
||||
if (type === 'menu') {
|
||||
this.form.menuCheckStrictly = value;
|
||||
} else if (type === 'dept') {
|
||||
this.form.deptCheckStrictly = !value;
|
||||
}
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加角色";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id
|
||||
getRole(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改角色";
|
||||
});
|
||||
},
|
||||
/** 分配菜单权限操作 */
|
||||
handleMenu(row) {
|
||||
this.reset();
|
||||
const id = row.id
|
||||
// 处理了 form 的角色 name 和 code 的展示
|
||||
this.form.id = id;
|
||||
this.form.name = row.name;
|
||||
this.form.code = row.code;
|
||||
// 打开弹窗
|
||||
this.openMenu = true;
|
||||
// 获得菜单列表
|
||||
listSimpleMenus().then(response => {
|
||||
// 处理 menuOptions 参数
|
||||
this.menuOptions = [];
|
||||
this.menuOptions.push(...this.handleTree(response.data, "id"));
|
||||
});
|
||||
// 获得角色拥有的菜单集合
|
||||
listRoleMenus(id).then(response => {
|
||||
// 设置为严格，避免设置父节点自动选中子节点，解决半选中问题
|
||||
this.form.menuCheckStrictly = true
|
||||
// 设置选中
|
||||
this.$refs.menu.setCheckedKeys(response.data);
|
||||
// 设置为非严格，继续使用半选中
|
||||
this.form.menuCheckStrictly = false
|
||||
})
|
||||
},
|
||||
/** 分配数据权限操作 */
|
||||
handleDataScope(row) {
|
||||
this.reset();
|
||||
// 处理了 form 的角色 name 和 code 的展示
|
||||
this.form.id = row.id;
|
||||
this.form.name = row.name;
|
||||
this.form.code = row.code;
|
||||
// 打开弹窗
|
||||
this.openDataScope = true;
|
||||
// 获得部门列表
|
||||
listSimpleDepts().then(response => {
|
||||
// 处理 deptOptions 参数
|
||||
this.deptOptions = [];
|
||||
this.deptOptions.push(...this.handleTree(response.data, "id"));
|
||||
this.depts = response.data;
|
||||
// this.deptIds = response.data.map(x => x.id);
|
||||
// 获得角色拥有的数据权限
|
||||
getRole(row.id).then(response => {
|
||||
this.form.dataScope = response.data.dataScope;
|
||||
this.$refs.dept.setCheckedKeys(response.data.dataScopeDeptIds, false);
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id !== undefined) {
|
||||
updateRole(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addRole(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 提交按钮（数据权限） */
|
||||
submitDataScope: function() {
|
||||
if (this.form.id !== undefined) {
|
||||
assignRoleDataScope({
|
||||
roleId: this.form.id,
|
||||
dataScope: this.form.dataScope,
|
||||
dataScopeDeptIds: this.form.dataScope !== SystemDataScopeEnum.DEPT_CUSTOM ? [] :
|
||||
this.$refs.dept.getCheckedKeys()
|
||||
}).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.openDataScope = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
},
|
||||
/** 提交按钮（菜单权限） */
|
||||
submitMenu: function() {
|
||||
if (this.form.id !== undefined) {
|
||||
assignRoleMenu({
|
||||
roleId: this.form.id,
|
||||
menuIds: [...this.$refs.menu.getCheckedKeys(), ...this.$refs.menu.getHalfCheckedKeys()]
|
||||
}).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.openMenu = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$confirm('是否确认删除角色编号为"' + ids + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delRole(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
const queryParams = this.queryParams;
|
||||
this.$confirm('是否确认导出所有角色数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportRole(queryParams);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '角色数据.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
100
yudao-ui-admin/src/views/system/session/index.vue
Normal file
100
yudao-ui-admin/src/views/system/session/index.vue
Normal file
@@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">
|
||||
<el-form-item label="登录地址" prop="userIp">
|
||||
<el-input v-model="queryParams.userIp" placeholder="请输入登录地址" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户名称" prop="username">
|
||||
<el-input v-model="queryParams.username" placeholder="请输入用户名称" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
<el-table v-loading="loading" :data="list" style="width: 100%;">
|
||||
<el-table-column label="会话编号" align="center" prop="id" width="300" />
|
||||
<el-table-column label="登录名称" align="center" prop="username" width="100" />
|
||||
<el-table-column label="部门名称" align="center" prop="deptName" width="100" />
|
||||
<el-table-column label="登录地址" align="center" prop="userIp" width="100" />
|
||||
<el-table-column label="userAgent" align="center" prop="userAgent" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="登录时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleForceLogout(scope.row)"
|
||||
v-hasPermi="['system:user-session:delete']">强退</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="pageNo" :limit.sync="pageSize" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { list, forceLogout } from "@/api/system/session";
|
||||
|
||||
export default {
|
||||
name: "Online",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 表格数据
|
||||
list: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
userIp: undefined,
|
||||
username: undefined
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询登录日志列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
list(this.queryParams).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 强退按钮操作 */
|
||||
handleForceLogout(row) {
|
||||
this.$confirm('是否确认强退名称为"' + row.username + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return forceLogout(row.id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("强退成功");
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
542
yudao-ui-admin/src/views/system/sms/smsChannel.vue
Normal file
542
yudao-ui-admin/src/views/system/sms/smsChannel.vue
Normal file
@@ -0,0 +1,542 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="短信签名" prop="signature">
|
||||
<el-input v-model="queryParams.signature" placeholder="请输入短信签名" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="启用状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择启用状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRangeCreateTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<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-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:sms-channel:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:sms-channel:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="编号" align="center" prop="id" />
|
||||
<el-table-column label="短信签名" align="center" prop="signature" />
|
||||
<el-table-column label="渠道编码" align="center" prop="code">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, scope.row.code) }}</span>
|
||||
</template>
|
||||
</el-table-column>>
|
||||
<el-table-column label="启用状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.COMMON_STATUS, scope.row.status) }}</span>
|
||||
</template>
|
||||
</el-table-column>>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="短信 API 的账号" align="center" prop="apiKey" />
|
||||
<el-table-column label="短信 API 的秘钥" align="center" prop="apiSecret" />
|
||||
<el-table-column label="短信发送回调 URL" align="center" prop="callbackUrl" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:sms-channel:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:sms-channel:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="短信签名" prop="signature">
|
||||
<el-input v-model="form.signature" placeholder="请输入短信签名" />
|
||||
</el-form-item>
|
||||
<el-form-item label="渠道编码" prop="code">
|
||||
<el-input v-model="form.code" placeholder="请输入渠道编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="启用状态">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="parseInt(dict.value)">{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item label="短信 API 的账号" prop="apiKey">
|
||||
<el-input v-model="form.apiKey" placeholder="请输入短信 API 的账号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="短信 API 的秘钥" prop="apiSecret">
|
||||
<el-input v-model="form.apiSecret" placeholder="请输入短信 API 的秘钥" />
|
||||
</el-form-item>
|
||||
<el-form-item label="短信发送回调 URL" prop="callbackUrl">
|
||||
<el-input v-model="form.callbackUrl" placeholder="请输入短信发送回调 URL" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createSmsChannel, updateSmsChannel, deleteSmsChannel, getSmsChannel, getSmsChannelPage,
|
||||
getSimpleSmsChannels } from "@/api/system/sms/smsChannel";
|
||||
|
||||
export default {
|
||||
name: "SmsChannel",
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 短信渠道列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
signature: null,
|
||||
status: null,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
signature: [{ required: true, message: "短信签名不能为空", trigger: "blur" }],
|
||||
code: [{ required: true, message: "渠道编码不能为空", trigger: "blur" }],
|
||||
status: [{ required: true, message: "启用状态不能为空", trigger: "blur" }],
|
||||
apiKey: [{ required: true, message: "短信 API 的账号不能为空", trigger: "blur" }],
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
getSmsChannelPage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
signature: undefined,
|
||||
code: undefined,
|
||||
status: undefined,
|
||||
remark: undefined,
|
||||
apiKey: undefined,
|
||||
apiSecret: undefined,
|
||||
callbackUrl: undefined,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加短信渠道";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id;
|
||||
getSmsChannel(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改短信渠道";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateSmsChannel(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createSmsChannel(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$confirm('是否确认删除短信渠道编号为"' + id + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return deleteSmsChannel(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行导出
|
||||
this.$confirm('是否确认导出所有短信渠道数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportSmsChannelExcel(params);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '短信渠道.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script><template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="短信签名" prop="signature">
|
||||
<el-input v-model="queryParams.signature" placeholder="请输入短信签名" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="启用状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择启用状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRangeCreateTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<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-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:sms-channel:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:sms-channel:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="编号" align="center" prop="id" />
|
||||
<el-table-column label="短信签名" align="center" prop="signature" />
|
||||
<el-table-column label="渠道编码" align="center" prop="code">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, scope.row.code) }}</span>
|
||||
</template>
|
||||
</el-table-column>>
|
||||
<el-table-column label="启用状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.COMMON_STATUS, scope.row.status) }}</span>
|
||||
</template>
|
||||
</el-table-column>>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:sms-channel:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:sms-channel:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="130px">
|
||||
<el-form-item label="短信签名" prop="signature">
|
||||
<el-input v-model="form.signature" placeholder="请输入短信签名" />
|
||||
</el-form-item>
|
||||
<el-form-item label="渠道编码" prop="code">
|
||||
<el-select v-model="form.code" placeholder="请选择渠道编码" :disabled="form.id > 0">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="启用状态">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="parseInt(dict.value)">{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item label="短信 API 的账号" prop="apiKey">
|
||||
<el-input v-model="form.apiKey" placeholder="请输入短信 API 的账号" />
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.code !== 'YUN_PIAN'" label="短信 API 的秘钥" prop="apiSecret">
|
||||
<el-input v-model="form.apiSecret" placeholder="请输入短信 API 的秘钥" />
|
||||
</el-form-item>
|
||||
<el-form-item label="短信发送回调 URL" prop="callbackUrl">
|
||||
<el-input v-model="form.callbackUrl" placeholder="请输入短信发送回调 URL" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createSmsChannel, updateSmsChannel, deleteSmsChannel, getSmsChannel, getSmsChannelPage } from "@/api/system/sms/smsChannel";
|
||||
|
||||
export default {
|
||||
name: "SmsChannel",
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 短信渠道列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
signature: null,
|
||||
status: null,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
apiKeyEnableChannelCodes: ['YUN_PIAN'],
|
||||
rules: {
|
||||
signature: [{ required: true, message: "短信签名不能为空", trigger: "blur" }],
|
||||
code: [{ required: true, message: "渠道编码不能为空", trigger: "blur" }],
|
||||
status: [{ required: true, message: "启用状态不能为空", trigger: "blur" }],
|
||||
apiKey: [{ required: true, message: "短信 API 的账号不能为空", trigger: "blur" }],
|
||||
apiSecret: [{ required: true, message: "短信 API 的秘钥不能为空", trigger: "blur" }],
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
getSmsChannelPage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
signature: undefined,
|
||||
code: undefined,
|
||||
status: undefined,
|
||||
remark: undefined,
|
||||
apiKey: undefined,
|
||||
apiSecret: undefined,
|
||||
callbackUrl: undefined,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加短信渠道";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id;
|
||||
getSmsChannel(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改短信渠道";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateSmsChannel(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createSmsChannel(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$confirm('是否确认删除短信渠道编号为"' + id + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return deleteSmsChannel(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行导出
|
||||
this.$confirm('是否确认导出所有短信渠道数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportSmsChannelExcel(params);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '短信渠道.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
300
yudao-ui-admin/src/views/system/sms/smsLog.vue
Normal file
300
yudao-ui-admin/src/views/system/sms/smsLog.vue
Normal file
@@ -0,0 +1,300 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
|
||||
<el-form-item label="手机号" prop="mobile">
|
||||
<el-input v-model="queryParams.mobile" placeholder="请输入手机号" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="短信渠道" prop="channelId">
|
||||
<el-select v-model="queryParams.channelId" placeholder="请选择短信渠道" clearable size="small">
|
||||
<el-option v-for="channel in channelOptions"
|
||||
:key="channel.id" :value="channel.id"
|
||||
:label="channel.signature + '【' + getDictDataLabel(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, channel.code) + '】'" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="模板编号" prop="templateId">
|
||||
<el-input v-model="queryParams.templateId" placeholder="请输入模板编号" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="发送状态" prop="sendStatus">
|
||||
<el-select v-model="queryParams.sendStatus" placeholder="请选择发送状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.SYSTEM_SMS_SEND_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="发送时间">
|
||||
<el-date-picker v-model="dateRangeSendTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
|
||||
</el-form-item>
|
||||
<el-form-item label="接收状态" prop="receiveStatus">
|
||||
<el-select v-model="queryParams.receiveStatus" placeholder="请选择接收状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.SYSTEM_SMS_RECEIVE_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收时间">
|
||||
<el-date-picker v-model="dateRangeReceiveTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<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-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:sms-log:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:sms-log:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="编号" align="center" prop="id" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="手机号" align="center" prop="mobile" width="120">
|
||||
<template slot-scope="scope">
|
||||
<div>{{ scope.row.mobile }}</div>
|
||||
<div v-if="scope.row.userType && scope.row.userId">
|
||||
{{ getDictDataLabel(DICT_TYPE.USER_TYPE, scope.row.userType) + '(' + scope.row.userId + ')' }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="短信内容" align="center" prop="templateContent" width="300" />
|
||||
<el-table-column label="发送状态" align="center" width="180">
|
||||
<template slot-scope="scope">
|
||||
<div>{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_SEND_STATUS, scope.row.sendStatus) }}</div>
|
||||
<div>{{ parseTime(scope.row.sendTime) }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="接收状态" align="center" width="180">
|
||||
<template slot-scope="scope">
|
||||
<div>{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_RECEIVE_STATUS, scope.row.receiveStatus) }}</div>
|
||||
<div>{{ parseTime(scope.row.receiveTime) }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="短信渠道" align="center" width="120">
|
||||
<template slot-scope="scope">
|
||||
<div>{{ formatChannelSignature(scope.row.channelId) }}</div>
|
||||
<div>【{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, scope.row.channelCode) }}】</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="模板编号" align="center" prop="templateId" />
|
||||
<el-table-column label="短信类型" align="center" prop="templateType">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE, scope.row.templateType) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row,scope.index)"
|
||||
v-hasPermi="['system:sms-log:query']">详细</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 短信日志详细 -->
|
||||
<el-dialog title="短信日志详细" :visible.sync="open" width="700px" append-to-body>
|
||||
<el-form ref="form" :model="form" label-width="140px" size="mini">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="日志主键：">{{ form.id }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="短信渠道：">
|
||||
{{
|
||||
formatChannelSignature(form.channelId)
|
||||
}}【{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, form.channelCode) }}】
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="短信模板：">
|
||||
{{ form.templateId }} | {{ form.templateCode }} |
|
||||
{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE, form.templateType) }}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="API 的模板编号：">{{ form.apiTemplateId }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="用户信息：">{{ form.mobile }}
|
||||
<span v-if="form.userType && form.userId"> | {{ getDictDataLabel(DICT_TYPE.USER_TYPE, form.userType) }} | {{ form.userId }}</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="短信内容：">{{ form.templateContent }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="短信参数：">{{ form.templateParams }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="创建时间：">{{ parseTime(form.createTime) }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="发送状态：">{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_SEND_STATUS, form.sendStatus) }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="发送时间：">{{ parseTime(form.sendTime) }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="发送结果：">{{ form.sendCode }} | {{ form.sendMsg }}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="API 发送结果：">{{ form.apiSendCode }} | {{ form.apiSendMsg }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="API 短信编号：">{{ form.apiSerialNo }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="API 请求编号：">{{ form.apiRequestId }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="接收状态：">{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_RECEIVE_STATUS, form.receiveStatus) }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="接收时间：">{{ parseTime(form.receiveTime) }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="API 接收结果：">{{ form.apiReceiveCode }} | {{ form.apiReceiveMsg }}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="open = false">关 闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getSmsLogPage, exportSmsLogExcel } from "@/api/system/sms/smsLog";
|
||||
import { getSimpleSmsChannels } from "@/api/system/sms/smsChannel";
|
||||
|
||||
export default {
|
||||
name: "SmsLog",
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 短信日志列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeSendTime: [],
|
||||
dateRangeReceiveTime: [],
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
channelId: null,
|
||||
templateId: null,
|
||||
mobile: null,
|
||||
sendStatus: null,
|
||||
receiveStatus: null,
|
||||
},
|
||||
// 短信渠道
|
||||
channelOptions: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
// 获得短信渠道
|
||||
getSimpleSmsChannels().then(response => {
|
||||
this.channelOptions = response.data;
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeSendTime, 'sendTime');
|
||||
this.addBeginAndEndTime(params, this.dateRangeReceiveTime, 'receiveTime');
|
||||
// 执行查询
|
||||
getSmsLogPage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeSendTime = [];
|
||||
this.dateRangeReceiveTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeSendTime, 'sendTime');
|
||||
this.addBeginAndEndTime(params, this.dateRangeReceiveTime, 'receiveTime');
|
||||
// 执行导出
|
||||
this.$confirm('是否确认导出所有短信日志数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportSmsLogExcel(params);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '短信日志.xls');
|
||||
})
|
||||
},
|
||||
/** 详细按钮操作 */
|
||||
handleView(row) {
|
||||
this.open = true;
|
||||
this.form = row;
|
||||
},
|
||||
/** 格式化短信渠道 */
|
||||
formatChannelSignature(channelId) {
|
||||
for (const channel of this.channelOptions) {
|
||||
if (channel.id === channelId) {
|
||||
return channel.signature;
|
||||
}
|
||||
}
|
||||
return '找不到签名：' + channelId;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
405
yudao-ui-admin/src/views/system/sms/smsTemplate.vue
Normal file
405
yudao-ui-admin/src/views/system/sms/smsTemplate.vue
Normal file
@@ -0,0 +1,405 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="150px">
|
||||
<el-form-item label="短信类型" prop="type">
|
||||
<el-select v-model="queryParams.type" placeholder="请选择短信类型" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="开启状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择开启状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="模板编码" prop="code">
|
||||
<el-input v-model="queryParams.code" placeholder="请输入模板编码" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="短信 API 的模板编号" prop="apiTemplateId">
|
||||
<el-input v-model="queryParams.apiTemplateId" placeholder="请输入短信 API 的模板编号" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="短信渠道" prop="channelId">
|
||||
<el-select v-model="queryParams.channelId" placeholder="请选择短信渠道" clearable size="small">
|
||||
<el-option v-for="channel in channelOptions"
|
||||
:key="channel.id" :value="channel.id"
|
||||
:label="channel.signature + '【' + getDictDataLabel(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, channel.code) + '】'" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRangeCreateTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<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-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:sms-template:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:sms-template:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="模板编码" align="center" prop="code" />
|
||||
<el-table-column label="模板名称" align="center" prop="name" />
|
||||
<el-table-column label="模板内容" align="center" prop="content" width="300" />
|
||||
<el-table-column label="短信类型" align="center" prop="type">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE, scope.row.type) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="开启状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.COMMON_STATUS, scope.row.status) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="短信 API 的模板编号" align="center" prop="apiTemplateId" width="180" />
|
||||
<el-table-column label="短信渠道" align="center" width="120">
|
||||
<template slot-scope="scope">
|
||||
<div>{{ formatChannelSignature(scope.row.channelId) }}</div>
|
||||
<div>【{{ getDictDataLabel(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, scope.row.channelCode) }}】</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-share" @click="handleSendSms(scope.row)"
|
||||
v-hasPermi="['system:sms-template:send-sms']">测试</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:sms-template:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:sms-template:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="140px">
|
||||
<el-form-item label="短信渠道编号" prop="channelId">
|
||||
<el-select v-model="form.channelId" placeholder="请选择短信渠道编号">
|
||||
<el-option v-for="channel in channelOptions"
|
||||
:key="channel.id" :value="channel.id"
|
||||
:label="channel.signature + '【' + getDictDataLabel(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, channel.code) + '】'" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="短信类型" prop="type">
|
||||
<el-select v-model="form.type" placeholder="请选择短信类型">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE)"
|
||||
:key="dict.value" :label="dict.label" :value="parseInt(dict.value)" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="模板编号" prop="code">
|
||||
<el-input v-model="form.code" placeholder="请输入模板编号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="模板名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入模板名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="模板内容" prop="content">
|
||||
<el-input type="textarea" v-model="form.content" placeholder="请输入模板内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="开启状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="parseInt(dict.value)">{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="短信 API 模板编号" prop="apiTemplateId">
|
||||
<el-input v-model="form.apiTemplateId" placeholder="请输入短信 API 的模板编号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 对话框(发送短信) -->
|
||||
<el-dialog title="测试发送短信" :visible.sync="sendSmsOpen" width="500px" append-to-body>
|
||||
<el-form ref="sendSmsForm" :model="sendSmsForm" :rules="sendSmsRules" label-width="140px">
|
||||
<el-form-item label="模板内容" prop="content">
|
||||
<el-input v-model="sendSmsForm.content" type="textarea" placeholder="请输入模板内容" readonly />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号" prop="mobile">
|
||||
<el-input v-model="sendSmsForm.mobile" placeholder="请输入手机号" />
|
||||
</el-form-item>
|
||||
<el-form-item v-for="param in sendSmsForm.params" :label="'参数 {' + param + '}'" :prop="'templateParams.' + param">
|
||||
<el-input v-model="sendSmsForm.templateParams[param]" :placeholder="'请输入 ' + param + ' 参数'" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitSendSmsForm">确 定</el-button>
|
||||
<el-button @click="cancelSendSms">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createSmsTemplate, updateSmsTemplate, deleteSmsTemplate, getSmsTemplate, getSmsTemplatePage,
|
||||
exportSmsTemplateExcel, sendSms } from "@/api/system/sms/smsTemplate";
|
||||
import { getSimpleSmsChannels } from "@/api/system/sms/smsChannel";
|
||||
|
||||
export default {
|
||||
name: "SmsTemplate",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 短信模板列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
type: null,
|
||||
status: null,
|
||||
code: null,
|
||||
content: null,
|
||||
apiTemplateId: null,
|
||||
channelId: null,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
type: [{ required: true, message: "短信类型不能为空", trigger: "change" }],
|
||||
status: [{ required: true, message: "开启状态不能为空", trigger: "blur" }],
|
||||
code: [{ required: true, message: "模板编码不能为空", trigger: "blur" }],
|
||||
name: [{ required: true, message: "模板名称不能为空", trigger: "blur" }],
|
||||
content: [{ required: true, message: "模板内容不能为空", trigger: "blur" }],
|
||||
apiTemplateId: [{ required: true, message: "短信 API 的模板编号不能为空", trigger: "blur" }],
|
||||
channelId: [{ required: true, message: "短信渠道编号不能为空", trigger: "change" }],
|
||||
},
|
||||
// 短信渠道
|
||||
channelOptions: [],
|
||||
// 发送短信
|
||||
sendSmsOpen: false,
|
||||
sendSmsForm: {
|
||||
params: [], // 模板的参数列表
|
||||
},
|
||||
sendSmsRules: {
|
||||
mobile: [{ required: true, message: "手机不能为空", trigger: "blur" }],
|
||||
templateCode: [{ required: true, message: "手机不能为空", trigger: "blur" }],
|
||||
templateParams: { }
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
// 获得短信渠道
|
||||
getSimpleSmsChannels().then(response => {
|
||||
this.channelOptions = response.data;
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
getSmsTemplatePage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
type: undefined,
|
||||
status: undefined,
|
||||
code: undefined,
|
||||
name: undefined,
|
||||
content: undefined,
|
||||
remark: undefined,
|
||||
apiTemplateId: undefined,
|
||||
channelId: undefined,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加短信模板";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id;
|
||||
getSmsTemplate(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改短信模板";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateSmsTemplate(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createSmsTemplate(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$confirm('是否确认删除短信模板编号为"' + id + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return deleteSmsTemplate(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行导出
|
||||
this.$confirm('是否确认导出所有短信模板数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportSmsTemplateExcel(params);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '短信模板.xls');
|
||||
})
|
||||
},
|
||||
/** 发送短息按钮 */
|
||||
handleSendSms(row) {
|
||||
this.resetSendSms(row);
|
||||
// 设置参数
|
||||
this.sendSmsForm.content = row.content;
|
||||
this.sendSmsForm.params = row.params;
|
||||
this.sendSmsForm.templateCode = row.code;
|
||||
this.sendSmsForm.templateParams = row.params.reduce(function(obj, item) {
|
||||
obj[item] = undefined;
|
||||
return obj;
|
||||
}, {});
|
||||
// 根据 row 重置 rules
|
||||
this.sendSmsRules.templateParams = row.params.reduce(function(obj, item) {
|
||||
obj[item] = { required: true, message: '参数 ' + item + " 不能为空", trigger: "change" };
|
||||
return obj;
|
||||
}, {});
|
||||
// 设置打开
|
||||
this.sendSmsOpen = true;
|
||||
},
|
||||
/** 重置发送短信的表单 */
|
||||
resetSendSms() {
|
||||
// 根据 row 重置表单
|
||||
this.sendSmsForm = {
|
||||
content: undefined,
|
||||
params: undefined,
|
||||
mobile: undefined,
|
||||
templateCode: undefined,
|
||||
templateParams: {}
|
||||
};
|
||||
this.resetForm("sendSmsForm");
|
||||
},
|
||||
/** 取消发送短信 */
|
||||
cancelSendSms() {
|
||||
this.sendSmsOpen = false;
|
||||
this.resetSendSms();
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitSendSmsForm() {
|
||||
this.$refs["sendSmsForm"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
sendSms(this.sendSmsForm).then(response => {
|
||||
this.msgSuccess("提交发送成功！发送结果，见发送日志编号：" + response.data);
|
||||
this.sendSmsOpen = false;
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 格式化短信渠道 */
|
||||
formatChannelSignature(channelId) {
|
||||
for (const channel of this.channelOptions) {
|
||||
if (channel.id === channelId) {
|
||||
return channel.signature;
|
||||
}
|
||||
}
|
||||
return '找不到签名：' + channelId;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
259
yudao-ui-admin/src/views/system/tenant/index.vue
Executable file
259
yudao-ui-admin/src/views/system/tenant/index.vue
Executable file
@@ -0,0 +1,259 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="租户名" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入租户名" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人" prop="contactName">
|
||||
<el-input v-model="queryParams.contactName" placeholder="请输入联系人" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系手机" prop="contactMobile">
|
||||
<el-input v-model="queryParams.contactMobile" placeholder="请输入联系手机" clearable size="small" @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="租户状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择租户状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRangeCreateTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<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-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:tenant:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:tenant:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="租户编号" align="center" prop="id" />
|
||||
<el-table-column label="租户名" align="center" prop="name" />
|
||||
<el-table-column label="联系人" align="center" prop="contactName" />
|
||||
<el-table-column label="联系手机" align="center" prop="contactMobile" />
|
||||
<el-table-column label="租户状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getDictDataLabel(DICT_TYPE.COMMON_STATUS, scope.row.status) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:tenant:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:tenant:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="租户名" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入租户名" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人" prop="contactName">
|
||||
<el-input v-model="form.contactName" placeholder="请输入联系人" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系手机" prop="contactMobile">
|
||||
<el-input v-model="form.contactMobile" placeholder="请输入联系手机" />
|
||||
</el-form-item>
|
||||
<el-form-item label="租户状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="parseInt(dict.value)">{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createTenant, updateTenant, deleteTenant, getTenant, getTenantPage, exportTenantExcel } from "@/api/system/tenant";
|
||||
import { CommonStatusEnum } from '@/utils/constants'
|
||||
|
||||
export default {
|
||||
name: "Tenant",
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 租户列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
name: null,
|
||||
contactName: null,
|
||||
contactMobile: null,
|
||||
status: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
name: [{ required: true, message: "租户名不能为空", trigger: "blur" }],
|
||||
contactName: [{ required: true, message: "联系人不能为空", trigger: "blur" }],
|
||||
status: [{ required: true, message: "租户状态（0正常 1停用）不能为空", trigger: "blur" }],
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
getTenantPage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
contactName: undefined,
|
||||
contactMobile: undefined,
|
||||
status: CommonStatusEnum.ENABLE,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加租户";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id;
|
||||
getTenant(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改租户";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateTenant(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createTenant(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$confirm('是否确认删除租户编号为"' + id + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return deleteTenant(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行导出
|
||||
this.$confirm('是否确认导出所有租户数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportTenantExcel(params);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '租户.xls');
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
659
yudao-ui-admin/src/views/system/user/index.vue
Normal file
659
yudao-ui-admin/src/views/system/user/index.vue
Normal file
@@ -0,0 +1,659 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-row :gutter="20">
|
||||
<!--部门数据-->
|
||||
<el-col :span="4" :xs="24">
|
||||
<div class="head-container">
|
||||
<el-input v-model="deptName" placeholder="请输入部门名称" clearable size="small" prefix-icon="el-icon-search" style="margin-bottom: 20px"/>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode"
|
||||
ref="tree" default-expand-all @node-click="handleNodeClick"/>
|
||||
</div>
|
||||
</el-col>
|
||||
<!--用户数据-->
|
||||
<el-col :span="20" :xs="24">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="用户名称" prop="username">
|
||||
<el-input v-model="queryParams.username" placeholder="请输入用户名称" clearable size="small" style="width: 240px"
|
||||
@keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号码" prop="mobile">
|
||||
<el-input v-model="queryParams.mobile" placeholder="请输入手机号码" clearable size="small" style="width: 240px"
|
||||
@keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="用户状态" clearable size="small" style="width: 240px">
|
||||
<el-option v-for="dict in statusDictDatas" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRange" size="small" style="width: 240px" value-format="yyyy-MM-dd" type="daterange"
|
||||
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:user:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="info" icon="el-icon-upload2" size="mini" @click="handleImport"
|
||||
v-hasPermi="['system:user:import']">导入</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['system:user:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="userList">
|
||||
<el-table-column label="用户编号" align="center" prop="id" />
|
||||
<el-table-column label="用户名称" align="center" prop="username" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="用户昵称" align="center" prop="nickname" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="部门" align="center" prop="dept.name" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="手机号码" align="center" prop="mobile" width="120" />
|
||||
<el-table-column label="状态" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-switch v-model="scope.row.status" :active-value="0" :inactive-value="1" @change="handleStatusChange(scope.row)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="160">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="large" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:user:update']">修改</el-button>
|
||||
<el-dropdown @command="(command) => handleCommand(command, scope.$index, scope.row)">
|
||||
<span class="el-dropdown-link">
|
||||
更多操作<i class="el-icon-arrow-down el-icon--right"></i>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item command="handleDelete" v-if="scope.row.id !== 1" size="mini" type="text" icon="el-icon-delete"
|
||||
v-hasPermi="['system:user:delete']">删除</el-dropdown-item>
|
||||
<el-dropdown-item command="handleResetPwd" size="mini" type="text" icon="el-icon-key"
|
||||
v-hasPermi="['system:user:update-password']">重置密码</el-dropdown-item>
|
||||
<el-dropdown-item command="handleRole" size="mini" type="text" icon="el-icon-circle-check"
|
||||
v-hasPermi="['system:permission:assign-user-role']">分配角色</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 添加或修改参数配置对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="用户昵称" prop="nickname">
|
||||
<el-input v-model="form.nickname" placeholder="请输入用户昵称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="归属部门" prop="deptId">
|
||||
<treeselect v-model="form.deptId" :options="deptOptions" :show-count="true"
|
||||
placeholder="请选择归属部门" :normalizer="normalizer"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="手机号码" prop="mobile">
|
||||
<el-input v-model="form.mobile" placeholder="请输入手机号码" maxlength="11" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item v-if="form.id === undefined" label="用户名称" prop="username">
|
||||
<el-input v-model="form.username" placeholder="请输入用户名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item v-if="form.id === undefined" label="用户密码" prop="password">
|
||||
<el-input v-model="form.password" placeholder="请输入用户密码" type="password" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="用户性别">
|
||||
<el-select v-model="form.sex" placeholder="请选择">
|
||||
<el-option v-for="dict in sexDictDatas" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="岗位">
|
||||
<el-select v-model="form.postIds" multiple placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in postOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 用户导入对话框 -->
|
||||
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
|
||||
<el-upload
|
||||
ref="upload"
|
||||
:limit="1"
|
||||
accept=".xlsx, .xls"
|
||||
:headers="upload.headers"
|
||||
:action="upload.url + '?updateSupport=' + upload.updateSupport"
|
||||
:disabled="upload.isUploading"
|
||||
:on-progress="handleFileUploadProgress"
|
||||
:on-success="handleFileSuccess"
|
||||
:auto-upload="false"
|
||||
drag
|
||||
>
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text">
|
||||
将文件拖到此处，或
|
||||
<em>点击上传</em>
|
||||
</div>
|
||||
<div class="el-upload__tip" slot="tip">
|
||||
<el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据
|
||||
<el-link type="info" style="font-size:12px" @click="importTemplate">下载模板</el-link>
|
||||
</div>
|
||||
<div class="el-upload__tip" style="color:red" slot="tip">提示：仅允许导入“xls”或“xlsx”格式文件！</div>
|
||||
</el-upload>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitFileForm">确 定</el-button>
|
||||
<el-button @click="upload.open = false">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 分配角色 -->
|
||||
<el-dialog title="分配角色" :visible.sync="openRole" width="500px" append-to-body>
|
||||
<el-form :model="form" label-width="80px">
|
||||
<el-form-item label="用户名称">
|
||||
<el-input v-model="form.username" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户昵称">
|
||||
<el-input v-model="form.nickname" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item label="角色">
|
||||
<el-select v-model="form.roleIds" multiple placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in roleOptions"
|
||||
:key="parseInt(item.id)"
|
||||
:label="item.name"
|
||||
:value="parseInt(item.id)"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitRole">确 定</el-button>
|
||||
<el-button @click="cancelRole">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
addUser,
|
||||
changeUserStatus,
|
||||
delUser,
|
||||
exportUser,
|
||||
getUser,
|
||||
importTemplate,
|
||||
listUser,
|
||||
resetUserPwd,
|
||||
updateUser
|
||||
} from "@/api/system/user";
|
||||
import {getToken} from "@/utils/auth";
|
||||
import Treeselect from "@riophae/vue-treeselect";
|
||||
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||
|
||||
import {listSimpleDepts} from "@/api/system/dept";
|
||||
import {listSimplePosts} from "@/api/system/post";
|
||||
|
||||
import {CommonStatusEnum} from "@/utils/constants";
|
||||
import {DICT_TYPE, getDictDatas} from "@/utils/dict";
|
||||
import {assignUserRole, listUserRoles} from "@/api/system/permission";
|
||||
import {listSimpleRoles} from "@/api/system/role";
|
||||
|
||||
export default {
|
||||
name: "User",
|
||||
components: { Treeselect },
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 用户表格数据
|
||||
userList: null,
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 部门树选项
|
||||
deptOptions: undefined,
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 部门名称
|
||||
deptName: undefined,
|
||||
// 默认密码
|
||||
initPassword: undefined,
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 状态数据字典
|
||||
statusOptions: [],
|
||||
// 性别状态字典
|
||||
sexOptions: [],
|
||||
// 岗位选项
|
||||
postOptions: [],
|
||||
// 角色选项
|
||||
roleOptions: [],
|
||||
// 表单参数
|
||||
form: {},
|
||||
defaultProps: {
|
||||
children: "children",
|
||||
label: "name"
|
||||
},
|
||||
// 用户导入参数
|
||||
upload: {
|
||||
// 是否显示弹出层（用户导入）
|
||||
open: false,
|
||||
// 弹出层标题（用户导入）
|
||||
title: "",
|
||||
// 是否禁用上传
|
||||
isUploading: false,
|
||||
// 是否更新已经存在的用户数据
|
||||
updateSupport: 0,
|
||||
// 设置上传的请求头部
|
||||
headers: { Authorization: "Bearer " + getToken() },
|
||||
// 上传的地址
|
||||
url: process.env.VUE_APP_BASE_API + '/api/' + "/system/user/import"
|
||||
},
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
username: undefined,
|
||||
mobile: undefined,
|
||||
status: undefined,
|
||||
deptId: undefined
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
username: [
|
||||
{ required: true, message: "用户名称不能为空", trigger: "blur" }
|
||||
],
|
||||
nickname: [
|
||||
{ required: true, message: "用户昵称不能为空", trigger: "blur" }
|
||||
],
|
||||
password: [
|
||||
{ required: true, message: "用户密码不能为空", trigger: "blur" }
|
||||
],
|
||||
email: [
|
||||
{
|
||||
type: "email",
|
||||
message: "'请输入正确的邮箱地址",
|
||||
trigger: ["blur", "change"]
|
||||
}
|
||||
],
|
||||
mobile: [
|
||||
{
|
||||
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
||||
message: "请输入正确的手机号码",
|
||||
trigger: "blur"
|
||||
}
|
||||
]
|
||||
},
|
||||
// 是否显示弹出层（角色权限）
|
||||
openRole: false,
|
||||
|
||||
// 枚举
|
||||
SysCommonStatusEnum: CommonStatusEnum,
|
||||
// 数据字典
|
||||
statusDictDatas: getDictDatas(DICT_TYPE.COMMON_STATUS),
|
||||
sexDictDatas: getDictDatas(DICT_TYPE.SYSTEM_USER_SEX),
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
// 根据名称筛选部门树
|
||||
deptName(val) {
|
||||
this.$refs.tree.filter(val);
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.getTreeselect();
|
||||
this.getConfigKey("sys.user.init-password").then(response => {
|
||||
this.initPassword = response.msg;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// 更多操作
|
||||
handleCommand(command, index, row) {
|
||||
switch (command) {
|
||||
case 'handleUpdate':
|
||||
this.handleUpdate(row);//修改客户信息
|
||||
break;
|
||||
case 'handleDelete':
|
||||
this.handleDelete(row);//红号变更
|
||||
break;
|
||||
case 'handleResetPwd':
|
||||
this.handleResetPwd(row);
|
||||
break;
|
||||
case 'handleRole':
|
||||
this.handleRole(row);
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
},
|
||||
/** 查询用户列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listUser(this.addDateRange(this.queryParams, [
|
||||
this.dateRange[0] ? this.dateRange[0] + ' 00:00:00' : undefined,
|
||||
this.dateRange[1] ? this.dateRange[1] + ' 23:59:59' : undefined,
|
||||
])).then(response => {
|
||||
this.userList = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
}
|
||||
);
|
||||
},
|
||||
/** 查询部门下拉树结构 + 岗位下拉 */
|
||||
getTreeselect() {
|
||||
listSimpleDepts().then(response => {
|
||||
// 处理 deptOptions 参数
|
||||
this.deptOptions = [];
|
||||
this.deptOptions.push(...this.handleTree(response.data, "id"));
|
||||
});
|
||||
listSimplePosts().then(response => {
|
||||
// 处理 postOptions 参数
|
||||
this.postOptions = [];
|
||||
this.postOptions.push(...response.data);
|
||||
});
|
||||
},
|
||||
// 筛选节点
|
||||
filterNode(value, data) {
|
||||
if (!value) return true;
|
||||
return data.name.indexOf(value) !== -1;
|
||||
},
|
||||
// 节点单击事件
|
||||
handleNodeClick(data) {
|
||||
this.queryParams.deptId = data.id;
|
||||
this.getList();
|
||||
},
|
||||
// 用户状态修改
|
||||
handleStatusChange(row) {
|
||||
let text = row.status === CommonStatusEnum.ENABLE ? "启用" : "停用";
|
||||
this.$confirm('确认要"' + text + '""' + row.username + '"用户吗?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return changeUserStatus(row.id, row.status);
|
||||
}).then(() => {
|
||||
this.msgSuccess(text + "成功");
|
||||
}).catch(function() {
|
||||
row.status = row.status === CommonStatusEnum.ENABLE ? CommonStatusEnum.DISABLE
|
||||
: CommonStatusEnum.ENABLE;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 取消按钮（角色权限）
|
||||
cancelRole() {
|
||||
this.openRole = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
deptId: undefined,
|
||||
username: undefined,
|
||||
nickname: undefined,
|
||||
password: undefined,
|
||||
mobile: undefined,
|
||||
email: undefined,
|
||||
sex: undefined,
|
||||
status: "0",
|
||||
remark: undefined,
|
||||
postIds: [],
|
||||
roleIds: []
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
// 获得下拉数据
|
||||
this.getTreeselect();
|
||||
// 打开表单，并设置初始化
|
||||
this.open = true;
|
||||
this.title = "添加用户";
|
||||
this.form.password = this.initPassword;
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
this.getTreeselect();
|
||||
const id = row.id;
|
||||
getUser(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改用户";
|
||||
this.form.password = "";
|
||||
});
|
||||
},
|
||||
/** 重置密码按钮操作 */
|
||||
handleResetPwd(row) {
|
||||
this.$prompt('请输入"' + row.username + '"的新密码', "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消"
|
||||
}).then(({ value }) => {
|
||||
resetUserPwd(row.id, value).then(response => {
|
||||
this.msgSuccess("修改成功，新密码是：" + value);
|
||||
});
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 分配用户角色操作 */
|
||||
handleRole(row) {
|
||||
this.reset();
|
||||
const id = row.id
|
||||
// 处理了 form 的用户 username 和 nickname 的展示
|
||||
this.form.id = id;
|
||||
this.form.username = row.username;
|
||||
this.form.nickname = row.nickname;
|
||||
// 打开弹窗
|
||||
this.openRole = true;
|
||||
// 获得角色列表
|
||||
listSimpleRoles().then(response => {
|
||||
// 处理 roleOptions 参数
|
||||
this.roleOptions = [];
|
||||
this.roleOptions.push(...response.data);
|
||||
});
|
||||
// 获得角色拥有的菜单集合
|
||||
listUserRoles(id).then(response => {
|
||||
// 设置选中
|
||||
this.form.roleIds = response.data;
|
||||
})
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id !== undefined) {
|
||||
updateUser(this.form).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addUser(this.form).then(response => {
|
||||
this.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 提交按钮（角色权限） */
|
||||
submitRole: function() {
|
||||
if (this.form.id !== undefined) {
|
||||
assignUserRole({
|
||||
userId: this.form.id,
|
||||
roleIds: this.form.roleIds,
|
||||
}).then(response => {
|
||||
this.msgSuccess("分配角色成功");
|
||||
this.openRole = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$confirm('是否确认删除用户编号为"' + ids + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delUser(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
const queryParams = this.addDateRange(this.queryParams, [
|
||||
this.dateRange[0] ? this.dateRange[0] + ' 00:00:00' : undefined,
|
||||
this.dateRange[1] ? this.dateRange[1] + ' 23:59:59' : undefined,
|
||||
]);
|
||||
this.$confirm('是否确认导出所有用户数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return exportUser(queryParams);
|
||||
}).then(response => {
|
||||
this.downloadExcel(response, '用户数据.xls');
|
||||
})
|
||||
},
|
||||
/** 导入按钮操作 */
|
||||
handleImport() {
|
||||
this.upload.title = "用户导入";
|
||||
this.upload.open = true;
|
||||
},
|
||||
/** 下载模板操作 */
|
||||
importTemplate() {
|
||||
importTemplate().then(response => {
|
||||
this.downloadExcel(response, '用户导入模板.xls');
|
||||
});
|
||||
},
|
||||
// 文件上传中处理
|
||||
handleFileUploadProgress(event, file, fileList) {
|
||||
this.upload.isUploading = true;
|
||||
},
|
||||
// 文件上传成功处理
|
||||
handleFileSuccess(response, file, fileList) {
|
||||
this.upload.open = false;
|
||||
this.upload.isUploading = false;
|
||||
this.$refs.upload.clearFiles();
|
||||
// 拼接提示语
|
||||
let data = response.data;
|
||||
let text = '创建成功数量：' + data.createUsernames.length;
|
||||
for (const username of data.createUsernames) {
|
||||
text += '<br /> ' + username;
|
||||
}
|
||||
text += '<br />更新成功数量：' + data.updateUsernames.length;
|
||||
for (const username of data.updateUsernames) {
|
||||
text += '<br /> ' + username;
|
||||
}
|
||||
text += '<br />更新失败数量：' + Object.keys(data.failureUsernames).length;
|
||||
for (const username in data.failureUsernames) {
|
||||
text += '<br /> ' + username + '：' + data.failureUsernames[username];
|
||||
}
|
||||
this.$alert(text, "导入结果", { dangerouslyUseHTMLString: true });
|
||||
this.getList();
|
||||
},
|
||||
// 提交上传文件
|
||||
submitFileForm() {
|
||||
this.$refs.upload.submit();
|
||||
},
|
||||
// 格式化部门的下拉框
|
||||
normalizer(node) {
|
||||
return {
|
||||
id: node.id,
|
||||
label: node.name,
|
||||
children: node.children
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.el-dropdown-link {
|
||||
cursor: pointer;
|
||||
color: #1890ff;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.el-icon-arrow-down {
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
100
yudao-ui-admin/src/views/system/user/profile/index.vue
Normal file
100
yudao-ui-admin/src/views/system/user/profile/index.vue
Normal file
@@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="6" :xs="24">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>个人信息</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-center">
|
||||
<userAvatar :user="user" />
|
||||
</div>
|
||||
<ul class="list-group list-group-striped">
|
||||
<li class="list-group-item">
|
||||
<svg-icon icon-class="user" />用户名称
|
||||
<div class="pull-right">{{ user.username }}</div>
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<svg-icon icon-class="phone" />手机号码
|
||||
<div class="pull-right">{{ user.mobile }}</div>
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<svg-icon icon-class="email" />用户邮箱
|
||||
<div class="pull-right">{{ user.email }}</div>
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<svg-icon icon-class="tree" />所属部门
|
||||
<div class="pull-right" v-if="user.dept">{{ user.dept.name }}</div>
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<svg-icon icon-class="tree" />所属岗位
|
||||
<div class="pull-right" v-if="user.posts">{{ user.posts.map(post => post.name).join(',') }}</div>
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<svg-icon icon-class="peoples" />所属角色
|
||||
<div class="pull-right" v-if="user.roles">{{ user.roles.map(role => role.name).join(',') }}</div>
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<svg-icon icon-class="date" />创建日期
|
||||
<div class="pull-right">{{ parseTime(user.createTime) }}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="18" :xs="24">
|
||||
<el-card>
|
||||
<div slot="header" class="clearfix">
|
||||
<span>基本资料</span>
|
||||
</div>
|
||||
<el-tabs v-model="activeTab">
|
||||
<el-tab-pane label="基本资料" name="userinfo">
|
||||
<userInfo :user="user" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="修改密码" name="resetPwd">
|
||||
<resetPwd :user="user" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="社交信息" name="userSocial">
|
||||
<userSocial :user="user" :getUser="getUser" :setActiveTab="setActiveTab" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import userAvatar from "./userAvatar";
|
||||
import userInfo from "./userInfo";
|
||||
import resetPwd from "./resetPwd";
|
||||
import userSocial from "./userSocial";
|
||||
import { getUserProfile } from "@/api/system/user";
|
||||
|
||||
export default {
|
||||
name: "Profile",
|
||||
components: { userAvatar, userInfo, resetPwd, userSocial },
|
||||
data() {
|
||||
return {
|
||||
user: {},
|
||||
roleGroup: {},
|
||||
postGroup: {},
|
||||
activeTab: "userinfo"
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getUser();
|
||||
},
|
||||
methods: {
|
||||
getUser() {
|
||||
getUserProfile().then(response => {
|
||||
this.user = response.data;
|
||||
});
|
||||
},
|
||||
setActiveTab(activeTab) {
|
||||
this.activeTab = activeTab
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
72
yudao-ui-admin/src/views/system/user/profile/resetPwd.vue
Normal file
72
yudao-ui-admin/src/views/system/user/profile/resetPwd.vue
Normal file
@@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="user" :rules="rules" label-width="80px">
|
||||
<el-form-item label="旧密码" prop="oldPassword">
|
||||
<el-input v-model="user.oldPassword" placeholder="请输入旧密码" type="password" />
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码" prop="newPassword">
|
||||
<el-input v-model="user.newPassword" placeholder="请输入新密码" type="password" />
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码" prop="confirmPassword">
|
||||
<el-input v-model="user.confirmPassword" placeholder="请确认密码" type="password" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="mini" @click="submit">保存</el-button>
|
||||
<el-button type="danger" size="mini" @click="close">关闭</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { updateUserPwd } from "@/api/system/user";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
const equalToPassword = (rule, value, callback) => {
|
||||
if (this.user.newPassword !== value) {
|
||||
callback(new Error("两次输入的密码不一致"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
return {
|
||||
test: "1test",
|
||||
user: {
|
||||
oldPassword: undefined,
|
||||
newPassword: undefined,
|
||||
confirmPassword: undefined
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
oldPassword: [
|
||||
{ required: true, message: "旧密码不能为空", trigger: "blur" }
|
||||
],
|
||||
newPassword: [
|
||||
{ required: true, message: "新密码不能为空", trigger: "blur" },
|
||||
{ min: 6, max: 20, message: "长度在 6 到 20 个字符", trigger: "blur" }
|
||||
],
|
||||
confirmPassword: [
|
||||
{ required: true, message: "确认密码不能为空", trigger: "blur" },
|
||||
{ required: true, validator: equalToPassword, trigger: "blur" }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
submit() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
updateUserPwd(this.user.oldPassword, this.user.newPassword).then(
|
||||
response => {
|
||||
this.msgSuccess("修改成功");
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
},
|
||||
close() {
|
||||
this.$store.dispatch("tagsView/delView", this.$route);
|
||||
this.$router.push({ path: "/index" });
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
167
yudao-ui-admin/src/views/system/user/profile/userAvatar.vue
Normal file
167
yudao-ui-admin/src/views/system/user/profile/userAvatar.vue
Normal file
@@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="user-info-head" @click="editCropper()"><img v-bind:src="options.img" title="点击上传头像" class="img-circle img-lg" /></div>
|
||||
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body @opened="modalOpened">
|
||||
<el-row>
|
||||
<el-col :xs="24" :md="12" :style="{height: '350px'}">
|
||||
<vue-cropper
|
||||
ref="cropper"
|
||||
:img="options.img"
|
||||
:info="true"
|
||||
:autoCrop="options.autoCrop"
|
||||
:autoCropWidth="options.autoCropWidth"
|
||||
:autoCropHeight="options.autoCropHeight"
|
||||
:fixedBox="options.fixedBox"
|
||||
@realTime="realTime"
|
||||
v-if="visible"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :xs="24" :md="12" :style="{height: '350px'}">
|
||||
<div class="avatar-upload-preview">
|
||||
<img :src="previews.url" :style="previews.img" />
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<br />
|
||||
<el-row>
|
||||
<el-col :lg="2" :md="2">
|
||||
<el-upload action="#" :http-request="requestUpload" :show-file-list="false" :before-upload="beforeUpload">
|
||||
<el-button size="small">
|
||||
选择
|
||||
<i class="el-icon-upload el-icon--right"></i>
|
||||
</el-button>
|
||||
</el-upload>
|
||||
</el-col>
|
||||
<el-col :lg="{span: 1, offset: 2}" :md="2">
|
||||
<el-button icon="el-icon-plus" size="small" @click="changeScale(1)"></el-button>
|
||||
</el-col>
|
||||
<el-col :lg="{span: 1, offset: 1}" :md="2">
|
||||
<el-button icon="el-icon-minus" size="small" @click="changeScale(-1)"></el-button>
|
||||
</el-col>
|
||||
<el-col :lg="{span: 1, offset: 1}" :md="2">
|
||||
<el-button icon="el-icon-refresh-left" size="small" @click="rotateLeft()"></el-button>
|
||||
</el-col>
|
||||
<el-col :lg="{span: 1, offset: 1}" :md="2">
|
||||
<el-button icon="el-icon-refresh-right" size="small" @click="rotateRight()"></el-button>
|
||||
</el-col>
|
||||
<el-col :lg="{span: 2, offset: 6}" :md="2">
|
||||
<el-button type="primary" size="small" @click="uploadImg()">提 交</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import store from "@/store";
|
||||
import { VueCropper } from "vue-cropper";
|
||||
import { uploadAvatar } from "@/api/system/user";
|
||||
|
||||
export default {
|
||||
components: { VueCropper },
|
||||
props: {
|
||||
user: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 是否显示cropper
|
||||
visible: false,
|
||||
// 弹出层标题
|
||||
title: "修改头像",
|
||||
options: {
|
||||
img: store.getters.avatar, //裁剪图片的地址
|
||||
autoCrop: true, // 是否默认生成截图框
|
||||
autoCropWidth: 200, // 默认生成截图框宽度
|
||||
autoCropHeight: 200, // 默认生成截图框高度
|
||||
fixedBox: true // 固定截图框大小 不允许改变
|
||||
},
|
||||
previews: {}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 编辑头像
|
||||
editCropper() {
|
||||
this.open = true;
|
||||
},
|
||||
// 打开弹出层结束时的回调
|
||||
modalOpened() {
|
||||
this.visible = true;
|
||||
},
|
||||
// 覆盖默认的上传行为
|
||||
requestUpload() {
|
||||
},
|
||||
// 向左旋转
|
||||
rotateLeft() {
|
||||
this.$refs.cropper.rotateLeft();
|
||||
},
|
||||
// 向右旋转
|
||||
rotateRight() {
|
||||
this.$refs.cropper.rotateRight();
|
||||
},
|
||||
// 图片缩放
|
||||
changeScale(num) {
|
||||
num = num || 1;
|
||||
this.$refs.cropper.changeScale(num);
|
||||
},
|
||||
// 上传预处理
|
||||
beforeUpload(file) {
|
||||
if (file.type.indexOf("image/") == -1) {
|
||||
this.msgError("文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。");
|
||||
} else {
|
||||
const reader = new FileReader();
|
||||
reader.readAsDataURL(file);
|
||||
reader.onload = () => {
|
||||
this.options.img = reader.result;
|
||||
};
|
||||
}
|
||||
},
|
||||
// 上传图片
|
||||
uploadImg() {
|
||||
this.$refs.cropper.getCropBlob(data => {
|
||||
let formData = new FormData();
|
||||
formData.append("avatarFile", data);
|
||||
uploadAvatar(formData).then(resp => {
|
||||
this.open = false;
|
||||
// this.options.img = process.env.VUE_APP_BASE_API + response.imgUrl;
|
||||
store.commit('SET_AVATAR', resp.data);
|
||||
this.msgSuccess("修改成功");
|
||||
this.visible = false;
|
||||
});
|
||||
});
|
||||
},
|
||||
// 实时预览
|
||||
realTime(data) {
|
||||
this.previews = data;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.user-info-head {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
.user-info-head:hover:after {
|
||||
content: '+';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
color: #eee;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 24px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
cursor: pointer;
|
||||
line-height: 110px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
</style>
|
||||
76
yudao-ui-admin/src/views/system/user/profile/userInfo.vue
Normal file
76
yudao-ui-admin/src/views/system/user/profile/userInfo.vue
Normal file
@@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="user" :rules="rules" label-width="80px">
|
||||
<el-form-item label="用户昵称" prop="nickName">
|
||||
<el-input v-model="user.nickname" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号码" prop="mobile">
|
||||
<el-input v-model="user.mobile" maxlength="11" />
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="user.email" maxlength="50" />
|
||||
</el-form-item>
|
||||
<el-form-item label="性别">
|
||||
<el-radio-group v-model="user.sex">
|
||||
<el-radio :label="1">男</el-radio>
|
||||
<el-radio :label="2">女</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="mini" @click="submit">保存</el-button>
|
||||
<el-button type="danger" size="mini" @click="close">关闭</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { updateUserProfile } from "@/api/system/user";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
user: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 表单校验
|
||||
rules: {
|
||||
nickname: [
|
||||
{ required: true, message: "用户昵称不能为空", trigger: "blur" }
|
||||
],
|
||||
email: [
|
||||
{ required: true, message: "邮箱地址不能为空", trigger: "blur" },
|
||||
{
|
||||
type: "email",
|
||||
message: "'请输入正确的邮箱地址",
|
||||
trigger: ["blur", "change"]
|
||||
}
|
||||
],
|
||||
mobile: [
|
||||
{ required: true, message: "手机号码不能为空", trigger: "blur" },
|
||||
{
|
||||
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
||||
message: "请输入正确的手机号码",
|
||||
trigger: "blur"
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
submit() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
updateUserProfile(this.user).then(response => {
|
||||
this.msgSuccess("修改成功");
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
close() {
|
||||
this.$store.dispatch("tagsView/delView", this.$route);
|
||||
this.$router.push({ path: "/index" });
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
100
yudao-ui-admin/src/views/system/user/profile/userSocial.vue
Normal file
100
yudao-ui-admin/src/views/system/user/profile/userSocial.vue
Normal file
@@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<el-table :data="socialUsers" :show-header="false">
|
||||
<el-table-column label="社交平台" align="left" width="120">
|
||||
<template slot-scope="scope">
|
||||
<img style="height:20px;vertical-align: middle;" :src="scope.row.img" /> {{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="left" >
|
||||
<template slot-scope="scope">
|
||||
<div v-if="scope.row.unionId">
|
||||
已绑定
|
||||
<el-button size="large" type="text" @click="unbind(scope.row)">(解绑)</el-button>
|
||||
</div>
|
||||
<div v-else>
|
||||
未绑定
|
||||
<el-button size="large" type="text" @click="bind(scope.row)">(绑定)</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import {SystemUserSocialTypeEnum} from "@/utils/constants";
|
||||
import {socialAuthRedirect, socialBind, socialUnbind} from "@/api/login";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
user: {
|
||||
type: Object
|
||||
},
|
||||
getUser: { // 刷新用户
|
||||
type: Function
|
||||
},
|
||||
setActiveTab: { // 设置激活的
|
||||
type: Function
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
socialUsers (){
|
||||
const socialUsers = [];
|
||||
for (const i in SystemUserSocialTypeEnum) {
|
||||
const socialUser = {...SystemUserSocialTypeEnum[i]};
|
||||
socialUsers.push(socialUser);
|
||||
if (this.user.socialUsers) {
|
||||
for (const j in this.user.socialUsers) {
|
||||
if (socialUser.type === this.user.socialUsers[j].type) {
|
||||
socialUser.unionId = this.user.socialUsers[j].unionId;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return socialUsers;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 社交绑定
|
||||
const type = this.$route.query.type;
|
||||
const code = this.$route.query.code;
|
||||
const state = this.$route.query.state;
|
||||
if (!code) {
|
||||
return;
|
||||
}
|
||||
socialBind(type, code, state).then(resp => {
|
||||
this.msgSuccess("绑定成功");
|
||||
this.$router.replace('/user/profile');
|
||||
// 调用父组件, 刷新
|
||||
this.getUser();
|
||||
this.setActiveTab('userSocial');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
bind(socialUser) {
|
||||
// 计算 redirectUri
|
||||
const redirectUri = location.origin + '/user/profile?type=' + socialUser.type;
|
||||
// 进行跳转
|
||||
socialAuthRedirect(socialUser.type, encodeURIComponent(redirectUri)).then((res) => {
|
||||
// console.log(res.url);
|
||||
window.location.href = res.data;
|
||||
});
|
||||
},
|
||||
unbind(socialUser) {
|
||||
socialUnbind(socialUser.type, socialUser.unionId).then(resp => {
|
||||
this.msgSuccess("解绑成功");
|
||||
socialUser.unionId = undefined;
|
||||
});
|
||||
},
|
||||
close() {
|
||||
this.$store.dispatch("tagsView/delView", this.$route);
|
||||
this.$router.push({ path: "/index" });
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
Reference in New Issue
Block a user