This commit is contained in:
2025-07-07 15:23:10 +08:00
parent d9ef508399
commit 2d03c09cc1
3 changed files with 43 additions and 31 deletions

View File

@@ -1,5 +1,5 @@
<script setup> <script setup>
import {onMounted, ref, watch} from "vue"; import {computed, nextTick, onMounted, ref, watch} from "vue";
import warn from '../static/icons/warn.png'; import warn from '../static/icons/warn.png';
import success from '../static/icons/info.png'; import success from '../static/icons/info.png';
@@ -16,8 +16,8 @@ const STATUS = {
const {text, status, tile, textColor} = defineProps({ const {text, status, tile, textColor} = defineProps({
text: { text: {
type: String, type: Array,
default: '提示请在规定时间内按要求提交回填1。以免影响收益。哈哈哈哈哈哈哈哈哈哈' default: ['1.你好你好', '2.啊我就会发回复哈', '3.测试啊u发哈u发货']
}, },
textColor: { textColor: {
type: String, type: String,
@@ -32,37 +32,45 @@ const {text, status, tile, textColor} = defineProps({
default: false, default: false,
} }
}); });
const showIndex = ref(0);
const textC = computed(() => {
return text.map((v, index) => ({
show: index === showIndex.value,
text: `${index + 1}. ${v}`,
}))
});
const XNoticeBox = ref(); const XNoticeBox = ref();
const Context = ref(); const Context = ref();
const roll = ref(false); const roll = ref(false);
watch( watch(
() => text, () => showIndex.value,
() => { () => {
if (!tile) { if (!tile) {
if ( nextTick(() => {
Context.value.$el.clientWidth if (
> Context.value.$el.clientWidth
XNoticeBox.value.$el.clientWidth >
) { XNoticeBox.value.$el.clientWidth
roll.value = true; ) {
} roll.value = true;
} else {
roll.value = false;
}
})
} }
}, },
{deep: true} {deep: true}
) )
onMounted(() => { onMounted(() => {
if (!tile) { setInterval(() => {
if ( showIndex.value++;
Context.value.$el.clientWidth if (showIndex.value > text.length - 1) {
> showIndex.value = 0;
XNoticeBox.value.$el.clientWidth
) {
roll.value = true;
} }
} }, 5000);
}); });
</script> </script>
@@ -72,8 +80,14 @@ onMounted(() => {
:style="{alignItems: tile ? 'start' : 'center'}"> :style="{alignItems: tile ? 'start' : 'center'}">
<image v-if="status==='error'" class="!size-[26rpx] flex-shrink-0" :src="warn"></image> <image v-if="status==='error'" class="!size-[26rpx] flex-shrink-0" :src="warn"></image>
<image v-else class="!size-[26rpx] flex-shrink-0" :src="success"></image> <image v-else class="!size-[26rpx] flex-shrink-0" :src="success"></image>
<text v-if="!tile" class="!whitespace-nowrap flex-shrink-0" :style="{color: textColor}" <view v-if="!tile">
v-html="text"></text> <view
class="!whitespace-nowrap flex-shrink-0"
:style="{color: textColor}"
v-for="v in textC.filter(v => v.show)"
v-html="v.text">
</view>
</view>
<text v-else :style="{color: textColor}" v-html="text"> <text v-else :style="{color: textColor}" v-html="text">
</text> </text>
</view> </view>
@@ -120,7 +134,7 @@ onMounted(() => {
@keyframes Roll { @keyframes Roll {
0% { 0% {
transform: translateX(100%); transform: translateX(0%);
} }
100% { 100% {
transform: translateX(-100%); transform: translateX(-100%);

View File

@@ -17,7 +17,7 @@ import XNoticeBar from "../../components/XNoticeBar.vue";
import {onShow} from "@dcloudio/uni-app"; import {onShow} from "@dcloudio/uni-app";
const showAddCustomer = ref(false); const showAddCustomer = ref(false);
const textContent = ref(null); const textContent = reactive([]);
const advList = reactive([]); const advList = reactive([]);
const nav = [ const nav = [
{ {
@@ -102,10 +102,8 @@ onMounted(() => {
advList.push(...data); advList.push(...data);
}); });
Api.system.getBarrageList().then(({data}) => { Api.system.getBarrageList().then(({data}) => {
textContent.value = ''; textContent.length = 0;
data.forEach((v, index) => { textContent.push(...data);
textContent.value += `${index + 1}.${v}&nbsp;&nbsp;&nbsp;&nbsp;`;
});
}); });
}) })
</script> </script>
@@ -113,7 +111,7 @@ onMounted(() => {
<template> <template>
<!--首页--> <!--首页-->
<XNav :show-back="false"></XNav> <XNav :show-back="false"></XNav>
<x-notice-bar :text="textContent" v-if="textContent"></x-notice-bar> <x-notice-bar :text="textContent" v-if="textContent.length"></x-notice-bar>
<add-customer-service-modal v-model:show="showAddCustomer"></add-customer-service-modal> <add-customer-service-modal v-model:show="showAddCustomer"></add-customer-service-modal>

View File

@@ -79,15 +79,15 @@ onShow(() => {
<view class="w-full !grid grid-cols-3 gap-[20rpx]"> <view class="w-full !grid grid-cols-3 gap-[20rpx]">
<view class="py-[24rpx] px-[20rpx] bg-[#fff] rounded-[16rpx]"> <view class="py-[24rpx] px-[20rpx] bg-[#fff] rounded-[16rpx]">
<view class="text-[#4E5969] test-22r">总收益</view> <view class="text-[#4E5969] test-22r">总收益</view>
<view class="test-36r" style="font-weight: 700;">0.00</view> <view class="test-36r" style="font-weight: 700;">{{ UserStore.userInfo.total_money }}</view>
</view> </view>
<view class="py-[24rpx] px-[20rpx] bg-[#fff] rounded-[16rpx]"> <view class="py-[24rpx] px-[20rpx] bg-[#fff] rounded-[16rpx]">
<view class="text-[#4E5969] test-22r">打款中</view> <view class="text-[#4E5969] test-22r">打款中</view>
<view class="test-36r" style="font-weight: 700;">0.00</view> <view class="test-36r" style="font-weight: 700;">{{ UserStore.userInfo.tx_money }}</view>
</view> </view>
<view class="py-[24rpx] px-[20rpx] bg-[#fff] rounded-[16rpx]"> <view class="py-[24rpx] px-[20rpx] bg-[#fff] rounded-[16rpx]">
<view class="text-[#4E5969] test-22r">已提现</view> <view class="text-[#4E5969] test-22r">已提现</view>
<view class="test-36r" style="font-weight: 700;">0.00</view> <view class="test-36r" style="font-weight: 700;">{{ UserStore.userInfo.withraw_money }}</view>
</view> </view>
</view> </view>