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.
437 lines
17 KiB
437 lines
17 KiB
<template> |
|
<basic-container> |
|
<avue-crud :option="option" :search.sync="searchForm" :table-loading="loading" :data="data" ref="crud" |
|
v-model="form" :permission="permissionList" @row-del="rowDel" @row-update="rowUpdate" @row-save="rowSave" |
|
:before-open="beforeOpen" :page.sync="page" @search-change="searchChange" @search-reset="searchReset" |
|
@selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange" |
|
@refresh-change="refreshChange" @on-load="onLoad"> |
|
<template slot-scope="{ row }" slot="status"> |
|
<el-tag :type="row.status == 0 ? 'warning' : row.status == 1 ? 'info' : 'success'"> |
|
{{row.status == 0 ? '待反馈' : row.status == 1 ? '已完成' : '已保存' }} |
|
</el-tag> |
|
</template> |
|
<template slot-scope="{ type, disabled }" slot="statusForm"> |
|
<div v-show="type == 'view' || type == 'edit'"> |
|
<el-tag :type="form.status == 0 ? 'warning' : 'info'"> |
|
{{form.status == 0 ? '待反馈' : form.status == 1 ? '已完成' : '' }} |
|
</el-tag> |
|
</div> |
|
</template> |
|
<template slot-scope="scope" slot="menuLeft"> |
|
<el-button type="primary" size="small" @click="handleAdd">反 馈</el-button> |
|
</template> |
|
<template slot-scope="{ row }" slot="menu"> |
|
<el-button @click="handleView(row)">查看</el-button> |
|
<el-button :disabled="row.status != 0" @click="handleBack(row)">反馈</el-button> |
|
</template> |
|
</avue-crud> |
|
<el-dialog :close-on-click-modal="false" title="意见反馈" :visible.sync="dialogReceive" :append-to-body="true" width="70%" class="proRecive" @close="closeDialog"> |
|
<el-form ref="receiveForm" :model="receiveForm" :rules="reciveRules" label-width="80px" |
|
label-position="left"> |
|
<div> |
|
<div style="color: #101010;font-size: 20px;font-weight: 550;margin-bottom: 20px;">基本信息</div> |
|
<el-form-item label="提报单位" prop="unitName"> |
|
<el-input style="width: 95%;" v-model="receiveForm.unitName" disabled placeholder="请输入提报单位"></el-input> |
|
</el-form-item> |
|
<el-form-item label="反馈类型" prop="type"> |
|
<el-select style="width: 95%;" v-model="receiveForm.type" disabled placeholder="请选择反馈类型"> |
|
<el-option v-for="item in typeList" :key="item.id" :label="item.dictValue" :value="item.dictKey"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
<el-form-item label="描述" prop="describes"> |
|
<el-input disabled style="width: 95%;" placeholder="请输入描述" type="textarea" v-model="receiveForm.describes"></el-input> |
|
</el-form-item> |
|
<el-form-item label="联系人" prop="feedUser"> |
|
<el-input disabled style="width: 95%;" placeholder="请输入联系人" v-model="receiveForm.feedUser"></el-input> |
|
</el-form-item> |
|
<el-form-item label="联系方式" prop="phone"> |
|
<el-input disabled style="width: 95%;" placeholder="请输入联系方式" v-model="receiveForm.phone"></el-input> |
|
</el-form-item> |
|
</div> |
|
<div> |
|
<div style="color: #101010;font-size: 20px;font-weight: 550;margin-bottom: 20px;">反馈结果</div> |
|
<el-form-item label="是否反馈" prop="status" v-if="viewType == 'view'"> |
|
<el-select :disabled="viewType == 'view'" placeholder="请选择反馈结果" v-model="receiveForm.status" style="width: 95%;"> |
|
<el-option label="待反馈" :value="0"></el-option> |
|
<el-option label="已完成" :value="1"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
<el-form-item label="反馈内容" prop="content" style="width: 95%;" v-if="(receiveForm.status==0&&viewType !== 'view')||(viewType == 'view'&&receiveForm.status==1)"> |
|
<el-input type="textarea" :disabled="viewType == 'view'" v-model="receiveForm.content" placeholder="请输入反馈内容"></el-input> |
|
</el-form-item> |
|
<el-form-item label="反馈附件" prop="file" style="width: 95%;" v-if="(receiveForm.status==0&&viewType !== 'view')||(viewType == 'view'&&receiveForm.status==1)"> |
|
<el-upload |
|
action="/api/blade-resource/oss/endpoint/put-file" |
|
:limit="3" |
|
list-type="picture-card" |
|
:on-success="handleSuccess" |
|
:on-remove="handleRemove" |
|
accept=".png,.jpg" |
|
:file-list="imgList" |
|
:headers="headers" |
|
:disabled="viewType == 'view'" |
|
:class="{ 'hide-upload-btn': viewType == 'view' }"> |
|
<i class="el-icon-plus" ></i> |
|
</el-upload> |
|
</el-form-item> |
|
</div> |
|
</el-form> |
|
<span slot="footer" class="dialog-footer"> |
|
<el-button v-show="viewType == 'view'" @click="closeRceive">关 闭</el-button> |
|
<el-button v-show="viewType != 'view'" @click="rejectRceive">保 存</el-button> |
|
<el-button v-show="viewType != 'view'" type="primary" @click="handleRceive">提 交</el-button> |
|
</span> |
|
</el-dialog> |
|
</basic-container> |
|
|
|
</template> |
|
|
|
<script> |
|
import website from '@/config/website'; |
|
import { getToken, removeToken, removeRefreshToken } from '@/util/auth'; |
|
import {getFeedList,getDetail,updateFeedback,saveFeedback} from '@/api/feedback/feedback' |
|
import {getChildList} from '@/api/system/dictbiz' |
|
export default { |
|
data() { |
|
return { |
|
typeList:[], |
|
searchForm:{}, |
|
treeOption: { |
|
nodeKey: 'id', |
|
// lazy: true, |
|
// treeLoad: function (node, resolve) { |
|
// const parentId = (node.level === 0) ? 0 : node.data.id; |
|
// getDeptLazyTree(parentId).then(res => { |
|
// resolve(res.data.data.map(item => { |
|
// return { |
|
// ...item, |
|
// leaf: !item.hasChildren |
|
// } |
|
// })) |
|
// }); |
|
// }, |
|
addBtn: false, |
|
menu: false, |
|
size: 'small', |
|
props: { |
|
labelText: '标题', |
|
label: 'title', |
|
value: 'value', |
|
children: 'children' |
|
} |
|
}, |
|
headers:{}, |
|
option: { |
|
height: 'auto', |
|
calcHeight: 80, |
|
tip: false, |
|
searchShow: true, |
|
searchMenuSpan: 6, |
|
border: true, |
|
index: true, |
|
selection: true, |
|
addBtn: false, |
|
viewBtn: false, |
|
editBtn: false, |
|
delBtn: false, |
|
dialogType: 'dialog', |
|
dialogClickModal: false, |
|
searchShowBtn: false, |
|
refreshBtn: false, |
|
columnBtn: false, |
|
menuWidth: 240, |
|
searchEnter:true, |
|
gridBtn:false, |
|
column: [ |
|
{ |
|
label: "意见单号", |
|
labelWidth: 120, |
|
prop: "code", |
|
overHidden: true, |
|
}, |
|
{ |
|
label: "提报单位", |
|
labelWidth: 120, |
|
prop: "unitName", |
|
overHidden: true, |
|
}, |
|
{ |
|
label: "反馈类型", |
|
labelWidth: 120, |
|
prop: "typeName", |
|
overHidden: true, |
|
}, |
|
{ |
|
label: "反馈类型", |
|
labelWidth: 120, |
|
prop: "feedbackType", |
|
hide: true, |
|
type: "select", |
|
props: { |
|
label: "dictValue", |
|
value: "dictKey", |
|
}, |
|
search:true, |
|
dicUrl: '/api/blade-system/dict-biz/child-list?current=1&size=100&parentId=1850021405049475074', |
|
}, |
|
{ |
|
label: "描述", |
|
labelWidth: 120, |
|
prop: "describes", |
|
overHidden:true, |
|
}, |
|
{ |
|
label: "提交时间", |
|
labelWidth: 120, |
|
type: 'datetime', |
|
format:'yyyy-MM-dd HH:mm:ss', |
|
valueFormat:'yyyy-MM-dd HH:mm:ss', |
|
prop: "createTime", |
|
overHidden: true, |
|
}, |
|
{ |
|
label: "状态", |
|
labelWidth: 120, |
|
prop: "status", //0-待反馈 1-已完成 |
|
slot:true, |
|
overHidden: true, |
|
formslot:true |
|
}, |
|
{ |
|
label: "完成时间", |
|
labelWidth: 120, |
|
type: 'datetime', |
|
format:'yyyy-MM-dd HH:mm:ss', |
|
valueFormat:'yyyy-MM-dd HH:mm:ss', |
|
prop: "finishTime", |
|
overHidden: true, |
|
}, |
|
], |
|
}, |
|
data: [], |
|
page: { |
|
pageSize: 10, |
|
currentPage: 1, |
|
total: 0, |
|
}, |
|
selectedList: [], |
|
dialogVisible: false, |
|
tableData: [], |
|
dialogReceive: false, |
|
receiveForm: { |
|
tableData: [] |
|
}, |
|
reciveRules: { |
|
// status: { required: true, message: '请选择是否反馈', trigger: 'blur' }, |
|
content: { required: true, message: '请输入反馈内容', trigger: 'blur' }, |
|
}, |
|
isShowTips: false, |
|
viewType:'', |
|
imgList:[], |
|
filesList:[] |
|
} |
|
}, |
|
created() { |
|
this.headers = { |
|
"Authorization": `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`, |
|
'Blade-Auth': 'bearer ' + getToken(), |
|
'Blade-Requested-With': 'BladeHttpRequest' |
|
} |
|
getChildList(1,100,'1850021405049475074').then(res =>{ |
|
this.typeList = res.data.data |
|
}) |
|
}, |
|
methods: { |
|
beforeOpen(done, type) { |
|
done(); |
|
}, |
|
|
|
beforeClose(done) { |
|
done(); |
|
}, |
|
rowUpdate(row,index,done,loading){ |
|
this.$message.success('修改成功') |
|
done() |
|
}, |
|
searchReset(params, done) { |
|
this.query = params; |
|
this.onLoad(this.page); |
|
}, |
|
searchChange(params, done) { |
|
this.query = params; |
|
this.page.currentPage = 1; |
|
this.onLoad(this.page, params); |
|
done(); |
|
}, |
|
refreshChange() { |
|
this.onLoad(this.page, this.query); |
|
}, |
|
selectionChange(list) { |
|
this.selectedList = list |
|
}, |
|
handleSuccess(res){ |
|
this.filesList.push({ |
|
attachUrl:res.data.link, |
|
attachName:res.data.originalName |
|
}) |
|
}, |
|
handleRemove(file, fileList){ |
|
if(file.response){ |
|
this.filesList = this.filesList.filter(item => item.attachUrl != file.response.data.link) |
|
} |
|
}, |
|
// 点击外部提交按钮 |
|
handleAdd() { |
|
if (this.selectedList.length == 0 || this.selectedList > 1) { |
|
this.$message.warning('请选择一条数据') |
|
} else { |
|
if(this.selectedList.find(item => item.status == 1)){ |
|
this.$message.warning('请选择状态为待反馈的数据') |
|
}else{ |
|
getDetail({id:this.selectedList[0].id}).then(res =>{ |
|
this.viewType = 'back' |
|
this.receiveForm = res.data.data |
|
this.dialogReceive = true |
|
}) |
|
|
|
} |
|
|
|
} |
|
}, |
|
closeDialog(){ |
|
this.imgList = [] |
|
this.filesList = [] |
|
this.receiveForm = {} |
|
}, |
|
// 点击行内反馈按钮 |
|
handleBack(row){ |
|
getDetail({id:row.id}).then(res =>{ |
|
this.viewType = 'back' |
|
this.receiveForm = res.data.data |
|
this.dialogReceive = true |
|
}) |
|
}, |
|
// 查看 |
|
handleView(row){ |
|
getDetail({id:row.id}).then(res =>{ |
|
this.receiveForm = res.data.data |
|
this.imgList = [] |
|
this.filesList = [] |
|
res.data.data.attach.map(item =>{ |
|
this.imgList.push({ |
|
url:item.attachUrl, |
|
name:item.attachName |
|
}) |
|
this.filesList.push({ |
|
url:item.attachUrl, |
|
name:item.attachName |
|
}) |
|
}) |
|
setTimeout(() =>{ |
|
this.viewType = 'view', |
|
this.dialogReceive = true |
|
},200) |
|
}) |
|
}, |
|
// 点击取消按钮 |
|
handleCancel() { |
|
this.dialogVisible = false |
|
this.tableData = [] |
|
}, |
|
// 点击确认按钮 |
|
handleSave() { |
|
this.dialogVisible = false |
|
}, |
|
// 点击申领单确认按钮 |
|
handleRceive() { |
|
this.$refs['receiveForm'].validate(valid =>{ |
|
if(valid){ |
|
let query = { |
|
id:this.receiveForm.id, |
|
content:this.receiveForm.content, |
|
attach:this.filesList |
|
} |
|
updateFeedback(query).then(res =>{ |
|
if(res.data.code == 200){ |
|
this.$message.success('反馈成功') |
|
this.dialogReceive = false |
|
this.onLoad() |
|
} |
|
}) |
|
} |
|
}) |
|
|
|
}, |
|
// 点击保存 |
|
rejectRceive() { |
|
this.$confirm('请确认是否保存该条反馈数据?', '提示', { |
|
confirmButtonText: '确定', |
|
cancelButtonText: '取消', |
|
type: 'warning' |
|
}).then(() => { |
|
this.$refs['receiveForm'].validate(valid => { |
|
if (valid) { |
|
let query = { |
|
id:this.receiveForm.id, |
|
status: this.receiveForm.status, |
|
content:this.receiveForm.content |
|
} |
|
saveFeedback(query).then(res =>{ |
|
this.$message.success('保存成功') |
|
this.dialogReceive = false |
|
this.onLoad() |
|
}) |
|
} |
|
}) |
|
// this.$message.success('保存成功') |
|
// this.dialogReceive = false |
|
// this.viewType = '' |
|
}) |
|
}, |
|
// 点击申领审核关闭按钮 |
|
closeRceive(){ |
|
this.dialogReceive = false |
|
}, |
|
onLoad(page, params = {}) { |
|
let query = { |
|
type:this.searchForm.feedbackType ? this.searchForm.feedbackType : null, |
|
current:this.page.currentPage, |
|
size:this.page.pageSize, |
|
} |
|
getFeedList(query).then(res =>{ |
|
this.data = res.data.data.records |
|
this.page.total = res.data.data.total |
|
}) |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss" scoped></style> |
|
|
|
<style lang="scss"> |
|
.proRecive { |
|
.input_number { |
|
.el-input__inner { |
|
color: red; |
|
} |
|
} |
|
|
|
.error_tips { |
|
width: 180px; |
|
height: 30px; |
|
background: rgba(222, 134, 143, 0.43); |
|
margin-bottom: 30px; |
|
margin-left: 71.8%; |
|
margin-top: 5px; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
} |
|
} |
|
</style> |
|
<style> |
|
.hide-upload-btn .el-upload--picture-card { |
|
display: none; |
|
} |
|
</style>
|
|
|