推送项目重构代码
This commit is contained in:
177
ruoyi-ui/src/views/system/feedback/index.vue
Normal file
177
ruoyi-ui/src/views/system/feedback/index.vue
Normal file
@@ -0,0 +1,177 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-tabs v-model="statusTab" @tab-click="onStatusTab" class="compact-tabs">
|
||||
<el-tab-pane name="pending">
|
||||
<span slot="label" :style="stat.pending > 0 ? 'color:#e6a23c;' : ''">
|
||||
待处理 ({{ stat.pending }})
|
||||
</span>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="`已受理 (${stat.accepted})`" name="accepted" />
|
||||
<el-tab-pane :label="`已完成 (${stat.finished})`" name="finished" />
|
||||
<el-tab-pane label="已关闭" name="closed" />
|
||||
<el-tab-pane label="全部" name="all" />
|
||||
</el-tabs>
|
||||
|
||||
<el-form :model="queryParams" size="mini" :inline="true" v-show="showSearch"
|
||||
label-width="60px" class="compact-search">
|
||||
<el-form-item label="标题" prop="title">
|
||||
<el-input v-model="queryParams.title" placeholder="模糊匹配" clearable style="width: 180px"
|
||||
@keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="类型" prop="category">
|
||||
<el-select v-model="queryParams.category" clearable style="width: 110px">
|
||||
<el-option label="Bug" value="bug" />
|
||||
<el-option label="新功能" value="feature" />
|
||||
<el-option label="其他" value="other" />
|
||||
</el-select>
|
||||
</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>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" />
|
||||
|
||||
<el-table v-loading="loading" :data="list" stripe size="small">
|
||||
<el-table-column type="expand" width="36">
|
||||
<template slot-scope="{ row }">
|
||||
<div style="padding:8px 24px; background:#fafafa;">
|
||||
<p style="white-space: pre-wrap; margin:0 0 8px; color:#303133;">{{ row.content }}</p>
|
||||
<div style="font-size:11px; color:#909399;">
|
||||
<span v-if="row.pagePath">页面：<code>{{ row.pagePath }}</code> </span>
|
||||
<span v-if="row.acceptRemark">处理备注：{{ row.acceptRemark }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="提交人" prop="submitterName" width="90" />
|
||||
<el-table-column label="类型" width="80" align="center">
|
||||
<template slot-scope="{ row }">
|
||||
<el-tag size="mini" :type="catTag(row.category)">{{ catLabel(row.category) }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="优先级" width="80" align="center">
|
||||
<template slot-scope="{ row }">
|
||||
<el-tag size="mini" :type="priTag(row.priority)">{{ priLabel(row.priority) }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="标题" prop="title" min-width="200" show-overflow-tooltip />
|
||||
<el-table-column label="状态" width="90" align="center">
|
||||
<template slot-scope="{ row }">
|
||||
<el-tag size="mini" :type="statusTag(row.status)">{{ statusLabel(row.status) }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="提交时间" prop="createTime" width="160">
|
||||
<template slot-scope="{ row }">{{ parseTime(row.createTime, '{y}-{m}-{d} {h}:{i}') }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="处理人" prop="handlerName" width="90" />
|
||||
<el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width" v-if="isIt">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button v-if="row.status === 0" type="text" size="mini" @click="onAccept(row)">受理</el-button>
|
||||
<el-button v-if="row.status === 1" type="text" size="mini" style="color:#67c23a"
|
||||
@click="onFinish(row)">完成</el-button>
|
||||
<el-button v-if="row.status !== 3 && row.status !== 2" type="text" size="mini"
|
||||
style="color:#f56c6c" @click="onClose(row)">关闭</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total > 0" :total="total"
|
||||
:page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { acceptSuggestion as acceptFeedback, closeSuggestion as closeFeedback,
|
||||
finishSuggestion as finishFeedback, isItMember, listSuggestion as listFeedback } from '@/api/oa/suggestion'
|
||||
|
||||
const CAT = { bug: ['Bug', 'danger'], feature: ['新功能', 'success'], other: ['其他', 'info'] }
|
||||
const PRI = { 1: ['高', 'danger'], 2: ['中', 'warning'], 3: ['低', 'info'] }
|
||||
const STATUS = { 0: ['待处理', 'warning'], 1: ['已受理', 'primary'], 2: ['已完成', 'success'], 3: ['已关闭', 'info'] }
|
||||
|
||||
export default {
|
||||
name: 'FeedbackManagement',
|
||||
data () {
|
||||
return {
|
||||
loading: false,
|
||||
showSearch: true,
|
||||
isIt: false,
|
||||
total: 0,
|
||||
statusTab: 'pending',
|
||||
stat: { pending: 0, accepted: 0, finished: 0 },
|
||||
list: [],
|
||||
queryParams: { pageNum: 1, pageSize: 30, status: 0, title: undefined, category: undefined }
|
||||
}
|
||||
},
|
||||
created () {
|
||||
isItMember().then(res => { this.isIt = !!(res && res.data) })
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
catLabel (c) { return (CAT[c] || [c])[0] },
|
||||
catTag (c) { return (CAT[c] || [])[1] || 'info' },
|
||||
priLabel (p) { return (PRI[p] || [p])[0] },
|
||||
priTag (p) { return (PRI[p] || [])[1] || 'info' },
|
||||
statusLabel (s) { return (STATUS[s] || [s])[0] },
|
||||
statusTag (s) { return (STATUS[s] || [])[1] || 'info' },
|
||||
onStatusTab () {
|
||||
const map = { pending: 0, accepted: 1, finished: 2, closed: 3, all: undefined }
|
||||
this.queryParams.status = map[this.statusTab]
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
handleQuery () { this.queryParams.pageNum = 1; this.getList() },
|
||||
resetQuery () {
|
||||
this.queryParams = { pageNum: 1, pageSize: 30, status: this.queryParams.status }
|
||||
this.getList()
|
||||
},
|
||||
getList () {
|
||||
this.loading = true
|
||||
listFeedback(this.queryParams).then(res => {
|
||||
this.list = res.rows || []
|
||||
this.total = res.total || 0
|
||||
}).finally(() => { this.loading = false })
|
||||
this.refreshStat()
|
||||
},
|
||||
refreshStat () {
|
||||
const base = { pageNum: 1, pageSize: 1 }
|
||||
Promise.all([
|
||||
listFeedback({ ...base, status: 0 }).catch(() => ({ total: 0 })),
|
||||
listFeedback({ ...base, status: 1 }).catch(() => ({ total: 0 })),
|
||||
listFeedback({ ...base, status: 2 }).catch(() => ({ total: 0 }))
|
||||
]).then(([p, a, f]) => {
|
||||
this.stat.pending = p.total || 0
|
||||
this.stat.accepted = a.total || 0
|
||||
this.stat.finished = f.total || 0
|
||||
})
|
||||
},
|
||||
onAccept (row) {
|
||||
this.$prompt('受理备注（可空）', '受理', { confirmButtonText: '确定受理',
|
||||
cancelButtonText: '取消', inputType: 'textarea' }).then(({ value }) => {
|
||||
acceptFeedback(row.feedbackId, value || '').then(() => {
|
||||
this.$modal.msgSuccess('已受理，已通知提出者')
|
||||
this.getList()
|
||||
})
|
||||
}).catch(() => {})
|
||||
},
|
||||
onFinish (row) {
|
||||
this.$prompt('完成说明（可空）', '完成', { confirmButtonText: '标记完成',
|
||||
cancelButtonText: '取消', inputType: 'textarea' }).then(({ value }) => {
|
||||
finishFeedback(row.feedbackId, value || '').then(() => {
|
||||
this.$modal.msgSuccess('已完成，已通知提出者')
|
||||
this.getList()
|
||||
})
|
||||
}).catch(() => {})
|
||||
},
|
||||
onClose (row) {
|
||||
this.$confirm('关闭后将不再处理，确认？', '关闭确认', { type: 'warning' }).then(() => {
|
||||
closeFeedback(row.feedbackId, '').then(() => {
|
||||
this.$modal.msgSuccess('已关闭')
|
||||
this.getList()
|
||||
})
|
||||
}).catch(() => {})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user