horzi_rai_wxa/pages-purchaser/survey/surveySubmit.vue

<template>
  <view class="container survey-box">
    <view class="survey-box-content">
      <view class="survey-textArea">
        <van-field
          :value="surveyText"
          type="textarea"
          :maxlength="100"
          placeholder="请详述您的调研需求"
          :border="false"
          :show-word-limit="true"
          :autosize="{ minHeight: 100 }"
          @change="inputChange($event)"
        ></van-field>
      </view>
      <view @click="submit" class="submit">提交</view>
    </view>
  </view>
</template>

<script>
import { leafletUrl } from "@/config/config";
import { purchaserApi } from "@/config/modules/purchaser.js";
export default {
  data() {
    return {
      surveyText: "",
    };
  },
  methods: {
    inputChange(e) {
      this.surveyText = e.detail;
    },
    submit() {
      if (!this.surveyText) {
        uni.showToast({
          title: "调研需求不能为空",
          icon: "none",
        });
        return;
      }
      purchaserApi.purchaserSurveySubmit({ Content: this.surveyText }).then((res) => {
        if (res.Ret === 200) {
          uni.showToast({
            title: "提交成功，请等待销售与您联系",
            duration: 2000,
            icon: "none",
          });
          setTimeout(() => {
            uni.navigateBack();
          }, 2000);
        }
      });
    },
  },
  onLoad(option) {
    let id = option.Id || 0;
    this.url = `${leafletUrl}?Id=${id}#wechat_redirect`;
  },
};
</script>

<style lang="scss" scoped>
.survey-box {
  padding: 30rpx 20rpx;
  display: flex;
  flex-direction: column;
  align-items: center;  
  background-color: $uni-color-new;
  .survey-box-content {
    width: 100%;
    padding: 20rpx 20rpx 80rpx;
    border-radius: 8rpx;
    background-color: #fff;
  }
  .survey-textArea {
    width: 100%;
    border: solid 1rpx #dcdfe6;
    border-radius: 8rpx;
    padding: 6rpx;
    box-sizing: border-box;
    margin-bottom: 40rpx;
  }
  .submit {
    width: 500rpx;
    height: 60rpx;
    background: $uni-color-new;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
  }
}
</style>