|
|
@@ -1,156 +1,96 @@
|
|
|
<template>
|
|
|
<view class="feedback-wrapper">
|
|
|
- <view class="head">
|
|
|
- <view class="left-wrapper">
|
|
|
- <view class="title">{{$t(`商城客服已离线`)}}</view>
|
|
|
- <view class="txt">{{feedback}}</view>
|
|
|
- </view>
|
|
|
- <view class="img-box"><image src="../static/feed-icon.png" mode=""></image></view>
|
|
|
+
|
|
|
+ <view class="input-box">
|
|
|
+ <textarea type="text" placeholder="请输入您要反馈的内容" v-model="con" />
|
|
|
+ </view>
|
|
|
+ <view class="input-box">
|
|
|
+ <text class="info" selectable="false" space="false" decode="false">
|
|
|
+ 上传图片
|
|
|
+ </text>
|
|
|
+ <u-upload action="http://www.example.com/upload" :file-list="[
|
|
|
+ ]" max-count="1"></u-upload>
|
|
|
</view>
|
|
|
- <view class="main">
|
|
|
- <view class="title">{{$t(`我要反馈`)}}</view>
|
|
|
- <view class="input-box">
|
|
|
- <input type="text" :placeholder="$t(`请输入姓名`)" v-model="name">
|
|
|
- </view>
|
|
|
- <view class="input-box">
|
|
|
- <input type="text" :placeholder="$t(`请输入手机号`)" v-model="phone">
|
|
|
- </view>
|
|
|
- <view class="input-box">
|
|
|
- <textarea type="text" :placeholder="$t(`请填写内容`)" v-model="con" />
|
|
|
- </view>
|
|
|
- <view class="sub_btn" @click="subMit">{{$t(`提交`)}}</view>
|
|
|
+ <view class="sub_btn" @click="subMit">
|
|
|
+ <button class='modifyBnt' formType="submit">保存</button>
|
|
|
+
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import { serviceFeedBack,feedBackPost } from '@/api/kefu.js'
|
|
|
- export default{
|
|
|
- name:'feedback',
|
|
|
- data(){
|
|
|
- return {
|
|
|
- name:'',
|
|
|
- phone:'',
|
|
|
- con:'',
|
|
|
- feedback:''
|
|
|
+import { serviceFeedBack, feedBackPost } from '@/api/kefu.js'
|
|
|
+export default {
|
|
|
+ name: 'feedback',
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ name: '',
|
|
|
+ phone: '',
|
|
|
+ con: '',
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad () {
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+
|
|
|
+ subMit () {
|
|
|
+ if (!this.name) {
|
|
|
+ return this.$util.Tips({
|
|
|
+ title: this.$t(`请输入姓名`)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (!this.phone || !(/^1(3|4|5|7|8|9|6)\d{9}$/i.test(this.phone))) {
|
|
|
+ return this.$util.Tips({
|
|
|
+ title: this.$t(`请输入正确的手机号码`)
|
|
|
+ })
|
|
|
}
|
|
|
- },
|
|
|
- onLoad(){
|
|
|
- this.getInfo()
|
|
|
- },
|
|
|
- methods:{
|
|
|
- getInfo(){
|
|
|
- serviceFeedBack().then(res=>{
|
|
|
- this.feedback = res.data.feedback
|
|
|
+ if (!this.con) {
|
|
|
+ return this.$util.Tips({
|
|
|
+ title: this.$t(`请填写内容`)
|
|
|
})
|
|
|
- },
|
|
|
- subMit(){
|
|
|
- if(!this.name){
|
|
|
- return this.$util.Tips({
|
|
|
- title: this.$t(`请输入姓名`)
|
|
|
- })
|
|
|
- }
|
|
|
- if(!this.phone || !(/^1(3|4|5|7|8|9|6)\d{9}$/i.test(this.phone))){
|
|
|
- return this.$util.Tips({
|
|
|
- title:this.$t(`请输入正确的手机号码`)
|
|
|
- })
|
|
|
- }
|
|
|
- if(!this.con){
|
|
|
- return this.$util.Tips({
|
|
|
- title: this.$t(`请填写内容`)
|
|
|
- })
|
|
|
- }
|
|
|
- feedBackPost({
|
|
|
- rela_name:this.name,
|
|
|
- phone:this.phone,
|
|
|
- content:this.con
|
|
|
- }).then(res=>{
|
|
|
- this.$util.Tips({
|
|
|
- title:res.msg,
|
|
|
- icon:'success'
|
|
|
- },{
|
|
|
- tab:3
|
|
|
- })
|
|
|
- }).catch(function(res) {
|
|
|
- that.$util.Tips({ title: res });
|
|
|
- });
|
|
|
}
|
|
|
+ feedBackPost({
|
|
|
+ rela_name: this.name,
|
|
|
+ phone: this.phone,
|
|
|
+ content: this.con
|
|
|
+ }).then(res => {
|
|
|
+ this.$util.Tips({
|
|
|
+ title: res.msg,
|
|
|
+ icon: 'success'
|
|
|
+ }, {
|
|
|
+ tab: 3
|
|
|
+ })
|
|
|
+ }).catch(function (res) {
|
|
|
+ that.$util.Tips({ title: res });
|
|
|
+ });
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</script>
|
|
|
+<style scoped lang="scss">
|
|
|
+.feedback-wrapper{
|
|
|
+ background: #fff;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ padding: 30rpx;
|
|
|
+}
|
|
|
+.info{
|
|
|
+height: 44rpx;
|
|
|
+font-size: 28rpx;
|
|
|
+font-weight: 400;
|
|
|
+color: #999999;
|
|
|
+line-height: 44rpx;
|
|
|
+}
|
|
|
+.modifyBnt {
|
|
|
+ width: 85%;
|
|
|
|
|
|
-<style lang="stylus">
|
|
|
- .feedback-wrapper
|
|
|
- .head
|
|
|
- display flex
|
|
|
- align-items center
|
|
|
- justify-content space-between
|
|
|
- height 215rpx
|
|
|
- padding 0rpx 30rpx
|
|
|
- background-color #3A3A3A
|
|
|
- .left-wrapper
|
|
|
- width 456rpx
|
|
|
- color #fff
|
|
|
- font-size 24rpx
|
|
|
- .title
|
|
|
- margin-bottom 15rpx
|
|
|
- font-size 32rpx
|
|
|
- .img-box
|
|
|
- image
|
|
|
- width 173rpx
|
|
|
- height 156rpx
|
|
|
- .info
|
|
|
- display flex
|
|
|
- background-color #fff
|
|
|
- .info-item
|
|
|
- flex 1
|
|
|
- display flex
|
|
|
- flex-direction column
|
|
|
- align-items center
|
|
|
- justify-content center
|
|
|
- height 138rpx
|
|
|
- border-right 1px solid #F0F1F2
|
|
|
- &:last-child
|
|
|
- border:none
|
|
|
- .big-txt
|
|
|
- font-size 32rpx
|
|
|
- font-weight bold
|
|
|
- color #282828
|
|
|
- .small
|
|
|
- margin-top 10rpx
|
|
|
- font-size 24rpx
|
|
|
- color #9F9F9F
|
|
|
- .main
|
|
|
- margin-top 16rpx
|
|
|
- padding 30rpx 30rpx 68rpx
|
|
|
- background-color #FFF
|
|
|
- .title
|
|
|
- font-size 30rpx
|
|
|
- font-weight bold
|
|
|
- .input-box
|
|
|
- margin-top 20rpx
|
|
|
- input
|
|
|
- display block
|
|
|
- width 100%
|
|
|
- height 78rpx
|
|
|
- background #F5F5F5
|
|
|
- font-size 28rpx
|
|
|
- padding-left 20rpx
|
|
|
- textarea
|
|
|
- display block
|
|
|
- width 100%
|
|
|
- height 260rpx
|
|
|
- padding 20rpx
|
|
|
- background #F5F5F5
|
|
|
- font-size 28rpx
|
|
|
- .sub_btn
|
|
|
- margin-top 130rpx
|
|
|
- width 100%
|
|
|
- height 86rpx
|
|
|
- line-height 86rpx
|
|
|
- font-size 30rpx
|
|
|
- text-align center
|
|
|
- color #fff
|
|
|
- border-radius 43rpx
|
|
|
- background-color #3875EA
|
|
|
+ margin: auto;
|
|
|
+ margin-top: 50rpx;
|
|
|
+ height: 84rpx;
|
|
|
+ background: #B42A3E;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 84rpx;
|
|
|
+}
|
|
|
</style>
|
jinchaoyu