<template>
|
<view class="flex-col group_1 page_bg">
|
<view class="flex-col">
|
<text class="text_1">您好,欢迎您给我们反馈产品的使用感受和建议。</text>
|
<view class="flex-col group_3">
|
<u-form :model="form" ref="uForm" :error-type="['toast']">
|
<u-form-item class="input_text" prop="suggestArea">
|
<u-input v-model="form.suggestArea" type="textarea" :border="false" :height="400"
|
:auto-height="true" placeholder="请填写意见反馈内容" />
|
</u-form-item>
|
<u-form-item class="input_text" prop="contactInfo">
|
<u-input v-model="form.contactInfo" type="text" :border="false"
|
placeholder="留下您的联系方式 手机 / QQ邮箱" />
|
</u-form-item>
|
</u-form>
|
</view>
|
<text class="text_4">您的联系方式有助于我们沟通解决问题,仅工作人员<br />可见</text>
|
</view>
|
<view class="flex-col items-center button" @tap="sendFeedBack">
|
<text>提交</text>
|
</view>
|
<u-toast ref="uToast" />
|
</view>
|
</template>
|
|
<script>
|
var that; // 当前页面对象
|
var vk; // vk依赖
|
export default {
|
data() {
|
// 页面数据变量
|
return {
|
form: {
|
suggestArea: '', // 意见
|
contactInfo: '' // 联系方式
|
},
|
rules: {
|
suggestArea: [{
|
required: true,
|
message: '请输入意见内容',
|
trigger: 'blur'
|
}, {
|
min: 10,
|
message: '意见内容不能少于15个字',
|
trigger: 'blur'
|
}],
|
contactInfo: [{
|
required: true,
|
message: '请输入正确的联系方式',
|
trigger: 'blur'
|
}, {
|
pattern: /(^1[0-9]{10}$)|(^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$)/g,
|
transform(value) {
|
return String(value);
|
},
|
message: '请输入正确的手机号或邮箱'
|
}]
|
}
|
}
|
},
|
// 监听 - 页面每次【加载时】执行(如:前进)
|
onLoad(options = {}) {
|
that = this;
|
vk = that.vk;
|
that.init(options)
|
},
|
// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快,会在页面进入动画完成前触发
|
onReady() {
|
this.$refs.uForm.setRules(this.rules)
|
},
|
// 监听 - 页面每次【显示时】执行(如:前进和返回) (页面每次出现在屏幕上都触发,包括从下级页面点返回露出当前页面)
|
onShow() {},
|
// 监听 - 页面每次【隐藏时】执行(如:返回)
|
onHide() {},
|
// 函数
|
methods: {
|
// 页面数据初始化函数
|
init(options) {},
|
// 提交建议
|
sendFeedBack() {
|
this.$refs.uForm.validate(valid => {
|
if (!valid) return
|
uni.vk.callFunction({
|
url: 'client/feedback/kh/add',
|
data: {
|
suggestArea: that.form.suggestArea,
|
contactInfo: that.form.contactInfo,
|
need_user_info: true,
|
},
|
success(res) {
|
that.$refs.uToast.show({
|
title: res.code == 0 ? '提交成功' : '提交失败',
|
type: res.code == 0 ? 'success' : 'warning',
|
})
|
setTimeout(() => {
|
if (res.code == 0) {
|
that.suggestArea = ''
|
that.contactInfo = ''
|
vk.navigateTo('/pages/mine/index')
|
}
|
}, 1500)
|
}
|
})
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.page_bg {
|
height: 100vh;
|
background-color: #F5F5F5;
|
padding-top: 20rpx;
|
}
|
|
.group_1 {
|
padding: 34rpx 30rpx 0;
|
flex: 1 1 auto;
|
overflow-y: auto;
|
|
.button {
|
margin-top: 169rpx;
|
padding: 26rpx 0 24rpx;
|
color: rgb(255, 255, 255);
|
font-size: 32rpx;
|
line-height: 38rpx;
|
white-space: nowrap;
|
background-color: rgb(51, 51, 51);
|
border-radius: 44rpx;
|
}
|
|
.text_1 {
|
color: rgb(51, 51, 51);
|
font-size: 28rpx;
|
line-height: 34rpx;
|
white-space: nowrap;
|
}
|
|
.group_3 {
|
margin-top: 25rpx;
|
color: rgb(204, 204, 204);
|
font-size: 28rpx;
|
line-height: 34rpx;
|
white-space: nowrap;
|
|
.input_text {
|
background: #FFFFFF;
|
padding: 12rpx 25rpx;
|
margin-bottom: 38rpx;
|
}
|
}
|
|
.text_4 {
|
margin-right: 40rpx;
|
color: rgb(204, 204, 204);
|
font-size: 28rpx;
|
line-height: 33rpx;
|
text-align: left;
|
}
|
}
|
</style>
|