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,18 +82,18 @@
</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'
@ -150,22 +150,22 @@ const props = defineProps({
type: Boolean, type: Boolean,
default: false default: false
} }
}) })
// //
const emit = defineEmits(['back', 'right-click', 'button-click', 'refresh']) const emit = defineEmits(['back', 'right-click', 'button-click', 'refresh'])
const data = reactive({ const data = reactive({
statusBarHeight: 0, statusBarHeight: 0,
showTipLayer: true, showTipLayer: true,
}) })
let { let {
showTipLayer showTipLayer
} = toRefs(data) } = toRefs(data)
onMounted(() => { onMounted(() => {
// //
const systemInfo = uni.getSystemInfoSync(); const systemInfo = uni.getSystemInfoSync();
data.statusBarHeight = systemInfo.statusBarHeight || 0; data.statusBarHeight = systemInfo.statusBarHeight || 0;
@ -176,54 +176,54 @@ onMounted(() => {
} }
} }
}) })
const closeTipLayer = () => { const closeTipLayer = () => {
showTipLayer.value = false showTipLayer.value = false
uni.setStorageSync(props.tipLayerType, props.tipLayerType) uni.setStorageSync(props.tipLayerType, props.tipLayerType)
emit("refresh") emit("refresh")
} }
const openPopup = () => { const openPopup = () => {
if (props.buttonGroup.length > 0) { if (props.buttonGroup.length > 0) {
topPopup.value.open() topPopup.value.open()
} }
} }
// //
const onBack = () => { const onBack = () => {
emit('back') emit('back')
// //
if (props.noBack) return if (props.noBack) return
uni.navigateBack() uni.navigateBack()
} }
// //
const onRightClick = () => { const onRightClick = () => {
emit('right-click') emit('right-click')
} }
const closeTopPopup = () => { const closeTopPopup = () => {
topPopup.value.close() 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;
@ -231,42 +231,42 @@ defineExpose({
left: 0; left: 0;
right: 0; right: 0;
z-index: 999; z-index: 999;
} }
.nav-bar { .nav-bar {
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
.status-placeholder { .status-placeholder {
width: 100%; width: 100%;
} }
::v-deep .uni-navbar__content { ::v-deep .uni-navbar__content {
width: 100%; width: 100%;
} }
.nav-bar-left { .nav-bar-left {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
} }
.nav-icon-back { .nav-icon-back {
width: 24px; width: 24px;
height: 24px; height: 24px;
} }
.nav-icon-more { .nav-icon-more {
width: 26px; width: 26px;
height: 26px; height: 26px;
} }
.nav-bar-title { .nav-bar-title {
flex: 1; flex: 1;
margin: auto; margin: auto;
display: flex; display: flex;
@ -274,15 +274,15 @@ defineExpose({
justify-content: center; justify-content: center;
font-size: 17px; font-size: 17px;
font-weight: 500; font-weight: 500;
} }
.nav-bar-right { .nav-bar-right {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;
} }
.right-button { .right-button {
font-size: 12px; font-size: 12px;
border-radius: 16px; border-radius: 16px;
color: #fff; color: #fff;
@ -291,23 +291,23 @@ defineExpose({
height: 30px; height: 30px;
min-width: 60px; min-width: 60px;
background: linear-gradient(90deg, #187AFF 0%, #3295FC 100%); background: linear-gradient(90deg, #187AFF 0%, #3295FC 100%);
} }
.button-box { .button-box {
width: calc(50% - 8rpx); width: calc(50% - 8rpx);
text-align: center; text-align: center;
margin-top: 16rpx; margin-top: 16rpx;
} }
.button { .button {
border: 1px solid #E4E4E4; border: 1px solid #E4E4E4;
border-radius: 8px; border-radius: 8px;
height: 42px; height: 42px;
line-height: 42px; line-height: 42px;
font-size: 28rpx; font-size: 28rpx;
} }
.tipLayer { .tipLayer {
box-sizing: border-box; box-sizing: border-box;
min-width: 200px !important; min-width: 200px !important;
height: 48px; height: 48px;
@ -321,15 +321,15 @@ defineExpose({
} }
.tipLayer-content { .tipLayer-content {
position: relative; position: relative;
} }
.title { .title {
font-weight: 450; font-weight: 450;
font-size: 14px; font-size: 14px;
color: #268FFF; color: #268FFF;
@ -347,29 +347,29 @@ defineExpose({
font-weight: bold; font-weight: bold;
color: #006ADD; color: #006ADD;
} }
} }
.triangleImg { .triangleImg {
width: 111px; width: 111px;
height: 52px; height: 52px;
pointer-events: none; pointer-events: none;
position: absolute; position: absolute;
top: -23px; top: -23px;
left: calc(50% - 111px); left: calc(50% - 111px);
} }
.triangle { .triangle {
position: absolute; position: absolute;
top: -57px; top: -57px;
left: calc(50% - 40px); left: calc(50% - 40px);
pointer-events: none; pointer-events: none;
} }
.close { .close {
position: absolute; position: absolute;
top: -5px; top: -5px;
right: -5px; right: -5px;
width: 18px; width: 18px;
height: 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,46 +410,54 @@ const serviceDetailRightTextList = [{
} }
] ]
// switch // switch
const switchOptions = [{ const switchOptions = [
{
"id": 11,
"name": "转账备注",
"isSwitch": true,
showTypeIds: [7],
key: 'isTransferNote',
isMarginBottom: true
}, {
"id": 7, "id": 7,
"name": "账单分类", "name": "账单分类",
"isSwitch": false, "isSwitch": false,
key: 'billClassify', key: 'billClassify',
}, },
{ {
"id": 8, "id": 8,
"name": "标签", "name": "标签",
"isSwitch": false, "isSwitch": false,
key: 'tag', key: 'tag',
}, },
{ {
"id": 9, "id": 9,
"name": "备注", "name": "备注",
"isSwitch": false, "isSwitch": false,
key: 'note', key: 'note',
}, },
{ {
"id": 1, "id": 1,
"name": "服务详情", "name": "服务详情",
"isSwitch": true, "isSwitch": true,
showTypeIds: [3, 4, 10], showTypeIds: [3, 4, 10],
key: 'serviceDetail', key: 'serviceDetail',
}, },
{ {
"id": 2, "id": 2,
"name": "推荐服务", "name": "推荐服务",
"isSwitch": true, "isSwitch": true,
showTypeIds: [4], showTypeIds: [4],
key: 'recommendService', key: 'recommendService',
}, },
{ {
"id": 3, "id": 3,
"name": "服务推荐", "name": "服务推荐",
"isSwitch": true, "isSwitch": true,
showTypeIds: [6, 7], showTypeIds: [6, 7],
key: 'serviceRecommend', key: 'serviceRecommend',
}, },
{ {
"id": 4, "id": 4,
"name": "退款", "name": "退款",
"isSwitch": true, "isSwitch": true,
@ -462,35 +472,35 @@ const switchOptions = [{
} }
} }
} }
}, },
{ {
"id": 5, "id": 5,
"name": "支付奖励", "name": "支付奖励",
"isSwitch": true, "isSwitch": true,
showTypeIds: [1, 3, 4, 13], showTypeIds: [1, 3, 4, 13],
key: 'payReward', key: 'payReward',
}, },
{ {
"id": 6, "id": 6,
"name": "计入收支", "name": "计入收支",
"isSwitch": true, "isSwitch": true,
showTypeIds: [1, 2, 3, 4, 5, 6, 7, 8, 10, 11, 12, 13], showTypeIds: [1, 2, 3, 4, 5, 6, 7, 8, 10, 11, 12, 13],
key: 'countInAndOut', key: 'countInAndOut',
}, },
{ {
"id": 7, "id": 7,
"name": "商家订单号转换条形码", "name": "商家订单号转换条形码",
"isSwitch": true, "isSwitch": true,
showTypeIds: [1, 2, 3], showTypeIds: [1, 2, 3],
key: 'isShowBarcode', key: 'isShowBarcode',
}, },
{ {
"id": 10, "id": 10,
"name": "账单分析", "name": "账单分析",
"isSwitch": true, "isSwitch": true,
showTypeIds: [1, 2, 3, 4, 5, 6, 7, 8, 10, 11, 12, 13], showTypeIds: [1, 2, 3, 4, 5, 6, 7, 8, 10, 11, 12, 13],
key: 'isShowBillAnalysis', 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>

View File

@ -117,31 +117,37 @@
</l-painter> </l-painter>
</view> </view>
</view> </view>
<!-- 水印 -->
<view v-if="$isVip()">
<liu-drag-button :canDocking="false" @clickBtn="$goRechargePage('watermark', 'uni_alipay_other_ranking')">
<c-lottie ref="cLottieRef" :src='$watermark()' width="94px" height='74px' :loop="true"></c-lottie>
</liu-drag-button>
</view>
</template> </template>
<script setup> <script setup>
import { import {
ref, ref,
reactive, reactive,
getCurrentInstance getCurrentInstance
} from 'vue'; } from 'vue';
import { import {
onLoad onLoad
} from '@dcloudio/uni-app'; } from '@dcloudio/uni-app';
const { const {
proxy proxy
} = getCurrentInstance(); } = getCurrentInstance();
const type = ref("base"); const type = ref("base");
const title = ref("xx排名"); const title = ref("xx排名");
const skinBgColor = ref("#FFDFDF"); const skinBgColor = ref("#FFDFDF");
const skinHue = ref(0); // const skinHue = ref(0); //
const isSnapshot = ref(false); const isSnapshot = ref(false);
const isEdit = ref(false); const isEdit = ref(false);
const rightButtonText = ref("编辑"); const rightButtonText = ref("编辑");
const tierList = ref([{ const tierList = ref([{
label: '夯', label: '夯',
bgColor: '#D5171C', bgColor: '#D5171C',
img: 'hang', img: 'hang',
@ -149,8 +155,8 @@ const tierList = ref([{
hasStroke: true, hasStroke: true,
images: [], images: [],
width: 60, width: 60,
}, },
{ {
label: '顶级', label: '顶级',
bgColor: '#FF6A0B', bgColor: '#FF6A0B',
img: 'dingji', img: 'dingji',
@ -158,8 +164,8 @@ const tierList = ref([{
hasStroke: true, hasStroke: true,
images: [], images: [],
width: 104, width: 104,
}, },
{ {
label: '人上人', label: '人上人',
bgColor: '#FFF06A', bgColor: '#FFF06A',
img: 'renshangren', img: 'renshangren',
@ -167,8 +173,8 @@ const tierList = ref([{
hasStroke: true, hasStroke: true,
images: [], images: [],
width: 156, width: 156,
}, },
{ {
label: 'NPC', label: 'NPC',
bgColor: '#FDF5C8', bgColor: '#FDF5C8',
img: 'npc', img: 'npc',
@ -176,8 +182,8 @@ const tierList = ref([{
hasStroke: true, hasStroke: true,
images: [], images: [],
width: 110, width: 110,
}, },
{ {
label: '拉完了', label: '拉完了',
bgColor: '#FFFFFF', bgColor: '#FFFFFF',
img: 'lawanle', img: 'lawanle',
@ -185,11 +191,11 @@ const tierList = ref([{
hasStroke: true, hasStroke: true,
images: [], images: [],
width: 156, width: 156,
} }
]); ]);
// --- --- // --- ---
onLoad(() => { onLoad(() => {
// //
proxy.$apiUserEvent('all', { proxy.$apiUserEvent('all', {
type: 'click', type: 'click',
@ -206,20 +212,20 @@ onLoad(() => {
if (cache.tierList) tierList.value = cache.tierList; if (cache.tierList) tierList.value = cache.tierList;
console.log(tierList.value); console.log(tierList.value);
} }
}); });
// --- --- // --- ---
const drag = reactive({ const drag = reactive({
tierIndex: -1, tierIndex: -1,
imgIdx: -1, imgIdx: -1,
startX: 0, startX: 0,
startY: 0, startY: 0,
moveX: 0, moveX: 0,
moveY: 0 moveY: 0
}); });
// //
const getDragStyle = (tIdx, iIdx) => { const getDragStyle = (tIdx, iIdx) => {
if (drag.tierIndex === tIdx && drag.imgIdx === iIdx) { if (drag.tierIndex === tIdx && drag.imgIdx === iIdx) {
return { return {
transform: `translate(${drag.moveX}px, ${drag.moveY}px)`, transform: `translate(${drag.moveX}px, ${drag.moveY}px)`,
@ -230,9 +236,9 @@ const getDragStyle = (tIdx, iIdx) => {
return { return {
transition: 'transform 0.3s ease' transition: 'transform 0.3s ease'
}; };
}; };
const onTouchStart = (e, tIdx, iIdx) => { const onTouchStart = (e, tIdx, iIdx) => {
if (!isEdit.value) return; if (!isEdit.value) return;
const touch = e.touches[0]; const touch = e.touches[0];
drag.tierIndex = tIdx; drag.tierIndex = tIdx;
@ -241,16 +247,16 @@ const onTouchStart = (e, tIdx, iIdx) => {
drag.startY = touch.clientY; drag.startY = touch.clientY;
drag.moveX = 0; drag.moveX = 0;
drag.moveY = 0; drag.moveY = 0;
}; };
const onTouchMove = (e) => { const onTouchMove = (e) => {
if (drag.tierIndex === -1) return; if (drag.tierIndex === -1) return;
const touch = e.touches[0]; const touch = e.touches[0];
drag.moveX = touch.clientX - drag.startX; drag.moveX = touch.clientX - drag.startX;
drag.moveY = touch.clientY - drag.startY; drag.moveY = touch.clientY - drag.startY;
}; };
const onTouchEnd = () => { const onTouchEnd = () => {
if (drag.tierIndex === -1) return; if (drag.tierIndex === -1) return;
const { const {
@ -276,10 +282,10 @@ const onTouchEnd = () => {
// //
drag.tierIndex = -1; drag.tierIndex = -1;
drag.imgIdx = -1; drag.imgIdx = -1;
}; };
// --- --- // --- ---
const chooseImage = (index) => { const chooseImage = (index) => {
const currentCount = tierList.value[index].images.length; const currentCount = tierList.value[index].images.length;
uni.chooseImage({ uni.chooseImage({
count: 4 - currentCount, count: 4 - currentCount,
@ -288,15 +294,15 @@ const chooseImage = (index) => {
tierList.value[index].images.push(...res.tempFilePaths); tierList.value[index].images.push(...res.tempFilePaths);
} }
}); });
}; };
const deleteImage = (tIdx, iIdx) => { const deleteImage = (tIdx, iIdx) => {
const path = tierList.value[tIdx].images[iIdx]; const path = tierList.value[tIdx].images[iIdx];
removeLocalFile(path); // removeLocalFile(path); //
tierList.value[tIdx].images.splice(iIdx, 1); tierList.value[tIdx].images.splice(iIdx, 1);
}; };
const onRightClick = async () => { const onRightClick = async () => {
if (isEdit.value) { if (isEdit.value) {
uni.showLoading({ uni.showLoading({
title: '正在持久化图片...', title: '正在持久化图片...',
@ -338,12 +344,12 @@ const onRightClick = async () => {
} }
isEdit.value = !isEdit.value; isEdit.value = !isEdit.value;
rightButtonText.value = isEdit.value ? "确定" : "编辑"; rightButtonText.value = isEdit.value ? "确定" : "编辑";
}; };
/** /**
* 将临时图片保存到本地永久目录 * 将临时图片保存到本地永久目录
*/ */
const saveImageToLocal = (tempFilePath) => { const saveImageToLocal = (tempFilePath) => {
return new Promise((resolve) => { return new Promise((resolve) => {
// //
if (tempFilePath.indexOf('_doc/') !== -1 || tempFilePath.indexOf('usr/') !== -1) { if (tempFilePath.indexOf('_doc/') !== -1 || tempFilePath.indexOf('usr/') !== -1) {
@ -362,12 +368,12 @@ const saveImageToLocal = (tempFilePath) => {
} }
}); });
}); });
}; };
/** /**
* 物理删除本地已保存的文件 * 物理删除本地已保存的文件
*/ */
const removeLocalFile = (path) => { const removeLocalFile = (path) => {
if (!path) return; if (!path) return;
// //
if (path.indexOf('_doc/') !== -1 || path.indexOf('usr/') !== -1) { if (path.indexOf('_doc/') !== -1 || path.indexOf('usr/') !== -1) {
@ -377,17 +383,17 @@ const removeLocalFile = (path) => {
fail: (err) => console.log('文件删除失败:', err) fail: (err) => console.log('文件删除失败:', err)
}); });
} }
}; };
const handleSave = () => { const handleSave = () => {
uni.showLoading({ uni.showLoading({
title: '生成中...', title: '生成中...',
mask: true mask: true
}); });
isSnapshot.value = true; isSnapshot.value = true;
}; };
const onPainterSuccess = (path) => { const onPainterSuccess = (path) => {
const done = () => { const done = () => {
isSnapshot.value = false; isSnapshot.value = false;
uni.hideLoading(); uni.hideLoading();
@ -405,9 +411,9 @@ const onPainterSuccess = (path) => {
}), }),
complete: done complete: done
}); });
}; };
const switchType = (val) => { const switchType = (val) => {
type.value = val; type.value = val;
if (val == 'skin') { if (val == 'skin') {
tierList.value[0].bgColor = '#F3575B' tierList.value[0].bgColor = '#F3575B'
@ -427,12 +433,12 @@ const switchType = (val) => {
const cache = uni.getStorageSync('ranking_config_data') || {}; const cache = uni.getStorageSync('ranking_config_data') || {};
cache.type = val; cache.type = val;
uni.setStorageSync('ranking_config_data', cache); uni.setStorageSync('ranking_config_data', cache);
} }
/** /**
* 循环切换行背景色 (编辑模式下) * 循环切换行背景色 (编辑模式下)
*/ */
const changeRowBgColor = (index) => { const changeRowBgColor = (index) => {
if (!isEdit.value) return; if (!isEdit.value) return;
const colors = ['#D5171C', '#FF6A0B', '#FFF06A', '#FDF5C8', '#FFFFFF', '#1777FF', '#333333']; const colors = ['#D5171C', '#FF6A0B', '#FFF06A', '#FDF5C8', '#FFFFFF', '#1777FF', '#333333'];
const curr = tierList.value[index].bgColor; const curr = tierList.value[index].bgColor;
@ -443,12 +449,12 @@ const changeRowBgColor = (index) => {
// () // ()
const darkColors = ['#D5171C', '#1777FF', '#333333']; const darkColors = ['#D5171C', '#1777FF', '#333333'];
tierList.value[index].textColor = darkColors.includes(colors[nextIdx]) ? '#FFFFFF' : '#FFFFFF'; tierList.value[index].textColor = darkColors.includes(colors[nextIdx]) ? '#FFFFFF' : '#FFFFFF';
}; };
/** /**
* 处理色域滑动 * 处理色域滑动
*/ */
const handleHueTouch = (e) => { const handleHueTouch = (e) => {
const touch = e.touches[0]; const touch = e.touches[0];
uni.createSelectorQuery().select('.spectrum-picker').boundingClientRect(rect => { uni.createSelectorQuery().select('.spectrum-picker').boundingClientRect(rect => {
if (rect) { if (rect) {
@ -464,12 +470,12 @@ const handleHueTouch = (e) => {
skinBgColor.value = hslToHex(h, s, l); skinBgColor.value = hslToHex(h, s, l);
} }
}).exec(); }).exec();
}; };
/** /**
* HSL Hex 工具函数 * HSL Hex 工具函数
*/ */
function hslToHex(h, s, l) { function hslToHex(h, s, l) {
l /= 100; l /= 100;
const a = s * Math.min(l, 1 - l) / 100; const a = s * Math.min(l, 1 - l) / 100;
const f = n => { const f = n => {
@ -478,23 +484,23 @@ function hslToHex(h, s, l) {
return Math.round(255 * color).toString(16).padStart(2, '0'); return Math.round(255 * color).toString(16).padStart(2, '0');
}; };
return `#${f(0)}${f(8)}${f(4)}`.toUpperCase(); return `#${f(0)}${f(8)}${f(4)}`.toUpperCase();
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.ranking-page { .ranking-page {
min-height: 100vh; min-height: 100vh;
background-color: #F8F8F8; background-color: #F8F8F8;
padding-bottom: 200rpx; padding-bottom: 200rpx;
} }
.content-container { .content-container {
position: relative; position: relative;
padding: 12rpx 24rpx; padding: 12rpx 24rpx;
} }
.table-box { .table-box {
position: relative; position: relative;
.watermark { .watermark {
@ -505,14 +511,14 @@ function hslToHex(h, s, l) {
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
z-index: 99; z-index: 99;
} }
} }
.ranking-table { .ranking-table {
border: 3rpx solid #333; border: 3rpx solid #333;
background-color: #fff; background-color: #fff;
} }
.ranking-row { .ranking-row {
display: flex; display: flex;
min-height: 148rpx; min-height: 148rpx;
border-bottom: 3rpx solid #333; border-bottom: 3rpx solid #333;
@ -520,34 +526,34 @@ function hslToHex(h, s, l) {
&:last-child { &:last-child {
border-bottom: none; border-bottom: none;
} }
} }
.label-box { .label-box {
width: 176rpx; width: 176rpx;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-right: 3rpx solid #333; border-right: 3rpx solid #333;
} }
.label-text { .label-text {
font-size: 48rpx; font-size: 48rpx;
font-weight: bold; font-weight: bold;
&.with-stroke { &.with-stroke {
text-shadow: 2rpx 2rpx 0 #000, -2rpx -2rpx 0 #000, 2rpx -2rpx 0 #000, -2rpx 2rpx 0 #000; text-shadow: 2rpx 2rpx 0 #000, -2rpx -2rpx 0 #000, 2rpx -2rpx 0 #000, -2rpx 2rpx 0 #000;
} }
} }
.items-box { .items-box {
flex: 1; flex: 1;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 14rpx 12rpx; padding: 14rpx 12rpx;
flex-wrap: wrap; flex-wrap: wrap;
} }
.item-wrapper { .item-wrapper {
width: 105rpx; width: 105rpx;
height: 105rpx; height: 105rpx;
position: relative; position: relative;
@ -560,15 +566,15 @@ function hslToHex(h, s, l) {
scale: 1.1; scale: 1.1;
box-shadow: 0 10rpx 20rpx rgba(0, 0, 0, 0.2); box-shadow: 0 10rpx 20rpx rgba(0, 0, 0, 0.2);
} }
} }
.item-img { .item-img {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 4rpx; border-radius: 4rpx;
} }
.del-btn { .del-btn {
position: absolute; position: absolute;
top: -12rpx; top: -12rpx;
right: -12rpx; right: -12rpx;
@ -582,9 +588,9 @@ function hslToHex(h, s, l) {
align-items: center; align-items: center;
font-size: 24rpx; font-size: 24rpx;
z-index: 10; z-index: 10;
} }
.add-btn { .add-btn {
width: 100rpx; width: 100rpx;
height: 100rpx; height: 100rpx;
background: #eee; background: #eee;
@ -597,17 +603,17 @@ function hslToHex(h, s, l) {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
} }
} }
.save-btn { .save-btn {
margin-top: 60rpx; margin-top: 60rpx;
width: 400rpx; width: 400rpx;
background: #1777FF; background: #1777FF;
color: #fff; color: #fff;
border-radius: 50rpx; border-radius: 50rpx;
} }
.bottom-tabs { .bottom-tabs {
position: fixed; position: fixed;
bottom: 40rpx; bottom: 40rpx;
bottom: calc(32rpx + env(safe-area-inset-bottom)); bottom: calc(32rpx + env(safe-area-inset-bottom));
@ -630,9 +636,9 @@ function hslToHex(h, s, l) {
color: #1777FF; color: #1777FF;
} }
} }
} }
.skin-box { .skin-box {
position: relative; position: relative;
padding: 120rpx 12rpx; padding: 120rpx 12rpx;
background-color: #FFDFDF; background-color: #FFDFDF;
@ -687,45 +693,45 @@ function hslToHex(h, s, l) {
bottom: 60rpx; bottom: 60rpx;
left: 100rpx; left: 100rpx;
} }
} }
.save-action { .save-action {
margin-top: 60rpx; margin-top: 60rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
padding-bottom: 60rpx; padding-bottom: 60rpx;
} }
.bottom-edit-actions { .bottom-edit-actions {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
width: 100%; width: 100%;
} }
.edit-tip { .edit-tip {
font-size: 22rpx; font-size: 22rpx;
color: #999; color: #999;
margin-top: 10rpx; margin-top: 10rpx;
} }
.color-picker { .color-picker {
display: flex; display: flex;
gap: 16rpx; gap: 16rpx;
background: #fff; background: #fff;
padding: 12rpx 20rpx; padding: 12rpx 20rpx;
border-radius: 40rpx; border-radius: 40rpx;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05); box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
} }
.color-picker-wrapper { .color-picker-wrapper {
display: flex; display: flex;
align-items: center; align-items: center;
margin: 12rpx 0; margin: 12rpx 0;
} }
.hex-input { .hex-input {
width: 150rpx; width: 150rpx;
height: 56rpx; height: 56rpx;
background: #fff; background: #fff;
@ -735,9 +741,9 @@ function hslToHex(h, s, l) {
color: #333; color: #333;
border: 1rpx solid #eee; border: 1rpx solid #eee;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05); box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
} }
.spectrum-picker { .spectrum-picker {
width: 600rpx; width: 600rpx;
height: 32rpx; height: 32rpx;
background: #fff; background: #fff;
@ -746,9 +752,9 @@ function hslToHex(h, s, l) {
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08); box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
position: relative; position: relative;
margin: 12rpx 0; margin: 12rpx 0;
} }
.slider-thumb { .slider-thumb {
position: absolute; position: absolute;
top: 50%; top: 50%;
width: 38rpx; width: 38rpx;
@ -759,26 +765,26 @@ function hslToHex(h, s, l) {
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.3); box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.3);
border: 2rpx solid #fff; border: 2rpx solid #fff;
pointer-events: none; pointer-events: none;
} }
.spectrum-bar { .spectrum-bar {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 12rpx; border-radius: 12rpx;
background: linear-gradient(to right, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%); background: linear-gradient(to right, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%);
} }
.color-dot { .color-dot {
width: 32rpx; width: 32rpx;
height: 32rpx; height: 32rpx;
border-radius: 50%; border-radius: 50%;
border: 2rpx solid #fff; border: 2rpx solid #fff;
box-shadow: 0 0 4rpx rgba(0, 0, 0, 0.2); box-shadow: 0 0 4rpx rgba(0, 0, 0, 0.2);
margin: 0 10rpx; margin: 0 10rpx;
} }
.painter-container { .painter-container {
position: fixed; position: fixed;
left: -9999rpx; left: -9999rpx;
} }
</style> </style>

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": "",