You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
431 lines
14 KiB
431 lines
14 KiB
<template>
|
|
<div class="mod-config yzz">
|
|
<!-- 查询表单 - rqrq -->
|
|
<el-form :inline="true" label-position="top" style="margin-top: 1px; margin-left: 0px;">
|
|
<!-- 三级级联选择：平台 -> 模块 -> 功能页面 - rqrq -->
|
|
<el-form-item label="平台">
|
|
<el-select
|
|
v-model="queryData.platform"
|
|
placeholder="请选择平台"
|
|
style="width: 100px"
|
|
@change="handlePlatformChange">
|
|
<el-option
|
|
v-for="item in platformOptions"
|
|
:key="item"
|
|
:label="item"
|
|
:value="item">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="模块">
|
|
<el-select
|
|
v-model="queryData.moduleName"
|
|
placeholder="请选择模块"
|
|
style="width: 150px"
|
|
:disabled="!queryData.platform"
|
|
@change="handleModuleChange">
|
|
<el-option
|
|
v-for="item in moduleOptions"
|
|
:key="item"
|
|
:label="item"
|
|
:value="item">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="功能页面">
|
|
<el-select
|
|
v-model="queryData.url"
|
|
placeholder="请选择功能页面"
|
|
style="width: 180px"
|
|
:disabled="!queryData.moduleName"
|
|
@change="handlePageChange">
|
|
<el-option
|
|
v-for="item in pageOptions"
|
|
:key="item.url"
|
|
:label="item.pageName"
|
|
:value="item.url">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="错误信息">
|
|
<el-input v-model="queryData.searchErrorMessage" style="width: 180px" placeholder="错误信息关键字" clearable></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item label=" ">
|
|
<el-button type="primary" @click="getDataList()">查询</el-button>
|
|
<el-button @click="resetQuery()">重置</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
|
|
<!-- 当前选中页面信息 - rqrq -->
|
|
<div v-if="false" class="url-info-card">
|
|
<el-card shadow="never">
|
|
<div slot="header" class="clearfix">
|
|
<span>
|
|
<el-tag :type="currentUrlConfig.platform === 'PC' ? 'primary' : 'success'" size="small" style="margin-right: 10px">
|
|
{{ currentUrlConfig.platform }}
|
|
</el-tag>
|
|
<i class="el-icon-document"></i>
|
|
{{ currentUrlConfig.moduleName }} - {{ currentUrlConfig.pageName }}
|
|
</span>
|
|
</div>
|
|
</el-card>
|
|
</div>
|
|
|
|
<!-- 数据表格 - rqrq -->
|
|
<el-table
|
|
:data="dataList"
|
|
:height="height"
|
|
border
|
|
highlight-current-row
|
|
v-loading="dataListLoading"
|
|
style="width: 100%;">
|
|
|
|
<el-table-column prop="functionButton" label="功能/按钮" width="150" header-align="center" align="center">
|
|
<template slot-scope="scope">
|
|
<el-tag type="primary" size="small">{{ scope.row.functionButton }}</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="seqNo" label="序号" width="60" header-align="center" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="errorMessage" label="错误信息" min-width="300" header-align="center" show-overflow-tooltip>
|
|
<template slot-scope="scope">
|
|
<span style="color: #F56C6C">{{ scope.row.errorMessage }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<!-- <el-table-column prop="errorType" label="类型" width="80" header-align="center" align="center">-->
|
|
<!-- <template slot-scope="scope">-->
|
|
<!-- <el-tag :type="scope.row.errorType === 'BACKEND' ? 'warning' : 'info'" size="mini">-->
|
|
<!-- {{ scope.row.errorType === 'BACKEND' ? '后端' : '前端' }}-->
|
|
<!-- </el-tag>-->
|
|
<!-- </template>-->
|
|
<!-- </el-table-column>-->
|
|
|
|
<el-table-column prop="defaultSolution" label="默认处理方式" min-width="250" header-align="center" show-overflow-tooltip>
|
|
<template slot-scope="scope">
|
|
<span style="color: #67C23A">{{ scope.row.defaultSolution || '-' }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="userSolution" label="用户补充处理方式" min-width="250" header-align="center" show-overflow-tooltip>
|
|
<template slot-scope="scope">
|
|
<span style="color: #409EFF">{{ scope.row.userSolution || '-' }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<!-- 操作列 - rqrq -->
|
|
<el-table-column header-align="center" align="center" fixed="right" width="100" label="操作">
|
|
<template slot-scope="scope">
|
|
<a type="text" @click="editSolution(scope.row)">编辑</a>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<!-- 分页 - rqrq -->
|
|
<el-pagination
|
|
@size-change="sizeChangeHandle"
|
|
@current-change="currentChangeHandle"
|
|
:current-page="pageIndex"
|
|
:page-sizes="[20, 50, 100, 1000]"
|
|
:page-size="pageSize"
|
|
:total="totalPage"
|
|
layout="total, sizes, prev, pager, next, jumper">
|
|
</el-pagination>
|
|
|
|
<!-- 编辑处理方式弹窗 - rqrq -->
|
|
<el-dialog
|
|
title="编辑处理方式"
|
|
:visible.sync="editDialogVisible"
|
|
:close-on-click-modal="false"
|
|
v-drag
|
|
width="800px">
|
|
|
|
<el-form :model="editForm" label-position="top" style="margin-top: 1px; margin-left: 0px;">
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="功能/按钮">
|
|
<el-input v-model="editForm.functionButton" readonly></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="错误类型">
|
|
<el-input v-model="editForm.errorTypeText" readonly></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<el-form-item label="错误信息">
|
|
<el-input type="textarea" :rows="3" resize="none" v-model="editForm.errorMessage" readonly></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row style="margin-top: 52px">
|
|
<el-col :span="24">
|
|
<el-form-item label="默认处理方式">
|
|
<el-input type="textarea" :rows="4" resize="none" v-model="editForm.defaultSolution" readonly></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row style="margin-top: 70px">
|
|
<el-col :span="24">
|
|
<el-form-item label="用户补充处理方式">
|
|
<el-input type="textarea" :rows="4" resize="none" v-model="editForm.userSolution" placeholder="请输入用户补充处理方式"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
|
|
<div slot="footer" class="dialog-footer" style="margin-top: 70px">
|
|
<el-button type="primary" @click="saveSolution" :disabled="saveLoading">
|
|
{{ saveLoading ? '保存中...' : '保存' }}
|
|
</el-button>
|
|
<el-button @click="editDialogVisible = false" :disabled="saveLoading">取消</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
getPlatformList,
|
|
getModuleListByPlatform,
|
|
getPageListByPlatformAndModule,
|
|
getErrorDetailList,
|
|
updateErrorDetail
|
|
} from "@/api/sys/sop.js"
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
height: 200,
|
|
dataListLoading: false,
|
|
saveLoading: false,
|
|
editDialogVisible: false,
|
|
platformOptions: [],
|
|
moduleOptions: [],
|
|
pageOptions: [],
|
|
currentUrlConfig: null,
|
|
queryData: {
|
|
platform: '',
|
|
moduleName: '',
|
|
url: '',
|
|
searchErrorMessage: '',
|
|
page: 1,
|
|
limit: 20
|
|
},
|
|
editForm: {
|
|
url: '',
|
|
functionButton: '',
|
|
seqNo: null,
|
|
errorMessage: '',
|
|
errorType: '',
|
|
errorTypeText: '',
|
|
defaultSolution: '',
|
|
userSolution: ''
|
|
},
|
|
dataList: [],
|
|
pageIndex: 1,
|
|
pageSize: 20,
|
|
totalPage: 0
|
|
}
|
|
},
|
|
mounted() {
|
|
// 使用nextTick确保DOM渲染完成后设置高度 - rqrq
|
|
this.$nextTick(() => {
|
|
this.height = window.innerHeight - 220
|
|
})
|
|
this.loadPlatformOptions()
|
|
},
|
|
methods: {
|
|
// 加载平台列表，默认选中PC - rqrq
|
|
loadPlatformOptions() {
|
|
getPlatformList({}).then(({ data }) => {
|
|
if (data && data.code == 0) {
|
|
this.platformOptions = data.rows || []
|
|
// 默认选中PC，如果没有PC则选中第一个 - rqrq
|
|
if (this.platformOptions.includes('PC')) {
|
|
this.queryData.platform = 'PC'
|
|
} else if (this.platformOptions.length > 0) {
|
|
this.queryData.platform = this.platformOptions[0]
|
|
}
|
|
// 加载模块列表
|
|
if (this.queryData.platform) {
|
|
this.loadModuleOptions(this.queryData.platform, true)
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 加载模块列表 - rqrq
|
|
loadModuleOptions(platform, selectFirst) {
|
|
getModuleListByPlatform({ platform: platform }).then(({ data }) => {
|
|
if (data && data.code == 0) {
|
|
this.moduleOptions = data.rows || []
|
|
// 默认选中第一个模块 - rqrq
|
|
if (selectFirst && this.moduleOptions.length > 0) {
|
|
this.queryData.moduleName = this.moduleOptions[0]
|
|
this.loadPageOptions(platform, this.queryData.moduleName, true)
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 加载功能页面列表 - rqrq
|
|
loadPageOptions(platform, moduleName, selectFirst) {
|
|
getPageListByPlatformAndModule({
|
|
platform: platform,
|
|
moduleName: moduleName
|
|
}).then(({ data }) => {
|
|
if (data && data.code == 0) {
|
|
this.pageOptions = data.rows || []
|
|
// 默认选中第一个功能页面 - rqrq
|
|
if (selectFirst && this.pageOptions.length > 0) {
|
|
this.queryData.url = this.pageOptions[0].url
|
|
this.currentUrlConfig = this.pageOptions[0]
|
|
this.getDataList()
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 平台变化处理 - rqrq
|
|
handlePlatformChange(platform) {
|
|
this.queryData.moduleName = ''
|
|
this.queryData.url = ''
|
|
this.moduleOptions = []
|
|
this.pageOptions = []
|
|
this.currentUrlConfig = null
|
|
this.dataList = []
|
|
this.totalPage = 0
|
|
if (platform) {
|
|
// 加载模块列表并默认选中第一个 - rqrq
|
|
this.loadModuleOptions(platform, true)
|
|
}
|
|
},
|
|
// 模块变化处理 - rqrq
|
|
handleModuleChange(moduleName) {
|
|
this.queryData.url = ''
|
|
this.pageOptions = []
|
|
this.currentUrlConfig = null
|
|
this.dataList = []
|
|
this.totalPage = 0
|
|
if (moduleName) {
|
|
// 加载功能页面列表并默认选中第一个 - rqrq
|
|
this.loadPageOptions(this.queryData.platform, moduleName, true)
|
|
}
|
|
},
|
|
// 功能页面变化处理 - rqrq
|
|
handlePageChange(url) {
|
|
if (url) {
|
|
this.currentUrlConfig = this.pageOptions.find(item => item.url === url)
|
|
this.getDataList()
|
|
} else {
|
|
this.currentUrlConfig = null
|
|
this.dataList = []
|
|
this.totalPage = 0
|
|
}
|
|
},
|
|
// 查询数据 - rqrq
|
|
getDataList() {
|
|
if (!this.queryData.url) {
|
|
this.$message.warning('请先选择功能页面')
|
|
return
|
|
}
|
|
this.dataListLoading = true
|
|
this.queryData.page = this.pageIndex
|
|
this.queryData.limit = this.pageSize
|
|
getErrorDetailList(this.queryData).then(({ data }) => {
|
|
this.dataListLoading = false
|
|
if (data && data.code == 0) {
|
|
this.dataList = data.rows || []
|
|
this.totalPage = data.total || 0
|
|
} else {
|
|
this.dataList = []
|
|
this.totalPage = 0
|
|
this.$alert(data.msg || '查询失败', '错误', { confirmButtonText: '确定' })
|
|
}
|
|
}).catch(() => {
|
|
this.dataListLoading = false
|
|
this.$alert('查询失败', '错误', { confirmButtonText: '确定' })
|
|
})
|
|
},
|
|
// 重置查询 - rqrq
|
|
resetQuery() {
|
|
this.queryData.searchErrorMessage = ''
|
|
this.pageIndex = 1
|
|
this.getDataList()
|
|
},
|
|
// 编辑处理方式 - rqrq
|
|
editSolution(row) {
|
|
this.editForm = {
|
|
url: row.url,
|
|
functionButton: row.functionButton,
|
|
seqNo: row.seqNo,
|
|
errorMessage: row.errorMessage,
|
|
errorType: row.errorType,
|
|
errorTypeText: row.errorType === 'BACKEND' ? '后端' : '前端',
|
|
defaultSolution: row.defaultSolution || '',
|
|
userSolution: row.userSolution || ''
|
|
}
|
|
this.editDialogVisible = true
|
|
},
|
|
// 保存处理方式 - rqrq
|
|
saveSolution() {
|
|
this.saveLoading = true
|
|
const updateData = {
|
|
url: this.editForm.url,
|
|
functionButton: this.editForm.functionButton,
|
|
seqNo: this.editForm.seqNo,
|
|
defaultSolution: this.editForm.defaultSolution,
|
|
userSolution: this.editForm.userSolution,
|
|
errorMessage: this.editForm.errorMessage,
|
|
errorType: this.editForm.errorType,
|
|
isActive: 'Y'
|
|
}
|
|
updateErrorDetail(updateData).then(({ data }) => {
|
|
if (data && data.code == 0) {
|
|
this.$message.success('保存成功')
|
|
this.editDialogVisible = false
|
|
this.getDataList()
|
|
} else {
|
|
this.$alert(data.msg || '保存失败', '错误', { confirmButtonText: '确定' })
|
|
}
|
|
}).catch(() => {
|
|
this.$alert('保存失败', '错误', { confirmButtonText: '确定' })
|
|
}).finally(() => {
|
|
this.saveLoading = false
|
|
})
|
|
},
|
|
// 分页 - 每页条数变化 - rqrq
|
|
sizeChangeHandle(val) {
|
|
this.pageSize = val
|
|
this.pageIndex = 1
|
|
this.getDataList()
|
|
},
|
|
// 分页 - 当前页变化 - rqrq
|
|
currentChangeHandle(val) {
|
|
this.pageIndex = val
|
|
this.getDataList()
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.url-info-card {
|
|
margin-bottom: 10px;
|
|
}
|
|
.url-info-card /deep/ .el-card__header {
|
|
padding: 10px 15px;
|
|
background-color: #f5f7fa;
|
|
}
|
|
.url-info-card /deep/ .el-card__body {
|
|
display: none;
|
|
}
|
|
</style>
|