czg_team/appointment_weapp
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

初始化

Browse Source
This commit is contained in:
魏啾
2024-03-21 15:43:18 +08:00
parent 08c5d22de6
commit fab2d5f480
534 changed files with 76501 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

623
pages/mall/order/orderInfo.vue Normal file
View File

@@ -0,0 +1,623 @@
<template>
<view class="index" :style="[theme]">
<view class="onecontent">
<view class="onecontentone">
<text v-if="datalist.status == 0">待付款</text>
<text v-if="datalist.status == 1">待发货</text>
<text v-if="datalist.status == 2">待收货</text>
<text v-if="datalist.status == 3">已收货/评价</text>
<text v-if="datalist.status == 4">退款中 </text>
<text v-if="datalist.status == 5">退款成功</text>
<text v-if="datalist.status == 6">取消订单</text>
<text v-if="datalist.status == 7">已拒绝</text>
</view>
<view class="onecontenttow">
感谢您的支持，欢迎再次光临
</view>
<view class="onecontentthere flex-between">
<view class="onecontentthere_one" v-if="datalist.status == 5 || datalist.status == 3 "
@click="orderorderdelete(datalist)">
删除订单
</view>
<view class="onecontentthere_tow"
v-if="datalist.status == 1 || datalist.status == 2 ||datalist.status == 3"
@click="orderordercancelrefund(datalist)">
申请退款
</view>
</view>
</view>
<view class="towcontent" >
<view class="towcontentone flex-between">
<view class="towcontentone_one flex-start">
<u-icon name="home" color="#ffffff" size="20"></u-icon>
<text class="towcontentone_one_text">{{datalist.store_title}}</text>
</view>
<u-icon @click="phonefill(item.store_mobile)" name="phone-fill" color="#ffffff" size="20"></u-icon>
</view>
<view class="towcontenttow flex-start" v-for="(item,index) in datalist.goods" :key="index" @click="detailsInfo(item.goods_id)">
<image class="towcontenttow_image" :src="item.img" mode="aspectFill"></image>
<view class="towcontenttowone flex-colum-start">
<view class="towcontenttowone_one">
{{item.title}}
</view>
<view class="towcontenttowone_tow flex-start">
<view class="towcontenttowone_tow_one flex-start">
<u-icon name="checkmark-circle" color="#999999" size="14"></u-icon>
随时退
</view>
<view class="towcontenttowone_tow_one flex-start">
<u-icon name="checkmark-circle" color="#999999" size="14"></u-icon>
过期退
</view>
</view>
<view class="towcontenttowone_there">
{{item.spec||''}}
</view>
<view class="towcontenttowone_four">
¥{{item.price}}
</view>
</view>
</view>
<!--<view class="towcontentthere flex-between">
<text class="towcontentthere_text"></text>
</view>
<view class="qr-box flex-colum" @longpress="save()">
<canvas canvas-id="qrcode" style="width:288rpx;" />
</view>
<view class="towcontenttfour flex-colum">
123 2345 567
</view> -->
<!-- <view class="towcontenttfive flex-between">
<view class="towcontenttfive_one flex-start">
<view class="towcontenttfive_oneone">
退款:
</view>
<view class="towcontenttfive_onetow">
08-22 23:59:59到期
</view>
</view>
<view class="towcontenttfive_tow">
申请退款
</view>
</view> -->
</view>
<view class="therecontent">
<view class="therecontentone">
订单信息
</view>
<view class="therecontentsix entowakst" v-if="datalist.people_nickname">
发型师：{{datalist.people_nickname}}
</view>
<view class="therecontentow entowakst">
实付金额：<text>¥{{datalist.price}}</text>
</view>
<view class="therecontentthere entowakst">
购买数量：{{datalist.number}}
</view>
<view class="therecontentthere entowakst">
购买数量：{{datalist.username}}
</view>
<view class="therecontenfour entowakst">
手机号码：{{datalist.mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2') || '-'}}
</view>
<view class="therecontentthere entowakst">
收货地址：{{datalist.address}}
</view>
<view class="therecontentfive flex-start entowakst">
订单编号：{{datalist.out_trade_no}}
<text class="therecontentfive_box" @click="copy(datalist.out_trade_no)">复制</text>
</view>
<view class="therecontentsix entowakst">
下单时间：{{datalist.createtime}}
</view>
</view>
<!-- <view class="fourcontent">
<view class="fourcontentone">
购买须知
</view>
<view v-html="datalist.details">
</view>
<view class="entowakst" v-html="datalist.details">
·预约须知：请您提前1小时预约
</view>
</view> -->
<!-- <view class="fivecontent">
<view class="fivecontentone">
用户评价
</view>
<view class="fivecontenttow flex-between">
<view class="fivecontenttow_one flex-start">
<text class="fivecontenttow_text">综合评分</text>
<u-rate :count="5" value="4" active-color="#f1cb66" inactive-color="#F1CB66"></u-rate>
</view>
<view class="fivecontenttow_tow">
满意
</view>
</view>
</view> -->
</view>
</template>
<script>
import uQRCode from '@/common/js/uqrCode.js'
export default {
data() {
return {
datalist: {
mobile:''
},
imgCode: '', // 后续保存到手机相册所需要用到的字段}
form: {
phone: '18092171236'
}
}
},
async onLoad(e) {
try {
let res = await this.api.shoppingorderoorderdetail({
id: e.id
})
if (res) {
this.datalist = res
this.datalist.details = res.details.replace(/\<img/g, '<img style="max-width:100%;height:auto" ');
}
} catch (e) {}
// this.generate()
},
computed: {
theme() {
return this.$store.getters.theme
},
},
methods: {
orderorderdelete(item) { //删除订单
uni.showModal({
content: '确定删除订单吗?',
confirmColor: '#f55850',
cancelColor: '#333333',
success: async (resdata) => {
if (resdata.confirm) {
let res = await this.api.shoppingorderorderorderdelete({
order_id: item.id
})
uni.navigateBack()
}
}
})
},
orderordercancelrefund(item) { //取消订单去退款
uni.pro.navigateTo('mall/order/refund', {
id: item.id
})
},
// 生成二维码事件
generate(e) {
uQRCode.make({
canvasId: 'qrcode',
componentInstance: this,
text: "https://ky.sxczgkj.cn/wap/merchant/authPay?userAppId=244", // 想生成二维码到内容
size: 150,
margin: 0,
backgroundColor: '#ffffff',
foregroundColor: '#000000',
fileType: 'jpg',
errorCorrectLevel: uQRCode.errorCorrectLevel.H,
success: res => {
this.imgCode = res // base64的图片格式
}
})
},
// 保存到手机
save() {
uni.getSetting({ //获取用户的当前设置
success: (res) => {
if (res.authSetting['scope.writePhotosAlbum']) { //验证用户是否授权可以访问相册
this.aveImageToPhotosAlbum();
} else {
uni.authorize({ //如果没有授权，向用户发起请求
scope: 'scope.writePhotosAlbum',
success: () => {
this.aveImageToPhotosAlbum();
},
fail: () => {
// 提示
uni.showToast({
title: "请打开保存相册权限，再点击保存到手机",
icon: "none",
duration: 3000
});
setTimeout(() => {
uni.openSetting({ //调起客户端小程序设置界面,让用户开启访问相册
success: (res2) => {
// console.log(res2.authSetting)
}
});
}, 3000);
}
})
}
}
})
},
copy(value) {
//提示模板
uni.setClipboardData({
data: value, //要被复制的内容
success: () => { //复制成功的回调函数
uni.showToast({
title: '复制成功'
})
}
});
},
detailsInfo(e) { //查看订单详情
uni.pro.navigateTo('mall/mallInfo', {
id: e,
})
},
phonefill(value) {
uni.makePhoneCall({
phoneNumber: value //仅为示例
});
},
aveImageToPhotosAlbum() {
let base64 = this.imgCode.replace(/^data:image\/\w+;base64,/, ""); //去掉data:image/png;base64,
let filePath = wx.env.USER_DATA_PATH + '/ph_fit_qrcode.png'; // 路径文件名
uni.showLoading({
title: '加载中',
mask: true
})
uni.getFileSystemManager().writeFile({ // 获取全局唯一的文件管理器
filePath: filePath, //创建一个临时文件名
data: base64, //写入的文本或二进制数据
encoding: 'base64', //写入当前文件的字符编码
success: res => {
uni.saveImageToPhotosAlbum({ // 保存图片到系统相册
filePath: filePath,
success: function(res2) {
uni.hideLoading();
uni.showToast({
title: '保存成功',
icon: "none",
duration: 5000
})
},
fail: function(err) {
uni.hideLoading();
// console.log(err.errMsg);
}
})
},
fail: err => {
uni.hideLoading();
//console.log(err)
}
})
},
}
}
</script>
<style lang="scss">
page {
background: #F6F6F6;
}
.index {
padding: 32rpx 28rpx;
.onecontent {
width: 100%;
padding: 32rpx;
background: #FFFFFF;
border-radius: 12rpx;
.onecontentone {
font-size: 32rpx;
font-family: SourceHanSansCN-Medium-, SourceHanSansCN-Medium;
font-weight: normal;
color: #333333;
}
.onecontenttow {
margin-top: 16rpx;
font-size: 24rpx;
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
font-weight: normal;
color: #666666;
}
.onecontentthere {
margin-top: 24rpx;
.onecontentthere_one {
background: #333333;
border-radius: 8rpx;
padding: 16rpx 94rpx;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
}
.onecontentthere_tow {
background: #F7F7F7;
border-radius: 8rpx;
padding: 16rpx 94rpx;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
}
}
}
.towcontent {
margin-top: 24rpx;
width: 100%;
background: #FFFFFF;
border-radius: 18rpx;
.towcontentone {
position: relative;
padding: 16rpx 32rpx;
border-radius: 18rpx 18rpx 0 0;
background:var(--bg-color-buttonone);
.towcontentone_one {
.towcontentone_one_image {
width: 33.04rpx;
height: 29.79rpx;
}
.towcontentone_one_text {
margin-left: 10rpx;
font-size: 28rpx;
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
font-weight: normal;
color: #FFFFFF;
}
}
.towcontentone_one::after {
z-index: 10;
position: absolute;
bottom: -22rpx;
content: '';
display: inline-block;
left: 50%;
transform: translateX(-50%);
width: 44rpx;
height: 44rpx;
border-radius: 0 0 22rpx 22rpx;
background:var(--bg-color-buttonone);
}
}
.towcontenttow {
position: relative;
padding: 32rpx;
width: 100%;
background: #fff;
.towcontenttow_image {
width: 128rpx;
height: 128rpx;
}
.towcontenttowone {
height: 128rpx;
margin-left: 36rpx;
justify-content: space-around;
.towcontenttowone_one {
font-size: 28rpx;
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
font-weight: normal;
color: #333333;
}
.towcontenttowone_tow {
.towcontenttowone_tow_one {
font-size: 24rpx;
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
font-weight: normal;
color: #999999;
}
}
.towcontenttowone_there {
font-size: 24rpx;
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
font-weight: normal;
color: #333333;
}
.towcontenttowone_four{
position: absolute;
font-weight: bold;
top:32rpx;
right: 32rpx;
}
}
}
.towcontentthere {
position: relative;
height: 44rpx;
width: 100%;
.towcontentthere_text {
width: 100%;
height: 0px;
border: 1rpx dashed #EAEAEA;
}
.towcontentthere_text::after {
z-index: 10;
position: absolute;
content: '';
display: inline-block;
left: 0;
top: 0;
width: 22rpx;
height: 44rpx;
border-radius: 0 44rpx 44rpx 0;
background: #f6f6f6;
}
.towcontentthere_text::before {
z-index: 10;
position: absolute;
content: '';
display: inline-block;
right: 0;
top: 0;
width: 22rpx;
height: 44rpx;
border-radius: 44rpx 0 0 44rpx;
background: #f6f6f6;
}
}
.towcontenttfour {
margin-top: 16rpx;
font-size: 32rpx;
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
font-weight: normal;
color: #333333;
}
.towcontenttfive {
padding: 32rpx;
width: 100%;
.towcontenttfive_one {
font-size: 32rpx;
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
font-weight: normal;
color: #333333;
}
.towcontenttfive_onetow {
margin-left: 16rpx;
font-size: 24rpx;
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
font-weight: normal;
color: #666666;
}
.towcontenttfive_tow {
padding: 10rpx 16rpx;
background: #FFFFFF;
border-radius: 8rpx;
border: 2rpx solid #D5D5D5;
}
}
}
.therecontent {
margin-top: 24rpx;
padding: 32rpx;
width: 100%;
background: #FFFFFF;
border-radius: 18rpx;
.therecontentone {
font-size: 28rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333333;
}
.entowakst {
font-size: 28rpx;
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
font-weight: normal;
color: #333333;
}
.therecontentfive_box {
padding: 6rpx 10rpx;
font-size: 20rpx;
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
font-weight: normal;
color: #666666;
background: #FFFFFF;
margin-left: 6rpx;
border-radius: 8rpx;
border: 2rpx solid #D5D5D5;
}
}
.fourcontent {
margin-top: 24rpx;
padding: 32rpx;
width: 100%;
background: #FFFFFF;
border-radius: 18rpx;
.fourcontentone {
font-size: 28rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333333;
}
.fourcontentone::after {
content: '';
display: inline-block;
width: 100%;
height: 1rpx;
border: 1px solid #F7F7F7;
}
.entowakst {
font-size: 24rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #666666;
}
}
.fivecontent {
margin-top: 24rpx;
padding: 32rpx;
width: 100%;
background: #FFFFFF;
border-radius: 18rpx;
.fivecontentone {
font-size: 28rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333333;
}
.fivecontenttow {
margin-top: 16rpx;
.fivecontenttow_one {
.fivecontenttow_text {
padding-right: 24rpx;
font-size: 28rpx;
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
font-weight: normal;
color: #333333;
}
}
.fivecontenttow_tow {
font-size: 24rpx;
font-family: SourceHanSansCN-Regular-, SourceHanSansCN-Regular;
font-weight: normal;
color: #666666;
}
}
}
}
</style>