root
/
school_uni
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

订单评价

master
tianyi 4 weeks ago
parent
b6450c16b1
commit
3784422907
1 changed files with 403 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 403
      package1/order/orderEvaluate.vue

403
package1/order/orderEvaluate.vue
View File

@ -0,0 +1,403 @@
<template>
<!-- 发布订单评价 -->
<view class="page1">
<view class="title">
<view class="title-sreach">
<view class="back-btn" @tap="back" :style="{'padding-top': menuButtonInfo.top +'px'}">
<uni-icons type="left" size="28"></uni-icons>
</view>
<view class="title-name" :style="{'padding-top': menuButtonInfo.top +'px'}">
写评价
</view>
</view>
</view>
<view class="content">
<view class="box1">
<view style="width: 100%;line-height: 35px;font-size: 14px;font-weight: 700;">
竹仔园牛仔农庄(第六分店)
</view>
<view style="display: flex;padding: 10px;background: rgba(247, 248, 248, 1);border-radius: 10px;">
<view class="goods-img">
<img src="/static/images/img/shangpintu.png" alt="">
</view>
<view class="goods-content">
<view class="goods-name">
牛仔农庄(医专店)
</view>
<view class="goods-content-center">
<view class="goods-deal1">
打分；不要啦
</view>
</view>
<view class="goods-content-bottom">
<view style="width: 50%;">
X1
</view>
<view class="pintuan-left-price">
￥90.00
</view>
</view>
</view>
</view>
</view>
<view class="box1" style="padding: 0;">
<view class="eval-title">
- 写下真实体验，帮助万千用户选店 -
</view>
<view class="eval-name">
<view class="eval-name1">
竹仔园牛仔农庄(第六分店)
</view>
<view class="eval-num">
<view class="eval-num1">
您对本次消费体验还满意吗？
</view>
<view style="display: flex;">
<view v-for="(item,index) in evalNumList" :key="index" @tap="shopEvaluateNum = item.index" style="flex: 1;text-align: center;font-weight: 700;">
<img v-if="shopEvaluateNum >=item.index" :src="item.checked" alt="" class="eval-img" />
<img v-else :src="item.noChecked" alt="" class="eval-img" />
<view>{{item.name}}</view>
</view>
</view>
</view>
<view class="eval-num">
<view class="eval-num1">
您对本次配送人员还满意吗？
</view>
<view style="display: flex;">
<view v-for="(item,index) in evalNumList" :key="index" @tap="manEvaluateNum = item.index" style="flex: 1;text-align: center;font-weight: 700;">
<img v-if="manEvaluateNum >=item.index" :src="item.checked" alt="" class="eval-img" />
<img v-else :src="item.noChecked" alt="" class="eval-img" />
<view>{{item.name}}</view>
</view>
</view>
</view>
<view class="eval-num" style="border: none;">
<textarea name="" id="" cols="30" rows="10" placeholder="有什么想说的吗？可以写下来，提交给我们" style="width: 100%;font-size: 14px;padding: 15px;height: 100px;"></textarea>
</view>
<view class="eval-num" style="border: none;padding: 0 15px;display: flex;">
<view class="upload-img" @tap="pictureAdd"
style="background: #eee;text-align: center;line-height: 160rpx;">
<uni-icons type="camera" size="28" color="#777"></uni-icons>
</view>
<view style="flex: 1;display: flex;">
<view v-if="orderPicture !=''"
:key="index" style="width: 160rpx;height: 160rpx;margin-left: 20rpx;">
<img :src="orderPicture" alt="" class="upload-img">
</view>
<view style="height: 80px;line-height: 20px;padding: 20px 0 0 10px;color: #777;">
发图/发视频能更有效地帮助他人哦~
</view>
</view>
</view>
<view style="border: none;padding: 0 15px;display: flex;height: 50px;line-height: 50px;">
<view v-if="selected == 'niming'" @tap="checkVoucher('shiming')" class="radio-check">
<uni-icons type="checkmarkempty" size="12"></uni-icons>
</view>
<view class="radio-no-check" @tap="checkVoucher('niming')" v-else></view>
<view style="font-size: 14px;font-weight: 700;color: #777;padding-right: 10px;">
匿名评价
</view>
<view style="font-weight: 700;color: #777;">
对商家和其他用户隐藏头像和昵称
</view>
</view>
</view>
</view>
<view class="bottom">
<view class="bottom-btn">
发布
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
selected:'niming',
orderPicture:'',
menuButtonInfo: {},
shopEvaluateNum:0,
manEvaluateNum:0,
evalNumList:[{
name:'很糟糕',
checked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/aa045ef1faca4130a9483688054e5620.png',
noChecked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/f224a2ef2cf44280a1eeaa7ccd76bf2b.png',
index:1
},{
name:'较差',
checked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/b0630e0ef7424214853ff4b1814e4607.png',
noChecked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/66c7a64c17574d74997bf86d1e8ddf60.png',
index:2
},{
name:'一般',
checked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/4c815fc9ca7e417b9f60ac6583251c8d.png',
noChecked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/b27134c1ec174ad0910349692d08df7a.png',
index:3
},{
name:'还可以',
checked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/8ab48411bf1a451097fdc4103b5ae44c.png',
noChecked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/8f705c0318e747e5b08c5099f04eb9ba.png',
index:4
},{
name:'超预期',
checked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/90ef5af58d314c1bbabe8bd48aa49d22.png',
noChecked:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/c1cce0db39264c6ea9b533137153fc36.png',
index:5
}]
}
},
onLoad(option) {
},
onShow() {
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
},
methods: {
checkVoucher(type) {
this.selected = type;
},
pictureAdd(id, huan) {
let that = this
uni.chooseMedia({
count: 1,
mediaType: ['image'],
sourceType: ['album'],
success(res) {
uni.showLoading({
title: '加载中...',
mask: true
})
for (let i = 0; i < res.tempFiles.length; i++) {
that.upLoadFile(res.tempFiles[i].tempFilePath)
}
}
})
},
async upLoadFile(path) {
let that = this;
let hiver_token = uni.getStorageSync("hiver_token")
await uni.uploadFile({
url: that.tui.interfaceUrl() + '/upload/file',
filePath: path,
name: 'file',
header: {
"content-type": "multipart/form-data",
'accessToken': hiver_token
},
formData: {},
success: (uploadFileRes) => {
let pathData = JSON.parse(uploadFileRes.data)
this.orderPicture = pathData.result
that.$forceUpdate()
},
fail: (err) => {
uni.hideLoading();
uni.showToast({
title: JSON.stringify(err),
icon: 'none'
})
}
});
await setTimeout(res => {
uni.hideLoading();
}, 1000)
},
back() {
uni.navigateBack()
}
}
}
</script>
<style lang="scss">
page {
width: 100%;
min-height: 100%;
font-size: 24rpx;
background: #F5F8F5;
color: #00231C;
}
.page1 {
width: 100%;
min-height: 100vh;
font-size: 24rpx;
position: relative;
display: flex;
flex-direction: column;
}
.title {
flex-shrink: 0;
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/9c27a07c0b5b40d9b5b97cb466d74c6b.png') no-repeat;
background-size: 100%;
width: 100%;
height: 400rpx;
padding-bottom: 20rpx;
}
.title-sreach{
width: 100%;
display: flex;
height: 200rpx;
position: relative;
}
.back-btn{
position: absolute;
}
.title-name{
padding-top: 55px;
font-size: 36rpx;
font-weight: 700;
flex: 1;
text-align: center;
}
.content {
flex: 1;
width: 95%;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
position: absolute;
top: 200rpx;
left: 2.5%;
}
.box1 {
width: 100%;
margin: 0 auto 20rpx;
background: #fff;
border-radius: 20rpx;
padding: 20rpx;
}
.goods-img {
width: 160rpx;
height: 160rpx;
position: relative;
img {
width: 100%;
background-size: 100%;
height: 100%;
}
}
.goods-content {
flex: 1;
padding-left: 20rpx;
}
.goods-name {
font-size: 32rpx;
font-weight: 900;
}
.goods-content-center {
display: flex;
margin: 16rpx 0;
color: #777;
}
.goods-deal1 {
width: 60%;
}
.goods-content-bottom {
display: flex;
line-height: 28px;
color: #777;
}
.pintuan-left-price {
width: 50%;
text-align: right;
font-weight: 700;
color: #000;
}
.eval-img{
width: 46px;
height: 46px;
background-size: 100%;
}
.eval-title{
height: 54px;
font-size: 14px;
text-align: center;
background: rgba(235, 255, 243, 1);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-top: 1px solid rgba(178, 255, 208, 1);
border-left: 1px solid rgba(178, 255, 208, 1);
border-right: 1px solid rgba(178, 255, 208, 1);
z-index: 77;
line-height: 44px;
}
.eval-name{
margin-top: -10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
z-index: 88;
display: block;
overflow: hidden;
background: #fff;
}
.eval-name1{
height: 54px;
font-size: 20px;
font-weight: 700;
text-align: center;
border-bottom: 1px solid #eee;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
line-height: 54px;
overflow: hidden;
display: block;
}
.eval-num{
padding-bottom: 15px;
border-bottom: 1px solid #eee;
}
.eval-num1{
height: 20px;
font-size: 14px;
margin: 15px;
font-weight: 700;
}
.upload-img {
width: 160rpx;
height: 160rpx;
}
.radio-check {
background: linear-gradient(90deg, #e3ff96, #a6ffea);
width: 20px;
height: 20px;
border-radius: 20px;
text-align: center;
line-height: 20px;
margin: 15px 10px 0 0;
}
.radio-no-check {
width: 20px;
height: 20px;
border-radius: 20px;
border: 1px solid #eee;
margin: 15px 10px 0 0;
}
.bottom-btn{
width: 95%;
height: 50px;
line-height: 50px;
text-align: center;
margin: 11px auto;
border-radius: 50px;
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
font-size: 16px;
font-weight: 700;
}
.bottom{
overflow: hidden;
height: 86px;
background:#fff;
}
</style>
Write Preview
Loading…
Cancel
Save