153 lines
6.6 KiB
Vue
153 lines
6.6 KiB
Vue
<template>
|
||
<div class="rm-container">
|
||
<div class="current-project-bar">当前项目：{{ currentProjectName }}</div>
|
||
<div class="rm-panel">
|
||
<div class="rm-panel-header">
|
||
<span>💬 安装时出现的问题反馈</span>
|
||
<el-button size="small" type="primary" @click="handleAdd">+ 反馈问题</el-button>
|
||
</div>
|
||
<div class="rm-panel-body">
|
||
<el-table :data="list" v-loading="loading" stripe border highlight-current-row size="small">
|
||
<el-table-column type="index" label="#" width="45" />
|
||
<el-table-column prop="title" label="问题标题" min-width="160" />
|
||
<el-table-column prop="location" label="发生位置" width="120" />
|
||
<el-table-column prop="proposer" label="反馈人" width="80" />
|
||
<el-table-column prop="feedbackDate" label="反馈日期" width="100" align="center" />
|
||
<el-table-column label="处理状态" width="90" align="center">
|
||
<template slot-scope="s">
|
||
<el-tag :type="statusTag(s.row.status)" size="mini">{{ statusLabel(s.row.status) }}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" width="120">
|
||
<template slot-scope="s">
|
||
<el-button type="text" size="mini" @click="handleEdit(s.row)">处理</el-button>
|
||
<el-button type="text" size="mini" @click="handleDelete(s.row)">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
</div>
|
||
|
||
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="560px" append-to-body @closed="onClosed">
|
||
<el-form ref="form" :model="form" :rules="rules" label-width="0" size="small">
|
||
<div class="form-group"><label>问题标题</label><el-input v-model="form.title" /></div>
|
||
<div class="form-row">
|
||
<div class="form-group"><label>发生位置</label><el-input v-model="form.location" placeholder="如：主轧机底座安装" /></div>
|
||
<div class="form-group"><label>反馈人</label><el-input v-model="form.proposer" /></div>
|
||
</div>
|
||
<div class="form-group"><label>问题描述</label><el-input v-model="form.issueDesc" type="textarea" :rows="2" /></div>
|
||
<div class="form-group"><label>解决方案</label><el-input v-model="form.solution" type="textarea" :rows="2" /></div>
|
||
<div class="form-group"><label>防止再发措施</label><el-input v-model="form.preventAction" type="textarea" :rows="2" placeholder="防止同类问题再次发生的措施" /></div>
|
||
<div class="form-group"><label>处理状态</label>
|
||
<el-select v-model="form.status" style="width:100%;">
|
||
<el-option label="待处理" value="pending" />
|
||
<el-option label="处理中" value="processing" />
|
||
<el-option label="已解决" value="resolved" />
|
||
</el-select>
|
||
</div>
|
||
</el-form>
|
||
<div slot="footer">
|
||
<el-button size="small" @click="dialogVisible = false">取消</el-button>
|
||
<el-button size="small" type="primary" @click="save">保存</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { listInstallFeedbackAll, addInstallFeedback, updateInstallFeedback, delInstallFeedback } from '@/api/rm/installFeedback'
|
||
import { listProject } from '@/api/rm/project'
|
||
|
||
export default {
|
||
name: 'RmInstallFeedback',
|
||
data() {
|
||
return {
|
||
currentProjectName: this.$route.query.projectName || sessionStorage.getItem('rm_current_project_name') || '',
|
||
loading: false,
|
||
list: [],
|
||
currentProjectId: null,
|
||
dialogVisible: false,
|
||
dialogTitle: '',
|
||
form: { title: '', location: '', proposer: '', issueDesc: '', solution: '', preventAction: '', status: 'pending' },
|
||
rules: { title: [{ required: true, message: '请填写问题标题', trigger: 'blur' }] }
|
||
}
|
||
},
|
||
created() { this.loadCurrentProject() },
|
||
methods: {
|
||
statusTag(status) {
|
||
return { pending: 'warning', processing: 'primary', resolved: 'success' }[status] || ''
|
||
},
|
||
statusLabel(status) {
|
||
return { pending: '待处理', processing: '处理中', resolved: '已解决' }[status] || status
|
||
},
|
||
loadCurrentProject() {
|
||
const pid = this.$route.query.projectId || sessionStorage.getItem('rm_current_project_id')
|
||
if (pid) {
|
||
this.currentProjectId = pid
|
||
this.loadData()
|
||
} else {
|
||
listProject({ pageNum: 1, pageSize: 1 }).then(res => {
|
||
const rows = res.rows || []
|
||
if (rows.length > 0) { this.currentProjectId = rows[0].projectId; this.loadData() }
|
||
})
|
||
}
|
||
},
|
||
loadData() {
|
||
if (!this.currentProjectId) return
|
||
this.loading = true
|
||
listInstallFeedbackAll({ projectId: this.currentProjectId }).then(res => {
|
||
this.list = res.data || []
|
||
}).finally(() => { this.loading = false })
|
||
},
|
||
handleAdd() {
|
||
this.dialogTitle = '反馈问题'
|
||
this.form = { title: '', location: '', proposer: '', issueDesc: '', solution: '', preventAction: '', status: 'pending' }
|
||
this.dialogVisible = true
|
||
},
|
||
handleEdit(row) {
|
||
this.dialogTitle = '处理问题反馈'
|
||
this.form = {
|
||
feedbackId: row.feedbackId,
|
||
title: row.title,
|
||
location: row.location,
|
||
proposer: row.proposer,
|
||
issueDesc: row.issueDesc,
|
||
solution: row.solution,
|
||
preventAction: row.preventAction,
|
||
status: row.status
|
||
}
|
||
this.dialogVisible = true
|
||
},
|
||
save() {
|
||
this.$refs.form.validate(valid => {
|
||
if (!valid) return
|
||
const data = { ...this.form, projectId: this.currentProjectId }
|
||
const action = data.feedbackId ? updateInstallFeedback(data) : addInstallFeedback(data)
|
||
action.then(() => {
|
||
this.$message.success('已保存')
|
||
this.dialogVisible = false
|
||
this.loadData()
|
||
})
|
||
})
|
||
},
|
||
handleDelete(row) {
|
||
this.$confirm('确认删除？', '提示', { type: 'warning' }).then(() => {
|
||
delInstallFeedback(row.feedbackId).then(() => { this.loadData() })
|
||
}).catch(() => {})
|
||
},
|
||
onClosed() { this.$refs.form?.clearValidate() }
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.rm-container { padding: 8px; }
|
||
.rm-panel { background: #fff; border: 1px solid #d0d7de; border-radius: 8px; overflow: hidden; }
|
||
.rm-panel-header { padding: 8px 12px; font-size: 14px; font-weight: 600; border-bottom: 1px solid #d0d7de; display: flex; align-items: center; justify-content: space-between; }
|
||
.rm-panel-body { padding: 12px; }
|
||
.form-group { margin-bottom: 6px; }
|
||
.form-group label { display: block; font-size: 12px; color: #555; margin-bottom: 3px; font-weight: 500; }
|
||
.form-row { display: flex; gap: 10px; }
|
||
.form-row .form-group { flex: 1; }
|
||
</style>
|