v1.0

pages/evaluate/evaluate.vue

@@ -0,0 +1,187 @@
+<template>
+  <layout class="evaluate">
+    <uv-navbar
+      :fixed="false"
+      title="评价"
+      left-arrow
+      @leftClick="$onClickLeft"
+    />
+    <view class="evaluate-card mb-20">
+      <div class="evaluate-item">
+        <view class="evaluate-label">商品评价</view>
+        <uv-rate
+          :count="5"
+          v-model="productScore"
+        ></uv-rate>
+      </div>
+      <uv-line color="#E6E6E6"></uv-line>
+      <view class="evaluate-content">
+        <uv-textarea
+          v-model="comment"
+          placeholder="请填写您遇到的问题，这将帮助我们为您提供更好的服务"
+        ></uv-textarea>
+        <uv-upload
+          :fileList="pics"
+          name="1"
+          multiple
+          :maxCount="10"
+          @afterRead="afterRead"
+          @delete="handleDeletePic"
+        ></uv-upload>
+
+      </view>
+    </view>
+
+    <view class="card evaluate-card noBorder">
+      <view class="card-head">
+        <view class="card-title">服务评价</view>
+      </view>
+      <view class="card-content">
+        <div class="evaluate-item min">
+          <view class="evaluate-label">服务评价</view>
+          <uv-rate
+            :count="5"
+            v-model="serviceScore"
+          ></uv-rate>
+        </div>
+      </view>
+    </view>
+
+
+    <div class="form-buttons">
+      <uv-button
+        round
+        block
+        type="primary"
+        @tap="handleOrderComments"
+      >
+        提交评论
+      </uv-button>
+    </div>
+  </layout>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { navigateTo, back } from '@/utils/router'
+import { onLoad } from '@dcloudio/uni-app'
+import { useMainStore } from '@/store/store'
+import { orderComments, orderCancel, orderInfo, orderTake, orderDelete } from '@/api/order'
+
+
+import {
+  getAddressDel,
+  getAddressDefault,
+  getAddressAddAndEdit,
+  getAddressList,
+  getAddressCityList,
+} from '@/api/address'
+
+const productScore = ref(0)
+const serviceScore = ref(0)
+const unique = ref(null)
+const pics = ref([])
+const comment = ref("")
+const orderInfoData = ref(null)
+
+const handleOrderComments = async () => {
+  const res = await orderComments([{
+    "comment": comment.value,
+    "pics": pics.value.toString(),
+    "productScore": productScore.value,
+    "serviceScore": serviceScore.value,
+    "unique": unique.value,
+  }])
+  console.log("--> % handleOrderComments % res:\n", res)
+}
+
+const handleDeletePic = (event) => {
+  pics.value.splice(event.index, 1)
+}
+
+
+const afterRead = async (event) => {
+  // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+  let lists = [].concat(event.file)
+  let fileListLen = this[`fileList${event.name}`].length
+  lists.map((item) => {
+    this[`fileList${event.name}`].push({
+      ...item,
+      status: 'uploading',
+      message: '上传中'
+    })
+  })
+  for (let i = 0; i < lists.length; i++) {
+    const result = await uploadFilePromise(lists[i].url)
+    let item = this[`fileList${event.name}`][fileListLen]
+    this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+      status: 'success',
+      message: '',
+      url: result
+    }))
+    fileListLen++
+  }
+}
+
+const uploadFilePromise = (url) => {
+  return new Promise((resolve, reject) => {
+    let a = uni.uploadFile({
+      url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+      filePath: url,
+      name: 'file',
+      formData: {
+        user: 'test'
+      },
+      success: (res) => {
+        setTimeout(() => {
+          resolve(res.data.data)
+        }, 1000)
+      }
+    });
+  })
+}
+
+
+
+onLoad((option) => {
+  unique.value = option.unique
+  // unique.value = option.orderId
+})
+
+
+
+</script>
+
+<style lang="less">
+.evaluate-item {
+  display: flex;
+  align-items: center;
+  padding: 30rpx 34rpx;
+
+  &.min {
+    .evaluate-label {
+      font-size: 28rpx;
+      color: #333333;
+    }
+  }
+
+  .evaluate-label {
+    margin-right: 24rpx;
+    font-size: 32rpx;
+    color: #333333;
+  }
+}
+
+.evaluate-content {
+  padding: 34rpx;
+
+  .uv-textarea {
+    padding: 0;
+    border: 0;
+  }
+}
+
+.evaluate-card {
+  background: #fff;
+}
+</style>