This commit is contained in:
tangxinyue 2026-05-25 09:40:19 +08:00
parent eb59411bda
commit 1d4fd42cbb
8 changed files with 988 additions and 957 deletions

View File

@ -6,7 +6,7 @@
<view class="status-placeholder" :style="{ height: `${data.statusBarHeight}px` }"> <view class="status-placeholder" :style="{ height: `${data.statusBarHeight}px` }">
<slot name="statusBar"></slot> <slot name="statusBar"></slot>
</view> </view>
<view class="nav-box" style="width: 100%;height: 88rpx;"> <view class="nav-box" style="width: 100%;height: 88rpx;" @click="openPopup">
<slot> <slot>
<uni-nav-bar backgroundColor="#00000000" class="nav-bar" :border="false" :title="title" v-bind="$attrs" <uni-nav-bar backgroundColor="#00000000" class="nav-bar" :border="false" :title="title" v-bind="$attrs"
v-on="$attrs"> v-on="$attrs">
@ -82,294 +82,294 @@
</template> </template>
<script setup> <script setup>
import popup from '../popup/popup.vue' import popup from '../popup/popup.vue'
import { import {
onMounted, onMounted,
reactive, reactive,
ref, ref,
toRefs toRefs
} from 'vue' } from 'vue'
const topPopup = ref() const topPopup = ref()
// //
const props = defineProps({ const props = defineProps({
bgColor: { bgColor: {
type: String, type: String,
default: '#fff' default: '#fff'
}, },
textColor: { textColor: {
type: String, type: String,
default: '#000' default: '#000'
}, },
title: { title: {
type: String, type: String,
default: '' default: ''
}, },
buttonGroup: { buttonGroup: {
type: Array, type: Array,
default: () => [] default: () => []
}, },
isRightIcon: { isRightIcon: {
type: Boolean, type: Boolean,
default: false default: false
}, },
isRightButton: { isRightButton: {
type: Boolean, type: Boolean,
default: false default: false
}, },
rightButtonText: { rightButtonText: {
type: String, type: String,
default: '确定' default: '确定'
}, },
zIndex: { zIndex: {
type: Number, type: Number,
default: 999 default: 999
}, },
noBack: { noBack: {
type: Boolean, type: Boolean,
default: false default: false
}, },
isBack: { isBack: {
type: Boolean, type: Boolean,
default: true default: true
}, },
tipLayerText: { tipLayerText: {
type: String, type: String,
default: '' default: ''
}, },
isTipLayer: { isTipLayer: {
type: Boolean, type: Boolean,
default: false default: false
}, },
tipLayerType: { tipLayerType: {
type: String, type: String,
default: '' default: ''
}, },
isClickNavBarOpenPopup: { isClickNavBarOpenPopup: {
type: Boolean, type: Boolean,
default: false default: false
}
})
//
const emit = defineEmits(['back', 'right-click', 'button-click', 'refresh'])
const data = reactive({
statusBarHeight: 0,
showTipLayer: true,
})
let {
showTipLayer
} = toRefs(data)
onMounted(() => {
//
const systemInfo = uni.getSystemInfoSync();
data.statusBarHeight = systemInfo.statusBarHeight || 0;
if (props.isTipLayer) {
if (uni.getStorageSync(props.tipLayerType) == props.tipLayerType) {
showTipLayer.value = false
}
}
})
const closeTipLayer = () => {
showTipLayer.value = false
uni.setStorageSync(props.tipLayerType, props.tipLayerType)
emit("refresh")
} }
})
// const openPopup = () => {
const emit = defineEmits(['back', 'right-click', 'button-click', 'refresh']) if (props.buttonGroup.length > 0) {
topPopup.value.open()
const data = reactive({
statusBarHeight: 0,
showTipLayer: true,
})
let {
showTipLayer
} = toRefs(data)
onMounted(() => {
//
const systemInfo = uni.getSystemInfoSync();
data.statusBarHeight = systemInfo.statusBarHeight || 0;
if (props.isTipLayer) {
if (uni.getStorageSync(props.tipLayerType) == props.tipLayerType) {
showTipLayer.value = false
} }
} }
}) //
const onBack = () => {
const closeTipLayer = () => { emit('back')
showTipLayer.value = false //
uni.setStorageSync(props.tipLayerType, props.tipLayerType) if (props.noBack) return
emit("refresh") uni.navigateBack()
}
const openPopup = () => {
if (props.buttonGroup.length > 0) {
topPopup.value.open()
} }
}
// //
const onBack = () => { const onRightClick = () => {
emit('back') emit('right-click')
// }
if (props.noBack) return
uni.navigateBack()
}
// const closeTopPopup = () => {
const onRightClick = () => { topPopup.value.close()
emit('right-click') }
}
const closeTopPopup = () => {
topPopup.value.close()
}
const buttonClick = (button) => { const buttonClick = (button) => {
closeTopPopup() closeTopPopup()
emit('button-click', button) emit('button-click', button)
} }
// //
defineExpose({ defineExpose({
openPopup, openPopup,
closeTopPopup closeTopPopup
}) })
</script> </script>
<style scoped> <style scoped>
@import "/common/main.css"; @import "/common/main.css";
.nav-bar-container { .nav-bar-container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: fixed !important; position: fixed !important;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
z-index: 999; z-index: 999;
}
.nav-bar {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
z-index: 1;
}
.status-placeholder {
width: 100%;
}
::v-deep .uni-navbar__content {
width: 100%;
}
.nav-bar-left {
display: flex;
align-items: center;
justify-content: flex-start;
}
.nav-icon-back {
width: 24px;
height: 24px;
}
.nav-icon-more {
width: 26px;
height: 26px;
}
.nav-bar-title {
flex: 1;
margin: auto;
display: flex;
align-items: center;
justify-content: center;
font-size: 17px;
font-weight: 500;
}
.nav-bar-right {
display: flex;
align-items: center;
justify-content: flex-end;
}
.right-button {
font-size: 12px;
border-radius: 16px;
color: #fff;
text-align: center;
line-height: 30px;
height: 30px;
min-width: 60px;
background: linear-gradient(90deg, #187AFF 0%, #3295FC 100%);
}
.button-box {
width: calc(50% - 8rpx);
text-align: center;
margin-top: 16rpx;
}
.button {
border: 1px solid #E4E4E4;
border-radius: 8px;
height: 42px;
line-height: 42px;
font-size: 28rpx;
}
.tipLayer {
box-sizing: border-box;
min-width: 200px !important;
height: 48px;
background: #B8EDFE;
border-radius: 8px 8px 8px 8px;
position: fixed;
/* top: 115px; */
left: 50%;
transform: translateX(-50%);
z-index: 999;
}
.tipLayer-content {
position: relative;
}
.title {
font-weight: 450;
font-size: 14px;
color: #268FFF;
line-height: 48px;
text-align: center;
text {
font-size: 14px;
font-weight: bold;
color: #006ADD;
} }
::v-deep text { .nav-bar {
font-size: 14px; width: 100%;
font-weight: bold; display: flex;
color: #006ADD; align-items: center;
justify-content: space-between;
position: relative;
z-index: 1;
} }
}
.triangleImg { .status-placeholder {
width: 111px; width: 100%;
height: 52px; }
pointer-events: none;
position: absolute;
top: -23px;
left: calc(50% - 111px);
}
.triangle { ::v-deep .uni-navbar__content {
position: absolute; width: 100%;
top: -57px; }
left: calc(50% - 40px);
pointer-events: none;
}
.close { .nav-bar-left {
position: absolute; display: flex;
top: -5px; align-items: center;
right: -5px; justify-content: flex-start;
width: 18px; }
height: 18px;
} .nav-icon-back {
width: 24px;
height: 24px;
}
.nav-icon-more {
width: 26px;
height: 26px;
}
.nav-bar-title {
flex: 1;
margin: auto;
display: flex;
align-items: center;
justify-content: center;
font-size: 17px;
font-weight: 500;
}
.nav-bar-right {
display: flex;
align-items: center;
justify-content: flex-end;
}
.right-button {
font-size: 12px;
border-radius: 16px;
color: #fff;
text-align: center;
line-height: 30px;
height: 30px;
min-width: 60px;
background: linear-gradient(90deg, #187AFF 0%, #3295FC 100%);
}
.button-box {
width: calc(50% - 8rpx);
text-align: center;
margin-top: 16rpx;
}
.button {
border: 1px solid #E4E4E4;
border-radius: 8px;
height: 42px;
line-height: 42px;
font-size: 28rpx;
}
.tipLayer {
box-sizing: border-box;
min-width: 200px !important;
height: 48px;
background: #B8EDFE;
border-radius: 8px 8px 8px 8px;
position: fixed;
/* top: 115px; */
left: 50%;
transform: translateX(-50%);
z-index: 999;
}
.tipLayer-content {
position: relative;
}
.title {
font-weight: 450;
font-size: 14px;
color: #268FFF;
line-height: 48px;
text-align: center;
text {
font-size: 14px;
font-weight: bold;
color: #006ADD;
}
::v-deep text {
font-size: 14px;
font-weight: bold;
color: #006ADD;
}
}
.triangleImg {
width: 111px;
height: 52px;
pointer-events: none;
position: absolute;
top: -23px;
left: calc(50% - 111px);
}
.triangle {
position: absolute;
top: -57px;
left: calc(50% - 40px);
pointer-events: none;
}
.close {
position: absolute;
top: -5px;
right: -5px;
width: 18px;
height: 18px;
}
</style> </style>

View File

@ -29,7 +29,7 @@ export function createApp() {
app.config.globalProperties.$system = plus.os.name; app.config.globalProperties.$system = plus.os.name;
// #endif // #endif
app.config.globalProperties.$systemInfo = systemInfo app.config.globalProperties.$systemInfo = systemInfo
uni.setStorageSync('version', '1.0.5.sp5') uni.setStorageSync('version', '1.0.5.sp9')
app.config.globalProperties.$version = uni.getStorageSync('version') app.config.globalProperties.$version = uni.getStorageSync('version')
app.use(globalMethods); app.use(globalMethods);
return { return {

View File

@ -56,7 +56,8 @@
<!-- 详情信息列表 --> <!-- 详情信息列表 -->
<view class="detail-info-container"> <view class="detail-info-container">
<template v-for="item in billData.itemInfoList" :key="item.id"> <template v-for="item in billData.itemInfoList" :key="item.id">
<view class="info-item-box" v-if="item.key != 'paymentReward'"> <view class="info-item-box"
v-if="item.key != 'paymentReward' && (item.key != 'transferNote' || billData.merchantOption.isTransferNote)">
<view class="item-label" :class="{ 'switchable-label': item.key === 'createTime' }" <view class="item-label" :class="{ 'switchable-label': item.key === 'createTime' }"
@click="toggleCreateTimeLabel(item)"> @click="toggleCreateTimeLabel(item)">
<text>{{ item.label }}</text> <text>{{ item.label }}</text>
@ -132,7 +133,8 @@
<view class="switch-option-container"> <view class="switch-option-container">
<template v-for="option in data.switchOptions" :key="option.id"> <template v-for="option in data.switchOptions" :key="option.id">
<view v-if="option.showTypeIds ? option.showTypeIds.includes(billData.selectId) : true" <view v-if="option.showTypeIds ? option.showTypeIds.includes(billData.selectId) : true"
class="border-bottom" :class="{ 'no-border-bottom': isNoBorderBottom(option) }"> class="border-bottom"
:class="{ 'no-border-bottom': isNoBorderBottom(option) || option.isMarginBottom, 'margin-bottom-16rpx': option.isMarginBottom }">
<view class="switch-option"> <view class="switch-option">
<view class="switch-option-text">{{ option.name }}</view> <view class="switch-option-text">{{ option.name }}</view>
<switch v-if="option.isSwitch" color="#1676FE" :checked="billData.merchantOption[option.key]" <switch v-if="option.isSwitch" color="#1676FE" :checked="billData.merchantOption[option.key]"
@ -408,89 +410,97 @@ const serviceDetailRightTextList = [{
} }
] ]
// switch // switch
const switchOptions = [{ const switchOptions = [
"id": 7, {
"name": "账单分类", "id": 11,
"isSwitch": false, "name": "转账备注",
key: 'billClassify', "isSwitch": true,
}, showTypeIds: [7],
{ key: 'isTransferNote',
"id": 8, isMarginBottom: true
"name": "标签", }, {
"isSwitch": false, "id": 7,
key: 'tag', "name": "账单分类",
}, "isSwitch": false,
{ key: 'billClassify',
"id": 9, },
"name": "备注", {
"isSwitch": false, "id": 8,
key: 'note', "name": "标签",
}, "isSwitch": false,
{ key: 'tag',
"id": 1, },
"name": "服务详情", {
"isSwitch": true, "id": 9,
showTypeIds: [3, 4, 10], "name": "备注",
key: 'serviceDetail', "isSwitch": false,
}, key: 'note',
{ },
"id": 2, {
"name": "推荐服务", "id": 1,
"isSwitch": true, "name": "服务详情",
showTypeIds: [4], "isSwitch": true,
key: 'recommendService', showTypeIds: [3, 4, 10],
}, key: 'serviceDetail',
{ },
"id": 3, {
"name": "服务推荐", "id": 2,
"isSwitch": true, "name": "推荐服务",
showTypeIds: [6, 7], "isSwitch": true,
key: 'serviceRecommend', showTypeIds: [4],
}, key: 'recommendService',
{ },
"id": 4, {
"name": "退款", "id": 3,
"isSwitch": true, "name": "服务推荐",
showTypeIds: [12, 13], "isSwitch": true,
key: 'refund', showTypeIds: [6, 7],
change: (value) => { key: 'serviceRecommend',
if (billData.value.selectId == 12 || billData.value.selectId == 13) { },
if (value) { {
billData.value.orderStatus = "已全额退款" "id": 4,
} else { "name": "退款",
billData.value.orderStatus = "交易成功" "isSwitch": true,
showTypeIds: [12, 13],
key: 'refund',
change: (value) => {
if (billData.value.selectId == 12 || billData.value.selectId == 13) {
if (value) {
billData.value.orderStatus = "已全额退款"
} else {
billData.value.orderStatus = "交易成功"
}
} }
} }
},
{
"id": 5,
"name": "支付奖励",
"isSwitch": true,
showTypeIds: [1, 3, 4, 13],
key: 'payReward',
},
{
"id": 6,
"name": "计入收支",
"isSwitch": true,
showTypeIds: [1, 2, 3, 4, 5, 6, 7, 8, 10, 11, 12, 13],
key: 'countInAndOut',
},
{
"id": 7,
"name": "商家订单号转换条形码",
"isSwitch": true,
showTypeIds: [1, 2, 3],
key: 'isShowBarcode',
},
{
"id": 10,
"name": "账单分析",
"isSwitch": true,
showTypeIds: [1, 2, 3, 4, 5, 6, 7, 8, 10, 11, 12, 13],
key: 'isShowBillAnalysis',
} }
},
{
"id": 5,
"name": "支付奖励",
"isSwitch": true,
showTypeIds: [1, 3, 4, 13],
key: 'payReward',
},
{
"id": 6,
"name": "计入收支",
"isSwitch": true,
showTypeIds: [1, 2, 3, 4, 5, 6, 7, 8, 10, 11, 12, 13],
key: 'countInAndOut',
},
{
"id": 7,
"name": "商家订单号转换条形码",
"isSwitch": true,
showTypeIds: [1, 2, 3],
key: 'isShowBarcode',
},
{
"id": 10,
"name": "账单分析",
"isSwitch": true,
showTypeIds: [1, 2, 3, 4, 5, 6, 7, 8, 10, 11, 12, 13],
key: 'isShowBillAnalysis',
}
] ]
@ -542,6 +552,7 @@ const data = reactive({
merchantOption: { merchantOption: {
serviceDetail: false, serviceDetail: false,
isShowBarcode: false, isShowBarcode: false,
isTransferNote: false,
serviceDetailInfo: { serviceDetailInfo: {
imgUrl: '', imgUrl: '',
rightText: 0, rightText: 0,
@ -1400,11 +1411,11 @@ page {
.switch-option-container { .switch-option-container {
margin: 16rpx 24rpx; margin: 16rpx 24rpx;
background-color: #ffffff;
border-radius: 16rpx 16rpx 16rpx 16rpx; border-radius: 16rpx 16rpx 16rpx 16rpx;
.border-bottom { .border-bottom {
border-bottom: 1px solid #efefef border-bottom: 1px solid #efefef;
background-color: #ffffff;
} }
.no-border-bottom { .no-border-bottom {
@ -1605,4 +1616,8 @@ page {
padding: 0 24rpx; padding: 0 24rpx;
} }
} }
.margin-bottom-16rpx {
margin-bottom: 16rpx;
}
</style> </style>

View File

@ -42,7 +42,9 @@
<!-- 详情信息列表 --> <!-- 详情信息列表 -->
<view class="detail-info-container"> <view class="detail-info-container">
<template v-for="item in visibleItemInfoList" :key="item.id"> <template v-for="item in visibleItemInfoList" :key="item.id">
<view class="info-item-box" :class="{ 'bottom-border': item.key == 'relatedRecord' }"> <view class="info-item-box"
v-if="item.key != 'transferNote' || billData.merchantOption.isTransferNote"
:class="{ 'bottom-border': item.key == 'relatedRecord' }">
<view class="item-label"> <view class="item-label">
{{ item.label }} {{ item.label }}
</view> </view>

File diff suppressed because it is too large Load Diff

View File

@ -130,7 +130,7 @@
</view> </view>
</view> </view>
<view class="progress-box" style="height: 192rpx;"> <view class="progress-box" style="height: 192rpx;">
<text class="text">快递运输 · 温馨提示您的订单预计3月11日09:00- 15:53送达</text> <text class="text">{{ order.trackingDesc2 }}</text>
<view class="upload-box"> <view class="upload-box">
<view class="info-box"> <view class="info-box">
<view class="image-box"> <view class="image-box">

View File

@ -424,7 +424,8 @@ const items = [
{ {
image: "/static/image/shopping/taobao/waimai/cuidan.png", image: "/static/image/shopping/taobao/waimai/cuidan.png",
text: "催单", text: "催单",
show: () => order.value.statusType == 'wait_recv' show: () => order.value.statusType == 'wait_recv',
color: "#CDCDCD"
}, },
{ {
image: "/static/image/shopping/taobao/waimai/quxiaodingdan.png", image: "/static/image/shopping/taobao/waimai/quxiaodingdan.png",

View File

@ -403,6 +403,13 @@
"key": "payMethod", "key": "payMethod",
"required": true "required": true
}, },
{
"label": "转账备注",
"value": "转账",
"type": "text",
"focus": false,
"key": "transferNote"
},
{ {
"label": "对方账户", "label": "对方账户",
"value": "", "value": "",