perry-mall/pagesA/suggestions/suggestions.vue

214 lines
6.8 KiB
Vue

<template>
<view>
<!-- 状态栏 -->
<status-nav :titleVal="'投诉与建议'" :statusTitle="true"></status-nav>
<!-- 自定义二级分类 -->
<!-- 列表 -->
<view :style="{paddingTop: statusHNH+'px'}" class="pad-zy20">
<view class="bacf mar-s25 pad-zy20 radius20 fon28 col3 pad-x40">
<!-- 问题类型 -->
<view class="disac pad-s32">
<view class="flexs mar-y20 titlel">问题类型</view>
<radio-group @change="changeCate" class="width100 disac">
<label class="radio disac">
<radio style="transform: scale(.7);" :value="2" checked color="#3875f6"/><text>改进意见/建议</text>
</label>
<label class="radio disac">
<radio style="transform: scale(.7);" :value="1" color="#3875f6"/><text>投诉</text>
</label>
</radio-group>
<!-- <radio-group @change="changeCate" class="width100 disac">
<label class="radio disac" v-for="(iteml,indexl) in xialone" :key="indexl">
<radio style="transform: scale(.7);" :value="iteml.id" :checked="indexl==0" color="#3875f6"/><text>{{iteml.title}}</text>
</label>
</radio-group> -->
<!-- 下拉列表 -->
<!-- <view @tap="openXial" class="disjbac width100 radius10 pad-zy20 xiala posir">
<view>{{category}}</view>
<image :class="isZhuan?'zhuan':'nozhuan'" src="/static/public/sanj.png" mode="aspectFill"></image>
<view v-if="isZhuan" class="posia bacf radius10 xial-box">
<view class="pad-zy20 xial-item-box">
<view @tap="chooseXia(indexl)" :class="xialCurrent==indexl?'pcol':''" v-for="(iteml,indexl) in xialone" :key="indexl">{{iteml.title}}</view>
</view>
</view>
</view> -->
</view>
<!-- 建议意见 -->
<view class="dis mar-s20">
<view class="mar-y20 flexs mar-s20 titlel">意见建议</view>
<view class="width100 radius10 pad20 borbot-cc" style="height: 300rpx;">
<textarea v-model="tmsg" class="fon28" maxlength="500" style="height: 300rpx;width: auto;" placeholder="请把您的意见及建议填写在这里" placeholder-style="color:#999999;"/>
</view>
</view>
<!-- 姓名 -->
<view class="disac mar-s30">
<view class="mar-y20 flexs titlel disjb">
<view>称</view>
<view class="mar-y10">呼</view>
</view>
<view class="width100 radius10 pad-zy20 borbot-cc height-68">
<input v-model="tname" class="fon28 height-68" type="text" value="" placeholder="我们怎么称呼您" placeholder-style="color:#999999;"/>
</view>
</view>
<!-- 联系电话 -->
<view class="disac mar-s20">
<view class="mar-y20 flexs titlel">联系电话</view>
<view class="width100 radius10 pad-zy20 borbot-cc height-68">
<input v-model="tphone" maxlength="11" class="fon28 height-68" type="text" value="" placeholder="请输入联系电话" placeholder-style="color:#999999;"/>
</view>
</view>
<!-- 底部按钮 -->
<view @tap="submit" class="fon30 radius20 tc colf bold0 btnl" :style="{background:publicColor}">{{btnCon}}</view>
</view>
<!-- 弹框 -->
<pu-po :isShowT="isShowT" :isCenter="true" :contentVal="'提交成功!等待审核'" :comfrimVal="'好的'" @comfirmev="comfirmev"></pu-po>
</view>
<!-- 底部客服 -->
<!-- <public-customer :nright="20" :nbottom="100"></public-customer> -->
<!-- 底部tab -->
<foot-tab :titleList="titleList" :imgList="imgList" :newcurrent='-1'></foot-tab>
</view>
</template>
<script>
export default {
data() {
return {
statusHNH:uni.getStorageSync('statusHNH'),
publicColor:uni.getStorageSync('publicColor'),//主题颜色
isShowT:false,
category:'',
tname:'',//联系人姓名
tphone:'',//联系方式
tmsg:'',//留言信息
touId:'',
isZhuan:false,
xialCurrent:0,
xialone:[],
btnCon:'立即提交',
titleList:[],//tab标题
imgList:[],//tab图标
}
},
onShow() {
this.$toolAll.tools.isLogin()
},
onLoad() {
this.checkCate();
this.tphone = uni.getStorageSync('phone');
this.$requst.post('index/mini-program-setting').then(res=>{
// log('数据:',res);
if(res.code==0){
if(res.data.length!=0){
if(res.data.footBar.length!=0){//底部导航
res.data.footBar.forEach(item=>{
let newName = item.name
let newObj = {
iconPath:this.$http + item.icon[0],
selectedIconPath:this.$http + item.icon[1],
}
if(item.key=="home"){
this.imgList[0] = newObj
this.titleList[0] = newName
}
if(item.key=="category"){
this.imgList[1] = newObj
this.titleList[1] = newName
}
if(item.key=="service"){
this.imgList[2] = newObj
this.titleList[2] = newName
}
if(item.key=="shop"){
this.imgList[3] = newObj
this.titleList[3] = newName
}
if(item.key=="my"){
this.imgList[4] = newObj
this.titleList[4] = newName
}
})
uni.setStorageSync('footTitle',this.titleList)
uni.setStorageSync('footimg',this.imgList)
this.titleList = uni.getStorageSync('footTitle')
this.imgList = uni.getStorageSync('footimg')
}
}
}
},error=>{})
},
methods: {
changeCate(e){
console.log(e.detail.value);
this.touId = e.detail.value;
},
checkCate(){
this.$requst.post('user/feedback-types').then(res=>{
// console.log('问题类型列表:',res);
if(res.code==0){
if(res.data.length!=0){
res.data.forEach(item=>{
let obj = {
id:item.id,
title:item.title
}
this.xialone.push(obj)
})
this.category = this.xialone[0].title
this.touId = this.xialone[0].id
}
}
},error=>{})
},
submit(){
if(!this.tmsg){
this.$toolAll.tools.showToast('请输入意见及建议')
} else if(this.$toolAll.tools.isPhone(this.tphone)){
this.$toolAll.tools.showToast('请输入正确的手机号')
} else {
this.eventEv();
}
},
eventEv(){
let parmas = {
type_id:this.touId,
content:this.tmsg,
user_name:this.tname,
user_phone:this.tphone
}
if(this.btnCon == '立即提交'){
// this.$toolAll.tools.showToast('正在提交...')
this.btnCon = '正在提交...'
this.$requst.post('user/add-feedback',parmas).then(res=>{
// uni.hideToast()
if(res.code==0){
this.isShowT = true
} else {
this.btnCon = '返回'
this.$toolAll.tools.showToast(res.msg)
}
},error=>{})
} else {
uni.navigateBack({delta:1})
}
},
comfirmev(){
uni.navigateBack({delta:1})
},
openXial(){
this.isZhuan = !this.isZhuan
// console.log('开启下拉');
},
chooseXia(index){
this.xialCurrent = index
this.btnCon = '立即提交'
this.category = this.xialone[index].title
this.touId = this.xialone[index].id
},
}
}
</script>
<style>
</style>