147 lines
3.9 KiB
Vue
147 lines
3.9 KiB
Vue
|
<template>
|
||
|
<el-dialog v-model="dialogFormVisible" :title="title" width="500px">
|
||
|
<el-form
|
||
|
ref="form"
|
||
|
:model="form"
|
||
|
:rules="rules"
|
||
|
label-width="80px"
|
||
|
label-position="left"
|
||
|
>
|
||
|
<el-form-item label="反馈内容" prop="feedbackText">
|
||
|
<el-input v-model="form.feedbackText" type="textarea"></el-input>
|
||
|
</el-form-item>
|
||
|
<el-form-item label="反馈状态" prop="status">
|
||
|
<el-select v-model="form.status" filterable placeholder="状态">
|
||
|
<el-option
|
||
|
v-for="item in statusData"
|
||
|
:key="item.value"
|
||
|
:label="item.label"
|
||
|
:value="item.value"
|
||
|
></el-option>
|
||
|
</el-select>
|
||
|
</el-form-item>
|
||
|
<el-form-item label="反馈图片" prop="feedbackImg">
|
||
|
<el-upload
|
||
|
:action="updateAction"
|
||
|
list-type="picture-card"
|
||
|
:on-preview="handlePictureCardPreview"
|
||
|
:on-remove="handleRemove"
|
||
|
:on-success="fileSuccess"
|
||
|
:headers="headerData"
|
||
|
name="files"
|
||
|
>
|
||
|
<i class="el-icon-plus"></i>
|
||
|
</el-upload>
|
||
|
<el-dialog v-model="dialogVisible">
|
||
|
<img width="100%" :src="dialogImageUrl" alt="" />
|
||
|
</el-dialog>
|
||
|
</el-form-item>
|
||
|
</el-form>
|
||
|
<div class="dialog-footer">
|
||
|
<el-button type="primary" @click="save">确 定</el-button>
|
||
|
<el-button @click="close">取 消</el-button>
|
||
|
</div>
|
||
|
</el-dialog>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import { feedback } from '@/api/task';
|
||
|
import store from '@/store';
|
||
|
import { baseURL } from '@/config';
|
||
|
export default {
|
||
|
data() {
|
||
|
return {
|
||
|
form: {
|
||
|
id: '',
|
||
|
feedbackText: '',
|
||
|
feedbackImg: '',
|
||
|
status: '',
|
||
|
},
|
||
|
rules: {
|
||
|
feedbackText: [
|
||
|
{ required: true, trigger: 'blur', message: '请输入反馈内容' },
|
||
|
],
|
||
|
status: [
|
||
|
{ required: true, trigger: 'change', message: '请选择反馈状态' },
|
||
|
],
|
||
|
feedbackImg: [
|
||
|
{ required: true, trigger: 'blur', message: '请上传反馈图片' },
|
||
|
],
|
||
|
},
|
||
|
title: '',
|
||
|
dialogVisible: false,
|
||
|
dialogFormVisible: false,
|
||
|
deviceData: [],
|
||
|
handlersData: [],
|
||
|
dialogImageUrl: '',
|
||
|
updateAction: '',
|
||
|
headerData: '',
|
||
|
statusData: [
|
||
|
{
|
||
|
label: '未处理',
|
||
|
value: 0,
|
||
|
},
|
||
|
{
|
||
|
label: '已处理',
|
||
|
value: 1,
|
||
|
},
|
||
|
],
|
||
|
};
|
||
|
},
|
||
|
created() {},
|
||
|
methods: {
|
||
|
handleRemove(file, fileList) {
|
||
|
console.log(file, fileList);
|
||
|
},
|
||
|
handlePictureCardPreview(file) {
|
||
|
console.log(file);
|
||
|
this.dialogImageUrl = file.url;
|
||
|
this.dialogVisible = true;
|
||
|
},
|
||
|
feedbackIndex(row) {
|
||
|
this.title = '任务反馈';
|
||
|
this.form.id = row.id;
|
||
|
this.dialogFormVisible = true;
|
||
|
this.setUpdateData();
|
||
|
},
|
||
|
setUpdateData() {
|
||
|
this.updateAction = baseURL + '/file/uploadImg';
|
||
|
this.headerData = { token: store.getters['user/token'] };
|
||
|
},
|
||
|
fileSuccess(response, file, fileList) {
|
||
|
var img = this.form.feedbackImg;
|
||
|
if (img == '') {
|
||
|
this.form.feedbackImg = response.data;
|
||
|
} else {
|
||
|
this.form.feedbackImg = this.form.feedbackImg + ',' + response.data;
|
||
|
}
|
||
|
console.log(this.form);
|
||
|
},
|
||
|
close() {
|
||
|
this.$refs['form'].resetFields();
|
||
|
this.form = this.$options.data().form;
|
||
|
this.dialogFormVisible = false;
|
||
|
this.$emit('fetch-data');
|
||
|
},
|
||
|
save() {
|
||
|
this.$refs['form'].validate(async valid => {
|
||
|
if (valid) {
|
||
|
if (this.form.id) {
|
||
|
const { msg } = await feedback(this.form);
|
||
|
this.$notify({
|
||
|
title: msg,
|
||
|
type: 'success',
|
||
|
});
|
||
|
}
|
||
|
this.$refs['form'].resetFields();
|
||
|
this.dialogFormVisible = false;
|
||
|
this.$parent.fetchData();
|
||
|
} else {
|
||
|
return false;
|
||
|
}
|
||
|
});
|
||
|
},
|
||
|
},
|
||
|
};
|
||
|
</script>
|