emis-frontend/src/views/system/sysCostTime/index.vue
2023-11-27 16:29:42 +08:00

522 lines
18 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<!--
<el-form-item label="" prop="orderFrom">
<el-select v-model="queryParams.orderFrom" placeholder="平台" clearable filterable @change="handleQuery">
<el-option
v-for="item in orderFromOptions"
v-bind:key="item.value"
v-bind:label="item.label"
v-bind:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="" prop="pri">
<el-select v-model="queryParams.pri" clearable="" @change="handleQuery" placeholder="任务状态">
<el-option
v-for="dict in dict.type.sys_pri_level"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
-->
<el-form-item label="ID" prop="id">
<el-input
v-model="queryParams.id"
placeholder="请输入ID"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="类名" prop="className">
<el-input
v-model="queryParams.className"
placeholder="请输入类名"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="方法名" prop="methodName">
<el-input
v-model="queryParams.methodName"
placeholder="请输入方法名"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="消耗的时间" prop="spendTime">
<el-input
v-model="queryParams.spendTime"
placeholder="请输入消耗的时间"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="删除标志(0代表存在 2代表删除)" prop="delFlag">
<el-input
v-model="queryParams.delFlag"
placeholder="请输入删除标志(0代表存在 2代表删除)"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="创建者" prop="createBy">
<el-input
v-model="queryParams.createBy"
placeholder="请输入创建者"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="更新者" prop="updateBy">
<el-input
v-model="queryParams.updateBy"
placeholder="请输入更新者"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input
v-model="queryParams.remark"
placeholder="请输入备注"
clearable
@keyup.enter.native="handleQuery"
/>
</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:sysCostTime:add']"
>新增</el-button>
</el-col>
<!--
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['system:sysCostTime:edit']"
>修改</el-button>
</el-col> -->
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['system:sysCostTime:remove']"
>删除</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:sysCostTime:export']"
>导出</el-button>
</el-col> -->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="sysCostTimeList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" align="center" min-width="60">
<template slot-scope="scope">
<span v-text="getIndex(scope.$index)"> </span>
</template>
</el-table-column>
<!--
<el-table-column label="xxx" align="left" prop="xxx" min-width="180">
<template slot-scope="scope">
<div class="link-type" @click="handleView(scope.row)">{{scope.row.orderSn}}</div>
</template>
</el-table-column>
<el-table-column label="结算状态" align="center" prop="settleStatus" min-width="80">
<template slot-scope="scope">
<div v-if="scope.row.settleStatus == 0" style="color:red;">
<span class="el-tag el-tag--info">未结算</span>
</div>
<div v-if="scope.row.settleStatus == 10" style="color:red;">
<span class="el-tag">待确认</span>
</div>
<div v-if="scope.row.settleStatus == 11" style="color:green;">
<span class="el-tag el-tag--success el-tag--light">已确认</span>
</div>
<div v-if="scope.row.settleStatus == 20" >
<span class="el-tag el-tag--warning el-tag--light">待打款</span>
</div>
<div v-if="scope.row.settleStatus == 21" style="color:green;">
<span class="el-tag el-tag--success el-tag--light">已打款</span>
</div>
<div v-if="scope.row.settleStatus == 40" style="color:red;">
<span class="el-tag el-tag--danger">已拒绝</span>
</div>
</template>
</el-table-column>
-->
<el-table-column label="类名" align="center" prop="className" min-width="100" />
<el-table-column label="方法名" align="center" prop="methodName" min-width="100" />
<el-table-column label="消耗的时间" align="center" prop="spendTime" min-width="100" />
<el-table-column label="删除标志(0代表存在 2代表删除)" align="center" prop="delFlag" min-width="100" />
<el-table-column label="创建者" align="center" prop="createBy" min-width="100" />
<el-table-column label="更新者" align="center" prop="updateBy" min-width="100" />
<el-table-column label="备注" align="center" prop="remark" min-width="100" />
<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:sysCostTime:edit']"
>修改</el-button>
<!--
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['system:sysCostTime:remove']"
>删除</el-button> -->
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page-sizes="[20,50,100,300,500,1000,2000,5000]"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
:page-size="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改接口耗时对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" :close-on-click-modal="false" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="ID" prop="id">
<el-input v-model="form.id" placeholder="请输入ID" />
</el-form-item>
<el-form-item label="类名" prop="className">
<el-input v-model="form.className" placeholder="请输入类名" />
</el-form-item>
<el-form-item label="方法名" prop="methodName">
<el-input v-model="form.methodName" placeholder="请输入方法名" />
</el-form-item>
<el-form-item label="消耗的时间" prop="spendTime">
<el-input v-model="form.spendTime" placeholder="请输入消耗的时间" />
</el-form-item>
<el-form-item label="删除标志(0代表存在 2代表删除)" prop="delFlag">
<el-input v-model="form.delFlag" placeholder="请输入删除标志(0代表存在 2代表删除)" />
</el-form-item>
<el-form-item label="创建者" prop="createBy">
<el-input v-model="form.createBy" placeholder="请输入创建者" />
</el-form-item>
<el-form-item label="更新者" prop="updateBy">
<el-input v-model="form.updateBy" placeholder="请输入更新者" />
</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>
</div>
</template>
<script>
import { listSysCostTime, getSysCostTime, delSysCostTime, addSysCostTime, updateSysCostTime } from "@/api/system/sysCostTime";
import elDateSimplePicker from '@/components/DatePickerAdv/elDateSimplePicker';
export default {
name: "sysCostTime",
components: { elDateSimplePicker },
dicts: [
// 'xxx',
],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 创建时间搜索
dateTimeRange:[],
// 搜索下拉
// itemOptions:[],
// 下拉枚举
// xxStatusOtions: [
// {value: '0', label: 'xx1'},
// {value: '10', label: 'xxx'},
// ],
// 总条数
total: 0,
// 接口耗时表格数据
sysCostTimeList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 备注时间范围
daterangeCreateTime: [],
// 备注时间范围
daterangeUpdateTime: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 20,
id: null,
className: null,
methodName: null,
spendTime: null,
delFlag: null,
createBy: null,
updateBy: null,
remark: null
},
// 表单参数
form: {},
// 表单校验
rules: {
id: [
{ required: true, message: "ID不能为空", trigger: "blur" }
],
className: [
{ required: true, message: "类名不能为空", trigger: "blur" }
],
methodName: [
{ required: true, message: "方法名不能为空", trigger: "blur" }
],
spendTime: [
{ required: true, message: "消耗的时间不能为空", trigger: "blur" }
],
delFlag: [
{ required: true, message: "删除标志(0代表存在 2代表删除)不能为空", trigger: "blur" }
],
createBy: [
{ required: true, message: "创建者不能为空", trigger: "blur" }
],
createTime: [
{ required: true, message: "创建时间不能为空", trigger: "blur" }
],
updateBy: [
{ required: true, message: "更新者不能为空", trigger: "blur" }
],
updateTime: [
{ required: true, message: "更新时间不能为空", trigger: "blur" }
],
remark: [
{ required: true, message: "备注不能为空", trigger: "blur" }
]
}
};
},
created() {
this.getList();
},
methods: {
/** 查询接口耗时列表 */
getList() {
this.loading = true;
this.queryParams.params = {};
if (null != this.daterangeCreateTime && '' != this.daterangeCreateTime) {
this.queryParams.params["beginCreateTime"] = this.daterangeCreateTime[0];
this.queryParams.params["endCreateTime"] = this.daterangeCreateTime[1];
}
if (null != this.daterangeUpdateTime && '' != this.daterangeUpdateTime) {
this.queryParams.params["beginUpdateTime"] = this.daterangeUpdateTime[0];
this.queryParams.params["endUpdateTime"] = this.daterangeUpdateTime[1];
}
listSysCostTime(this.addDateRange(this.queryParams, this.dateTimeRange)).then(response => {
this.sysCostTimeList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
className: null,
methodName: null,
spendTime: null,
delFlag: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "新增";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getSysCostTime(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改";
});
},
handleView(row) {
// this.orderId=row.orderId;
// this.titleView="查看信息";
// this.openView=true;
// this.router.push({ path: '/cebOrderMgnt/viewDetail', query: { orderId: row.orderId }})
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
updateSysCostTime(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addSysCostTime(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除').then(function() {
return delSysCostTime(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
// this.download('system/sysCostTime/export', {
// ...this.queryParams
// }, `sysCostTime_${new Date().getTime()}.xlsx`)
const loadingInstance = this.$loading({
text: '正在导出...'
})
var qParam = {...this.queryParams};
qParam.pageNum=1;
qParam.pageSize=5000;
listSysCostTime(this.addDateRange(qParam, this.dateTimeRange)).then(response => {
this.downloadLoading = false
if (response.code === 200) {
const curList = response.rows
import('@/vendor/Export2Excel').then(excel => {
const tHeader = ['ID','类名','方法名','消耗的时间','删除标志(0代表存在 2代表删除)','创建者','创建时间','更新者','更新时间','备注',];
const filterVal = ['id','className','methodName','spendTime','delFlag','createBy','createTime','updateBy','updateTime','remark',];
const data = this.formatJson(filterVal, curList, response.rows)
excel.export_json_to_excel({
header: tHeader,
data,
filename: '接口耗时',
autoWidth: true
})
loadingInstance.close()
})
}
});
},
formatJson(filterVal, jsonData, resData) {
let index = 0
return jsonData.map(v => filterVal.map(j => {
if (j === 'index') {
return ++index
}
if (j === 'status') {
var statusStr='xxx'
if(v[j] == 10){
statusStr='xxx'
}
return statusStr;
}
return v[j]
}))
},
/** 列索引函数 */
getIndex($index) {
return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + $index + 1
},
/** 时间搜索响应函数 */
dateTimeChange(value){
this.dateTimeRange=value;
},
}
};
</script>