xjs
/
payment-statistics
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 线上线下数据对接

master
xjs 2025-05-26 10:30:43 +08:00
parent c4fcc28ed2
commit 3306cab187
2 changed files with 17 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/views/components/OfflineStatus.vue
View File

@ -18,7 +18,7 @@
</div>
<div class="leading-[1] absolute top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%] z-3 flex items-center flex-col font-700 italic">
<div class="bg-gradient-to-b from-[#8FC8FF] to-white bg-clip-text text-transparent flex items-baseline">
<div class="text-[25px]">690</div>
<div class="text-[25px]">{{ offlineTotal }}</div>
<div class="text-[20px]">人</div>
</div>
<div class="text-[#FFFFFF] text-[16px] text-shadow-[0px_2px_2px_rgba(12,32,72,0.42)] mt-[7px]">线下</div>
@ -70,7 +70,7 @@
};
const colorList = ref(["#0783FA", "#07D1FA", "#20E6A4", "#FFD15C"]);
const askSectionData = inject("askSectionData", ref<{ offline: any[] }>({ offline: [] }));
const askSectionData = inject("askSectionData", ref<{ offline: any[],scource:any[] }>({ offline: [],scource:[] }));
const chartData = ref<any[]>([]);
@ -81,6 +81,8 @@
},
);
const offlineTotal = ref<any>({})
const initData = () => {
if (askSectionData.value.offline && askSectionData.value.offline.length > 0) {
chartData.value = askSectionData.value.offline.map((item, index) => ({
@ -88,6 +90,7 @@
value: item.total,
color: colorList.value[index % colorList.value.length],
}));
offlineTotal.value = askSectionData.value.scource.filter(item => item.tag==="线下")[0].total
}
}

19
src/views/components/OnlineStatus.vue
View File

@ -18,7 +18,7 @@
</div>
<div class="leading-[1] absolute top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%] z-3 flex items-center flex-col font-700 italic">
<div class="bg-gradient-to-b from-[#8FC8FF] to-white bg-clip-text text-transparent flex items-baseline">
<div class="text-[25px]">690</div>
<div class="text-[25px]">{{ onlineTotal }}</div>
<div class="text-[20px]">人</div>
</div>
<div class="text-[#FFFFFF] text-[16px] text-shadow-[0px_2px_2px_rgba(12,32,72,0.42)] mt-[7px]">线上</div>
@ -71,23 +71,28 @@
const colorList = ref(["#0783FA", "#07D1FA", "#20E6A4", "#FFD15C"]);
const askSectionData = inject("askSectionData", ref<{ online: any[] }>({ online: [] }));
const askSectionData = inject("askSectionData", ref<{ online: any[]; scource: any[] }>({ online: [], scource: [] }));
const chartData = ref<any[]>([]);
const onlineTotal = ref<any>({});
watch(() => askSectionData.value, () => {
initData()
});
watch(
() => askSectionData.value,
() => {
initData();
},
);
const initData = () => {
if (askSectionData.value.online && askSectionData.value.online.length > 0) {
chartData.value = askSectionData.value.online.map((item, index) => ({
name: item.tag,
value: item.total,
color: colorList.value[index % colorList.value.length],
color: colorList.value[index % colorList.value.length],
}));
onlineTotal.value = askSectionData.value.scource.filter((item) => item.tag === "线上")[0].total;
}
}
};
onBeforeMount(() => {
getHeaderLeftSvg();