yitisheng-mini-app/pages/zyb/other/feedback.vue

<script>
import StaticConstant from "@/common/StaticConstant";
import ApiConstant from "@/common/ApiConstant";
import Request from '@/common/request'
import {arrayIsNotEmpty, stringIsNotEmpty} from "@/common/util";

let request = new Request()
export default {
  name: "feedback",
  computed: {
    StaticConstant() {
      return StaticConstant
    }
  },
  data() {
    return {
      contentHeight: 600,
      typeVisible: false,//模态框状态
      typeIndex: 0,
      feedback: {
        type: '1',
        content: '',
        contactPerson:'',
        contactPersonPhone:'',
      },
      typeArray: [
        {label: '使用疑问', value: '1'},
        {label: '功能故障', value: '2'},
        {label: '数据错误', value: '3'},
        {label: '注销账号', value: '4'},
        {label: '投诉', value: '5'},
        {label: '提建议', value: '6'},
      ]
    }
  },
  onShow() {
  },
  methods: {
    bindPickerFeedbackChange(e) {
      console.log(e)
      this.typeIndex = e.detail.value
    },
    formSubmit(){
      if (!this.feedback.content || this.feedback.content ==='') {
        uni.showToast({title: '请输入问题描述', icon: "none"});
        return
      }
      let data = {
        type:this.typeArray[this.typeIndex].value,
        content:this.feedback.content,
        contactPerson:this.feedback.contactPerson,
        contactPersonPhone:this.feedback.contactPersonPhone,
      }
      request.post(ApiConstant.System.feedbackSave, data).then(r => {
        console.log(r)
        if (r.success) {
          setTimeout(function () {
            uni.showToast({title: '反馈成功', icon: "none"});
          }, 300)
          setTimeout(function () {
            //回到首页
            uni.navigateBack({
              delta: 1 // 返回的页面数，这里设置为1表示返回上一页
            });
          }, 1000)

        }else{
          setTimeout(function () {
            uni.showToast({title: r.message, icon: "none"});
          }, 500)
        }
      }).catch(err => {
      }).finally(() => {
      });
    },
    close(){

    },
    open(){

    }
  }
}
</script>

<template>
  <view class="container" style="background-color: #ffffff">
    <view class="uni-padding-wrap" style="text-align: center">
      <view class="font-size-medium font-weight-b">
        问题反馈
      </view>
    </view>
    <!--表单-->
    <view class="uni-padding-wrap uni-common-mt border-top">
      <view class="forms">
        <view class="form-item">
          <view class="form-item-label">问题类型</view>
          <view class="form-item-view form-input">
            <picker @change="bindPickerFeedbackChange" :value="typeIndex" :range="typeArray"
                    range-key="label">
              <view class="uni-input">{{ typeArray[typeIndex].label }}</view>
            </picker>
          </view>
        </view>
        <view class="form-item">
          <view class="form-item-label">问题描述</view>
          <view class="form-item-view form-input">
            <uni-easyinput type="textarea" v-model="feedback.content" placeholder="请输入问题描述"/>
          </view>
        </view>
        <view class="form-item">
          <view class="form-item-label">联系人</view>
          <view class="form-item-view form-input">
            <input class="uni-input" type="number"
                   v-model="feedback.contactPerson"
                   name="contactPersonPhone"
                   :placeholder="'请输入联系人'"/>
          </view>
        </view>
        <view class="form-item">
          <view class="form-item-label">联系电话</view>
          <view class="form-item-view form-input">
            <input class="uni-input" type="number"
                   v-model="feedback.contactPersonPhone"
                   name="contactPersonPhone"
                   :placeholder="'请输入联系电话'"/>
          </view>
        </view>
      </view>
      <text class="darkGray font-size-mini">联系我们：{{StaticConstant.email}}</text>
    </view>

    <view class="submitButtonView button-active" @click="formSubmit">
      <text class="font-weight-b">提交问题</text>
    </view>
  </view>
</template>

<style scoped lang="scss">
.container {
  height: 100%;
}

.uni-form-item .title {
  padding: 20rpx 0;
}

/*表单 start*/
.form-item {
  display: flex;
  align-items: center;
  margin: 30rpx 0;
}

.form-item-label {
  width: 20%;
}

.form-item-view {
  width: 80%;
  min-height: 80rpx;
}

.form-input {
  border: 1rpx solid #e6e6e6;
}

//选考科目
.kelei-item {
  background-color: #f7f7f7;
  color: black;
  padding: 20rpx 30rpx;
  margin-right: 30rpx;
}

.kelei-item-active {
  background-color: #feede1;
  color: #f96712;
}

.submitButtonView {
  margin: 30rpx;
  text-align: center;
  border-radius: 15rpx;
  line-height: 80rpx;
}

.button-disabled {
  color: white;
  background-color: #d8d8d8;
}

.button-active {
  color: white;
  background: linear-gradient(#f79459, #f96622);
}

/*表单 end*/

.uni-picker-tips {
  font-size: 12px;
  color: #666;
  margin-bottom: 15px;
  padding: 0 15px;
}

/*底部抽屉 报考方向内容 start*/
.professionalCategoryPopup .professionalCategoryItem {
  margin: 20rpx;
  padding: 20rpx;
  text-align: center;
  border: 1rpx solid #f1f2f3;

  .text {
    margin: 0 auto;
  }
}

.active {
  background-color: #3e89fe;
  color: white;
  border-radius: 15rpx;
}

.professionalCategoryChildren .childrenItem {
  margin: 20rpx;
}

/*底部抽屉 报考方向内容 end*/
</style>