This commit is contained in:
ky_gyt
2021-04-16 09:35:45 +00:00
parent 18f1d28d27
commit 039242b8b1
6 changed files with 786 additions and 0 deletions

View File

@@ -0,0 +1,72 @@
<template>
<a-modal
:confirmLoading="confirmLoading"
:visible="visible"
@cancel="onCancel"
:width="1024"
@ok="onOk"
title="日志详情"
>
<FormBody ref="form-body" />
</a-modal>
</template>
<script>
import FormBody from './form';
export default {
components: {
FormBody,
},
data() {
return {
visible: false,
confirmLoading: false,
};
},
methods: {
/**
* 必要的方法
* 从外部调用打开本窗口
*/
onOpen(record) {
this.visible = true;
this.$nextTick(() => {
this.$refs['form-body'].onFillData(record);
});
},
/**
* 必要的方法
* 点击保存时的操作
*/
onOk() {
// this.$refs['form-body'].onValidate((valid) => {
// if (valid) {
// this.confirmLoading = true;
// this.$api.sysRoleAdd(this.$refs['form-body'].form).then(({ success, message }) => {
// this.confirmLoading = false;
// if (success) {
// this.$message.success('编辑成功');
// this.onCancel();
// this.$emit('ok');
// } else {
// this.$message.error(message);
// }
// });
// }
// });
},
/**
* 必要的方法
* 关闭窗口时的操作
*/
onCancel() {
this.$refs['form-body'].onResetFields();
this.visible = false;
},
},
};
</script>

View File

@@ -0,0 +1,109 @@
<template>
<!-- <a-form-model :model="form" class="yo-form" ref="form">
<div class="yo-form-group">
<a-col :span="10">
<a-form-model-item label="方法名称" prop="methodName">
<a-input v-model="form.methodName" />
</a-form-model-item>
<a-form-model-item label="地址" prop="location">
<a-input v-model="form.location" />
</a-form-model-item>
<a-form-model-item label="浏览器" prop="browser">
<a-input v-model="form.browser" />
</a-form-model-item>
<a-form-model-item label="操作系统" prop="os">
<a-input v-model="form.os" />
</a-form-model-item>
</a-col>
<a-col :span="10">
<a-form-model-item label="类名称" prop="className">
<a-textarea :rows="4" v-model="form.className" />
</a-form-model-item>
<a-form-model-item label="具体消息" prop="message">
<a-textarea :rows="4" v-model="form.message" />
</a-form-model-item>
<a-form-model-item label="请求参数" prop="param">
<a-textarea :rows="4" v-model="form.param" />
</a-form-model-item>
<a-form-model-item label="返回结果" prop="result">
<a-textarea :rows="4" v-model="form.result" />
</a-form-model-item>
</a-col>
</div>
</a-form-model> -->
<a-form-model :model="form" :rules="rules" class="yo-form" ref="form">
<a-row :gutter="16">
<a-col :span="10">
<div class="yo-form-group">
<a-form-model-item label="方法名称" prop="methodName">
<a-input v-model="form.methodName" />
</a-form-model-item>
<a-form-model-item label="地址" prop="location">
<a-input v-model="form.location" />
</a-form-model-item>
<a-form-model-item label="类名称" prop="className">
<a-textarea :rows="4" v-model="form.className" />
</a-form-model-item>
<a-form-model-item label="返回结果" prop="result">
<a-textarea :rows="4" v-model="form.result" />
</a-form-model-item>
</div>
</a-col>
<a-col :span="14">
<div class="yo-form-group">
<a-form-model-item label="浏览器" prop="browser">
<a-input v-model="form.browser" />
</a-form-model-item>
<a-form-model-item label="操作系统" prop="os">
<a-input v-model="form.os" />
</a-form-model-item>
<a-form-model-item label="请求参数" prop="param">
<a-textarea :rows="4" v-model="form.param" />
</a-form-model-item>
<a-form-model-item label="具体消息" prop="message">
<a-textarea :rows="4" v-model="form.message" />
</a-form-model-item>
</div>
</a-col>
</a-row>
</a-form-model>
</template>
<script>
export default {
data() {
return {
form: {
active: "N",
},
};
},
methods: {
/**
* 必要的方法
* 在打开编辑页时允许填充数据
*/
onFillData(record) {
this.form = this.$_.cloneDeep(record);
},
/**
* 必要的方法
* 在外部窗口进行保存时调用表单验证
*/
onValidate(callback) {
this.$refs.form.validate(callback);
},
/**
* 必要的方法
* 在外部窗口关闭或重置时对表单验证进行初始化
*/
onResetFields() {
setTimeout(() => {
this.form = {};
this.$refs.form.resetFields();
}, 300);
},
},
};
</script>

View File

@@ -0,0 +1,241 @@
<template>
<container>
<br />
<a-alert banner closable type="error">
<template slot="message">后端bug:任何操作的操作类型都是增加</template>
</a-alert>
<br />
<a-alert banner closable type="warning">
<template slot="message">详情的确认按钮没功能</template>
</a-alert>
<br />
<a-card :bordered="false">
<Auth auth="sysApp:page">
<div class="yo-query-bar">
<a-form-model :model="query" layout="inline">
<a-form-model-item label="角色名称">
<a-input placeholder="请输入角色名称" v-model="query.name" />
</a-form-model-item>
<a-form-model-item label="唯一编号">
<a-input placeholder="请输入唯一编码" v-model="query.code" />
</a-form-model-item>
<a-form-model-item>
<a-button-group>
<a-button @click="onQuery" type="primary">查询</a-button>
<a-button
@click="
() => {
(query = {}), onQuery();
}
"
>重置</a-button
>
</a-button-group>
</a-form-model-item>
</a-form-model>
</div>
</Auth>
<yo-table :columns="columns" :load-data="loadData" ref="table">
<div class="yo-action-bar" slot="title">
<Auth auth="sysApp:delete">
<div class="yo-action-bar--actions">
<a-popconfirm
@confirm="sysVisLogDelete()"
placement="topRight"
title="确认清空日志?"
>
<a-button>清空日志</a-button>
</a-popconfirm>
</div>
</Auth>
</div>
<span slot="opType" slot-scope="text, record">
{{ opTypeFilter(text) }}
</span>
<span slot="success" slot-scope="text, record">
{{ successFilter(text) }}
</span>
<span slot="action" slot-scope="text, record">
<yo-table-actions>
<a @click="onOpen('details-Form', record)">详情</a>
</yo-table-actions>
</span>
</yo-table>
<details-Form ref="details-Form" />
</a-card>
<br />
</container>
</template>
<script>
import detailsForm from "./detailsForm";
export default {
components: {
detailsForm,
},
data() {
return {
query: {},
columns: [
{
title: "日志名称",
dataIndex: "name",
},
{
title: "操作类型",
dataIndex: "opType",
scopedSlots: { customRender: "opType" },
},
{
title: "是否成功",
dataIndex: "success",
scopedSlots: { customRender: "success" },
},
{
title: "ip",
dataIndex: "ip",
},
{
title: "请求地址",
dataIndex: "url",
scopedSlots: { customRender: "url" },
},
{
title: "操作时间",
dataIndex: "opTime",
scopedSlots: { customRender: "opTime" },
},
{
title: "操作人",
dataIndex: "account",
},
{
title: "详情",
dataIndex: "action",
width: "150px",
scopedSlots: { customRender: "action" },
},
],
opTypeDict: [],
successDict: [],
};
},
created() {
this.onLoadCodes();
},
methods: {
opTypeFilter(result) {
// eslint-disable-next-line eqeqeq
const values = this.opTypeDict.filter((item) => item.code == result);
if (values.length > 0) {
return values[0].value;
}
},
sysVisLogDelete() {
this.$api.sysOpLogDelete().then((res) => {
if (res.success) {
this.$message.success("清空成功");
this.onReloadData();
} else {
this.$message.error("清空失败:" + res.message);
}
});
},
successFilter(result) {
// eslint-disable-next-line eqeqeq
const values = this.successDict.filter((item) => item.code == result);
if (values.length > 0) {
return values[0].value;
}
},
/**
* 必要的方法
* 传给yo-table以示意数据接口及其参数和返回的数据结构
*/
loadData(params) {
return this.$api
.sysOpLogPage({
...params,
...this.query,
})
.then((res) => {
return res.data;
});
},
/**
* 有查询功能时的必要方法
* 加载数据时初始化分页信息
*/
onQuery() {
this.$refs.table.onReloadData(true);
},
/**
* 必要方法
* 重新列表数据
*/
onReloadData() {
this.$refs.table.onReloadData();
},
/**
* 加载字典数据时的必要方法
*/
onLoadCodes() {
this.$api
.$queue([
this.$api.sysDictTypeDropDownWait({ code: "yes_or_no" }),
this.$api.sysDictTypeDropDownWait({ code: "op_type" }),
])
.then(([yesOrNo, commonStatus]) => {
this.opTypeDict = commonStatus.data;
this.successDict = yesOrNo.data;
});
},
bindCodeValue(code, name) {
const c = this.codes
.find((p) => p.code == name)
.values.find((p) => p.code == code);
if (c) {
return c.value;
}
return null;
},
/**
* 有编辑新增功能的必要方法
* 从列表页调用窗口的打开方法
*/
onOpen(formName, record) {
this.$refs[formName].onOpen(record);
},
onResult(success, message, successMessage) {
if (success) {
this.$message.success(successMessage);
this.onReloadData();
} else {
this.$refs.table.onLoaded();
this.$message.error(message);
}
},
onSetDefault(record) {
this.$refs.table.onLoading();
this.$api
.sysAppSetAsDefault({ id: record.id })
.then(({ success, message }) => {
this.onResult(success, message, "设置成功");
});
},
onDelete(record) {
this.$refs.table.onLoading();
this.$api.sysRoleDel(record).then(({ success, message }) => {
this.onResult(success, message, "删除成功");
});
},
},
};
</script>

View File

@@ -0,0 +1,71 @@
<template>
<a-modal
:confirmLoading="confirmLoading"
:visible="visible"
@cancel="onCancel"
@ok="onOk"
class="yo-modal-form"
title="日志详情"
>
<FormBody ref="form-body" />
</a-modal>
</template>
<script>
import FormBody from './form';
export default {
components: {
FormBody,
},
data() {
return {
visible: false,
confirmLoading: false,
};
},
methods: {
/**
* 必要的方法
* 从外部调用打开本窗口
*/
onOpen(record) {
this.visible = true;
this.$nextTick(() => {
this.$refs['form-body'].onFillData(record);
});
},
/**
* 必要的方法
* 点击保存时的操作
*/
onOk() {
// this.$refs['form-body'].onValidate((valid) => {
// if (valid) {
// this.confirmLoading = true;
// this.$api.sysRoleAdd(this.$refs['form-body'].form).then(({ success, message }) => {
// this.confirmLoading = false;
// if (success) {
// this.$message.success('编辑成功');
// this.onCancel();
// this.$emit('ok');
// } else {
// this.$message.error(message);
// }
// });
// }
// });
},
/**
* 必要的方法
* 关闭窗口时的操作
*/
onCancel() {
this.$refs['form-body'].onResetFields();
this.visible = false;
},
},
};
</script>

View File

@@ -0,0 +1,49 @@
<template>
<a-form-model :model="form" class="yo-form" ref="form">
<div class="yo-form-group">
<a-form-model-item label="具体消息" prop="message">
<a-textarea :rows="4" v-model="form.message" />
</a-form-model-item>
</div>
</a-form-model>
</template>
<script>
export default {
data() {
return {
form: {
active: 'N',
},
};
},
methods: {
/**
* 必要的方法
* 在打开编辑页时允许填充数据
*/
onFillData(record) {
this.form = this.$_.cloneDeep(record);
},
/**
* 必要的方法
* 在外部窗口进行保存时调用表单验证
*/
onValidate(callback) {
this.$refs.form.validate(callback);
},
/**
* 必要的方法
* 在外部窗口关闭或重置时对表单验证进行初始化
*/
onResetFields() {
setTimeout(() => {
this.form = {};
this.$refs.form.resetFields();
}, 300);
},
},
};
</script>

View File

@@ -0,0 +1,244 @@
<template>
<container>
<br />
<a-alert banner closable type="warning">
<template slot="message">详情的确认按钮没功能</template>
</a-alert>
<br />
<a-alert banner closable type="warning">
<template slot="message"
>页面刷新的时候也会有保存登录日志但是没有ip显示</template
>
</a-alert>
<br />
<a-card :bordered="false">
<Auth auth="sysApp:page">
<div class="yo-query-bar">
<a-form-model :model="query" layout="inline">
<a-form-model-item label="角色名称">
<a-input placeholder="请输入角色名称" v-model="query.name" />
</a-form-model-item>
<a-form-model-item label="唯一编号">
<a-input placeholder="请输入唯一编码" v-model="query.code" />
</a-form-model-item>
<a-form-model-item>
<a-button-group>
<a-button @click="onQuery" type="primary">查询</a-button>
<a-button
@click="
() => {
(query = {}), onQuery();
}
"
>重置</a-button
>
</a-button-group>
</a-form-model-item>
</a-form-model>
</div>
</Auth>
<yo-table :columns="columns" :load-data="loadData" ref="table">
<div class="yo-action-bar" slot="title">
<Auth auth="sysApp:delete">
<div class="yo-action-bar--actions">
<a-popconfirm
@confirm="sysVisLogDelete()"
placement="topRight"
title="确认清空日志?"
>
<a-button>清空日志</a-button>
</a-popconfirm>
</div>
</Auth>
</div>
<span slot="visType" slot-scope="text, record">
{{ visTypeFilter(text) }}
</span>
<span slot="success" slot-scope="text, record">
{{ successFilter(text) }}
</span>
<span slot="action" slot-scope="text, record">
<yo-table-actions>
<a @click="onOpen('details-Form', record)">详情</a>
</yo-table-actions>
</span>
</yo-table>
<details-Form ref="details-Form" />
</a-card>
<br />
</container>
</template>
<script>
import detailsForm from "./detailsForm";
export default {
components: {
detailsForm,
},
data() {
return {
query: {},
columns: [
{
title: "日志名称",
dataIndex: "name",
},
{
title: "访问类型",
dataIndex: "visType",
scopedSlots: { customRender: "visType" },
},
{
title: "是否成功",
dataIndex: "success",
scopedSlots: { customRender: "success" },
},
{
title: "ip",
dataIndex: "ip",
},
{
title: "浏览器",
dataIndex: "browser",
},
{
title: "访问时间",
dataIndex: "visTime",
scopedSlots: { customRender: "visTime" },
},
{
title: "访问人",
dataIndex: "account",
},
{
title: "详情",
width: "200px",
dataIndex: "action",
scopedSlots: {
customRender: "action",
},
},
],
visTypeDict: [],
successDict: [],
};
},
created() {
this.onLoadCodes();
},
methods: {
visTypeFilter(result) {
// eslint-disable-next-line eqeqeq
const values = this.visTypeDict.filter((item) => item.code == result);
if (values.length > 0) {
return values[0].value;
}
},
sysVisLogDelete() {
this.$api.sysVisLogDelete().then((res) => {
if (res.success) {
this.$message.success("清空成功");
this.onReloadData();
} else {
this.$message.error("清空失败:" + res.message);
}
});
},
successFilter(result) {
// eslint-disable-next-line eqeqeq
const values = this.successDict.filter((item) => item.code == result);
if (values.length > 0) {
return values[0].value;
}
},
/**
* 必要的方法
* 传给yo-table以示意数据接口及其参数和返回的数据结构
*/
loadData(params) {
return this.$api
.sysVisLogPage({
...params,
...this.query,
})
.then((res) => {
return res.data;
});
},
/**
* 有查询功能时的必要方法
* 加载数据时初始化分页信息
*/
onQuery() {
this.$refs.table.onReloadData(true);
},
/**
* 必要方法
* 重新列表数据
*/
onReloadData() {
this.$refs.table.onReloadData();
},
/**
* 加载字典数据时的必要方法
*/
onLoadCodes() {
this.$api
.$queue([
this.$api.sysDictTypeDropDownWait({ code: "yes_or_no" }),
this.$api.sysDictTypeDropDownWait({ code: "vis_type" }),
])
.then(([yesOrNo, commonStatus]) => {
this.visTypeDict = commonStatus.data;
this.successDict = yesOrNo.data;
});
},
bindCodeValue(code, name) {
const c = this.codes
.find((p) => p.code == name)
.values.find((p) => p.code == code);
if (c) {
return c.value;
}
return null;
},
/**
* 有编辑新增功能的必要方法
* 从列表页调用窗口的打开方法
*/
onOpen(formName, record) {
this.$refs[formName].onOpen(record);
},
onResult(success, message, successMessage) {
if (success) {
this.$message.success(successMessage);
this.onReloadData();
} else {
this.$refs.table.onLoaded();
this.$message.error(message);
}
},
onSetDefault(record) {
this.$refs.table.onLoading();
this.$api
.sysAppSetAsDefault({ id: record.id })
.then(({ success, message }) => {
this.onResult(success, message, "设置成功");
});
},
onDelete(record) {
this.$refs.table.onLoading();
this.$api.sysRoleDel(record).then(({ success, message }) => {
this.onResult(success, message, "删除成功");
});
},
},
};
</script>