Skip to content

S
saas-manage
Commit 424df567 by zhuzhequan
Options

添加字段

parent 7964a627
Showing with 317 additions and 290 deletions
src/views/operation/exceptionMessage.vue
<template> <template>
<div class="saas-manage card"> <div class="saas-manage card">
<div class="search"> <div class="search">
<el-form :model="searchForm" size="small" :inline="true"> <el-form :model="searchForm" size="small" :inline="true">
<el-form-item label="创建时间"> <el-form-item label="创建时间">
<el-date-picker <el-date-picker
style="width: 360px" style="width: 360px"
v-model="period" v-model="period"
type="datetimerange" type="datetimerange"
value-format="yyyy-MM-dd HH:ss:mm" value-format="yyyy-MM-dd HH:ss:mm"
range-separator="至" range-separator="至"
start-placeholder="开始日期" start-placeholder="开始日期"
end-placeholder="结束日期"></el-date-picker> end-placeholder="结束日期"></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="route"> <el-form-item label="route">
<el-input <el-input
size="small" size="small"
style="width: 160px" style="width: 160px"
clearable clearable
v-model.trim="searchForm.route" v-model.trim="searchForm.route"
placeholder="请输入route"></el-input> placeholder="请输入route"></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item label="消息id">
<el-button <el-input
type="primary" size="small"
size="small" style="width: 160px"
:loading="searchLoading" clearable
icon="el-icon-search" v-model.trim="searchForm.messageId"
@click="search"> placeholder="请输入消息id"></el-input>
查询 </el-form-item>
</el-button> <el-form-item label="namespace">
</el-form-item> <el-input
<el-form-item> size="small"
<el-button style="width: 160px"
type="warning" clearable
size="small" v-model.trim="searchForm.namespace"
:loading="sendLoading" placeholder="请输入namespace"></el-input>
icon="el-icon-s-promotion" </el-form-item>
@click="resendMsg()"> <el-form-item>
批量发送 <el-button
</el-button> type="primary"
</el-form-item> size="small"
</el-form> :loading="searchLoading"
</div> icon="el-icon-search"
<div @click="search">
class="table_wrap" 查询
style="min-height: 50%; max-height: 90%; padding: 0"> </el-button>
<table-view </el-form-item>
:sourceData="messageLists" <el-form-item>
:serialNumber="true" <el-button
:tableColumns="tableColumns" type="warning"
ref="multipleTable" size="small"
@selectionChange="selectionChange" :loading="sendLoading"
:selection="true"></table-view> icon="el-icon-s-promotion"
</div> @click="resendMsg()">
<div class="pagination"> 批量发送
<el-pagination </el-button>
layout="sizes, total, prev, pager, next, jumper" </el-form-item>
background </el-form>
:total="total" </div>
:page-size="pageSize" <div
:current-page="currentPage" class="table_wrap"
@size-change="sizeChange" style="min-height: 50%; max-height: 90%; padding: 0">
@current-change="onCurrentChange"></el-pagination> <table-view
</div> :sourceData="messageLists"
<el-dialog :serialNumber="true"
title="查看详情" :tableColumns="tableColumns"
:visible.sync="detailsVisible" ref="multipleTable"
:close-on-click-modal="false" @selectionChange="selectionChange"
width="700px"> :selection="true"></table-view>
<json-viewer :value="jsonData" :expand-depth="5"></json-viewer> </div>
</el-dialog> <div class="pagination">
</div> <el-pagination
</template> layout="sizes, total, prev, pager, next, jumper"
<script> background
import { :total="total"
getMqMessagePage, :page-size="pageSize"
getMessageDetails, :current-page="currentPage"
getMessageReSend @size-change="sizeChange"
} from '@/common/api/message' @current-change="onCurrentChange"></el-pagination>
import tableView from '@/common/components/base/tableView.vue' </div>
import JsonViewer from 'vue-json-viewer' // 下载vue-json-viewer插件 <el-dialog
export default { title="查看详情"
name: 'exceptionMessage', :visible.sync="detailsVisible"
components: { tableView, JsonViewer }, :close-on-click-modal="false"
data() { width="700px">
return { <json-viewer :value="jsonData" :expand-depth="5"></json-viewer>
detailsVisible: false, </el-dialog>
jsonData: {}, </div>
period: [], </template>
messageLists: [], <script>
searchForm: {}, import {
editForm: { getMqMessagePage,
domain: '' getMessageDetails,
}, getMessageReSend
total: 0, } from '@/common/api/message'
pageSize: 50, import tableView from '@/common/components/base/tableView.vue'
currentPage: 1, import JsonViewer from 'vue-json-viewer' // 下载vue-json-viewer插件
selection: [], export default {
searchLoading: false, name: 'exceptionMessage',
sendLoading: false, components: { tableView, JsonViewer },
loading: false data() {
} return {
}, detailsVisible: false,
computed: { jsonData: {},
tableColumns() { period: [],
return [ messageLists: [],
{ searchForm: {},
label: 'route', editForm: {
key: 'route' domain: ''
}, },
{ total: 0,
label: '发送状态', pageSize: 50,
key: 'statusStr' currentPage: 1,
}, selection: [],
{ searchLoading: false,
label: '创建时间', sendLoading: false,
key: 'createTime' loading: false
}, }
{ },
label: '操作', computed: {
width: 150, tableColumns() {
render: (item) => ( return [
<div> {
<span label: 'route',
class="icon-view icon-tools-view" key: 'route'
title="详情" },
onClick={() => this.lookJson(item.id)}>
<i class="el-icon-tickets"></i> {
</span> label: '消息id',
<span key: 'messageId'
class="icon-view icon-edit-view" },
title="重新发送" {
onClick={() => this.resendMsg(item)}> label: 'namespace',
<i class="el-icon-s-promotion"></i> key: 'namespace'
</span> },
</div> {
) label: '发送状态',
} key: 'statusStr'
] },
} {
}, label: '创建时间',
async created() { key: 'createTime'
this.getList() },
}, {
methods: { label: '操作',
async resendMsg(row) { width: 150,
const arr = row ? [row] : this.selection render: (item) => (
if (arr.length === 0) { <div>
this.$message.error('请至少选择一条记录') <span
return class="icon-view icon-tools-view"
} title="详情"
try { onClick={() => this.lookJson(item.id)}>
await this.$confirm('确认发送？', '提示', { <i class="el-icon-tickets"></i>
confirmButtonText: '确定', </span>
cancelButtonText: '取消', <span
type: 'warning' class="icon-view icon-edit-view"
}) title="重新发送"
onClick={() => this.resendMsg(item)}>
const ids = arr.map((item) => item.id) <i class="el-icon-s-promotion"></i>
</span>
const loading = this.$loading({ </div>
background: 'rgba(0, 0, 0, 0.3)' )
}) }
this.sendLoading = true ]
try { }
const res = await getMessageReSend(String(ids)) },
if (res.code === 200) { async created() {
this.$message.success('发送成功') this.getList()
this.selection = [] },
this.getList() methods: {
} else { async resendMsg(row) {
this.$message.error(res.message) const arr = row ? [row] : this.selection
} if (arr.length === 0) {
} finally { this.$message.error('请至少选择一条记录')
this.sendLoading = false return
loading.close() }
} try {
} catch {} await this.$confirm('确认发送？', '提示', {
}, confirmButtonText: '确定',
async lookJson(id) { cancelButtonText: '取消',
this.jsonData = {} type: 'warning'
const res = await getMessageDetails(id) })
if (res.code === 200) {
this.jsonData = res.data || {} const ids = arr.map((item) => item.id)
this.detailsVisible = true
} const loading = this.$loading({
}, background: 'rgba(0, 0, 0, 0.3)'
async getList() { })
this.searchLoading = true this.sendLoading = true
this.loading = true try {
const params = { const res = await getMessageReSend(String(ids))
currentPage: this.currentPage, if (res.code === 200) {
pageSize: this.pageSize, this.$message.success('发送成功')
route: this.searchForm.route, this.selection = []
startTime: this.period && this.period[0], this.getList()
endTime: this.period && this.period[1] } else {
} this.$message.error(res.message)
try { }
const res = await getMqMessagePage(params) } finally {
this.messageLists = res.data.records || [] this.sendLoading = false
this.total = res.data.total || 0 loading.close()
} catch (e) { }
console.error(e) } catch {}
} finally { },
this.searchLoading = false async lookJson(id) {
this.loading = false this.jsonData = {}
} const res = await getMessageDetails(id)
}, if (res.code === 200) {
search() { this.jsonData = res.data || {}
this.getList() this.detailsVisible = true
}, }
selectionChange(selection) { },
this.selection = selection async getList() {
}, this.searchLoading = true
onCurrentChange(currentPage) { this.loading = true
this.currentPage = currentPage const params = {
this.getList() currentPage: this.currentPage,
}, pageSize: this.pageSize,
sizeChange(pageSize) { route: this.searchForm.route,
this.pageSize = pageSize namespace: this.searchForm.namespace,
this.getList() messageId: this.searchForm.messageId,
} startTime: this.period && this.period[0],
} endTime: this.period && this.period[1]
} }
</script> try {
<style lang="scss" scoped> const res = await getMqMessagePage(params)
::v-deep .jv-light { this.messageLists = res.data.records || []
background-color: #ececec !important; this.total = res.data.total || 0
} } catch (e) {
.saas-manage { console.error(e)
height: 100%; } finally {
overflow: hidden; this.searchLoading = false
display: flex; this.loading = false
flex-direction: column; }
},
&::v-deep { search() {
.el-table .el-table__cell { this.getList()
padding: 6px 0; },
} selectionChange(selection) {
this.selection = selection
.el-input__inner { },
padding: 0 4px; onCurrentChange(currentPage) {
} this.currentPage = currentPage
this.getList()
.el-input--small .el-input__inner { },
height: 30px; sizeChange(pageSize) {
line-height: 30px; this.pageSize = pageSize
} this.getList()
}
.el-icon-time:before { }
content: ''; }
} </script>
<style lang="scss" scoped>
.el-dialog__footer { ::v-deep .jv-light {
text-align: center; background-color: #ececec !important;
}
.el-button--small { .saas-manage {
padding: 9px 50px; height: 100%;
} overflow: hidden;
} display: flex;
flex-direction: column;
.el-dialog__body {
padding: 10px 20px; &::v-deep {
} .el-table .el-table__cell {
padding: 6px 0;
.el-range-editor--small .el-range-separator { }
line-height: 31px;
} .el-input__inner {
padding: 0 4px;
.header-row-class-name th { }
background-color: #f8f8f9;
} .el-input--small .el-input__inner {
height: 30px;
.el-input-group__append { line-height: 30px;
padding-left: 0; }
}
} .el-icon-time:before {
} content: '';
}
.search {
background: #fff; .el-dialog__footer {
} text-align: center;
.table-wrap { .el-button--small {
background: #fff; padding: 9px 50px;
flex: 1; }
overflow: hidden; }
}
</style> .el-dialog__body {
padding: 10px 20px;
}
.el-range-editor--small .el-range-separator {
line-height: 31px;
}
.header-row-class-name th {
background-color: #f8f8f9;
}
.el-input-group__append {
padding-left: 0;
}
}
}
.search {
background: #fff;
}
.table-wrap {
background: #fff;
flex: 1;
overflow: hidden;
}
</style>
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