117 lines
2.6 KiB
Vue
117 lines
2.6 KiB
Vue
<template>
|
|
<view class="write-complaints">
|
|
<view class="main-container">
|
|
<view class="text-box">
|
|
<u-input class="textarea" placeholder="发表您的意见吧，我们会做得更好。 (必填)" v-model="text" type="textarea" :clearable="false" :maxlength="200" />
|
|
<span class="text-length">{{ text.length }}/200</span>
|
|
</view>
|
|
<u-input class="phone" placeholder="请输入手机号方便联系 (非必填)" v-model="phone" type="number" />
|
|
</view>
|
|
<view class="write-btn" @click="submit">发表意见</view>
|
|
<u-toast ref="uToast" />
|
|
</view>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
phone: '',
|
|
text: '',
|
|
}
|
|
},
|
|
methods: {
|
|
submit() {
|
|
if(!this.verifyContent()) return false;
|
|
// console.log(this.phone);
|
|
// console.log(this.text);
|
|
this.$u.toast('提交成功');
|
|
this.phone = "";
|
|
this.text = "";
|
|
},
|
|
verifyContent() {
|
|
if(this.$u.test.isEmpty(this.text)) {
|
|
this.$u.toast('内容不可为空');
|
|
return false;
|
|
}
|
|
if(!this.$u.test.isEmpty(this.phone)) {
|
|
if(!this.$u.test.mobile(this.phone)) {
|
|
this.$u.toast('手机格式错误');
|
|
return false;
|
|
}
|
|
}
|
|
return true;
|
|
},
|
|
writeFeedback() {
|
|
if(!this.verifyContent()) return false;
|
|
this.$u.api.writeFeedback({
|
|
fb_content: this.text,
|
|
fb_images: this.imageList,
|
|
}).then(res => {
|
|
if(res.errCode == 0) {
|
|
this.$refs.uToast.show({
|
|
title: res.message,
|
|
duration: 2000,
|
|
callback:() => {
|
|
this.$u.route({
|
|
type: "navigateBack",
|
|
url: '/pageE/more/Complaints',
|
|
})
|
|
}
|
|
})
|
|
} else {
|
|
this.$u.toast(res.message);
|
|
}
|
|
})
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.write-complaints {
|
|
min-height: calc(100vh - var(--window-top));
|
|
background-color: #ECECEC;
|
|
.main-container {
|
|
background-color: #ffffff;
|
|
.text-box {
|
|
padding-bottom: 60rpx;
|
|
position: relative;
|
|
&::after {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
height: 3rpx;
|
|
width: 750rpx;
|
|
background-color: #ECECEC;
|
|
}
|
|
.text-length {
|
|
height: 60rpx;
|
|
position: absolute;
|
|
right: 40rpx;
|
|
bottom: 0;
|
|
color: #999;
|
|
}
|
|
}
|
|
/deep/ .textarea {
|
|
padding: 0 30rpx !important;
|
|
width: 100% !important;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
/deep/ .phone {
|
|
padding: 20rpx 30rpx !important;
|
|
|
|
}
|
|
}
|
|
.write-btn {
|
|
margin: 120rpx auto 0;
|
|
width: 690rpx;
|
|
height: 98rpx;
|
|
background: rgba(255,120,15,1);
|
|
border-radius: 46rpx;
|
|
font-size: 36rpx;
|
|
color: rgba(255,255,255,1);
|
|
text-align: center;
|
|
line-height: 98rpx;
|
|
}
|
|
}
|
|
</style> |