@@ -254,6 +254,15 @@ export function treeselectByUser(query) { | |||||
params: query | params: query | ||||
}) | }) | ||||
} | } | ||||
// 查询部门下拉树结构 | |||||
export function treeselect() { | |||||
return request({ | |||||
url: '/depositm/dept/treeselect', | |||||
method: 'get' | |||||
}) | |||||
} | |||||
//获取账套列表 | //获取账套列表 | ||||
export function listByDeptId(query) { | export function listByDeptId(query) { | ||||
return request({ | return request({ | ||||
@@ -833,6 +842,16 @@ export function attachmentUpload(data) { | |||||
}) | }) | ||||
} | } | ||||
// 附件上传 | |||||
export function publicUpload(data) { | |||||
return request({ | |||||
url: '/villageAffairs/public/upload', | |||||
method: 'post', | |||||
header: { "Content-Type": 'application/x-www-form-urlencoded' }, | |||||
data: data | |||||
}) | |||||
} | |||||
// 投诉建议列表 | // 投诉建议列表 | ||||
export function adviceList(query) { | export function adviceList(query) { | ||||
return request({ | return request({ | ||||
@@ -841,3 +860,20 @@ export function adviceList(query) { | |||||
params: query | params: query | ||||
}) | }) | ||||
} | } | ||||
// 新增投诉建议 | |||||
export function addAdvice(data) { | |||||
return request({ | |||||
url: '/villageAffairs/public/addAdvice', | |||||
method: 'post', | |||||
data: data | |||||
}) | |||||
} | |||||
// 投诉建议详情 | |||||
export function getAdvice(id) { | |||||
return request({ | |||||
url: '/villageAffairs/public/getAdvice/'+id, | |||||
method: 'get', | |||||
}) | |||||
} |
@@ -140,6 +140,7 @@ const whiteList = [ | |||||
'/sunVillage_info/list_vote_form', //详情页 | '/sunVillage_info/list_vote_form', //详情页 | ||||
'/sunVillage_info/list_complaint', //详情页 | '/sunVillage_info/list_complaint', //详情页 | ||||
'/sunVillage_info/list_complaint_add', //详情页 | '/sunVillage_info/list_complaint_add', //详情页 | ||||
'/sunVillage_info/list_complaint_detail', //详情页 | |||||
'/sunVillage_info/homeApplication/applicationList', //列表页面 | '/sunVillage_info/homeApplication/applicationList', //列表页面 | ||||
'/sunVillage_info/proposerLite', | '/sunVillage_info/proposerLite', | ||||
'/sunVillage_info/paidExit/paidExitList', //列表页面 | '/sunVillage_info/paidExit/paidExitList', //列表页面 | ||||
@@ -3849,6 +3849,15 @@ export const constantRoutes = [ | |||||
}, | }, | ||||
component: (resolve) => require(['@/views/sunVillage_info/list_complaint_add'], resolve) | component: (resolve) => require(['@/views/sunVillage_info/list_complaint_add'], resolve) | ||||
}, | }, | ||||
{ ////阳光村务(新)-- 合同信息 | |||||
path: '/sunVillage_info/list_complaint_detail', | |||||
name: 'sunVillageInfoListComplaintDetail', | |||||
meta: { | |||||
title: '投诉建议', | |||||
hidden: true, | |||||
}, | |||||
component: (resolve) => require(['@/views/sunVillage_info/list_complaint_detail'], resolve) | |||||
}, | |||||
{ ////阳光村务(新)-- 合同网签 | { ////阳光村务(新)-- 合同网签 | ||||
path: '/sunVillage_info/list_signature', | path: '/sunVillage_info/list_signature', | ||||
name: 'sunVillageInfoListSignature', | name: 'sunVillageInfoListSignature', | ||||
@@ -100,23 +100,25 @@ | |||||
}, | }, | ||||
created() { | created() { | ||||
if(this.$route.query.bookId) | |||||
{ | |||||
bookInfo(this.$route.query.bookId).then((res) => { | |||||
if (res.code == 200) { | |||||
Cookies.set("bookName", res.data.bookName, { | |||||
expires: 30, | |||||
}); | |||||
Cookies.set("deptName", res.data.deptName, { | |||||
expires: 30, | |||||
}); | |||||
this.deptName = res.data.deptName; | |||||
this.bookName = res.data.bookName; | |||||
} | |||||
}); | |||||
Cookies.set("bookId", this.$route.query.bookId, { | |||||
expires: 30, | |||||
}); | |||||
if(this.$route.query.bookId){ | |||||
bookInfo(this.$route.query.bookId).then((res) => { | |||||
if (res.code == 200) { | |||||
let seconds = 3600; | |||||
let expires = new Date(new Date() * 1 + seconds * 1000); | |||||
Cookies.set("bookName", res.data.bookName, { | |||||
expires: expires, | |||||
}); | |||||
Cookies.set("deptName", res.data.deptName, { | |||||
expires: expires, | |||||
}); | |||||
this.deptName = res.data.deptName; | |||||
this.bookName = res.data.bookName; | |||||
} | |||||
}); | |||||
Cookies.set("bookId", this.$route.query.bookId, { | |||||
expires: 30, | |||||
}); | |||||
} | } | ||||
Cookies.set("deptId", this.$route.query.deptId, { | Cookies.set("deptId", this.$route.query.deptId, { | ||||
expires: 30, | expires: 30, | ||||
@@ -17,23 +17,29 @@ | |||||
<van-swipe-cell v-for="(item,index) in applicationList" :key="index" > | <van-swipe-cell v-for="(item,index) in applicationList" :key="index" > | ||||
<van-cell | <van-cell | ||||
:border="false" | :border="false" | ||||
:title="item.subjectName" | |||||
:label="'时间:'+item.startTime.substr(0,10)+' - '+item.endTime.substr(0,10)" | |||||
center | center | ||||
:to="{name: item.isVote || showBtn ? 'sunVillageInfoListVoteDetail':'sunVillageInfoListVoteForm',query:{id:item.id,type:show?'':'code'}}" | |||||
:to="{name: 'sunVillageInfoListComplaintDetail',query:{id:item.id,type:show?'':'code'}}" | |||||
> | > | ||||
<template #right-icon> | <template #right-icon> | ||||
<p style="color: #1D6FE9">投票</p> | |||||
<p :class="{ | |||||
'state1':item.advideState=='已解决', | |||||
'state2':item.advideState!='已解决', | |||||
}">{{item.advideState}}</p> | |||||
</template> | |||||
<template #title> | |||||
<p class="tit">{{item.title}}</p> | |||||
<p class="time">{{item.adviceTime}}</p> | |||||
<p class="dept"><van-icon name="location" color="#3977e7" />{{item.deptName}}</p> | |||||
</template> | </template> | ||||
<template #icon> | <template #icon> | ||||
<img src="../../assets/images/sunVillage_info/icon_vote.png" style="width: .5rem;margin-right: 2%;"> | |||||
<img src="../../assets/images/sunVillage_info/complaint_add_icon_05.png" style="width: 1.5rem;margin-right: 2%;"> | |||||
</template> | </template> | ||||
</van-cell> | </van-cell> | ||||
<template #right v-if="showBtn"> | |||||
<div style="background-color: #ee0a24;height: 100%" @click="goRemove(item.id)">删除</div> | |||||
<div style="background-color: #07c160" @click="goEdit(item.id)">修改</div> | |||||
<div style="background-color: rgb(255, 166, 62);" v-if="item.status != '3'" @click="goRanking(item.id)">发布</div> | |||||
</template> | |||||
<!-- <template #right v-if="showBtn">--> | |||||
<!-- <div style="background-color: #ee0a24;height: 100%" @click="goRemove(item.id)">删除</div>--> | |||||
<!-- <div style="background-color: #07c160" @click="goEdit(item.id)">修改</div>--> | |||||
<!-- <div style="background-color: rgb(255, 166, 62);" v-if="item.status != '3'" @click="goRanking(item.id)">发布</div>--> | |||||
<!-- </template>--> | |||||
</van-swipe-cell> | </van-swipe-cell> | ||||
</van-list> | </van-list> | ||||
</div> | </div> | ||||
@@ -43,6 +49,7 @@ | |||||
import { adviceList , delPoll , publicPoll } from "@/api/sunVillage_info/fixedAssets"; | import { adviceList , delPoll , publicPoll } from "@/api/sunVillage_info/fixedAssets"; | ||||
import Cookies from "js-cookie"; | import Cookies from "js-cookie"; | ||||
import request from '@/utils/request' | import request from '@/utils/request' | ||||
import {Dialog} from "vant"; | |||||
export default { | export default { | ||||
name: "certificateList", | name: "certificateList", | ||||
data() { | data() { | ||||
@@ -56,15 +63,23 @@ | |||||
}; | }; | ||||
}, | }, | ||||
created() { | created() { | ||||
if (Cookies.get('user')){ | |||||
this.queryParams.userId = JSON.parse(Cookies.get('user')).id | |||||
if (!Cookies.get('user')){ | |||||
Dialog.confirm({ | |||||
title: '系统提示', | |||||
message: '登录状态已过期,请重新登录', | |||||
confirmButtonText: '重新登录', | |||||
cancelButtonText: '取消' | |||||
}).then(() => { | |||||
this.$router.push({path:'/sunVillage_info/login_code'}) | |||||
}) | |||||
} | } | ||||
}, | }, | ||||
methods: { | methods: { | ||||
getList(){ | getList(){ | ||||
var _this = this; | var _this = this; | ||||
let queryParams = { | let queryParams = { | ||||
advicePhone:JSON.parse(Cookies.get('user')).phone | |||||
advicePhone:JSON.parse(Cookies.get('user')).phone, | |||||
translate_dict:1, | |||||
} | } | ||||
adviceList(queryParams).then(response => { | adviceList(queryParams).then(response => { | ||||
_this.listLength = response.total; | _this.listLength = response.total; | ||||
@@ -82,7 +97,7 @@ | |||||
}); | }); | ||||
}, | }, | ||||
goAdd(){ | goAdd(){ | ||||
this.$router.push('/sunVillage_info/list_complaint_add') | |||||
this.$router.push({path:'/sunVillage_info/list_complaint_add', query: {type: 'code'}}) | |||||
}, | }, | ||||
goDetail(id){ | goDetail(id){ | ||||
this.$router.push({path:'/sunVillage_info/list_vote_detail',query: {id:id}}) | this.$router.push({path:'/sunVillage_info/list_vote_detail',query: {id:id}}) | ||||
@@ -126,6 +141,9 @@ | |||||
} | } | ||||
}, | }, | ||||
} | } | ||||
</script> | </script> | ||||
@@ -192,5 +210,36 @@ | |||||
flex: 1; | flex: 1; | ||||
} | } | ||||
} | } | ||||
.tit{ | |||||
color: #333333; | |||||
font-size: .45rem; | |||||
} | |||||
.time{ | |||||
color: #aaaaaa; | |||||
font-size: .35rem; | |||||
} | |||||
.dept{ | |||||
color: #3977e7; | |||||
font-size: .35rem; | |||||
display: flex; | |||||
align-items: center; | |||||
} | |||||
.state1{ | |||||
background: #e4f8f4; | |||||
border: 1px solid #c5efe7; | |||||
color: #2ec6a9; | |||||
padding: 0 3vw; | |||||
border-radius: 5vw; | |||||
} | |||||
.state2{ | |||||
background: #fedfe3; | |||||
border: 1px solid #fcb9c2; | |||||
color: #f60325; | |||||
padding: 0 3vw; | |||||
border-radius: 5vw; | |||||
} | |||||
} | } | ||||
</style> | </style> |
@@ -1,6 +1,6 @@ | |||||
<template> | <template> | ||||
<div class="home_wrapper"> | <div class="home_wrapper"> | ||||
<div class="header_main"> | |||||
<div class="header_main" v-if="$route.query.type == 'code'"> | |||||
投诉建议 | 投诉建议 | ||||
<div class="return_btn" @click="onClickLeft"></div> | <div class="return_btn" @click="onClickLeft"></div> | ||||
<div class="add_btn"></div> | <div class="add_btn"></div> | ||||
@@ -9,13 +9,18 @@ | |||||
<img src="../../assets/images/sunVillage_info/complaint_add_icon_01.jpg" width="100%" alt=""> | <img src="../../assets/images/sunVillage_info/complaint_add_icon_01.jpg" width="100%" alt=""> | ||||
<van-form @submit="onSubmit"> | <van-form @submit="onSubmit"> | ||||
<div class="list_main"> | <div class="list_main"> | ||||
<van-field readonly required label="投诉内容" :border="false" /> | |||||
<van-field readonly required label="投诉标题" :border="false" /> | |||||
<div class="input_field"> | |||||
<van-field placeholder="请输入标题" :rules="[{ required: true , message:'标题' }]" v-model="form.title" :border="false" /> | |||||
</div> | |||||
<van-field readonly required label="投诉内容" :border="false" /> | |||||
<div class="input_field"> | <div class="input_field"> | ||||
<van-field | <van-field | ||||
v-model="form.subjectName" | |||||
v-model="form.adviceContent" | |||||
:rules="[{ required: true , message:'具体说明举报内容' }]" | :rules="[{ required: true , message:'具体说明举报内容' }]" | ||||
rows="4" | rows="4" | ||||
autosize | autosize | ||||
@@ -24,99 +29,191 @@ | |||||
placeholder="具体说明举报内容" | placeholder="具体说明举报内容" | ||||
show-word-limit | show-word-limit | ||||
:border="false" | :border="false" | ||||
style="padding: 5PX 0;" | |||||
/> | |||||
</div> | |||||
<van-field readonly required label="业务类型" :border="false" /> | |||||
<div class="input_field"> | |||||
<van-field | |||||
readonly | |||||
clickable | |||||
placeholder="请选择业务类型" | |||||
v-model="adviceType" | |||||
label-width="auto" | |||||
:border="false" | |||||
:rules="[{ required: true , message:'请选择业务类型' }]" | |||||
right-icon="arrow-down" | |||||
@click="showAdviceType = true" | |||||
/> | /> | ||||
<van-popup v-model="showAdviceType" position="bottom"> | |||||
<van-picker | |||||
show-toolbar | |||||
:columns="adviceTypeOptions" | |||||
@confirm="onConfirmAdviceType" | |||||
@cancel="showAdviceType = false" | |||||
value-key="dictLabel" | |||||
/> | |||||
</van-popup> | |||||
</div> | </div> | ||||
<van-field readonly required label="图片线索" :border="false" /> | <van-field readonly required label="图片线索" :border="false" /> | ||||
<van-uploader /> | |||||
<van-uploader | |||||
v-model="fileList" | |||||
style="margin-top: 10PX;" | |||||
:upload-icon="uploadIcon1" | |||||
:after-read="afterRead" | |||||
@delete="deleteFile1" | |||||
/> | |||||
<van-field readonly required label="视频线索" :border="false" /> | <van-field readonly required label="视频线索" :border="false" /> | ||||
<van-uploader /> | |||||
<van-uploader | |||||
v-model="videoList" | |||||
style="margin-top: 10PX;" | |||||
:upload-icon="uploadIcon2" | |||||
accept="video/*" | |||||
:after-read="afterReadVideo" | |||||
@delete="deleteFileVideo" | |||||
@click-preview="handleclicksc" | |||||
/> | |||||
<van-popup v-model="showvideoplay" style="background: transparent;width: 70%;"> | |||||
<video | |||||
controls | |||||
preload="auto" | |||||
style="width:100%;object-fit: contain;" | |||||
:src="videourl" | |||||
v-if="videourl" | |||||
></video> | |||||
</van-popup> | |||||
<van-field readonly required label="所在区域" :border="false" /> | <van-field readonly required label="所在区域" :border="false" /> | ||||
<div class="input_field"> | <div class="input_field"> | ||||
<van-field v-model="value1" right-icon="arrow-down" placeholder="显示图标" :border="false" /> | |||||
<van-field | |||||
readonly | |||||
clickable | |||||
placeholder="请选择所在区域" | |||||
v-model="form.deptName" | |||||
label-width="auto" | |||||
:border="false" | |||||
:rules="[{ required: true , message:'请选择所在区域' }]" | |||||
right-icon="arrow-down" | |||||
@click="showDept = true" | |||||
/> | |||||
<van-popup v-model="showDept" position="bottom"> | |||||
<van-cascader | |||||
v-model="villageValue" | |||||
title="请选择" | |||||
:options="deptOptions" | |||||
@close="showDept = false" | |||||
@change="onConfirmDept" | |||||
active-color="#1989fa" | |||||
:field-names="hcAreaInfoFieldName" | |||||
/> | |||||
</van-popup> | |||||
</div> | </div> | ||||
<van-field readonly required label="线索地址(具体到村小组)" :border="false" /> | <van-field readonly required label="线索地址(具体到村小组)" :border="false" /> | ||||
<div class="input_field"> | <div class="input_field"> | ||||
<van-field placeholder="请输入地址" :border="false" /> | |||||
<van-field placeholder="请输入地址" v-model="form.adviceAddress" :border="false" /> | |||||
</div> | </div> | ||||
<van-field readonly label="投诉人(非必填)" :border="false" /> | <van-field readonly label="投诉人(非必填)" :border="false" /> | ||||
<div class="input_field"> | <div class="input_field"> | ||||
<van-field placeholder="请输入姓名" :border="false" /> | |||||
<van-field placeholder="请输入姓名" v-model="form.adviceName" :border="false" /> | |||||
</div> | </div> | ||||
<van-field readonly label="联系电话(非必填,我们将对号码保密)" :border="false" /> | <van-field readonly label="联系电话(非必填,我们将对号码保密)" :border="false" /> | ||||
<div class="input_field"> | <div class="input_field"> | ||||
<van-field placeholder="请输入电话" :border="false" /> | |||||
<van-field placeholder="请输入电话" v-model="form.advicePhone" :border="false" /> | |||||
</div> | </div> | ||||
</div> | |||||
<div style="margin: 16px auto;width: 50%;"> | |||||
<van-button round block type="primary" native-type="submit"> | |||||
<van-button size="small" round block type="primary" native-type="submit"> | |||||
保存 | 保存 | ||||
</van-button> | </van-button> | ||||
</div> | </div> | ||||
</van-form> | </van-form> | ||||
<div style="height: 50px;"></div> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
import { commonUpload , addPoll } from "@/api/sunVillage_info/fixedAssets"; | |||||
import {publicUpload, addAdvice, treeselect} from "@/api/sunVillage_info/fixedAssets"; | |||||
import Cookies from "js-cookie"; | import Cookies from "js-cookie"; | ||||
import uploadIcon1 from '@/assets/images/sunVillage_info/complaint_add_icon_03.png' | |||||
import uploadIcon2 from '@/assets/images/sunVillage_info/complaint_add_icon_04.png' | |||||
import request from '@/utils/request' | import request from '@/utils/request' | ||||
export default { | export default { | ||||
name: "certificateList", | name: "certificateList", | ||||
data() { | data() { | ||||
return { | return { | ||||
showStartTime:false, | |||||
showEndTime:false, | |||||
form:{ | |||||
startTime:this.format(new Date(),'yyyy-MM-dd HH:mm:ss'), | |||||
endTime:this.format(new Date(),'yyyy-MM-dd HH:mm:ss'), | |||||
type:'1', | |||||
anonymous:'Y', | |||||
status:'2', | |||||
options:[{name:''}] | |||||
showvideoplay:false, | |||||
videourl:'', | |||||
form:{}, | |||||
//选中的值 | |||||
villageValue: "", | |||||
hcAreaInfoFieldName: { | |||||
text: "label", | |||||
value: "value", | |||||
children: "children", | |||||
}, | }, | ||||
uploadIcon1:uploadIcon1, | |||||
uploadIcon2:uploadIcon2, | |||||
openPic:[], | openPic:[], | ||||
fileList:[], | |||||
fileList1:[], | |||||
startTime:new Date(), | |||||
endTime:new Date(), | |||||
type:'', | |||||
openFile:[], | |||||
openFileList:[], | |||||
queryParams:{ | queryParams:{ | ||||
bookId:'', | bookId:'', | ||||
deptId:'', | deptId:'', | ||||
}, | }, | ||||
openFile2:[], | |||||
openPic2:[], | openPic2:[], | ||||
value1:'' | |||||
deptOptions:[], | |||||
fileList:[], | |||||
videoList:[], | |||||
videoUrl:[], | |||||
adviceTypeOptions:[], | |||||
showDept:false, | |||||
showAdviceType:false, | |||||
adviceType:'' | |||||
}; | }; | ||||
}, | }, | ||||
created() { | created() { | ||||
this.queryParams.bookId = Cookies.get('bookId'); | this.queryParams.bookId = Cookies.get('bookId'); | ||||
this.queryParams.deptId = Cookies.get('deptId'); | this.queryParams.deptId = Cookies.get('deptId'); | ||||
this.houseGetDicts("communicate_type").then((response) => { | |||||
this.adviceTypeOptions = response.data; | |||||
// this.form.otherTypeText = this.selectDictLabel(response.data, this.$route.query.type); | |||||
// this.form.otherName = Cookies.get('deptName')+this.selectDictLabel(response.data, this.$route.query.type); | |||||
}); | |||||
treeselect().then((res) => { | |||||
if (res.code == 200) { | |||||
this.deptOptions = res.data; | |||||
} | |||||
}); | |||||
}, | }, | ||||
methods: { | methods: { | ||||
addOptions(){ | |||||
var that = this; | |||||
let array = that.form.options.filter(function (e) { return e.name == ""; }); | |||||
console.log(array); | |||||
if (array.length>0){ | |||||
that.$toast('请勿添加多个空选项!'); | |||||
}else{ | |||||
that.form.options.push({name:''}) | |||||
} | |||||
handleclicksc(file) { | |||||
console.log(file) | |||||
this.videourl = file.content | |||||
this.showvideoplay = true; | |||||
}, | |||||
onConfirmDept({ selectedOptions }){ | |||||
this.form.deptId = selectedOptions[selectedOptions.length-1].id; | |||||
this.form.deptName = selectedOptions.map((option) => option.label).join('/'); | |||||
}, | |||||
onConfirmAdviceType(e){ | |||||
this.form.adviceType = e.dictValue; | |||||
this.adviceType = e.dictLabel; | |||||
this.showAdviceType = false; | |||||
console.log(e) | |||||
}, | }, | ||||
onSubmit(){ | onSubmit(){ | ||||
var that = this; | var that = this; | ||||
addPoll(that.form).then((r1) => { | |||||
that.form.fileUrl = that.openPic2.join(',') | |||||
that.form.videoUrl = that.videoUrl.join(',') | |||||
that.form.adviceTime = that.format(new Date(),'yyyy-MM-dd HH:mm:ss') | |||||
addAdvice(that.form).then((r1) => { | |||||
if (r1.code == 200){ | if (r1.code == 200){ | ||||
that.$notify({ type: 'success', message: '新增成功' }); | that.$notify({ type: 'success', message: '新增成功' }); | ||||
setTimeout(function(){ | setTimeout(function(){ | ||||
@@ -125,32 +222,61 @@ | |||||
} | } | ||||
}) | }) | ||||
}, | }, | ||||
onConfirmOpenNy(data){ | |||||
this.form.startTime = this.format(data,'yyyy-MM-dd HH:mm:ss'); | |||||
this.startTime = data; | |||||
this.showStartTime = false; | |||||
afterRead(file) { | |||||
console.log(file instanceof Array) | |||||
if (file instanceof Array){//判断是否为数组,单张图片为array,多张为数组,数组返回true否则为false | |||||
file.map(res=>{ | |||||
this.openPic.push(res.file); | |||||
let params1 = new FormData(); | |||||
params1.append("file", res.file); | |||||
publicUpload(params1).then((r1) => { | |||||
this.openPic2.push(r1.fileName); | |||||
}) | |||||
}) | |||||
}else{ | |||||
this.openPic.push(file); | |||||
let params1 = new FormData(); | |||||
params1.append("file", file.file); | |||||
publicUpload(params1).then((r1) => { | |||||
this.openPic2.push(r1.fileName); | |||||
}) | |||||
} | |||||
}, | |||||
deleteFile1(detail){ | |||||
this.openPic2.splice(detail.index,1) | |||||
// this.form.openPic.splice(index,1); | |||||
}, | }, | ||||
onConfirmOpenEndTime(data){ | |||||
this.form.endTime = this.format(data,'yyyy-MM-dd HH:mm:ss'); | |||||
this.endTime = data; | |||||
this.showEndTime = false; | |||||
deleteFileVideo(detail){ | |||||
this.videoUrl.splice(detail.index,1) | |||||
// this.form.openPic.splice(index,1); | |||||
}, | }, | ||||
afterReadVideo(file){ | |||||
const that = this; | |||||
let formData = new FormData(); // 为上传文件定义一个formData对象 | |||||
formData.append("file", file.file); | |||||
publicUpload(formData).then((r1) => { | |||||
this.videoUrl.push(r1.fileName); | |||||
}) | |||||
}, | |||||
}, | }, | ||||
} | } | ||||
</script> | </script> | ||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
/deep/ .van-button--primary{ | /deep/ .van-button--primary{ | ||||
background: url("../../assets/images/sunVillage_info/btn_bg.png") no-repeat; | |||||
background-size: 100% 100%; | |||||
background: #2ec6a9; | |||||
border: none; | border: none; | ||||
width: 40%; | |||||
margin:5vh auto 2vh; | |||||
} | } | ||||
.van-radio:last-child{ | .van-radio:last-child{ | ||||
margin-right: 0; | margin-right: 0; | ||||
} | } | ||||
.input_field{ | .input_field{ | ||||
border: 1px solid #d8d8d8; | border: 1px solid #d8d8d8; | ||||
padding: 5px 15px; | |||||
padding: 8PX 15PX; | |||||
border-radius: 8PX; | border-radius: 8PX; | ||||
margin: 10PX 0; | margin: 10PX 0; | ||||
} | } | ||||
@@ -233,7 +359,7 @@ | |||||
.list_main{ | .list_main{ | ||||
padding: 75px 25px 25px; | padding: 75px 25px 25px; | ||||
background: #ffffff url("../../assets/images/sunVillage_info/complaint_add_icon_02.jpg") no-repeat center top; | background: #ffffff url("../../assets/images/sunVillage_info/complaint_add_icon_02.jpg") no-repeat center top; | ||||
background-size: auto 75px; | |||||
background-size: auto 60px; | |||||
width: 94%; | width: 94%; | ||||
margin: 25px auto 0; | margin: 25px auto 0; | ||||
border-radius: 15PX; | border-radius: 15PX; | ||||
@@ -0,0 +1,383 @@ | |||||
<template> | |||||
<div class="home_wrapper"> | |||||
<div class="header_main"> | |||||
投诉建议 | |||||
<div class="return_btn" @click="onClickLeft"></div> | |||||
<div class="add_btn"></div> | |||||
</div> | |||||
<img src="../../assets/images/sunVillage_info/complaint_add_icon_01.jpg" width="100%" alt=""> | |||||
<van-form @submit="onSubmit"> | |||||
<div class="list_main"> | |||||
<van-field readonly required label="投诉标题" :border="false" /> | |||||
<div class="input_field"> | |||||
<van-field readonly placeholder="请输入标题" v-model="form.title" :border="false" /> | |||||
</div> | |||||
<van-field readonly required label="投诉内容" :border="false" /> | |||||
<div class="input_field"> | |||||
<van-field | |||||
v-model="form.adviceContent" | |||||
readonly | |||||
rows="4" | |||||
autosize | |||||
type="textarea" | |||||
maxlength="1000" | |||||
placeholder="具体说明举报内容" | |||||
show-word-limit | |||||
:border="false" | |||||
style="padding: 5PX 0;" | |||||
/> | |||||
</div> | |||||
<van-field readonly required label="业务类型" :border="false" /> | |||||
<div class="input_field"> | |||||
<van-field | |||||
readonly | |||||
clickable | |||||
placeholder="请选择业务类型" | |||||
v-model="form.adviceType" | |||||
label-width="auto" | |||||
:border="false" | |||||
/> | |||||
</div> | |||||
<van-field readonly required label="图片线索" :border="false" /> | |||||
<van-uploader | |||||
v-model="form.fileUrlArray" | |||||
style="margin-top: 10PX;" | |||||
:upload-icon="uploadIcon1" | |||||
:show-upload="false" | |||||
:deletable="false" | |||||
/> | |||||
<van-empty | |||||
class="custom-image" | |||||
image="https://img01.yzcdn.cn/vant/custom-empty-image.png" | |||||
description="暂无图片" | |||||
v-if="form.fileUrlArray.length<1" | |||||
/> | |||||
<van-field readonly required label="视频线索" :border="false" /> | |||||
<van-uploader | |||||
v-model="form.videoUrlArray" | |||||
style="margin-top: 10PX;" | |||||
:upload-icon="uploadIcon2" | |||||
:show-upload="false" | |||||
:deletable="false" | |||||
@click-preview="handleclicksc" | |||||
/> | |||||
<van-empty | |||||
class="custom-image" | |||||
image="https://img01.yzcdn.cn/vant/custom-empty-image.png" | |||||
description="暂无视频" | |||||
v-if="form.videoUrlArray.length<1" | |||||
/> | |||||
<van-popup v-model="showvideoplay" style="background: transparent;width: 70%;"> | |||||
<video | |||||
controls | |||||
preload="auto" | |||||
style="width:100%;object-fit: contain;" | |||||
:src="videourl" | |||||
v-if="videourl" | |||||
></video> | |||||
</van-popup> | |||||
<van-field readonly required label="所在区域" :border="false" /> | |||||
<div class="input_field"> | |||||
<van-field | |||||
readonly | |||||
clickable | |||||
placeholder="请选择所在区域" | |||||
v-model="form.deptName" | |||||
label-width="auto" | |||||
:border="false" | |||||
/> | |||||
</div> | |||||
<van-field readonly required label="线索地址(具体到村小组)" :border="false" /> | |||||
<div class="input_field"> | |||||
<van-field readonly placeholder="请输入地址" v-model="form.adviceAddress" :border="false" /> | |||||
</div> | |||||
<van-field readonly label="投诉人(非必填)" :border="false" /> | |||||
<div class="input_field"> | |||||
<van-field readonly placeholder="请输入姓名" v-model="form.adviceName" :border="false" /> | |||||
</div> | |||||
<van-field readonly label="联系电话(非必填,我们将对号码保密)" :border="false" /> | |||||
<div class="input_field"> | |||||
<van-field readonly placeholder="请输入电话" v-model="form.advicePhone" :border="false" /> | |||||
</div> | |||||
</div> | |||||
</van-form> | |||||
<div style="height: 50px;"></div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import {commonUpload, addAdvice, treeselect,getAdvice} from "@/api/sunVillage_info/fixedAssets"; | |||||
import Cookies from "js-cookie"; | |||||
import uploadIcon1 from '@/assets/images/sunVillage_info/complaint_add_icon_03.png' | |||||
import uploadIcon2 from '@/assets/images/sunVillage_info/complaint_add_icon_04.png' | |||||
import request from '@/utils/request' | |||||
export default { | |||||
name: "certificateList", | |||||
data() { | |||||
return { | |||||
showvideoplay:false, | |||||
videourl:'', | |||||
form:{ | |||||
fileUrlArray:[], | |||||
videoUrlArray:[] | |||||
}, | |||||
//选中的值 | |||||
villageValue: "", | |||||
hcAreaInfoFieldName: { | |||||
text: "label", | |||||
value: "value", | |||||
children: "children", | |||||
}, | |||||
uploadIcon1:uploadIcon1, | |||||
uploadIcon2:uploadIcon2, | |||||
openPic:[], | |||||
queryParams:{ | |||||
bookId:'', | |||||
deptId:'', | |||||
}, | |||||
openPic2:[], | |||||
deptOptions:[], | |||||
fileList:[], | |||||
videoList:[], | |||||
adviceTypeOptions:[], | |||||
showDept:false, | |||||
showAdviceType:false, | |||||
adviceType:'' | |||||
}; | |||||
}, | |||||
created() { | |||||
this.queryParams.bookId = Cookies.get('bookId'); | |||||
this.queryParams.deptId = Cookies.get('deptId'); | |||||
this.houseGetDicts("communicate_type").then((response) => { | |||||
this.adviceTypeOptions = response.data; | |||||
}); | |||||
this.getDetail(); | |||||
}, | |||||
methods: { | |||||
handleclicksc(file) { | |||||
console.log(file) | |||||
this.videourl = file.url | |||||
this.showvideoplay = true; | |||||
}, | |||||
getDetail(){ | |||||
getAdvice(this.$route.query.id).then((r1) => { | |||||
if (r1.code == 200){ | |||||
r1.data.fileUrlArray = []; | |||||
r1.data.videoUrlArray = []; | |||||
if (r1.data.fileUrl){ | |||||
r1.data.fileUrl.split(',').map(res=>{ | |||||
r1.data.fileUrlArray.push({ | |||||
url:'/api'+res, | |||||
}) | |||||
}) | |||||
} | |||||
if (r1.data.videoUrl){ | |||||
r1.data.videoUrl.split(',').map(res=>{ | |||||
r1.data.videoUrlArray.push({ | |||||
url:'/api'+res, | |||||
}) | |||||
}) | |||||
} | |||||
r1.data.adviceType = this.selectDictLabel(this.adviceTypeOptions, r1.data.adviceType); | |||||
this.form = r1.data; | |||||
} | |||||
}) | |||||
}, | |||||
onConfirmDept({ selectedOptions }){ | |||||
this.form.deptId = selectedOptions[selectedOptions.length-1].id; | |||||
this.form.deptName = selectedOptions.map((option) => option.label).join('/'); | |||||
}, | |||||
onConfirmAdviceType(e){ | |||||
this.form.adviceType = e.dictValue; | |||||
this.adviceType = e.dictLabel; | |||||
this.showAdviceType = false; | |||||
console.log(e) | |||||
}, | |||||
onSubmit(){ | |||||
var that = this; | |||||
that.form.fileUrl = that.openPic2.join(',') | |||||
that.form.adviceTime = that.format(new Date(),'yyyy-MM-dd HH:mm:ss') | |||||
addAdvice(that.form).then((r1) => { | |||||
if (r1.code == 200){ | |||||
that.$notify({ type: 'success', message: '新增成功' }); | |||||
setTimeout(function(){ | |||||
// history.back(-1); | |||||
},2000) | |||||
} | |||||
}) | |||||
}, | |||||
afterRead(file) { | |||||
console.log(file instanceof Array) | |||||
if (file instanceof Array){//判断是否为数组,单张图片为array,多张为数组,数组返回true否则为false | |||||
file.map(res=>{ | |||||
this.openPic.push(res.file); | |||||
let params1 = new FormData(); | |||||
params1.append("file", res.file); | |||||
commonUpload(params1).then((r1) => { | |||||
this.openPic2.push(r1.fileName); | |||||
}) | |||||
}) | |||||
}else{ | |||||
this.openPic.push(file); | |||||
let params1 = new FormData(); | |||||
params1.append("file", file.file); | |||||
commonUpload(params1).then((r1) => { | |||||
this.openPic2.push(r1.fileName); | |||||
}) | |||||
} | |||||
}, | |||||
deleteFile1(detail){ | |||||
this.openPic2.splice(detail.index,1) | |||||
// this.form.openPic.splice(index,1); | |||||
}, | |||||
}, | |||||
} | |||||
</script> | |||||
<style scoped lang="scss"> | |||||
/deep/ .van-button--primary{ | |||||
background: #2ec6a9; | |||||
border: none; | |||||
width: 40%; | |||||
margin:5vh auto 2vh; | |||||
} | |||||
.van-radio:last-child{ | |||||
margin-right: 0; | |||||
} | |||||
.input_field{ | |||||
border: 1px solid #d8d8d8; | |||||
padding: 8PX 15PX; | |||||
border-radius: 8PX; | |||||
margin: 10PX 0; | |||||
} | |||||
.home_wrapper{ | |||||
background: #f1f2f2; | |||||
min-height: 100vh; | |||||
width: 100vw; | |||||
.header_main { | |||||
height: 116px; | |||||
background: url('../../assets/images/sunVillage_info/list_head_green.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
position: fixed; | |||||
top: 0; | |||||
left: 0; | |||||
width: 100%; | |||||
font-size: 36px; | |||||
line-height: 116px; | |||||
text-align: center; | |||||
color: #fff; | |||||
position: relative; | |||||
.return_btn { | |||||
width: 24px; | |||||
height: 43.2px; | |||||
background: url('../../assets/images/sunVillage_info/list_icon_5.png') center center no-repeat; | |||||
background-size: 20px 36px; | |||||
position: absolute; | |||||
left: 38px; | |||||
top: 36px; | |||||
} | |||||
} | |||||
.release_head{ | |||||
height: 90px; | |||||
padding:0 23px; | |||||
display: flex; | |||||
align-items: center; | |||||
font-size: 26px; | |||||
color: #929292; | |||||
.people{ | |||||
flex: 1; | |||||
display: flex; | |||||
align-items: center; | |||||
.icon{ | |||||
width: 24px; | |||||
height: 21px; | |||||
background: url('../../assets/images/sunVillage_info/details_icon_1.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
display: block; | |||||
margin-right: 8px; | |||||
} | |||||
} | |||||
.time{ | |||||
flex: 1; | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content:flex-end; | |||||
.icon{ | |||||
width: 25px; | |||||
height: 25px; | |||||
background: url('../../assets/images/sunVillage_info/details_icon_2.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
display: block; | |||||
margin-right: 8px; | |||||
} | |||||
} | |||||
} | |||||
.release_conetnt{ | |||||
padding:0 22px; | |||||
font-size: 32px; | |||||
color: #252525; | |||||
line-height: 44px; | |||||
img{ | |||||
max-width: 100%; | |||||
margin-bottom: 16px; | |||||
} | |||||
p{ | |||||
margin-bottom: 16px; | |||||
} | |||||
} | |||||
.list_main{ | |||||
padding: 75px 25px 25px; | |||||
background: #ffffff url("../../assets/images/sunVillage_info/complaint_add_icon_02.jpg") no-repeat center top; | |||||
background-size: auto 60px; | |||||
width: 94%; | |||||
margin: 25px auto 0; | |||||
border-radius: 15PX; | |||||
box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1); | |||||
} | |||||
.tit{ | |||||
font-size: 16PX; | |||||
padding: 15PX 10PX; | |||||
} | |||||
/deep/ .van-cell{ | |||||
padding-left: 0!important; | |||||
padding-right: 0!important; | |||||
padding-bottom: 0!important; | |||||
line-height: 1; | |||||
&:nth-child(1){ | |||||
padding-top: 0; | |||||
} | |||||
} | |||||
/deep/ .van-field__label{ | |||||
padding-left: 10PX; | |||||
width: auto; | |||||
display: flex; | |||||
align-items: center; | |||||
border-left: 4PX solid #2ec6a9; | |||||
} | |||||
/deep/ .van-cell--required::before{ | |||||
left: 22%; | |||||
} | |||||
/deep/ .van-field__error-message{ | |||||
display: none; | |||||
} | |||||
} | |||||
</style> |