|
|
<template>
|
|
|
<view class="page">
|
|
|
|
|
|
<view class="oinfo" v-if="info">
|
|
|
|
|
|
<!-- 商品信息 -->
|
|
|
<view class="yycon odrcell" v-if="info.orderItemList&&info.orderItemList.length>0">
|
|
|
<view class="oscon" v-for="(item, index) in info.orderItemList" :key="index">
|
|
|
<view class="osimg imgload">
|
|
|
<image class="osimg" v-if="item.pic" :src="item.pic" mode="aspectFill"></image>
|
|
|
</view>
|
|
|
<view class="osrcon">
|
|
|
<view class="osname">
|
|
|
{{item.productName?item.productName:''}}
|
|
|
</view>
|
|
|
<view class="oscell">
|
|
|
<text class="txt">规格：{{ retSku(item.spData) }}</text>
|
|
|
</view>
|
|
|
<view class="oscell">
|
|
|
<text class="txt">单价：￥{{item.salePrice}}</text>
|
|
|
</view>
|
|
|
<view class="oscell">
|
|
|
<text class="txt">数量：{{item.quantity}}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<!-- 评价信息 -->
|
|
|
<view class="pjcon">
|
|
|
|
|
|
<view class="fcon">
|
|
|
<!-- <button @click="handleUploadClick">上传</button> -->
|
|
|
<view class="fcell" @click="handleUploadClick">
|
|
|
<image class="img" src="/static/image/camera.png"></image>
|
|
|
<view class="ftxt">添加视频/图片</view>
|
|
|
</view>
|
|
|
<xe-upload ref="XeUpload" :options="uploadOptions" @callback="handleUploadCallback"></xe-upload>
|
|
|
</view>
|
|
|
<view class="srcon">
|
|
|
<uni-easyinput type="textarea" v-model="value" placeholder="请从多个角度输入商品的评价内容！"></uni-easyinput>
|
|
|
</view>
|
|
|
|
|
|
<view class="fcon">
|
|
|
<view class="pfcon">
|
|
|
<view class="pftxt">综合评价</view>
|
|
|
<uni-rate v-model="rateValue1" @change="onChange1" />
|
|
|
</view>
|
|
|
<view class="pfcon">
|
|
|
<view class="pftxt">物流评价</view>
|
|
|
<uni-rate v-model="rateValue2" @change="onChange2" />
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<view class="submitcon">
|
|
|
<button type="primary" class="bbtn" @click="submit('valiForm')">发布</button>
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<!-- 提示信息弹窗 -->
|
|
|
<uni-popup ref="message" type="message">
|
|
|
<uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
|
|
|
</uni-popup>
|
|
|
|
|
|
<!-- 是否登录 -->
|
|
|
<openlogin ref="loginId" @getPhoneNumber="getPhoneNumber"></openlogin>
|
|
|
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { myCache } from '../../utils/utils.js';
|
|
|
import openlogin from "../components/openlogin.vue";
|
|
|
export default {
|
|
|
components: {
|
|
|
openlogin
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
openId:"",
|
|
|
phone:"",
|
|
|
userid:"",
|
|
|
messageText: '', //错误提示框
|
|
|
msgType: 'error',
|
|
|
id:"",
|
|
|
value:"",
|
|
|
rateValue1:null,
|
|
|
rateValue2:null,
|
|
|
rateValue3:null,
|
|
|
info:{
|
|
|
sh_state:"1",
|
|
|
sh_name:"收货人",
|
|
|
sh_phone:"18900000001",
|
|
|
sh_address:"收货地址收货地址收货地址收货地址",
|
|
|
orderid:"ord23258876543",
|
|
|
business:"π瑜伽（淮海中路店）",
|
|
|
productid:"1",
|
|
|
productprice:39.9,
|
|
|
productname:"减脂|减重|垫子上瑜伽",
|
|
|
img:'../../static/image/theme/p1.jpg',
|
|
|
productspecs:"M 白",
|
|
|
productnum:1,
|
|
|
productunit:"个",
|
|
|
orderstate:'1',
|
|
|
orderdate:"2025-06-23 10:26:09",
|
|
|
room:"VIP1",
|
|
|
teacher:"教练A",
|
|
|
paytype:"支付宝",
|
|
|
paydate:"2025-06-23 10:26:09",
|
|
|
ordershipfee:"0.0",
|
|
|
jymoney:39.9,
|
|
|
sfmoney:39.9,
|
|
|
kdno:"1098768799232",
|
|
|
icon:"../../static/image/product/sp1.jpg",
|
|
|
username:"张三",
|
|
|
tel:"18000000001",
|
|
|
address:"江苏省扬州市江都市地址信息1地址信息2地址信息3地址信息4地址信息5"
|
|
|
},
|
|
|
steps:
|
|
|
[
|
|
|
{title:'已付款',desc:'2025-02-05 13:30'},
|
|
|
{title:'已预约',desc:'2025-02-05 13:30'},
|
|
|
{title:'教练已确认',desc:'2025-02-05 13:30'},
|
|
|
{title:'店长确认，准备上课',desc:''},
|
|
|
{title:'课程结束',desc:''},
|
|
|
],
|
|
|
uploadOptions: {
|
|
|
// url: 'http://192.168.31.185:3000/api/upload', // 不传入上传地址则返回本地链接
|
|
|
},
|
|
|
};
|
|
|
},
|
|
|
onLoad(options) {
|
|
|
if(options.id)
|
|
|
{
|
|
|
this.id=parseInt(options.id);
|
|
|
this.getinfo();
|
|
|
}
|
|
|
},
|
|
|
onShow(){
|
|
|
this.openId = myCache('openId');
|
|
|
var user = myCache('user');
|
|
|
this.userid = user.userid? user.userid:'';
|
|
|
this.phone = user.userphone;
|
|
|
if(this.userid==""||this.userid=="0"){
|
|
|
uni.navigateTo({
|
|
|
url: `/pages/login/login`
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
onChange1(e) {
|
|
|
console.log('rate发生改变:' + JSON.stringify(e))
|
|
|
// console.log(this.rateValue);
|
|
|
},
|
|
|
onChange2(e) {
|
|
|
console.log('rate发生改变:' + JSON.stringify(e))
|
|
|
// console.log(this.rateValue);
|
|
|
},
|
|
|
onChange3(e) {
|
|
|
console.log('rate发生改变:' + JSON.stringify(e))
|
|
|
// console.log(this.rateValue);
|
|
|
},
|
|
|
handleUploadClick() {
|
|
|
// 使用默认配置则不需要传入第二个参数
|
|
|
// type: ['image', 'video', 'file'];
|
|
|
this.$refs.XeUpload.upload('file', {});
|
|
|
// this.$refs.XeUpload.upload('image', {
|
|
|
// count: 6,
|
|
|
// sizeType: ['original', 'compressed'],
|
|
|
// sourceType: ['album'],
|
|
|
// });
|
|
|
},
|
|
|
handleUploadCallback(e) {
|
|
|
// e.type: ['choose', 'success', 'warning']
|
|
|
// choose 是options没有传入url，返回临时链接时触发
|
|
|
// success 是上传成功返回对应的数据时触发
|
|
|
// warning 上传或者选择文件失败触发
|
|
|
// ......
|
|
|
},
|
|
|
getPhoneNumber(e){
|
|
|
if(e.phone){
|
|
|
this.phone = e.phone
|
|
|
}
|
|
|
if(e.userid){
|
|
|
this.userid = e.userid
|
|
|
}
|
|
|
},
|
|
|
iflogin(){
|
|
|
this.openId = myCache('openId');
|
|
|
var user = myCache('user');
|
|
|
this.userid = user.userid? user.userid:'';
|
|
|
this.phone = user.userphone;
|
|
|
if(this.userid==""||this.userid=="0"||this.phone==""){
|
|
|
uni.navigateTo({
|
|
|
url: `/pages/login/login`
|
|
|
});
|
|
|
return false;
|
|
|
}
|
|
|
else{
|
|
|
return true;
|
|
|
}
|
|
|
},
|
|
|
goback(){
|
|
|
uni.navigateBack({
|
|
|
delta: 1
|
|
|
});
|
|
|
},
|
|
|
retSku(spData){
|
|
|
var sels=[];
|
|
|
if(spData){
|
|
|
var suk= JSON.parse(spData);
|
|
|
var keys=Object.keys(suk);
|
|
|
keys.forEach(dd=>{
|
|
|
sels.push(dd+":"+suk[dd])
|
|
|
});
|
|
|
}
|
|
|
return sels.join(',');
|
|
|
},
|
|
|
async getinfo() {
|
|
|
uni.showLoading({
|
|
|
title: '数据加载中...'
|
|
|
});
|
|
|
const {data: res} = await uni.$http.get('/api/order/orderDetail', {orderId:this.id});
|
|
|
if(res){
|
|
|
// 订单信息
|
|
|
this.info=res;
|
|
|
this.$forceUpdate();
|
|
|
}
|
|
|
else{
|
|
|
uni.showModal({
|
|
|
title: '提示',
|
|
|
content: '当前订单信息不存在..',
|
|
|
cancelText: '取消',
|
|
|
confirmText: '确定',
|
|
|
success: ress => {
|
|
|
// 返回
|
|
|
uni.navigateBack({
|
|
|
delta: 1
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
submit(ref) {
|
|
|
var that = this;
|
|
|
// 判断是否可以提交？
|
|
|
that.savedo();
|
|
|
},
|
|
|
async savedo() {
|
|
|
var that = this;
|
|
|
try {
|
|
|
|
|
|
const {
|
|
|
data: res
|
|
|
} = await uni.$http.post("/member/update", that.valiFormData);
|
|
|
if (res.msg == "update member succeeded") {
|
|
|
this.msgType = 'success';
|
|
|
this.messageText = `提交成功！`;
|
|
|
this.$refs.message.open();
|
|
|
myCache("ifuserEdit", true);
|
|
|
setTimeout(() => {
|
|
|
// 返回 关闭当前页面
|
|
|
uni.navigateBack({
|
|
|
delta: 1
|
|
|
});
|
|
|
}, 2000);
|
|
|
} else {
|
|
|
this.msgType = 'error';
|
|
|
this.messageText = res.msg ? res.msg : '提交失败！',
|
|
|
this.$refs.message.open();
|
|
|
}
|
|
|
} catch (res) {
|
|
|
this.msgType = 'error';
|
|
|
this.messageText = res.msg ? res.msg : '提交失败！',
|
|
|
this.$refs.message.open();
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
::v-deep .uni-collapse-item__title-box{
|
|
|
padding: 0 !important;
|
|
|
}
|
|
|
::v-deep .uni-collapse-item__title-text{
|
|
|
font-weight: 600;
|
|
|
}
|
|
|
.page{
|
|
|
padding: 0;
|
|
|
position: relative;
|
|
|
background-image: url('@/static/image/bg.jpg');
|
|
|
background-attachment: fixed;
|
|
|
background-size: cover;
|
|
|
background-position: center center;
|
|
|
min-height: calc(100vh - var(--window-top) - var(--window-bottom));
|
|
|
}
|
|
|
.ret{
|
|
|
position: fixed;
|
|
|
top:20rpx;
|
|
|
left:20rpx;
|
|
|
background: rgba(0, 0, 0, .3);
|
|
|
height: 60rpx;
|
|
|
width: 60rpx;
|
|
|
border-radius: 50% 50%;
|
|
|
text-align: center;
|
|
|
line-height: 60rpx;
|
|
|
z-index: 9999;
|
|
|
}
|
|
|
.submitcon{
|
|
|
position: fixed;
|
|
|
display: flex;
|
|
|
bottom: 0;
|
|
|
left: 0;
|
|
|
width: 100%;
|
|
|
height: 140rpx;
|
|
|
background-color: #FFFFFF;
|
|
|
justify-content: center;
|
|
|
}
|
|
|
.oscon{
|
|
|
margin:0;
|
|
|
background-color: #f3fafa;
|
|
|
border-radius: 16rpx;
|
|
|
padding: 16rpx;
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
justify-content: center;
|
|
|
.osimg{
|
|
|
width: 120rpx;
|
|
|
height: 120rpx;
|
|
|
border-radius: 10rpx;
|
|
|
}
|
|
|
.osrcon{
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
flex: 1;
|
|
|
justify-content: flex-start;
|
|
|
margin-left: 50rpx;
|
|
|
}
|
|
|
.osname{
|
|
|
line-height: 48rpx;
|
|
|
font-size:28rpx;
|
|
|
color:#303133;
|
|
|
}
|
|
|
.oscell{
|
|
|
font-size: 24rpx;
|
|
|
color:#747474;
|
|
|
}
|
|
|
.omoney{
|
|
|
display: flex;
|
|
|
width: 100rpx;
|
|
|
color:#333;
|
|
|
font-size: 28rpx;
|
|
|
align-items: flex-end;
|
|
|
justify-content: flex-end;
|
|
|
}
|
|
|
}
|
|
|
.ydcon{
|
|
|
position: relative;
|
|
|
}
|
|
|
.yyright{
|
|
|
position: absolute;
|
|
|
right: 100rpx;
|
|
|
top:50rpx;
|
|
|
}
|
|
|
.odrcell{
|
|
|
border-radius: 10rpx;
|
|
|
}
|
|
|
.pjcon{
|
|
|
position: relative;
|
|
|
}
|
|
|
.srcon{
|
|
|
margin-top: 20rpx;
|
|
|
}
|
|
|
.pfcon{
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
justify-content: flex-start;
|
|
|
width: 100%;
|
|
|
align-items: center;
|
|
|
padding:10rpx;
|
|
|
}
|
|
|
.pftxt{
|
|
|
width: 140rpx;
|
|
|
}
|
|
|
.fcon{
|
|
|
margin-top: 20rpx;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
background: #fff;
|
|
|
border:1rpx solid #e5e5e5;
|
|
|
padding: 20rpx;
|
|
|
border-radius: 8rpx;
|
|
|
}
|
|
|
.fcell{
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
}
|
|
|
.img{
|
|
|
width: 80rpx;
|
|
|
height: 80rpx;
|
|
|
}
|
|
|
.oinfo{
|
|
|
padding:20rpx;
|
|
|
position: relative;
|
|
|
margin-bottom: 160rpx;
|
|
|
|
|
|
.ozc{
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
background-color: #becba0 ;
|
|
|
padding: 20rpx;
|
|
|
border-radius: 16rpx;
|
|
|
.ozstate{
|
|
|
font-size: 28rpx;
|
|
|
color: #333;
|
|
|
width: 100%;
|
|
|
margin: 10rpx 0;
|
|
|
}
|
|
|
.oztip{
|
|
|
font-size: 26rpx;
|
|
|
color: #333;
|
|
|
width: 100%;
|
|
|
margin: 0 0 20rpx;
|
|
|
}
|
|
|
}
|
|
|
.owc{
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
background-color: #00A99A ;
|
|
|
padding: 20rpx;
|
|
|
border-radius: 16rpx;
|
|
|
.ozstate{
|
|
|
font-size: 28rpx;
|
|
|
color: #FFF;
|
|
|
width: 100%;
|
|
|
margin: 6rpx 0 0;
|
|
|
}
|
|
|
.oztip{
|
|
|
font-size: 26rpx;
|
|
|
color: #FFF;
|
|
|
width: 100%;
|
|
|
margin: 0 0 6rpx;
|
|
|
}
|
|
|
}
|
|
|
.oztgray{
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
background-color: #ddd;
|
|
|
padding: 20rpx;
|
|
|
border-radius: 16rpx;
|
|
|
.ozstate{
|
|
|
font-size: 28rpx;
|
|
|
color: #333;
|
|
|
width: 100%;
|
|
|
margin: 6rpx 0;
|
|
|
}
|
|
|
.oztip{
|
|
|
font-size: 26rpx;
|
|
|
color: #747474;
|
|
|
width: 100%;
|
|
|
margin: 0 0 20rpx;
|
|
|
}
|
|
|
}
|
|
|
.oztorange{
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
background-color: #faa755;
|
|
|
padding: 20rpx;
|
|
|
border-radius: 16rpx;
|
|
|
.ozstate{
|
|
|
font-size: 28rpx;
|
|
|
color: #FFF;
|
|
|
width: 100%;
|
|
|
margin: 6rpx 0;
|
|
|
}
|
|
|
.oztip{
|
|
|
font-size: 26rpx;
|
|
|
color: #FFF;
|
|
|
width: 100%;
|
|
|
margin: 0 0 20rpx;
|
|
|
}
|
|
|
}
|
|
|
.yycon{
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
justify-content: center;
|
|
|
background-color: #FFFFFF;
|
|
|
margin-top: 20rpx;
|
|
|
padding: 20rpx 20rpx;
|
|
|
.atitle{
|
|
|
padding: 10rpx 0 10rpx;
|
|
|
color:#303133;
|
|
|
font-size: 30rpx;
|
|
|
font-weight: 600;
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
justify-content: space-between;
|
|
|
.price{
|
|
|
font-size: 36rpx;
|
|
|
}
|
|
|
}
|
|
|
.olist{
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
padding: 0;
|
|
|
width: 100%;
|
|
|
.ocell{
|
|
|
font-size: 26rpx;
|
|
|
color:#747474;
|
|
|
padding: 10rpx 0 10rpx;
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
}
|
|
|
.ocell1{
|
|
|
font-size: 26rpx;
|
|
|
color:#747474;
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
}
|
|
|
}
|
|
|
.sqcon{
|
|
|
padding: 20rpx;
|
|
|
margin: 20rpx 0;
|
|
|
background-color: #f5f5f5;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
border-radius: 10rpx;
|
|
|
.sqlist{
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
justify-content: space-between;
|
|
|
color: #333333;
|
|
|
font-size: 26rpx;
|
|
|
line-height: 50rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.red{
|
|
|
color:#ff3d0e;
|
|
|
}
|
|
|
.green{
|
|
|
color:#00cd00;
|
|
|
}
|
|
|
|
|
|
::v-deep.uni-radio-input-checked{
|
|
|
background-color: #00A99A !important;
|
|
|
border-color: #00A99A !important;
|
|
|
background-clip: content-box!important;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
::v-deep.uni-radio-input-checked::before{
|
|
|
display: none!important;
|
|
|
}
|
|
|
|
|
|
.bbtn {
|
|
|
margin: 20rpx 10rpx 54rpx;
|
|
|
font-size: 32rpx;
|
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
|
font-weight: 500;
|
|
|
color: #FCFCFD;
|
|
|
width: 560rpx;
|
|
|
height: 76rpx;
|
|
|
line-height: 76rpx;
|
|
|
background: #00A99A;
|
|
|
box-shadow: 0rpx 12rpx 64rpx 2rpx rgba(0,169,154,0.4);
|
|
|
border-radius: 10rpx;
|
|
|
opacity: 1;
|
|
|
&::after{
|
|
|
border:none;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
</style>
|
