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.
530 lines
14 KiB
530 lines
14 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">
|
|
投诉类型
|
|
<text class="chel_t_s">(必填)</text>
|
|
</view>
|
|
</view>
|
|
<view style="margin-top: 20rpx;">
|
|
<input v-show="false" v-model="suggestType" type="text" name="suggestType" placeholder="投诉类型" class="ipt_sug" />
|
|
<uni-data-select
|
|
class='select-l'
|
|
:localdata="range"
|
|
@change="change"
|
|
:clear='false'
|
|
></uni-data-select>
|
|
</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: '',
|
|
range: [
|
|
|
|
],
|
|
suggestType:''
|
|
};
|
|
},
|
|
onShow() {
|
|
this.getIdCardType()
|
|
},
|
|
methods: {
|
|
change(e) {
|
|
const this_ = this
|
|
this_.suggestType = e
|
|
},
|
|
getIdCardType: function () {
|
|
const datas = {
|
|
userkey: this.$param.userkey,
|
|
// userkey: aes.aesMinEncrypt(this.$param.userkey),
|
|
dicnum: this.$param.suggestType
|
|
// dicnum: aes.aesMinEncrypt(this.$param.suggestType)
|
|
|
|
};
|
|
// uni.request({
|
|
// url:this.$config.getDicByDicnum,
|
|
// data:datas,
|
|
// method:'post',
|
|
// header:{
|
|
// "Content-Type":"multipart/form-data"
|
|
// },
|
|
// success: function (res) {
|
|
// console.log(res);
|
|
|
|
// },
|
|
// fail: function (err) {
|
|
// console.log(err); //App.json中默认超时时间为60秒
|
|
// }
|
|
// });
|
|
this.$Request.post(this.$config.getDicByDicnum, datas).then((res) => {
|
|
console.log(res,'投诉类型')
|
|
if (this.$util.isSuccess(res)) {
|
|
var data = res.data;
|
|
const arr = []
|
|
data.forEach(item=>{
|
|
const obj = {
|
|
value:item.dicnum,
|
|
text:item.dicname
|
|
}
|
|
arr.push(obj)
|
|
})
|
|
this.range = arr;
|
|
}
|
|
});
|
|
},
|
|
inputVerify: function (e) {
|
|
var value = e.detail.value;
|
|
if (value == '') {
|
|
return;
|
|
}
|
|
},
|
|
formSubmit: function (e) {
|
|
var that = this;
|
|
console.log(that.suggestType,'ppp')
|
|
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{
|
|
// debugger
|
|
// if(!e.detail.value.address.match("/^[0-9,.]+$/")){
|
|
// uni.showModal({
|
|
// title: '温馨提示',
|
|
// content: '请正确输入发生地',
|
|
// })
|
|
// return;
|
|
// }
|
|
// }
|
|
if (e.detail.value.ctype.length == 0) {
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请填写投诉对象'
|
|
});
|
|
return false;
|
|
}
|
|
// else{
|
|
// debugger
|
|
// 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{
|
|
// debugger
|
|
// 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{
|
|
// debugger
|
|
// if(!e.detail.value.lineuser.match("^[a-zA-Z0-9_\u4e00-\u9fa5]+$")){
|
|
// uni.showModal({
|
|
// title: '温馨提示',
|
|
// content: '请正确输入联系人',
|
|
// })
|
|
// return;
|
|
// }
|
|
// }
|
|
if (this.suggestTyp==''||this.suggestType==undefined||this.suggestType==null) {
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '请选择投诉类型'
|
|
});
|
|
return false;
|
|
}
|
|
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,
|
|
lng:e.detail.value.address.split(',')[0],
|
|
lat:e.detail.value.address.split(',')[1],
|
|
ctype: e.detail.value.ctype,
|
|
linemobile: e.detail.value.linemobile,
|
|
lineuser: e.detail.value.lineuser,
|
|
suggestType:e.detail.value.suggestType,
|
|
filePath: filePath,
|
|
unionid:uni.getStorageSync("unionid"),
|
|
// unionid: 'unionIdewrqrfb',
|
|
userkey: that.$param.userkey
|
|
};
|
|
console.log(data)
|
|
this.$Request.post(this.$config.addFeedback, data).then((res) => {
|
|
if (res.status == 200) {
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '提交成功',
|
|
showCancel: false,
|
|
success() {
|
|
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');
|
|
.select-l{
|
|
|
|
}
|
|
</style>
|
|
|