增加问题反馈页面
This commit is contained in:
BianLzhaoMin
parent
ee6026a46a
commit
0ab6513828
|
|
@ -1,9 +0,0 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["src/*"]
|
||||
}
|
||||
},
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
import request from '@/utils/request'
|
||||
import request_formdata from '@/utils/request_formdata'
|
||||
|
||||
// 查询列表
|
||||
export function getProblemFeedbackListAPI(query) {
|
||||
return request({
|
||||
url: '/bmw/question/list',
|
||||
method: 'get',
|
||||
params: query,
|
||||
})
|
||||
}
|
||||
|
||||
// 添加问题反馈
|
||||
export function addProblemFeedbackAPI(data) {
|
||||
return request_formdata({
|
||||
url: '/bmw/question/insert',
|
||||
method: 'post',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
// 处理问题反馈
|
||||
export function handleProblemFeedbackAPI(data) {
|
||||
return request({
|
||||
url: '/bmw/question/deal',
|
||||
method: 'post',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
// 删除问题反馈
|
||||
export function deleteProblemFeedbackAPI(data) {
|
||||
return request({
|
||||
url: '/bmw/question/del',
|
||||
method: 'post',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
|
@ -66,7 +66,6 @@ export const constantRoutes = [
|
|||
path: '/parameter',
|
||||
component: Layout,
|
||||
redirect: 'index',
|
||||
|
||||
permissions: ['parameter:decryption:list'],
|
||||
children: [
|
||||
{
|
||||
|
|
@ -80,6 +79,21 @@ export const constantRoutes = [
|
|||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/problem-feedback',
|
||||
component: Layout,
|
||||
redirect: 'index',
|
||||
permissions: ['parameter:decryption:list'],
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'ProblemFeedback',
|
||||
component: () => import('@/views/ProblemFeedback/index'),
|
||||
permissions: ['problem:feedback:list'],
|
||||
meta: { title: '问题反馈', icon: 'message' },
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '',
|
||||
component: Layout,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,471 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<TableModel
|
||||
:formLabel="formLabel"
|
||||
:columnsList="columnsList"
|
||||
:request-api="getProblemFeedbackListAPI"
|
||||
:showOperation="true"
|
||||
ref="tableRef"
|
||||
>
|
||||
<template slot="btn">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
@click="handleAdd"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</template>
|
||||
<template slot="file" slot-scope="{ data }">
|
||||
<template v-if="data.file && data.file.length > 0">
|
||||
<a
|
||||
target="_blank"
|
||||
:key="index"
|
||||
:href="item.lsUrl"
|
||||
class="cursor-blue"
|
||||
style="padding: 0 2px"
|
||||
v-for="(item, index) in data.file"
|
||||
>
|
||||
附件{{ index + 1 }}
|
||||
</a>
|
||||
</template>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
<template slot="status" slot-scope="{ data }">
|
||||
<el-tag
|
||||
size="mini"
|
||||
type="warning"
|
||||
v-if="data.status == 0 || data.status == null"
|
||||
>
|
||||
待处理
|
||||
</el-tag>
|
||||
<el-tag size="mini" type="success" v-if="data.status == 1">
|
||||
已处理
|
||||
</el-tag>
|
||||
</template>
|
||||
<template slot="handle" slot-scope="{ data }">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(data)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
v-if="data.status == 0 || data.status == null"
|
||||
@click="handleDeal(data)"
|
||||
v-hasPermi="['problem:feedback:deal']"
|
||||
>
|
||||
处理
|
||||
</el-button>
|
||||
</template>
|
||||
</TableModel>
|
||||
|
||||
<DialogModel
|
||||
:dialogConfig="dialogConfig"
|
||||
@closeDialogOuter="handleCloseDialog"
|
||||
>
|
||||
<template slot="outerContent">
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
label-width="120px"
|
||||
>
|
||||
<el-form-item label="问题所在模块：" prop="module">
|
||||
<el-input
|
||||
v-model="formData.module"
|
||||
placeholder="请输入问题所在模块"
|
||||
clearable
|
||||
maxlength="100"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="问题描述：" prop="content">
|
||||
<el-input
|
||||
v-model="formData.content"
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 4, maxRows: 8 }"
|
||||
placeholder="请输入问题描述"
|
||||
clearable
|
||||
maxlength="500"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="提出人：" prop="submitter">
|
||||
<el-input
|
||||
v-model="formData.submitter"
|
||||
placeholder="请输入提出人"
|
||||
clearable
|
||||
maxlength="50"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="附件：" prop="fileList">
|
||||
<UploadFileFormData
|
||||
:fileList.sync="formData.fileList"
|
||||
:limit="5"
|
||||
:multiple="true"
|
||||
:fileSize="10"
|
||||
:fileType="['jpg', 'jpeg', 'png', 'gif']"
|
||||
uploadTip="支持上传图片格式，单个文件不超过10MB，最多上传5个文件"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row class="dialog-footer-btn">
|
||||
<el-button size="medium" @click="handleCloseDialog">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button
|
||||
size="medium"
|
||||
type="primary"
|
||||
@click="handleSubmit"
|
||||
>
|
||||
确定
|
||||
</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
</DialogModel>
|
||||
|
||||
<DialogModel
|
||||
:dialogConfig="dealDialogConfig"
|
||||
@closeDialogOuter="handleCloseDealDialog"
|
||||
>
|
||||
<template slot="outerContent">
|
||||
<el-form
|
||||
ref="dealFormRef"
|
||||
:model="dealFormData"
|
||||
:rules="dealFormRules"
|
||||
label-width="120px"
|
||||
>
|
||||
<el-form-item label="处理状态：" prop="handler">
|
||||
<el-radio-group v-model="dealFormData.status">
|
||||
<el-radio :label="1">处理成功</el-radio>
|
||||
<el-radio :label="2">处理失败</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="处理人：" prop="handler">
|
||||
<el-input
|
||||
v-model="dealFormData.handler"
|
||||
placeholder="请输入处理人"
|
||||
clearable
|
||||
maxlength="50"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="处理结果：" prop="remark">
|
||||
<el-input
|
||||
v-model="dealFormData.remark"
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 4, maxRows: 8 }"
|
||||
placeholder="请输入处理结果"
|
||||
clearable
|
||||
maxlength="500"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row class="dialog-footer-btn">
|
||||
<el-button size="medium" @click="handleCloseDealDialog">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button
|
||||
size="medium"
|
||||
type="primary"
|
||||
@click="handleDealSubmit"
|
||||
>
|
||||
确定
|
||||
</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
</DialogModel>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TableModel from '@/components/TableModel'
|
||||
import DialogModel from '@/components/DialogModel'
|
||||
import UploadFileFormData from '@/components/UploadFileFormData'
|
||||
import {
|
||||
getProblemFeedbackListAPI,
|
||||
addProblemFeedbackAPI,
|
||||
deleteProblemFeedbackAPI,
|
||||
handleProblemFeedbackAPI,
|
||||
} from '@/api/ProblemFeedback/index.js'
|
||||
|
||||
export default {
|
||||
name: 'ProblemFeedback',
|
||||
components: {
|
||||
TableModel,
|
||||
DialogModel,
|
||||
UploadFileFormData,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
getProblemFeedbackListAPI,
|
||||
// 查询表单配置
|
||||
formLabel: [
|
||||
{
|
||||
f_label: '问题所在模块',
|
||||
f_model: 'module',
|
||||
f_type: 'ipt',
|
||||
f_width: '180px',
|
||||
},
|
||||
{
|
||||
f_label: '提出人',
|
||||
f_model: 'submitter',
|
||||
f_type: 'ipt',
|
||||
f_width: '180px',
|
||||
},
|
||||
],
|
||||
// 表格列配置
|
||||
columnsList: [
|
||||
{
|
||||
t_label: '问题所在模块',
|
||||
t_props: 'module',
|
||||
},
|
||||
{
|
||||
t_label: '问题描述',
|
||||
t_props: 'content',
|
||||
},
|
||||
{
|
||||
t_label: '提出人',
|
||||
t_props: 'submitter',
|
||||
},
|
||||
{
|
||||
t_label: '处理状态',
|
||||
t_slot: 'status',
|
||||
},
|
||||
{
|
||||
t_label: '处理人',
|
||||
t_props: 'handler',
|
||||
},
|
||||
{
|
||||
t_label: '处理结果',
|
||||
t_props: 'remark',
|
||||
},
|
||||
{
|
||||
t_label: '附件',
|
||||
|
||||
t_slot: 'file',
|
||||
},
|
||||
{
|
||||
t_label: '创建时间',
|
||||
t_props: 'createTime',
|
||||
t_width: '180',
|
||||
},
|
||||
],
|
||||
// 弹框配置
|
||||
dialogConfig: {
|
||||
outerVisible: false,
|
||||
outerTitle: '新增问题反馈',
|
||||
outerWidth: '50%',
|
||||
maxHeight: '80vh',
|
||||
},
|
||||
// 处理弹框配置
|
||||
dealDialogConfig: {
|
||||
outerVisible: false,
|
||||
outerTitle: '处理问题反馈',
|
||||
outerWidth: '50%',
|
||||
maxHeight: '80vh',
|
||||
},
|
||||
// 表单数据
|
||||
formData: {
|
||||
module: '',
|
||||
content: '',
|
||||
submitter: '',
|
||||
fileList: [],
|
||||
},
|
||||
// 处理表单数据
|
||||
dealFormData: {
|
||||
id: '',
|
||||
handler: '',
|
||||
remark: '',
|
||||
status: 1,
|
||||
},
|
||||
// 表单校验规则
|
||||
formRules: {
|
||||
module: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入问题所在模块',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
content: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入问题描述',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
submitter: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入提出人',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
// 处理表单校验规则
|
||||
dealFormRules: {
|
||||
handler: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入处理人',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
remark: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入处理结果',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 新增
|
||||
handleAdd() {
|
||||
this.dialogConfig.outerVisible = true
|
||||
this.resetForm()
|
||||
},
|
||||
// 删除
|
||||
handleDelete(row) {
|
||||
this.$modal
|
||||
.confirm('确定要删除该问题反馈吗？')
|
||||
.then(() => {
|
||||
deleteProblemFeedbackAPI({ id: row.id })
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$modal.msgSuccess('删除成功')
|
||||
this.$refs.tableRef.getTableList()
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
// 提交表单
|
||||
handleSubmit() {
|
||||
this.$refs.formRef.validate((valid) => {
|
||||
if (valid) {
|
||||
const formData = new FormData()
|
||||
// formData.append('module', this.formData.module)
|
||||
// formData.append('content', this.formData.content)
|
||||
// formData.append('submitter', this.formData.submitter)
|
||||
|
||||
const params = {
|
||||
module: this.formData.module,
|
||||
content: this.formData.content,
|
||||
submitter: this.formData.submitter,
|
||||
}
|
||||
|
||||
formData.append('params', JSON.stringify(params))
|
||||
|
||||
// 添加附件
|
||||
if (
|
||||
this.formData.fileList &&
|
||||
this.formData.fileList.length > 0
|
||||
) {
|
||||
this.formData.fileList.forEach((file) => {
|
||||
if (file.raw) {
|
||||
formData.append('files', file.raw)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
addProblemFeedbackAPI(formData)
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$modal.msgSuccess('新增成功')
|
||||
this.handleCloseDialog()
|
||||
this.$refs.tableRef.getTableList()
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭弹框
|
||||
handleCloseDialog() {
|
||||
this.dialogConfig.outerVisible = false
|
||||
this.resetForm()
|
||||
},
|
||||
// 重置表单
|
||||
resetForm() {
|
||||
this.formData = {
|
||||
module: '',
|
||||
content: '',
|
||||
submitter: '',
|
||||
fileList: [],
|
||||
}
|
||||
if (this.$refs.formRef) {
|
||||
this.$refs.formRef.resetFields()
|
||||
}
|
||||
},
|
||||
|
||||
// 处理
|
||||
handleDeal(row) {
|
||||
this.dealFormData = {
|
||||
id: row.id,
|
||||
handler: '',
|
||||
remark: '',
|
||||
status: 1,
|
||||
}
|
||||
this.dealDialogConfig.outerVisible = true
|
||||
},
|
||||
// 提交处理表单
|
||||
handleDealSubmit() {
|
||||
this.$refs.dealFormRef.validate((valid) => {
|
||||
if (valid) {
|
||||
const params = {
|
||||
id: this.dealFormData.id,
|
||||
handler: this.dealFormData.handler,
|
||||
remark: this.dealFormData.remark,
|
||||
status: this.dealFormData.status,
|
||||
}
|
||||
handleProblemFeedbackAPI(params)
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$modal.msgSuccess('处理成功')
|
||||
this.handleCloseDealDialog()
|
||||
this.$refs.tableRef.getTableList()
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭处理弹框
|
||||
handleCloseDealDialog() {
|
||||
this.dealDialogConfig.outerVisible = false
|
||||
this.resetDealForm()
|
||||
},
|
||||
// 重置处理表单
|
||||
resetDealForm() {
|
||||
this.dealFormData = {
|
||||
id: '',
|
||||
handler: '',
|
||||
remark: '',
|
||||
}
|
||||
if (this.$refs.dealFormRef) {
|
||||
this.$refs.dealFormRef.resetFields()
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.dialog-footer-btn {
|
||||
text-align: right;
|
||||
padding-top: 20px;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue