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.
306 lines
12 KiB
306 lines
12 KiB
<!--
|
|
* @Author: yanLu xgktv007@163.com
|
|
* @Date: 2023-09-05 10:21:34
|
|
* @LastEditors: mk 2403457699@qq.com
|
|
* @LastEditTime: 2023-09-18 17:16:40
|
|
* @Description: 事件转办表单
|
|
*
|
|
-->
|
|
<template>
|
|
<div class="search">
|
|
<el-form ref="ref_form2" :inline="false" :model="formData" :rules="dataRule">
|
|
<el-form-item label="办理情况" label-width="118px" :class="{ 'form-item': source === 'visiual' }"
|
|
prop="content">
|
|
<div :class="{ 'visiual-form': source === 'visiual' }">
|
|
<el-input type="textarea" class="cell-width-area" :rows="2" placeholder="请输入回访意见"
|
|
v-model.trim="formData.content">
|
|
</el-input>
|
|
</div>
|
|
</el-form-item>
|
|
<el-form-item label="上传录音" label-width="118px" :class="{ 'form-item': source === 'visiual' }" prop="luyin">
|
|
<el-upload :headers="$getElUploadHeaders()" class="avatar-uploader" :action="uploadUlr"
|
|
:data="{ customerId: customerId }" :show-file-list="true" :on-success="handleAudioSuccess"
|
|
:on-remove="handleAudioRemove" :before-upload="beforeAudioUpload" accept=".mp3">
|
|
<el-button type="primary">上传录音<i class="el-icon-upload el-icon--right"></i></el-button>
|
|
</el-upload>
|
|
</el-form-item>
|
|
<el-form-item label="上传图片" label-width="118px" :class="{ 'form-item': source === 'visiual' }"
|
|
prop="internalFile">
|
|
<el-upload :headers="$getElUploadHeaders()" class="avatar-uploader" :action="uploadUlr"
|
|
:data="{ customerId: customerId }" :show-file-list="true" :on-success="handleImgSuccess"
|
|
:on-remove="handleImgRemove" :before-upload="beforeImgUpload" accept=".jpg,.png,.jpeg">
|
|
<el-button type="primary">上传图片<i class="el-icon-upload el-icon--right"></i></el-button>
|
|
</el-upload>
|
|
</el-form-item>
|
|
|
|
<el-divider></el-divider>
|
|
<div class="flex">
|
|
<div class="item">
|
|
<el-form-item label="答复人" label-width="118px" :class="{ 'form-item': source === 'visiual' }"
|
|
prop="respondent">
|
|
<div :class="{ 'visiual-form': source === 'visiual' }">
|
|
<el-input type="input" class="item_width_4" :rows="2" placeholder="请输入答复人"
|
|
v-model.trim="formData.respondent">
|
|
</el-input>
|
|
</div>
|
|
</el-form-item>
|
|
</div>
|
|
<div class="item">
|
|
<el-form-item label="答复电话" label-width="118px" :class="{ 'form-item': source === 'visiual' }"
|
|
prop="respondentPhone">
|
|
<div :class="{ 'visiual-form': source === 'visiual' }">
|
|
<el-input type="input" class="item_width_4" :rows="2" placeholder="请输入答复电话"
|
|
v-model.trim="formData.respondentPhone">
|
|
</el-input>
|
|
</div>
|
|
</el-form-item>
|
|
</div>
|
|
<div class="item">
|
|
<el-form-item label="联系人" label-width="118px" :class="{ 'form-item': source === 'visiual' }"
|
|
prop="contacts">
|
|
<div :class="{ 'visiual-form': source === 'visiual' }">
|
|
<el-input type="input" class="item_width_4" :rows="2" placeholder="请输入联系人"
|
|
v-model.trim="formData.contacts">
|
|
</el-input>
|
|
</div>
|
|
</el-form-item>
|
|
</div>
|
|
<div class="item">
|
|
<el-form-item label="联系电话" label-width="118px" :class="{ 'form-item': source === 'visiual' }"
|
|
prop="contactsPhone">
|
|
<div :class="{ 'visiual-form': source === 'visiual' }">
|
|
<el-input type="input" class="item_width_4" :rows="2" placeholder="请输入联系电话"
|
|
v-model.trim="formData.contactsPhone">
|
|
</el-input>
|
|
</div>
|
|
</el-form-item>
|
|
</div>
|
|
<div class="item">
|
|
<el-form-item label-width="118px" label="填报不合规诉求">
|
|
<el-select v-model.trim="formData.irregularity" clearable class="item_width_4">
|
|
<el-option v-for="item in binaryOptionListReverse" :key="item.value" :label="item.label"
|
|
:value="item.value">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</div>
|
|
<!-- <div class="item" v-if="formData.irregularity === 0">
|
|
<el-form-item label-width="118px" label="不合规诉求类型">
|
|
<el-select v-model.trim="formData.irregularity" clearable class="item_width_4">
|
|
<el-option v-for="item in nonComplianceType" :key="item.value" :label="item.label"
|
|
:value="item.value">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</div> -->
|
|
<div class="item">
|
|
<el-form-item label="办理真实度" label-width="118px" :class="{ 'form-item': source === 'visiual' }">
|
|
<el-select v-model.trim="formData.verified" clearable class="item_width_4">
|
|
<el-option v-for="item in selectList" :key="item.value" :label="item.label"
|
|
:value="item.value">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</div>
|
|
</div>
|
|
</el-form>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { Loading } from "element-ui"; // 引入Loading服务
|
|
import { requestPost } from "@/js/dai/request";
|
|
import { binaryOptionListReverse, nonComplianceType } from "@/js/columns/constants";
|
|
let loading; // 加载动画
|
|
export default {
|
|
data() {
|
|
return {
|
|
customerId: localStorage.getItem("customerId"),
|
|
binaryOptionListReverse,
|
|
nonComplianceType,
|
|
formData: {
|
|
operationType: "10", //处理方式[11已办结,10办理中,9联系当事人]
|
|
content: '',//办理情况
|
|
respondent: '',//答复人
|
|
respondentPhone: '',//答复人电话
|
|
contacts: '',//联系人
|
|
contactsPhone: '',//联系人电话
|
|
irregularity: '',//填报不合规诉求 0：是 1：否
|
|
//不合规诉求类型
|
|
verified: '', //办理真实度是否属实 0：属实 1：不属实
|
|
},
|
|
status: false,
|
|
okflag: false,
|
|
casOptions: [],
|
|
fileList: [],
|
|
uploadUlr: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadvariedfile",
|
|
|
|
dataRule: {
|
|
content: [
|
|
{ required: true, message: "办理情况不能为空", trigger: "blur" },
|
|
],
|
|
},
|
|
selectList: [{ label: '属实', value: 1 }, { label: '不属实', value: 0 }],
|
|
imgList: [],
|
|
audioList: []
|
|
};
|
|
},
|
|
components: {},
|
|
computed: {},
|
|
props: {
|
|
eventId: {
|
|
type: String,
|
|
default: "",
|
|
},
|
|
eventDetailData: {
|
|
type: Object,
|
|
default() {
|
|
return {};
|
|
},
|
|
},
|
|
source: {
|
|
//展示来源：manage 管理平台 visiual 可视化平台
|
|
type: String,
|
|
default: "manage",
|
|
},
|
|
},
|
|
created() {
|
|
|
|
},
|
|
async mounted() {
|
|
const { user } = this.$store.state;
|
|
this.agencyId = user.agencyId;
|
|
},
|
|
methods: {
|
|
async getReplayInfo() {
|
|
this.okflag = false;
|
|
this.$refs["ref_form2"].validate((valid, messageObj) => {
|
|
if (!valid) {
|
|
app.util.validateRule(messageObj);
|
|
} else {
|
|
this.okflag = true;
|
|
}
|
|
});
|
|
},
|
|
beforeImgUpload(file) {
|
|
const isLt1M = file.size / 1024 / 1024 < 10;
|
|
|
|
if (!isLt1M) {
|
|
this.$message.error("上传文件大小不能超过 10MB!");
|
|
}
|
|
return isLt1M;
|
|
},
|
|
handleImgSuccess(res, file, fileList) {
|
|
console.log("res.data.url", file);
|
|
if (res.code === 0 && res.msg === "success") {
|
|
console.log("res.data.url", res.data.url);
|
|
this.imgList.push({
|
|
attachmentFormat: file.name.split(".").pop(),
|
|
attachmentName: file.name,
|
|
size: file.size,
|
|
attachmentType: file.raw.type,
|
|
attachmentUrl: res.data.url,
|
|
});
|
|
console.log(this.imgList);
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
},
|
|
|
|
handleImgRemove(file) {
|
|
let index = this.imgList.findIndex(
|
|
(item) => item.url == file.response.data.url
|
|
);
|
|
this.imgList.splice(index, 1);
|
|
console.log(this.imgList);
|
|
},
|
|
beforeAudioUpload(file) {
|
|
const isLt1M = file.size / 1024 / 1024 < 10;
|
|
if (!isLt1M) {
|
|
this.$message.error("上传文件大小不能超过 10MB!");
|
|
}
|
|
return isLt1M;
|
|
},
|
|
handleAudioSuccess(res, file, fileList) {
|
|
console.log("res.data.url", file);
|
|
if (res.code === 0 && res.msg === "success") {
|
|
console.log("res.data.url", res.data.url);
|
|
this.audioList.push({
|
|
attachmentFormat: file.name.split(".").pop(),
|
|
attachmentName: file.name,
|
|
size: file.size,
|
|
attachmentType: file.raw.type,
|
|
attachmentUrl: res.data.url,
|
|
});
|
|
console.log(this.audioList);
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
},
|
|
|
|
handleAudioRemove(file) {
|
|
let index = this.audioList.findIndex(
|
|
(item) => item.url == file.response.data.url
|
|
);
|
|
this.audioList.splice(index, 1);
|
|
console.log(this.formData.files);
|
|
},
|
|
beforeImgUpload(file) {
|
|
const isLt1M = file.size / 1024 / 1024 < 10;
|
|
|
|
if (!isLt1M) {
|
|
this.$message.error("上传文件大小不能超过 10MB!");
|
|
}
|
|
return isLt1M;
|
|
},
|
|
handleImgSuccess(res, file, fileList) {
|
|
console.log("res.data.url", file);
|
|
if (res.code === 0 && res.msg === "success") {
|
|
console.log("res.data.url", res.data.url);
|
|
this.imgList.push({
|
|
attachmentFormat: file.name.split(".").pop(),
|
|
attachmentName: file.name,
|
|
size: file.size,
|
|
attachmentType: file.raw.type,
|
|
attachmentUrl: res.data.url,
|
|
});
|
|
console.log(this.formData.files);
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
},
|
|
|
|
handleImgRemove(file) {
|
|
let index = this.formData.files.findIndex(
|
|
(item) => item.url == file.response.data.url
|
|
);
|
|
this.formData.files.splice(index, 1);
|
|
console.log(this.formData.files);
|
|
},
|
|
// 开启加载动画
|
|
startLoading() {
|
|
loading = Loading.service({
|
|
lock: true, // 是否锁定
|
|
text: "正在加载……", // 加载中需要显示的文字
|
|
background: "rgba(0,0,0,.7)", // 背景颜色
|
|
});
|
|
},
|
|
// 结束加载动画
|
|
endLoading() {
|
|
// clearTimeout(timer);
|
|
if (loading) {
|
|
loading.close();
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang='scss' scoped>
|
|
@import "@/assets/scss/modules/visual/a_customize.scss";
|
|
@import "@/assets/scss/modules/shequzhili/event-info.scss";
|
|
|
|
.el-dialog__body {
|
|
padding: 0 10px 20px !important;
|
|
}
|
|
</style>
|
|
|