JiangningUrbanManageApp/sub-public/allPingJia/allPingJia.vue

<template>
  <view class="container-main">
    <view class="enterprise-header">
      <view class="enterprise-img">
        <image :src="baseImgUrl + 'liao-ning/icon_qyzhcx.png'" mode=""></image>
      </view>
      <view class="enterprise-name">
        <view class="name-text">23</view>
        <view class="score">
          <uni-rate
            allow-half
            :value="2"
            :size="18"
            color="#C4CCD8"
            activeColor="#ED7043"
            readonly
          />
          <text v-if="gradeNum == 0">暂无评价</text>
          <text v-else>1分</text>
        </view>
      </view>
    </view>
    <view class="ping-fen">
      <view class="lable">
        <text style="color: #eb5b47; font-size: 40rpx; margin-right: 10rpx"
          >*</text>
        <text style="font-size: 32rpx; font-weight: 400; color: #34373b"
          >评分</text
        >
      </view>
      <view class="value">
        <uni-rate
          allow-half
          v-model="query.grade"
          :size="25"
          color="#C4CCD8"
          activeColor="#ED7043"
        />
      </view>
    </view>
    <view
      class="ping-fen"
      style="
        flex-direction: column;
        justify-content: flex-start;	
        align-items: flex-start;
      "
    >
      <view class="lable">
        <text style="color: #eb5b47; font-size: 40rpx; margin-right: 10rpx"
          >*</text
        >
        <text style="font-size: 32rpx; font-weight: 400; color: #34373b"
          >评价内容</text
        >
      </view>
      <view class="value" style="width: 100%">
        <u-input
          v-model="query.content"
          type="textarea"
          height="200"
		  maxlength='1000'
          placeholderStyle="padding-left:20rpx;color:#C4CCD8;font-size:30rpx"
          :border="false"
		  :auto-height='true'
          placeholder="请输入建议意见"
        />
      </view>
    </view>
    <fixedButton @click="addlist" :flag="status" />
  </view>
</template>

<script>
import fixedButton from "@/components/fixedButton/fixedButton.vue";
export default {
  components: {
    fixedButton,
  },
  data() {
    return {
      baseImgUrl: getApp().globalData.config.iamgeBaseUrl,
      status: false,
      query: {
        content: "",
        grade: 0,
      },
      gradeNum: 0,
    };
  },
  onLoad(e) {

  },
  methods: {
    addlist() {
      console.log(this.query);
      if (this.query.content && this.query.grade>0) {
       
          uni.showToast({
            title: "评价成功",
            duration: 1000,
          });
         
      } else if(!this.query.content) {
        uni.showToast({
          title: "请输入评价内容",
          icon: "none",
          duration: 2000,
        });
      }else {
        uni.showToast({
          title: "请选择评分分数",
          icon: "none",
          duration: 2000,
        });
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.container-main {
  box-sizing: border-box;
  padding: 20rpx;

  .enterprise-header {
    background: #ffffff;
    border-radius: 16rpx;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 20rpx;

    .enterprise-img {
      height: 100rpx;
      width: 100rpx;

      image {
        height: 100%;
        width: 100%;
        display: block;
      }
    }

    .enterprise-name {
      flex: 1;
      box-sizing: border-box;
      padding-left: 20rpx;

      .name-text {
        font-size: 36rpx;
        font-weight: 550;
        color: #34373b;
        margin-bottom: 15rpx;
      }

      .score {
        display: flex;
        align-items: center;

        text {
          margin-left: 20rpx;
          font-size: 26rpx;
          font-weight: 600;
          color: #ed7043;
        }
      }
    }
  }

  .ping-fen {
    margin-top: 20rpx;
    border-radius: 16rpx;
    background-color: #ffffff;
    box-sizing: border-box;
    padding: 30rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}
</style>