|
|
@@ -0,0 +1,252 @@
|
|
|
+<template>
|
|
|
+ <view class="flex-common-css">
|
|
|
+ <Nav title="评价" titleColor="#333" bgckgroundBox='#fff'></Nav>
|
|
|
+ <scroll-view :scroll-y="true" class="scroll-view-css" @scrolltolower="scrolltolower">
|
|
|
+ <view class="content-box">
|
|
|
+ <view class="fc-FB3D03 fs-24 mb-28 text-align-center">
|
|
|
+ 提交好评或建议，帮助骑手和商家做的更好
|
|
|
+ </view>
|
|
|
+ <view class="bgc-f p-24 b-rad-20 mb-18 box-sizing-border">
|
|
|
+ <view class="flex-justify-space">
|
|
|
+ <view class="fs-36 fw-600 fc-3">
|
|
|
+ 你对商家满意吗？
|
|
|
+ </view>
|
|
|
+ <view class="align-items-center mb-24" @click="clickShopCheck">
|
|
|
+ <uni-icons v-if="shopCheck" color="#41ABF5" type="checkbox-filled" size="20"></uni-icons>
|
|
|
+ <uni-icons v-else color="#ccc" type="circle" size="20"></uni-icons>
|
|
|
+ <view class="ml-2 fs-24 fc-6">
|
|
|
+ 匿名提交
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="shop-box align-items-center mb-48">
|
|
|
+ <image class="shop-img mr-20" src="../static/img/my/bg.png" mode=""></image>
|
|
|
+ <view class="fs-30 fc-3">
|
|
|
+ 2024-05-21 01:05 下单
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="align-items-center mb-26">
|
|
|
+ <view class="fs-30 fw-600 fc-0 mr-40">
|
|
|
+ 总体
|
|
|
+ </view>
|
|
|
+ <uni-rate v-model="formData.rateValueOne" margin="10" active-color="#FF7F00" color="#F1F1F1" />
|
|
|
+ <view class="fc-FF7F00 fs-28 ml-40">
|
|
|
+ {{formData.rateValueOne == 1?'非常差':formData.rateValueOne == 2?'一般':formData.rateValueOne == 3?'好':formData.rateValueOne == 4?'很棒':'非常棒'}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="align-items-center mb-60">
|
|
|
+ <view class="fs-30 fw-600 fc-0 mr-40">
|
|
|
+ 包装
|
|
|
+ </view>
|
|
|
+ <uni-rate v-model="formData.rateValueTwo" margin="10" active-color="#FF7F00" color="#F1F1F1" />
|
|
|
+ <view class="fc-FF7F00 fs-28 ml-40">
|
|
|
+ {{formData.rateValueTwo == 1?'非常差':formData.rateValueTwo == 2?'一般':formData.rateValueTwo == 3?'好':formData.rateValueTwo == 4?'很棒':'非常棒'}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="fs-36 fw-600 fc-3 mb-24">
|
|
|
+ 你对商品满意吗？
|
|
|
+ </view>
|
|
|
+ <view class="goods-box align-items-center">
|
|
|
+ <image class="goods-img mr-20" src="../static/img/my/bg.png" mode=""></image>
|
|
|
+ <view class="">
|
|
|
+ <view class="mb-16 fs-30 fc-3">
|
|
|
+ 小炒肉
|
|
|
+ </view>
|
|
|
+ <view class="align-items-center">
|
|
|
+ <uni-rate v-model="formData.rateValueThree" margin="10" active-color="#FF7F00"
|
|
|
+ color="#F1F1F1" />
|
|
|
+ <view class="fc-FF7F00 fs-28 ml-40">
|
|
|
+ {{formData.rateValueThree == 1?'非常差':formData.rateValueThree == 2?'一般':formData.rateValueThree == 3?'好':formData.rateValueThree == 4?'很棒':'非常棒'}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="bgc-f p-24 b-rad-20 mb-18 box-sizing-border">
|
|
|
+ <view class="flex-justify-space mb-24">
|
|
|
+ <view class="fs-36 fw-600 fc-3">
|
|
|
+ 你对骑手满意吗？
|
|
|
+ </view>
|
|
|
+ <view class="fs-24 fc-6">
|
|
|
+ 已对骑手匿名
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="rider-box align-items-center mb-50">
|
|
|
+ <image class="rider-img mr-18" src="../static/img/my/bg.png" mode=""></image>
|
|
|
+ <view class="">
|
|
|
+ <view class="mb-4 fs-30 fc-0">
|
|
|
+ 王欢
|
|
|
+ </view>
|
|
|
+ <view class="fc-6 fs-24">
|
|
|
+ 5月21日01:15左右送达
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="rider-rate align-items-center">
|
|
|
+ <view
|
|
|
+ class="rider-rate-but mr-18 scroll-view-css align-items-center flex-justify-center b-rad-200"
|
|
|
+ :class="formData.riderRate?'bgc-F6F6F6':'bgc-ECF7FE'" @click="formData.riderRate = false">
|
|
|
+ <image v-if="formData.riderRate" class="rider-rate-img mr-8"
|
|
|
+ src="@/static/img/my/bmy-no.png" mode=""></image>
|
|
|
+ <image v-else class="rider-rate-img mr-8" src="@/static/img/my/bmy-ok.png" mode=""></image>
|
|
|
+ <view class="fs-30" :class="formData.riderRate?'fc-0':'fc-41ABF5'">
|
|
|
+ 不满意
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="rider-rate-but scroll-view-css align-items-center flex-justify-center b-rad-200"
|
|
|
+ :class="formData.riderRate?'bgc-ECF7FE':'bgc-F6F6F6'" @click="formData.riderRate = true">
|
|
|
+ <image v-if="formData.riderRate" class="rider-rate-img mr-8" src="@/static/img/my/my-ok.png"
|
|
|
+ mode=""></image>
|
|
|
+ <image v-else class="rider-rate-img mr-8" src="@/static/img/my/my-no.png" mode=""></image>
|
|
|
+ <view class="fs-30" :class="formData.riderRate?'fc-41ABF5':'fc-0'">
|
|
|
+ 满意
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="bgc-f p-24 b-rad-20 mb-18 box-sizing-border">
|
|
|
+ <view class="fs-36 fw-600 fc-3 mb-8">
|
|
|
+ 请说说你的评价
|
|
|
+ </view>
|
|
|
+ <view class="textarea-box">
|
|
|
+ <textarea placeholder-style="color:#ccc" auto-height maxlength='100' placeholder="请输入" />
|
|
|
+ </view>
|
|
|
+ <view class="up-img-box align-items-center flex-wrap-wrap">
|
|
|
+ <view class="up-img" v-for="(itme, index) in imgList" :key="index">
|
|
|
+ <image class="img" src="../static/img/my/bg.png" mode=""></image>
|
|
|
+ <uni-icons @click="deleteImg(index)" class="delete-icons" color="#000" type="clear" size="20"></uni-icons>
|
|
|
+ </view>
|
|
|
+ <view class="add-img-box flex-direction flex-justify-center align-items-center bgc-F6F6F6">
|
|
|
+ <image class="add-img" src="@/static/img/my/sc.png" mode=""></image>
|
|
|
+ <view class="fs-24 fc-9">
|
|
|
+ 上传照片
|
|
|
+ </view>
|
|
|
+ <view class="fs-24 fc-9">
|
|
|
+ (最多6张)
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+ <view class="bot-box bgc-f">
|
|
|
+ <view class="bot-but fc-f fs-32 text-align-center" :class="formType?'bgc-4FB3EF':'bgc-B3DDFB'">
|
|
|
+ 提交评价
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ components: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ formType: false,
|
|
|
+ shopCheck: false,
|
|
|
+ formData: {
|
|
|
+ rateValueOne: 1, //总体
|
|
|
+ rateValueTwo: 1, //包装
|
|
|
+ rateValueThree: 1, //商品
|
|
|
+ riderRate: false, //骑手评价
|
|
|
+ rate: '',
|
|
|
+ imgList: []
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(data) {},
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ deleteImg(index) {
|
|
|
+ this.formData.imgList.splice(index, 1)
|
|
|
+ },
|
|
|
+ clickShopCheck() {
|
|
|
+ this.shopCheck = !this.shopCheck
|
|
|
+ },
|
|
|
+ scrolltolower() {
|
|
|
+ console.log('触底');
|
|
|
+ },
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .content-box {
|
|
|
+ padding: 24rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bot-box {
|
|
|
+ width: 100%;
|
|
|
+ padding: 12rpx 32rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bot-but {
|
|
|
+ width: 100%;
|
|
|
+ height: 92rpx;
|
|
|
+ line-height: 92rpx;
|
|
|
+ border-radius: 200rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .shop-img {
|
|
|
+ width: 88rpx;
|
|
|
+ height: 88rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods-img {
|
|
|
+ width: 108rpx;
|
|
|
+ height: 108rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .rider-img {
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .rider-rate-img {
|
|
|
+ width: 48rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .rider-rate-but {
|
|
|
+ padding: 16rpx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .textarea-box {
|
|
|
+ width: 100%;
|
|
|
+ height: 200rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .up-img {
|
|
|
+ width: 204rpx;
|
|
|
+ height: 204rpx;
|
|
|
+ margin: 0 8rpx 8rpx 0;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ border-radius: 4rpx;
|
|
|
+ }
|
|
|
+ .delete-icons{
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .add-img-box {
|
|
|
+ width: 204rpx;
|
|
|
+ height: 204rpx;
|
|
|
+ border: 1px dashed #666;
|
|
|
+
|
|
|
+ .add-img {
|
|
|
+ width: 56rpx;
|
|
|
+ height: 56rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
