Commit e2bcfd30 authored by “yiyousong”'s avatar “yiyousong”

feat: 系统设置页面

parent 291db38f
#开发环境 #开发环境
NODE_ENV = "development" NODE_ENV = "development"
VUE_APP_API_BASE_URL=http://112.19.80.237:11078 VUE_APP_API_BASE_URL=http://192.168.0.98:11078
// 系统api
import request from "@/utils/request";
/**
* 系统参数
*/
// 获取系统参数列表
export const getParamList = (data) => {
return request({
url: `/bill/param/list`,
method: "post",
data,
});
};
// 查看系统参数
export const getParamInfo = (params) => {
return request({
url: `/bill/param/info`,
method: "get",
params,
});
};
// 保存编辑系统参数
export const saveParam = (data) => {
return request({
url: `/bill/param/save`,
method: "post",
data,
});
};
// 删除系统参数
export const delParam = (params) => {
return request({
url: `/bill/param/delete`,
method: "get",
params,
});
};
/**
* 任务信息
*/
// 获取任务信息列表
export const getTaskList = (data) => {
return request({
url: `/bill/task/list`,
method: "post",
data,
});
};
// 查看任务信息
export const getTaskInfo = (params) => {
return request({
url: `/bill/task/info`,
method: "get",
params,
});
};
// 保存编辑任务信息
export const saveTask = (data) => {
return request({
url: `/bill/task/save`,
method: "post",
data,
});
};
// 删除任务信息
export const delTask = (params) => {
return request({
url: `/bill/task/delete`,
method: "get",
params,
});
};
/**
* 操作日志
*/
// 获取操作日志
export const getlogsList = (data) => {
return request({
url: `/bill/oper/log/list`,
method: "post",
data,
});
};
// 查看操作日志
export const getlog = (params) => {
return request({
url: `/bill/oper/log/info`,
method: "get",
params,
});
};
...@@ -157,11 +157,11 @@ ...@@ -157,11 +157,11 @@
margin: 0px !important; margin: 0px !important;
} }
.search-popover{ // .search-popover{
box-shadow: 0 0 12px 0 rgba(24, 144, 255, 0.1); // box-shadow: 0 0 12px 0 rgba(24, 144, 255, 0.1);
border: 1px solid var(--primary); // border: 1px solid var(--primary);
.popper__arrow::after{ // .popper__arrow::after{
border-bottom-color: var(--primary) !important; // border-bottom-color: var(--primary) !important;
} // }
} // }
\ No newline at end of file \ No newline at end of file
admin_2/src/assets/img/logo.png

38.5 KB | W: | H:

admin_2/src/assets/img/logo.png

10.7 KB | W: | H:

admin_2/src/assets/img/logo.png
admin_2/src/assets/img/logo.png
admin_2/src/assets/img/logo.png
admin_2/src/assets/img/logo.png
  • 2-up
  • Swipe
  • Onion skin
<template>
<div class="pagination" v-if="total">
<el-pagination
background
layout="total,prev,pager,next,sizes,jumper"
:pager-count="5"
:total="total"
:current-page="page"
:page-size="Size"
:page-sizes="pageSizes"
v-bind="$attrs"
@current-change="changePagination"
@size-change="changeSize"
>
</el-pagination>
</div>
</template>
<script>
export default {
props: {
total: {
required: true,
type: Number,
default: 0,
},
size: {
required: true,
type: Number,
default: 10,
},
current: {
required: true,
type: Number,
default: 1,
},
layout: {
type: String,
default: "total,prev,pager,next,sizes,jumper",
},
pageSizes: {
type: Array,
default: () => [10, 20, 30, 40, 50, 100, 200],
},
},
data() {
return {};
},
computed: {
Size: {
get() {
return this.size;
},
set(value) {
this.$emit("update:size", value);
},
},
page: {
get() {
return this.current;
},
set(value) {
this.$emit("update:current", value);
},
},
},
methods: {
changePagination(cur) {
this.page = cur;
if (this.$listeners.get) {
this.$listeners.get();
}
this.$emit("currentChange", cur);
},
changeSize(size) {
this.Size = size;
if (this.$listeners.get) {
this.$listeners.get();
}
this.$emit("sizeChange", size);
},
},
};
</script>
<style lang="less" scoped></style>
<template>
<div class="table-header">
<div class="header-left">
<slot name="left"></slot>
</div>
<div class="header-right">
<slot name="right"></slot>
</div>
</div>
</template>
<script>
export default {};
</script>
<style lang="less" scoped>
.table-header {
width: 100%;
margin-bottom: 15px;
display: flex;
align-items: center;
justify-content: space-between;
:deep(.el-form-item) {
margin-bottom: 0px;
}
}
</style>
<template> <template>
<div class="y-table"> <div class="y-table">
<el-table <el-table
ref="MyTable"
v-loading="loading" v-loading="loading"
:border="isBorder" :border="isBorder"
:data="tableData" :data="data"
style="width: 100%" style="width: 100%"
:size="size" :size="size"
:max-height="maxHeight"
v-bind="$attrs" v-bind="$attrs"
v-on="$listeners"
> >
<el-table-column <el-table-column
v-for="(v, i) in column" v-for="(v, i) in column"
:key="i" :key="i"
:reserve-selection="v.reserveSelection"
:prop="v.prop" :prop="v.prop"
:type="v.type" :type="v.type"
:index="v.index" :index="v.index"
...@@ -43,7 +45,7 @@ export default { ...@@ -43,7 +45,7 @@ export default {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
tableData: { data: {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
...@@ -51,26 +53,31 @@ export default { ...@@ -51,26 +53,31 @@ export default {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
headerHeight: {
type: String,
default: "44px",
}, },
headerWeight: { data() {
type: Number, return {};
default: 400,
}, },
maxHeight: { watch: {
default: null, data: {
handler() {
this.$nextTick(() => {
this.$refs.MyTable.bodyWrapper.scrollTop = 0;
});
}, },
immediate: true,
deep: true,
}, },
data() {
return {};
}, },
computed: { computed: {
isBorder() { isBorder() {
return !!this.border; return !!this.border;
}, },
}, },
methods: {
clearSelection() {
this.$refs.MyTable.clearSelection();
},
},
}; };
</script> </script>
......
...@@ -109,7 +109,7 @@ export default { ...@@ -109,7 +109,7 @@ export default {
object-fit: contain; object-fit: contain;
} }
.title { .title {
max-width: 200px; // max-width: 300px;
font-size: 18px; font-size: 18px;
} }
.back-btn { .back-btn {
......
...@@ -38,6 +38,10 @@ import "swiper/css/swiper.min.css"; ...@@ -38,6 +38,10 @@ import "swiper/css/swiper.min.css";
// 注册全局组件 // 注册全局组件
import customComponents from "@/components"; import customComponents from "@/components";
Vue.use(customComponents); Vue.use(customComponents);
// 重置表单
import { resetForm, clearSelection } from "@/utils";
Vue.prototype.$resetForm = resetForm;
Vue.prototype.$clearSelection = clearSelection;
Vue.config.productionTip = false; Vue.config.productionTip = false;
new Vue({ new Vue({
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
title="大厅评价量统计" title="大厅评价量统计"
border border
:column="column" :column="column"
:tableData="tableData" :data="tableData"
></DoubleTable> ></DoubleTable>
</div> </div>
<div class="table-item"> <div class="table-item">
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
title="业务评价量统计" title="业务评价量统计"
border border
:column="column" :column="column"
:tableData="tableData" :data="tableData"
></DoubleTable> ></DoubleTable>
</div> </div>
<div class="table-item"> <div class="table-item">
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
title="部门评价量统计" title="部门评价量统计"
border border
:column="column" :column="column"
:tableData="tableData" :data="tableData"
></DoubleTable> ></DoubleTable>
</div> </div>
<div class="table-item"> <div class="table-item">
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
title="个人评价量统计" title="个人评价量统计"
border border
:column="column" :column="column"
:tableData="tableData" :data="tableData"
></DoubleTable> ></DoubleTable>
</div> </div>
</div> </div>
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
title="大厅取号量统计" title="大厅取号量统计"
border border
:column="column" :column="column"
:tableData="tableData" :data="tableData"
></DoubleTable> ></DoubleTable>
</div> </div>
<div class="table-item"> <div class="table-item">
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
title="业务取号量统计" title="业务取号量统计"
border border
:column="column" :column="column"
:tableData="tableData" :data="tableData"
></DoubleTable> ></DoubleTable>
</div> </div>
<div class="table-item"> <div class="table-item">
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
title="部门取号量统计" title="部门取号量统计"
border border
:column="column" :column="column"
:tableData="tableData" :data="tableData"
></DoubleTable> ></DoubleTable>
</div> </div>
<div class="table-item"> <div class="table-item">
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
title="个人取号量统计" title="个人取号量统计"
border border
:column="column" :column="column"
:tableData="tableData" :data="tableData"
></DoubleTable> ></DoubleTable>
</div> </div>
</div> </div>
......
...@@ -21,14 +21,14 @@ ...@@ -21,14 +21,14 @@
size="small" size="small"
border border
:column="column" :column="column"
:tableData="letTableData" :data="letTableData"
></y-table> ></y-table>
<y-table <y-table
v-if="tableData.length > 5" v-if="data.length > 5"
size="small" size="small"
border border
:column="column" :column="column"
:tableData="rightTableData" :data="rightTableData"
></y-table> ></y-table>
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
<script> <script>
export default { export default {
props: { props: {
tableData: { data: {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
...@@ -74,14 +74,14 @@ export default { ...@@ -74,14 +74,14 @@ export default {
}, },
computed: { computed: {
letTableData() { letTableData() {
let arr = this.tableData.slice(0, 5); let arr = this.data.slice(0, 5);
while (arr.length < 5) { while (arr.length < 5) {
arr.push(null); arr.push(null);
} }
return arr; return arr;
}, },
rightTableData() { rightTableData() {
let arr = this.tableData.slice(5, 10); let arr = this.data.slice(5, 10);
while (arr.length < 5) { while (arr.length < 5) {
arr.push(null); arr.push(null);
} }
......
...@@ -56,7 +56,7 @@ export default { ...@@ -56,7 +56,7 @@ export default {
width: 100%; width: 100%;
height: 100%; height: 100%;
color: #fff; color: #fff;
background: url("@/assets/img/card_bg.png") no-repeat center / 100% 100%; background: url("@/assets/img/changningxian.png") no-repeat center / 100% 100%;
border-radius: 4px; border-radius: 4px;
color: #fff; color: #fff;
position: relative; position: relative;
......
<template> <template>
<div>系统设置</div> <div class="system flex flex-col bg-white">
<el-tabs :value="activeKey" @tab-click="changeRouter">
<el-tab-pane v-for="v in subMenus" :key="v.path" :name="v.path">
<template slot="label">
<i
v-if="v.meta.icon"
:class="['mr-[5px]', 'primary', v.meta.icon]"
></i>
<span class="tab-label">{{ v.meta.title }}</span>
</template>
</el-tab-pane>
</el-tabs>
<div class="system-out-box flex-1">
<router-view></router-view>
</div>
</div>
</template> </template>
<script> <script>
export default {}; import { findBottomSubarrays } from "@/utils";
export default {
data() {
return {
subMenus: [],
};
},
computed: {
activeKey() {
return this.$route.path;
},
},
created() {
this.getSubMenus();
},
methods: {
changeRouter(e) {
this.$router.push(e.name);
},
// 获取当前顶层路由下的所有子路由
getSubMenus() {
let path = this.$route?.meta.activeMenu
? this.$route.meta.activeMenu
: this.$route.path;
let options = this.$router.options.routes[0].children;
let curRouters = options.filter((v) => v.path == path);
this.subMenus = findBottomSubarrays(curRouters).filter(
(v) => !v.meta.hidden
);
},
},
};
</script> </script>
<style lang="less" scoped></style> <style lang="less" scoped>
// :deep(.el-tabs__nav-scroll) {
// padding-left: 15px;
// }
.system {
width: 100%;
height: 100%;
.system-out-box {
padding: 15px;
overflow-y: auto;
}
}
</style>
<template>
<div class="parameter h-full w-full">
<TableHeader>
<div slot="left">
<el-button size="small" type="primary" @click="handleAdd"
>新增参数</el-button
>
<el-button size="small" type="danger" @click="handleDelAll"
>批量删除</el-button
>
</div>
<div slot="right">
<el-form ref="searchForm" :model="searchForm" inline>
<el-form-item prop="type">
<el-select
size="small"
style="width: 150px"
v-model="searchForm.type"
>
<el-option label="按参数名称" value="name"></el-option>
<el-option label="按二级组织" value="secondOrganize"></el-option>
</el-select>
</el-form-item>
<el-form-item prop="keyword">
<el-input
size="small"
v-model="searchForm.keyword"
style="width: 200px"
class="ml10 mr10"
placeholder="请输入关键字搜索"
@keyup.native.enter="handleSearch"
></el-input>
</el-form-item>
<el-form-item>
<el-button size="small" type="primary" @click="handleSearch"
>搜 索</el-button
>
</el-form-item>
<el-form-item>
<el-button size="small" @click="handleReset">重 置</el-button>
</el-form-item>
</el-form>
</div>
</TableHeader>
<!-- 表格 -->
<div class="table-content">
<y-table
ref="MyTable"
:loading="loading"
:data="tableData"
:column="column"
border
tooltip-effect="dark"
:max-height="600"
:row-key="(row) => row.id"
@selection-change="handleSelectionChange"
></y-table>
</div>
<Pagination
:total="total"
:current.sync="current"
:size.sync="size"
@get="getParamList"
></Pagination>
<!-- 新增参数 -->
<AddParameter
ref="AddParameter"
:addVisible.sync="addVisible"
:title="title"
:dict="dict"
@addSuccess="getParamList"
></AddParameter>
</div>
</template>
<script>
import TableHeader from "@/components/TableHeader.vue";
import AddParameter from "./components/AddParameter.vue";
import Pagination from "@/components/Pagination.vue";
import { getParamList, delParam } from "@/api/system";
export default {
components: {
TableHeader,
AddParameter,
Pagination,
},
data() {
return {
column: [
{
label: "全选",
type: "selection",
width: "55",
align: "center",
reserveSelection: true,
},
{
label: "序号",
type: "index",
width: "55",
align: "center",
index: (index) => {
return (this.current - 1) * this.size + index + 1;
},
},
{
label: "参数名称",
prop: "name",
align: "center",
},
{
label: "一级组织",
prop: "firstOrganize",
align: "center",
},
{
label: "二级组织",
prop: "secondOrganize",
align: "center",
},
{
label: "参数键",
prop: "paramKey",
align: "center",
},
{
label: "参数值",
prop: "paramValue",
align: "center",
},
{
label: "参数有效状态",
prop: "validStatus",
align: "center",
formatter: (row) => {
if (this.dict.validStatus) {
return (
<el-tag type="info" size="small">
{this.dict.validStatus[row.validStatus]}
</el-tag>
);
}
},
},
{
label: "备注",
prop: "remark",
align: "center",
},
{
label: "操作",
align: "center",
width: "120",
formatter: (row) => {
return (
<div class="flex justify-center gap-2">
<span
class="primary cursor-pointer"
onClick={() => this.handleEdit(row)}
>
编辑
</span>
<span
class="delete cursor-pointer"
onClick={() => this.handleDel(row.id)}
>
删除
</span>
</div>
);
},
},
],
searchForm: {
type: "name",
keyword: "",
},
tableData: [],
current: 1,
size: 10,
total: 0,
loading: false,
selectKeys: [],
addVisible: false,
title: "新增参数",
dict: {}, // 字典
};
},
created() {
this.getParamList();
},
computed: {},
methods: {
// 系统事项列表
async getParamList() {
this.loading = true;
let form = {};
let value = `%${this.searchForm.keyword}%`;
if (this.searchForm.type == "name") {
form.name = value;
} else {
form.secondOrganize = value;
}
let res = await getParamList({
page: this.current,
size: this.size,
...form,
});
if (res.data.code == 1) {
let { data, total, dict } = res.data.data;
this.dict = dict;
if (!data.length && this.current > 1) {
this.current -= 1;
this.getParamList();
}
this.tableData = data;
this.total = total;
}
this.loading = false;
},
// 批量移除
handleDelAll() {
if (!this.selectKeys.length) {
this.$message.warning("请先勾选数据");
return;
}
let ids = this.selectKeys.map((v) => v.id).join(",");
this.handleDel(ids);
},
// 搜索
handleSearch() {
this.current = 1;
this.$clearSelection("MyTable");
this.getParamList();
},
// 重置
handleReset() {
this.current = 1;
this.$clearSelection("MyTable");
this.$resetForm("searchForm");
this.getParamList();
},
// 选中
handleSelectionChange(select) {
this.selectKeys = select;
},
// 新增
handleAdd() {
this.title = "新增参数";
this.$refs.AddParameter.onAdd();
this.addVisible = true;
},
// 编辑
handleEdit(row) {
this.title = "编辑参数";
this.$refs.AddParameter.onEdit(row);
this.addVisible = true;
},
// 移除
handleDel(id) {
this.$confirm("此操作将删除所选数据,是否继续?", "系统提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
cancelButtonClass: "btn-custom-cancel",
type: "warning",
})
.then(async () => {
let res = await delParam({ id });
let { code, msg } = res.data;
if (code === 1) {
this.$message.success(msg);
this.getParamList();
this.$clearSelection("MyTable");
}
})
.catch(() => {
console.log("取消成功!");
});
},
},
};
</script>
<style lang="less" scoped></style>
<template>
<div>
<el-dialog
:title="title"
:destroy-on-close="true"
:visible.sync="Visible"
width="30%"
@close="handleClose"
:close-on-click-modal="false"
top="10vh"
>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="参数名称" prop="name">
<el-input
size="small"
v-model="form.name"
placeholder="请输入参数名称"
></el-input>
</el-form-item>
<el-form-item label="一级组织" prop="firstOrganize">
<el-input
size="small"
v-model="form.firstOrganize"
placeholder="请输入一级组织"
></el-input>
</el-form-item>
<el-form-item label="二级组织" prop="secondOrganize">
<el-input
size="small"
v-model="form.secondOrganize"
placeholder="请输入二级组织"
></el-input>
</el-form-item>
<el-form-item label="参数键" prop="paramKey">
<el-input
size="small"
v-model="form.paramKey"
placeholder="请输入参数键"
></el-input>
</el-form-item>
<el-form-item label="参数值" prop="paramValue">
<el-input
size="small"
v-model="form.paramValue"
placeholder="请输入参数值"
></el-input>
</el-form-item>
<el-form-item label="参数修改状态" prop="modStatus">
<el-select v-model="form.modStatus" placeholder="请选择参数有效状态">
<el-option
v-for="(v, key) in dict.modStatus"
:key="key"
:label="v"
:value="Number(key)"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="展现类型" prop="displayType">
<el-select v-model="form.displayType" placeholder="请选择展现类型">
<el-option
v-for="(v, key) in dict.displayType"
:key="key"
:label="v"
:value="Number(key)"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="参数有效状态" prop="validStatus">
<el-radio-group v-model="form.validStatus">
<el-radio
v-for="(v, key) in dict.validStatus"
:key="key"
:label="Number(key)"
>
{{ v }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input
resize="none"
:autosize="{ minRows: 3, maxRows: 3 }"
type="textarea"
placeholder="请输入备注"
v-model="form.remark"
></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="handleRest">重 置</el-button>
<el-button size="small" type="primary" @click="handleOk"
>确 定</el-button
>
</span>
</el-dialog>
</div>
</template>
<script>
import { saveParam } from "@/api/system";
export default {
props: {
title: {
type: String,
required: true,
default: "",
},
addVisible: {
type: Boolean,
required: true,
default: false,
},
dict: {
type: Object,
required: true,
default: () => {
return {};
},
},
},
data() {
return {
form: {
name: "", // 参数名称
firstOrganize: "", // 一级组织
secondOrganize: "", // 二级组织
paramKey: "", // 参数键
paramValue: "", // 参数值
modStatus: "", // 参数修改状态
displayType: "", // 展现类型
validStatus: 1, // 参数有效状态
remark: "", // 备注
},
rules: {
name: [{ required: true, message: "请输入参数名称", trigger: "blur" }],
paramKey: [
{ required: true, message: "请输入参数键", trigger: "blur" },
],
paramValue: [
{ required: true, message: "请输入参数值", trigger: "blur" },
],
},
};
},
computed: {
Visible: {
get() {
return this.addVisible;
},
set(val) {
this.$emit("update:addVisible", val);
},
},
},
methods: {
// 确定
handleOk() {
this.$refs.form.validate(async (valid) => {
if (valid) {
let res = await saveParam(this.form);
let { code, msg } = res.data;
if (code === 1) {
this.$message.success(msg);
this.$emit("addSuccess");
this.handleClose();
}
}
});
},
// 新增
onAdd() {
Object.assign(this.form, this.$options.data().form);
this.form.id && this.$delete(this.form, "id");
},
// 编辑
onEdit(row) {
setTimeout(() => {
this.form = { ...row };
}, 10);
},
// 重置
handleRest() {
this.$resetForm("form");
},
// 关闭
handleClose() {
this.$resetForm("form");
this.Visible = false;
},
},
};
</script>
<style lang="less" scoped>
/deep/.el-select {
width: 100%;
}
</style>
<template>
<div class="system-logs h-full w-full">
<TableHeader>
<div slot="right" class="flex">
<el-input
size="small"
v-model="searchVal"
style="width: 200px"
class="mr-[10px]"
placeholder="请输入请求地址搜索"
@keyup.native.enter="handleSearch"
></el-input>
<el-button size="small" type="primary" @click="handleSearch"
>搜 索</el-button
>
<el-button size="small" @click="handleReset">重 置</el-button>
</div>
</TableHeader>
<!-- 表格 -->
<div class="table-content">
<y-table
ref="MyTable"
:loading="loading"
:data="tableData"
:column="column"
border
tooltip-effect="dark"
:max-height="600"
:row-key="(row) => row.id"
></y-table>
</div>
<Pagination
:total="total"
:current.sync="current"
:size.sync="size"
@get="getlogsList"
></Pagination>
</div>
</template>
<script>
import TableHeader from "@/components/TableHeader.vue";
import Pagination from "@/components/Pagination.vue";
import { getlogsList } from "@/api/system";
export default {
components: {
TableHeader,
Pagination,
},
data() {
return {
column: [
{
label: "序号",
type: "index",
width: "55",
align: "center",
index: (index) => {
return (this.current - 1) * this.size + index + 1;
},
},
{
label: "用户名称",
prop: "userName",
align: "center",
},
{
label: "登录名称",
prop: "loginName",
align: "center",
},
{
label: "请求地址",
prop: "requestUrl",
align: "center",
},
{
label: "操作内容",
prop: "content",
align: "center",
},
{
label: "操作IP地址",
prop: "ip",
align: "center",
},
{
label: "操作时间",
prop: "logDate",
align: "center",
formatter: (row) => {
return this.$moment(row.logDate).format("YYYY-MM-DD HH:mm:ss");
},
},
],
searchVal: "",
tableData: [],
current: 1,
size: 10,
total: 10,
loading: false,
selectKeys: [],
dict: {}, // 字典
};
},
created() {
this.getlogsList();
},
computed: {},
methods: {
// 系统事项列表
async getlogsList() {
this.loading = true;
let res = await getlogsList({
page: this.current,
size: this.size,
requestUrl: `%${this.searchVal}%`,
});
if (res.data.code == 1) {
let { data, total, dict } = res.data.data;
this.dict = dict;
if (!data.length && this.current > 1) {
this.current -= 1;
this.getlogsList();
}
this.tableData = data;
this.total = total;
}
this.loading = false;
},
// 搜索
handleSearch() {
this.current = 1;
this.$clearSelection("MyTable");
this.getlogsList();
},
// 重置
handleReset() {
this.searchVal = "";
this.current = 1;
this.$clearSelection("MyTable");
this.getlogsList();
},
},
};
</script>
<style lang="less" scoped></style>
<template>
<div class="task-set h-ull w-full">
<TableHeader>
<div slot="left">
<el-button size="small" type="primary" @click="handleAdd"
>新增任务</el-button
>
<el-button size="small" type="danger" @click="handleDelAll"
>批量删除</el-button
>
</div>
<div slot="right" class="flex">
<el-input
size="small"
v-model="searchVal"
style="width: 200px"
class="mr-[10px]"
placeholder="请输入任务名称搜索"
@keyup.native.enter="handleSearch"
></el-input>
<el-button size="small" type="primary" @click="handleSearch"
>搜 索</el-button
>
<el-button size="small" @click="handleReset">重 置</el-button>
</div>
</TableHeader>
<!-- 表格 -->
<div class="table-content">
<y-table
ref="MyTable"
:loading="loading"
:data="tableData"
:column="column"
border
tooltip-effect="dark"
:max-height="600"
:row-key="(row) => row.id"
@selection-change="handleSelectionChange"
></y-table>
</div>
<Pagination
:total="total"
:current.sync="current"
:size.sync="size"
@get="getTaskList"
></Pagination>
<!-- 新增参数 -->
<AddTask
ref="AddTask"
:addVisible.sync="addVisible"
:title="title"
:dict="dict"
@addSuccess="getTaskList"
></AddTask>
</div>
</template>
<script>
import TableHeader from "@/components/TableHeader.vue";
import AddTask from "./components/AddTask.vue";
import Pagination from "@/components/Pagination.vue";
import { getTaskList, delTask } from "@/api/system";
export default {
components: {
TableHeader,
AddTask,
Pagination,
},
data() {
return {
column: [
{
label: "全选",
type: "selection",
width: "55",
align: "center",
reserveSelection: true,
},
{
label: "序号",
type: "index",
width: "55",
align: "center",
index: (index) => {
return (this.current - 1) * this.size + index + 1;
},
},
{
label: "任务名称",
prop: "name",
align: "center",
},
{
label: "执行主机",
prop: "excuteHost",
align: "center",
},
{
label: "执行关键字",
prop: "taskKey",
align: "center",
},
{
label: "执行策略",
prop: "excuteStrategy",
align: "center",
formatter: (row) => {
return (
<el-tag size="small" type="info">
{this.dict.excuteStrategy[row.excuteStrategy]}
</el-tag>
);
},
},
{
label: "最后执行主机",
prop: "lastExcuteHost",
align: "center",
},
{
label: "最后执行时间",
prop: "lastExcuteTime",
align: "center",
},
{
label: "任务状态",
prop: "status",
align: "center",
formatter: (row) => {
return (
<el-tag size="small" type="info">
{this.dict.status[row.status]}
</el-tag>
);
},
},
{
label: "操作",
align: "center",
width: "120",
formatter: (row) => {
return (
<div class="flex justify-center gap-2">
<span
class="primary cursor-pointer"
onClick={() => this.handleEdit(row)}
>
编辑
</span>
<span
class="delete cursor-pointer"
onClick={() => this.handleDel(row.id)}
>
删除
</span>
</div>
);
},
},
],
searchVal: "",
tableData: [],
current: 1,
size: 10,
total: 10,
loading: false,
selectKeys: [],
addVisible: false,
title: "新增参数",
dict: {}, // 字典
};
},
created() {
this.getTaskList();
},
computed: {},
methods: {
// 系统事项列表
async getTaskList() {
this.loading = true;
let res = await getTaskList({
page: this.current,
size: this.size,
name: `%${this.searchVal}%`,
});
if (res.data.code == 1) {
let { data, total, dict } = res.data.data;
this.dict = dict;
if (!data.length && this.current > 1) {
this.current -= 1;
this.getTaskList();
}
this.tableData = data;
this.total = total;
}
this.loading = false;
},
// 批量移除
handleDelAll() {
if (!this.selectKeys.length) {
this.$message.warning("请先勾选数据");
return;
}
let ids = this.selectKeys.map((v) => v.id).join(",");
this.handleDel(ids);
},
// 搜索
handleSearch() {
this.current = 1;
this.$clearSelection("MyTable");
this.getTaskList();
},
// 重置
handleReset() {
this.searchVal = "";
this.current = 1;
this.$clearSelection("MyTable");
this.getTaskList();
},
// 选中
handleSelectionChange(select) {
this.selectKeys = select;
},
// 新增
handleAdd() {
this.title = "新增任务";
this.$refs.AddTask.onAdd();
this.addVisible = true;
},
// 编辑
handleEdit(row) {
this.title = "编辑任务";
this.$refs.AddTask.onEdit(row);
this.addVisible = true;
},
// 移除
handleDel(id) {
this.$confirm("此操作将删除所选数据,是否继续?", "系统提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
cancelButtonClass: "btn-custom-cancel",
type: "warning",
})
.then(async () => {
let res = await delTask({ id });
let { code, msg } = res.data;
if (code === 1) {
this.$message.success(msg);
this.getTaskList();
this.$clearSelection("MyTable");
}
})
.catch(() => {
console.log("取消成功!");
});
},
},
};
</script>
<style lang="less" scoped></style>
<template>
<div>
<el-dialog
:title="title"
:destroy-on-close="true"
:visible.sync="Visible"
width="30%"
@close="handleClose"
:close-on-click-modal="false"
top="10vh"
>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="任务名称" prop="name">
<el-input
size="small"
v-model="form.name"
placeholder="请输入任务名称"
></el-input>
</el-form-item>
<el-form-item label="关键字" prop="taskKey">
<el-input
size="small"
v-model="form.taskKey"
placeholder="请输入关键字"
></el-input>
</el-form-item>
<el-form-item label="执行服务" prop="excuteService">
<el-input
size="small"
v-model="form.excuteService"
placeholder="请输入执行服务"
></el-input>
</el-form-item>
<el-form-item label="执行策略" prop="excuteStrategy">
<el-select
v-model="form.excuteStrategy"
placeholder="请选择执行策略"
@change="changeExcuteStrategy"
>
<el-option
v-for="(v, key) in dict.excuteStrategy"
:key="key"
:label="v"
:value="Number(key)"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item
label="执行日期"
v-if="form.excuteStrategy != 4"
prop="excuteDate"
>
<el-input
disabled
v-if="form.excuteStrategy == 1"
size="small"
value="每日"
placeholder="请输入参数值"
></el-input>
<el-select
placeholder="请选择执行日期"
v-model.number="form.excuteDate"
v-else-if="form.excuteStrategy == 2"
>
<el-option
v-for="(v, key) in weeks"
:key="key"
:value="Number(key)"
:label="v"
>
</el-option>
</el-select>
<el-select
placeholder="请选择执行日期"
v-else-if="form.excuteStrategy == 3"
v-model="form.excuteDate"
>
<el-option
v-for="(v, key) in days"
:key="key"
:value="Number(key)"
:label="v"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="执行间隔时间" v-else prop="excuteDate">
<el-input placeholder="执行间隔时间" v-model.number="form.excuteDate">
<template slot="suffix"></template>
</el-input>
</el-form-item>
<el-form-item label="执行时间" prop="excuteTime">
<el-time-picker
format="HH:mm"
value-format="HH:mm"
v-model="form.excuteTime"
placeholder="请选择时间"
>
</el-time-picker>
</el-form-item>
<el-form-item label="执行主机" prop="excuteHost">
<el-input
size="small"
v-model="form.excuteHost"
placeholder="请输入执行主机"
></el-input>
</el-form-item>
<el-form-item label="执行参数" prop="excuteParam">
<el-input
size="small"
v-model="form.excuteParam"
placeholder="请输入执行参数"
></el-input>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input
resize="none"
:autosize="{ minRows: 3, maxRows: 3 }"
type="textarea"
placeholder="请输入备注"
v-model="form.remark"
></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="handleRest">重 置</el-button>
<el-button size="small" type="primary" @click="handleOk"
>确 定</el-button
>
</span>
</el-dialog>
</div>
</template>
<script>
import { saveTask } from "@/api/system";
export default {
props: {
title: {
type: String,
required: true,
default: "",
},
addVisible: {
type: Boolean,
required: true,
default: false,
},
dict: {
type: Object,
required: true,
default: () => {
return {};
},
},
},
data() {
return {
days: {}, // 号数
weeks: {}, // 周
form: {
name: "", // 任务名称
taskKey: "", // 关键字
excuteService: "", // 执行服务
excuteStrategy: 1, // 执行策略
excuteDate: 0, // 执行日期
excuteTime: "", // 执行时间
excuteHost: "", // 执行主机
excuteParam: "", // 执行参数
remark: "", // 备注
},
rules: {
name: [{ required: true, message: "请输入参数名称", trigger: "blur" }],
paramKey: [
{ required: true, message: "请输入参数键", trigger: "blur" },
],
paramValue: [
{ required: true, message: "请输入参数值", trigger: "blur" },
],
},
};
},
computed: {
Visible: {
get() {
return this.addVisible;
},
set(val) {
this.$emit("update:addVisible", val);
},
},
},
created() {
for (let i = 1; i <= 31; i++) {
this.days[i] = i + "";
}
let numArr = ["", "", "", "", "", "", ""];
for (let i = 1; i <= 7; i++) {
this.weeks[i] = "星期" + numArr[i - 1];
}
},
methods: {
// 确定
handleOk() {
this.$refs.form.validate(async (valid) => {
if (valid) {
let res = await saveTask(this.form);
let { code, msg } = res.data;
if (code === 1) {
this.$message.success(msg);
this.$emit("addSuccess");
this.handleClose();
}
}
});
},
// 新增
onAdd() {
Object.assign(this.form, this.$options.data().form);
this.form.id && this.$delete(this.form, "id");
},
// 编辑
onEdit(row) {
setTimeout(() => {
this.form = { ...row };
}, 10);
},
// 重置
handleRest() {
this.$resetForm("form");
},
// 关闭
handleClose() {
this.$resetForm("form");
this.Visible = false;
},
// 切换策略
changeExcuteStrategy(val) {
if (val == 1) {
this.form.excuteDate = 0;
} else {
this.form.excuteDate = "";
}
if (val == 4) {
this.form.excuteTime = "";
}
},
},
};
</script>
<style lang="less" scoped>
/deep/.el-select {
width: 100%;
}
</style>
...@@ -105,6 +105,36 @@ const routes = [ ...@@ -105,6 +105,36 @@ const routes = [
icon: "el-icon-setting", icon: "el-icon-setting",
title: "系统设置", title: "系统设置",
}, },
redirect: "/system/parameter",
children: [
{
path: "/system/parameter",
component: () => import("@/pages/system/parameter/Parameter.vue"),
meta: {
activeMenu: "/system",
title: "系统参数",
icon: "el-icon-cpu",
},
},
{
path: "/system/task",
component: () => import("@/pages/system/task/TaskSet.vue"),
meta: {
activeMenu: "/system",
title: "任务信息",
icon: "el-icon-bank-card",
},
},
{
path: "/system/systemlogs",
component: () => import("@/pages/system/systemlogs/SystemLogs.vue"),
meta: {
activeMenu: "/system",
title: "系统日志",
icon: "el-icon-notebook-1",
},
},
],
}, },
], ],
}, },
......
...@@ -88,6 +88,13 @@ export function resetForm(refName) { ...@@ -88,6 +88,13 @@ export function resetForm(refName) {
} }
} }
// 表格清除选中
export function clearSelection(refName) {
if (this.$refs[refName]) {
this.$refs[refName].clearSelection();
}
}
/** /**
* 对象数组去重 * 对象数组去重
* @param {数组} arr * @param {数组} arr
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment