zhangyan
/
hainan_2024
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

去掉子组件中的悬浮按钮

Browse Source
wenjuan
刘佳宇 1 year ago
parent 065a6c4b31
commit 9df3b78f02
1 changed files with 352 additions and 315 deletions
Show Stats Download Patch File Download Diff File

259
h5/pages/main/order/src/order.vue
Unescape Escape View File

@ -1,147 +1,167 @@
<script setup> <script setup>
import DraggableButton from "@/pages/components/goHome.vue";
/** /**
* name： * name：
* user：sa0ChunLuyu * user：sa0ChunLuyu
* date：2024年8月14日 20:38:40 * date：2024年8月14日 20:38:40
*/ */
import { import { ref, onMounted, defineEmits } from "vue";
ref, import { $api, $response } from "@/api";
onMounted, import { onShow } from "@dcloudio/uni-app";
defineEmits import wx from "weixin-js-sdk";
} from 'vue'
import {
$api,
$response
} from '@/api'
import {
onShow
} from '@dcloudio/uni-app'
import wx from 'weixin-js-sdk'
const $props = defineProps({ const $props = defineProps({
info: { info: {
type: Object, type: Object,
default: () => { default: () => {
return { return {
id: 0 id: 0,
} };
} },
} },
}); });
const order_info = ref(false) const order_info = ref(false);
const deepInfo = () => { const deepInfo = () => {
order_info.value = JSON.parse(JSON.stringify($props.info)) order_info.value = JSON.parse(JSON.stringify($props.info));
checkStatus() checkStatus();
} };
const countdown = ref(null) const countdown = ref(null);
const checkStatus = () => { const checkStatus = () => {
if (order_info.value.status === 1) { if (order_info.value.status === 1) {
countdown.value = setInterval(() => { countdown.value = setInterval(() => {
countdownRun() countdownRun();
}, 500) }, 500);
}
} }
const count_down_text = ref('限制时间') };
const count_down_text = ref("限制时间");
const countdownRun = () => { const countdownRun = () => {
let seconds = Math.floor((order_info.value.end_time - (new Date() / 1000)) % 60) let seconds = Math.floor(
let minutes = Math.floor((order_info.value.end_time - (new Date() / 1000)) / 60) (order_info.value.end_time - new Date() / 1000) % 60
count_down_text.value = `${minutes}分${seconds}秒` );
let minutes = Math.floor(
(order_info.value.end_time - new Date() / 1000) / 60
);
count_down_text.value = `${minutes}分${seconds}秒`;
if (order_info.value.end_time <= new Date() / 1000) { if (order_info.value.end_time <= new Date() / 1000) {
clearInterval(countdown.value) clearInterval(countdown.value);
order_info.value.status = 3 order_info.value.status = 3;
} }
} };
const StartPay = async (id) => { //继续支付 const StartPay = async (id) => {
uni.showLoading() //继续支付
const response = await $api('StartPay', { uni.showLoading();
openid: localStorage.getItem('OPENID'), const response = await $api("StartPay", {
openid: localStorage.getItem("OPENID"),
id: id, id: id,
}) });
uni.hideLoading() uni.hideLoading();
$response(response, () => { $response(response, () => {
if (response.status) { if (response.status) {
let info = response.data.info let info = response.data.info;
let p = '&appid=' + info.appid + '&sub_org_code=' + info.sub_org_code + '&ghzid=' + info let p =
.ghzid + '&orderid=' + info.orderid + '&order_desc=' + info.order_desc + '&amount=' + "&appid=" +
info.amount + '&notify_url=' + info.notify_url + '&timestamp=' + info.timestamp + info.appid +
'&nonce=' + info.nonce + '&signature=' + info.signature; "&sub_org_code=" +
info.sub_org_code +
"&ghzid=" +
info.ghzid +
"&orderid=" +
info.orderid +
"&order_desc=" +
info.order_desc +
"&amount=" +
info.amount +
"&notify_url=" +
info.notify_url +
"&timestamp=" +
info.timestamp +
"&nonce=" +
info.nonce +
"&signature=" +
info.signature;
console.log(p); console.log(p);
wx.miniProgram.navigateTo({ wx.miniProgram.navigateTo({
url: '/pages/other/entry/index?path=/pages/physical-examination/payment/index' + url:
p "/pages/other/entry/index?path=/pages/physical-examination/payment/index" +
}) p,
} });
})
} }
});
};
const emit = defineEmits(); const emit = defineEmits();
const Refound = async (id) => { const Refound = async (id) => {
uni.showLoading();
uni.showLoading() const response = await $api("Refund", {
const response = await $api('Refund', { openid: localStorage.getItem("OPENID"),
openid: localStorage.getItem('OPENID'),
id: id, id: id,
}) });
uni.hideLoading() uni.hideLoading();
$response(response, () => { $response(response, () => {
if (response.status) { if (response.status) {
uni.showToast({ uni.showToast({
title: '退款完成' title: "退款完成",
}); });
emit('updateValue', 'orderUpdate'); emit("updateValue", "orderUpdate");
}
})
} }
});
};
onMounted(() => { onMounted(() => {
deepInfo() deepInfo();
}) });
</script> </script>
<template> <template>
<DraggableButton />
<view> <view>
<view v-if="!!order_info" class="order_wrapper"> <view v-if="!!order_info" class="order_wrapper">
<view class="order_status_wrapper" :class="[`status${order_info.status}`]"> <view
<view v-if="[1].includes(order_info.status)"> class="order_status_wrapper"
待支付 :class="[`status${order_info.status}`]"
</view> >
<view v-if="[2].includes(order_info.status)"> <view v-if="[1].includes(order_info.status)"> 待支付 </view>
已预约 <view v-if="[2].includes(order_info.status)"> 已预约 </view>
</view> <view v-if="[3, 5].includes(order_info.status)"> 交易关闭 </view>
<view v-if="[3,5].includes(order_info.status)"> <view v-if="[4].includes(order_info.status)"> 已完成 </view>
交易关闭
</view>
<view v-if="[4].includes(order_info.status)">
已完成
</view>
</view> </view>
<view class="combo_name_wrapper">{{ order_info.title }}</view> <view class="combo_name_wrapper">{{ order_info.title }}</view>
<view class="order_info_wrapper"> <view class="order_info_wrapper">
<view class="order_info_line_wrapper"> <view class="order_info_line_wrapper">
<view class="order_info_line_label_wrapper">体检人：</view> <view class="order_info_line_label_wrapper">体检人：</view>
<view class="order_info_line_value_wrapper">{{ order_info.name }}</view> <view class="order_info_line_value_wrapper">{{
order_info.name
}}</view>
</view> </view>
<view class="order_info_line_wrapper"> <view class="order_info_line_wrapper">
<view class="order_info_line_label_wrapper">预约时间：</view> <view class="order_info_line_label_wrapper">预约时间：</view>
<view class="order_info_line_value_wrapper">{{ order_info.time }}</view> <view class="order_info_line_value_wrapper">{{
order_info.time
}}</view>
</view> </view>
<view class="order_info_line_wrapper"> <view class="order_info_line_wrapper">
<view class="order_info_line_label_wrapper">订单号：</view> <view class="order_info_line_label_wrapper">订单号：</view>
<view class="order_info_line_value_wrapper">{{ order_info.order }}</view> <view class="order_info_line_value_wrapper">{{
order_info.order
}}</view>
</view> </view>
<view class="order_info_line_wrapper"> <view class="order_info_line_wrapper">
<view class="order_info_line_label_wrapper">类型：</view> <view class="order_info_line_label_wrapper">类型：</view>
<view class="order_info_line_value_wrapper">{{ order_info.type }}</view> <view class="order_info_line_value_wrapper">{{
order_info.type
}}</view>
</view> </view>
<view v-if="[1,2,4,5].includes(order_info.status)" class="order_price_wrapper"> <view
v-if="[1, 2, 4, 5].includes(order_info.status)"
class="order_price_wrapper"
>
<text v-if="[1].includes(order_info.status)">需支付</text> <text v-if="[1].includes(order_info.status)">需支付</text>
<text v-if="[2, 4].includes(order_info.status)">实付款</text> <text v-if="[2, 4].includes(order_info.status)">实付款</text>
<text v-if="[5].includes(order_info.status)">已退款</text> <text v-if="[5].includes(order_info.status)">已退款</text>
<text class="price_true" <text
v-if="order_info.true_price !== order_info.price">(测试:{{ order_info.true_price }})</text> class="price_true"
v-if="order_info.true_price !== order_info.price"
>(测试:{{ order_info.true_price }})</text
>
<text class="price_text">{{ order_info.price }}</text> <text class="price_text">{{ order_info.price }}</text>
</view> </view>
<view class="order_line_wrapper"></view> <view class="order_line_wrapper"></view>
@ -162,18 +182,35 @@ import DraggableButton from "@/pages/components/goHome.vue";
</view> </view>
</view> </view>
<view class="order_pay_button_wrapper"> <view class="order_pay_button_wrapper">
<view v-if="[1].includes(order_info.status)" @click="StartPay(order_info.id)" <view
class="button_item_wrapper pay_button_wrapper">继续付款</view> v-if="[1].includes(order_info.status)"
@click="StartPay(order_info.id)"
class="button_item_wrapper pay_button_wrapper"
>继续付款</view
>
<!-- <view v-if="[2].includes(order_info.status)" class="button_item_wrapper change_button_wrapper"> <!-- <view v-if="[2].includes(order_info.status)" class="button_item_wrapper change_button_wrapper">
改约</view> --> 改约</view> -->
<view v-if="[2].includes(order_info.status)" @click="Refound(order_info.id)" <view
class="button_item_wrapper refund_button_wrapper">退款</view> v-if="[2].includes(order_info.status)"
<view v-if="[4].includes(order_info.status) && order_info.report" @click="Refound(order_info.id)"
class="button_item_wrapper report_button_wrapper"> class="button_item_wrapper refund_button_wrapper"
>退款</view
>
<view
v-if="[4].includes(order_info.status) && order_info.report"
class="button_item_wrapper report_button_wrapper"
>
查看报告 查看报告
</view> </view>
<view v-if="[4].includes(order_info.status) && order_info.report && !order_info.decode" <view
class="button_item_wrapper decode_button_wrapper">报告解读</view> v-if="
[4].includes(order_info.status) &&
order_info.report &&
!order_info.decode
"
class="button_item_wrapper decode_button_wrapper"
>报告解读</view
>
</view> </view>
</view> </view>
<view v-else class="order_pay_blank_wrapper"></view> <view v-else class="order_pay_blank_wrapper"></view>
@ -199,28 +236,28 @@ import DraggableButton from "@/pages/components/goHome.vue";
} }
.pay_button_wrapper { .pay_button_wrapper {
background: #239EA3; background: #239ea3;
color: #FFFFFF; color: #ffffff;
} }
.change_button_wrapper { .change_button_wrapper {
background: #E1ECEE; background: #e1ecee;
color: #239EA3; color: #239ea3;
} }
.refund_button_wrapper { .refund_button_wrapper {
background: #239EA3; background: #239ea3;
color: #FFFFFF; color: #ffffff;
} }
.report_button_wrapper { .report_button_wrapper {
background: #E1ECEE; background: #e1ecee;
color: #239EA3; color: #239ea3;
} }
.decode_button_wrapper { .decode_button_wrapper {
background: #239EA3; background: #239ea3;
color: #FFFFFF; color: #ffffff;
} }
.order_pay_blank_wrapper { .order_pay_blank_wrapper {
@ -230,12 +267,12 @@ import DraggableButton from "@/pages/components/goHome.vue";
.order_pay_time_wrapper { .order_pay_time_wrapper {
font-weight: 500; font-weight: 500;
font-size: 20rpx; font-size: 20rpx;
color: #8B8B8B; color: #8b8b8b;
line-height: 26rpx; line-height: 26rpx;
} }
.time_red { .time_red {
color: #EC4D15; color: #ec4d15;
margin: 0 5rpx; margin: 0 5rpx;
} }
@ -251,7 +288,7 @@ import DraggableButton from "@/pages/components/goHome.vue";
.order_line_wrapper { .order_line_wrapper {
width: 660rpx; width: 660rpx;
height: 1rpx; height: 1rpx;
background: #EBEAEA; background: #ebeaea;
margin: 19rpx auto 0; margin: 19rpx auto 0;
} }
@ -287,7 +324,7 @@ import DraggableButton from "@/pages/components/goHome.vue";
width: 120rpx; width: 120rpx;
font-weight: 400; font-weight: 400;
font-size: 24rpx; font-size: 24rpx;
color: #8B8B8B; color: #8b8b8b;
line-height: 1; line-height: 1;
margin-left: 30rpx; margin-left: 30rpx;
} }
@ -304,7 +341,7 @@ import DraggableButton from "@/pages/components/goHome.vue";
width: calc(550rpx - 30rpx); width: calc(550rpx - 30rpx);
font-weight: bold; font-weight: bold;
font-size: 32rpx; font-size: 32rpx;
color: #0E0E0E; color: #0e0e0e;
line-height: 1; line-height: 1;
margin-left: 30rpx; margin-left: 30rpx;
overflow: hidden; overflow: hidden;
@ -320,15 +357,15 @@ import DraggableButton from "@/pages/components/goHome.vue";
} }
.order_status_wrapper.status1 { .order_status_wrapper.status1 {
color: #EC4D15; color: #ec4d15;
} }
.order_status_wrapper.status2 { .order_status_wrapper.status2 {
color: #239EA3; color: #239ea3;
} }
.order_status_wrapper.status3 { .order_status_wrapper.status3 {
color: #EC4D15; color: #ec4d15;
} }
.order_status_wrapper.status4 { .order_status_wrapper.status4 {
@ -336,13 +373,13 @@ import DraggableButton from "@/pages/components/goHome.vue";
} }
.order_status_wrapper.status5 { .order_status_wrapper.status5 {
color: #EC4D15; color: #ec4d15;
} }
.order_wrapper { .order_wrapper {
position: relative; position: relative;
width: 710rpx; width: 710rpx;
background: #FFFFFF; background: #ffffff;
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.05); box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.05);
border-radius: 10rpx; border-radius: 10rpx;
margin: 0 auto; margin: 0 auto;

Write Preview
Loading…
Cancel
Save