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.
443 lines
12 KiB
443 lines
12 KiB
<template>
|
|
<view>
|
|
<form @submit="formSubmit">
|
|
<view class="mode_com lst_sug_unit">
|
|
<view class="sug_form_line">
|
|
<view class="sug_dly_flex">
|
|
<view class="sug_sgu">事故发生地<text class="chel_t_s">(必填)</text></view>
|
|
<view class="sug_r">
|
|
<view @click="getLocation()" class="sug_dwei">当前位置</view>
|
|
</view>
|
|
</view>
|
|
<view>
|
|
<input type="text" @input="inputVerify" name="address" :value="address" placeholder="手动输入" class="ipt_sug" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="sug_form_line">
|
|
<view class="sug_dly_flex">
|
|
<view class="sug_sgu">投诉对象<text class="chel_t_s">(必填)</text></view>
|
|
<!-- <view class="sug_r">
|
|
<view class="obj_type">
|
|
<text class="cue">商家</text><text>旅行社</text><text>导游</text><text>其他</text>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
<view>
|
|
<input type="text" @input="inputVerify" name="ctype" placeholder="您要投诉谁" class="ipt_sug" />
|
|
</view>
|
|
</view>
|
|
<view class="sug_form_line">
|
|
<view class="sug_dly_flex">
|
|
<view class="sug_sgu">投诉原因<text class="chel_t_s">(必填)</text></view>
|
|
<view class="sug_r">
|
|
<!-- <view class="">
|
|
<text class="chel_t_s">0/500</text>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
<view>
|
|
<textarea name="creason" @input="inputVerify" class="ipt_sug" auto-height placeholder="输入投诉的具体事由" />
|
|
</view>
|
|
</view>
|
|
<view class="sug_form_line">
|
|
<view class="sug_dly_flex" >
|
|
<view class="sug_sgu">上传证据</view>
|
|
|
|
</view>
|
|
<view class="sug_dly_flex sug_lst_img sug_fm_img">
|
|
<view class="w_33" v-for="(item,index) in pics" :key="index">
|
|
<view class="fm_img_2">
|
|
<image :src="imgUrl + item" class="sug_img" mode="aspectFill"></image>
|
|
<view @tap="delImg(index)" class="btn_del_sug"><image src="../../static/images/del_2.png" mode="aspectFill" class="kou_top3"></image></view>
|
|
</view>
|
|
</view>
|
|
<!-- 上传按钮 -->
|
|
<view @tap="beforeUpload" class="w_33">
|
|
<view class="fm_img_2">
|
|
<image src="../../static/images/icn_xji.png" class="kou_top" mode="aspectFill"></image></view>
|
|
</view>
|
|
<!-- 上传后自带删除按钮 -->
|
|
<!-- <view class="w_33">
|
|
<view class="fm_img_2">
|
|
<image src="" class="sug_img" mode="aspectFill"></image> -->
|
|
<!-- 删除图片按钮 -->
|
|
<!-- <view class="btn_del_sug"><image src="../../static/images/del_2.png" mode="aspectFill" class="kou_top3"></image></view>
|
|
</view>
|
|
</view> -->
|
|
<!-- <view class="w_33">
|
|
<view class="fm_img_2">
|
|
<image src="" class="sug_img" mode="aspectFill"></image>
|
|
<view class="btn_del_sug"><image src="../../static/images/del_2.png" mode="aspectFill" class="kou_top3"></image></view>
|
|
</view>
|
|
</view>
|
|
<view class="w_33">
|
|
<view class="fm_img_2">
|
|
<image src="" class="sug_img" mode="aspectFill"></image>
|
|
<view class="btn_del_sug"><image src="../../static/images/del_2.png" mode="aspectFill" class="kou_top3"></image></view>
|
|
</view>
|
|
</view>
|
|
<view class="w_33">
|
|
<view class="fm_img_2">
|
|
<image src="" class="sug_img" mode="aspectFill"></image>
|
|
<view class="btn_del_sug"><image src="../../static/images/del_2.png" mode="aspectFill" class="kou_top3"></image></view>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="mode_com ">
|
|
<view class="sug_form_line">
|
|
<view class="sug_dly_flex sub_lxir">
|
|
<text style="color: #ff0000;">*</text><view class="sug_sgu">联系人</view>
|
|
<view class="sug_r">
|
|
<input type="text" name="lineuser" @input="inputVerify" :value="lineuser" placeholder="请输入姓名" class="ipt_sug" />
|
|
<!-- <view class="btn_del_sug"><image src="../../static/images/del_2.png" mode="aspectFill" class="kou_top3"></image></view> -->
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="sug_form_line">
|
|
<view class="sug_dly_flex sub_lxir">
|
|
<text style="color: #ff0000;">*</text><view class="sug_sgu">联系方式</view>
|
|
<view class="sug_r">
|
|
<input type="number" name="linemobile" placeholder="请输入手机号码" class="ipt_sug" />
|
|
<!-- <view class="btn_baoh_sug"><image src="../../static/images/icn_baoh.png" mode="aspectFill" class="kou_top3"></image><text>保护中</text></view> -->
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
<view class="blk_2"></view>
|
|
<view class="sug_fied">
|
|
<view class="mode_com sug_edit_btn">
|
|
<button type="default" form-type="submit" class="state_sub">提交</button>
|
|
</view>
|
|
</view>
|
|
</form>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import aes from "@/common/aes.js";
|
|
export default {
|
|
data() {
|
|
return {
|
|
pics:[],
|
|
imgUrl:this.$config.ROOTPATH,
|
|
latitude:this.$param.clat,
|
|
longitude:this.$param.clng,
|
|
address:"",
|
|
lineuser:""
|
|
}
|
|
},
|
|
methods: {
|
|
inputVerify:function(e){
|
|
var value = e.detail.value
|
|
if(value == ""){
|
|
return;
|
|
}
|
|
if(!value.match("^[a-zA-Z0-9_\u4e00-\u9fa5]+$")){
|
|
uni.showToast({
|
|
icon:"none",
|
|
title:"请正确输入"
|
|
})
|
|
}
|
|
},
|
|
formSubmit:function(e){
|
|
var that = this;
|
|
var filePath = "";
|
|
if(that.pics.length > 0){
|
|
filePath = that.pics.join(",")
|
|
}
|
|
if(e.detail.value.address.length == 0){
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请填写事故发生地',
|
|
})
|
|
return false;
|
|
}else{
|
|
if(!e.detail.value.address.match("^[a-zA-Z0-9_\u4e00-\u9fa5]+$")){
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请正确输入发生地',
|
|
})
|
|
return;
|
|
}
|
|
}
|
|
if(e.detail.value.ctype.length == 0){
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请填写投诉对象',
|
|
})
|
|
return false;
|
|
}else{
|
|
if(!e.detail.value.ctype.match("^[a-zA-Z0-9_\u4e00-\u9fa5]+$")){
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请正确输入投诉对象',
|
|
})
|
|
return;
|
|
}
|
|
}
|
|
|
|
if(e.detail.value.creason.length == 0){
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请填写原因',
|
|
})
|
|
return false;
|
|
}else{
|
|
if(!e.detail.value.creason.match("^[a-zA-Z0-9_\u4e00-\u9fa5]+$")){
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请正确输入原因',
|
|
})
|
|
return;
|
|
}
|
|
}
|
|
|
|
if(e.detail.value.lineuser.length==0){
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请填写联系人',
|
|
})
|
|
return false;
|
|
}else{
|
|
if(!e.detail.value.lineuser.match("^[a-zA-Z0-9_\u4e00-\u9fa5]+$")){
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请正确输入联系人',
|
|
})
|
|
return;
|
|
}
|
|
}
|
|
if (!/^1\d{10}$/.test(e.detail.value.linemobile) || e.detail.value.linemobile.length == 0) {
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请填写正确的联系电话',
|
|
})
|
|
return false;
|
|
}
|
|
var data = {
|
|
address:e.detail.value.address,
|
|
creason:e.detail.value.creason,
|
|
ctype:e.detail.value.ctype,
|
|
linemobile:e.detail.value.linemobile,
|
|
lineuser:e.detail.value.lineuser,
|
|
filePath:filePath,
|
|
unionid:aes.aesDecrypt(uni.getStorageSync("unionid")),
|
|
lat:that.latitude,
|
|
lng:that.longitude,
|
|
userkey: that.$param.userkey
|
|
}
|
|
this.$Request.post(this.$config.addFeedback,data).then(res => {
|
|
if(res.status == 200){
|
|
uni.showModal({
|
|
title:"提示",
|
|
content:"提交成功",
|
|
showCancel:false,
|
|
success() {
|
|
// uni.redirectTo({
|
|
// url: "/pages/suggest/sug_list"
|
|
// })
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
}
|
|
})
|
|
}else{
|
|
uni.showToast({
|
|
title:res.msg,
|
|
icon:"none"
|
|
})
|
|
}
|
|
});
|
|
},
|
|
|
|
beforeUpload: function(){
|
|
var that = this;
|
|
var url = this.$config.getMessageInfoFormFilter;
|
|
var data = {
|
|
type: this.$param.svgType,
|
|
userkey: this.$param.userkey,
|
|
title: '投诉',
|
|
pageSize: 1,
|
|
sort:"2"
|
|
};
|
|
this.$Request.post(url, data).then(res => {
|
|
var data = res.data;
|
|
var url = "";
|
|
if(data.length > 0){
|
|
url = data[0].logo;
|
|
if(url == undefined || url == null){
|
|
url = "kong";
|
|
}
|
|
}
|
|
switch (uni.getSystemInfoSync().platform) {
|
|
case 'android':
|
|
console.log('运行Android上')
|
|
this.$util.bindGpsObj(that);
|
|
Android.gotoDetial("ImageFrom","camera");
|
|
Android.gotoDetial('SVGLINE', url);
|
|
break;
|
|
case 'ios':
|
|
console.log('运行iOS上')
|
|
this.$util.bindGpsObj(that);
|
|
window.location.href="https://www.baidu.com?url=svg&value="+url;
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
});
|
|
uni.showLoading({
|
|
title:"开启相机中...",
|
|
mask:true
|
|
})
|
|
setTimeout(function(){
|
|
uni.hideLoading();
|
|
that.uploadImg();
|
|
},500,that)
|
|
},
|
|
receiveSuccess:function(base64){
|
|
var that = this;
|
|
var pics = that.pics;
|
|
uni.showLoading({
|
|
mask:true,
|
|
title:"上传中"
|
|
})
|
|
var data = {
|
|
file: base64,
|
|
}
|
|
that.$Request.post(that.$config.base64Upload, data).then(res => {
|
|
if(res.status != 200){
|
|
uni.showToast({
|
|
title:"上传失败",
|
|
icon:"none"
|
|
})
|
|
uni.hideLoading();
|
|
return;
|
|
}
|
|
var obj = res.data;
|
|
pics = pics.concat(obj.path);
|
|
that.pics = pics;
|
|
uni.hideLoading();
|
|
})
|
|
},
|
|
uploadImg:function(){
|
|
var that = this;
|
|
var pics = that.pics;
|
|
if(pics.length < 9){
|
|
|
|
uni.chooseImage({
|
|
count: 9, // 最多可以选择的图片张数，默认9
|
|
sizeType: ['original','compressed'], // original 原图，compressed 压缩图，默认二者都有
|
|
sourceType: ['album', 'camera'], // album 从相册选图，camera 使用相机，默认二者都有
|
|
success: function (res) {
|
|
uni.showLoading({
|
|
mask:true,
|
|
title:"上传中"
|
|
})
|
|
var imgsrc = res.tempFilePaths;
|
|
uni.uploadFile({
|
|
url: that.$config.fileUpload,
|
|
filePath: imgsrc[0],
|
|
name: 'file',
|
|
success(res) {
|
|
if(res.statusCode != 200){
|
|
uni.showToast({
|
|
title:"上传失败",
|
|
icon:"none"
|
|
})
|
|
uni.hideLoading();
|
|
}
|
|
var obj = JSON.parse(res.data);
|
|
var flag = that.$util.isSuccess(obj);
|
|
if(!flag){
|
|
return;
|
|
}
|
|
obj = obj.data;
|
|
pics = pics.concat(obj.path);
|
|
that.pics = pics;
|
|
uni.hideLoading();
|
|
},
|
|
fail(res){
|
|
uni.showToast({
|
|
title:"上传失败",
|
|
icon:"none"
|
|
})
|
|
uni.hideLoading();
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}else{
|
|
uni.showToast({
|
|
title:"最多上传9张",
|
|
icon:"none"
|
|
})
|
|
}
|
|
},
|
|
delImg:function(index){
|
|
this.pics.splice(index,1);
|
|
},
|
|
getLocation:function(){
|
|
var that = this;
|
|
uni.showLoading({
|
|
title: "定位中",
|
|
mask: true
|
|
})
|
|
uni.getLocation({
|
|
type: 'gcj02',
|
|
altitude:true,
|
|
success: function (res) {
|
|
console.log('当前位置的经度：' + res.longitude);
|
|
console.log('当前位置的纬度：' + res.latitude);
|
|
that.address = res.longitude+','+res.latitude;
|
|
uni.hideLoading();
|
|
},
|
|
|
|
});
|
|
},
|
|
callGpsSuccess: function(lat, lng){
|
|
var that = this;
|
|
var data = {
|
|
lat: lat,
|
|
lng: lng,
|
|
poi:"0",
|
|
key:"Z2IBZ-6BRKG-Z52QT-IU3J2-6P3QO-WIBII"
|
|
}
|
|
that.$Request.post(that.$config.getAddressByLatLng,data).then(res => {
|
|
if(res.status == 0){
|
|
that.address = res.result.address;
|
|
}
|
|
});
|
|
uni.hideLoading();
|
|
},
|
|
callGpsFail: function(){
|
|
var that = this;
|
|
var data = {
|
|
lat: this.$param.lat,
|
|
lng: this.$param.lng,
|
|
poi:"0",
|
|
key:"Z2IBZ-6BRKG-Z52QT-IU3J2-6P3QO-WIBII"
|
|
}
|
|
that.$Request.post(that.$config.getAddressByLatLng,data).then(res => {
|
|
if(res.status == 0){
|
|
that.address = res.result.address;
|
|
}
|
|
});
|
|
uni.hideLoading();
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
@import url("../../static/css/common.css");
|
|
</style>
|
|
|