no message

main
HUOJIN\92525 2026-01-19 16:56:14 +08:00
parent 4761f7036d
commit 173c639d5e
5 changed files with 44 additions and 22 deletions

View File

@ -19,7 +19,7 @@ export const columns: BasicColumn[] = [
{ {
title: '柜号', title: '柜号',
align: "center", align: "center",
width: '155px', width: '160px',
dataIndex: 'conNo', dataIndex: 'conNo',
customRender: ({ text }) => { customRender: ({ text }) => {
return render.renderTip(text); return render.renderTip(text);

View File

@ -3,6 +3,7 @@ import { defHttp } from '/@/utils/http/axios';
enum Api { enum Api {
loginfo = '/sys/loginfo', loginfo = '/sys/loginfo',
visitInfo = '/sys/visitInfo', visitInfo = '/sys/visitInfo',
getChartCardList = '/dashboard/getChartCardList',
} }
/** /**
* *
@ -14,3 +15,5 @@ export const getLoginfo = (params) => defHttp.get({ url: Api.loginfo, params },
* @param params * @param params
*/ */
export const getVisitInfo = (params) => defHttp.get({ url: Api.visitInfo, params }, { isTransformResponse: false }); export const getVisitInfo = (params) => defHttp.get({ url: Api.visitInfo, params }, { isTransformResponse: false });
export const getChartCardList = (params) => defHttp.get({ url: Api.getChartCardList, params }, { isTransformResponse: false });

View File

@ -31,14 +31,13 @@
<Bar :seriesColor="seriesColor" v-if="index === 2" :option="option" :chartData="chartData" height="50px"></Bar> <Bar :seriesColor="seriesColor" v-if="index === 2" :option="option" :chartData="chartData" height="50px"></Bar>
<Progress v-if="index === 3" :percent="78" :show-info="false"></Progress> <Progress v-if="index === 3" :percent="78" :show-info="false"></Progress>
</div> </div>
<template #footer v-if="type === 'chart'"> <template #footer v-if="type === 'chart'">
<span v-if="index !== 3" <span v-if="index !== 3"
>{{ item.footer }}<span>{{ item.value }}</span></span >{{ item.footer }}<span>{{ item.value }}</span></span
> >
<Trend term="周同比" :percentage="12" v-if="index === 3" /> <!-- <Trend term="周同比" :percentage="12" v-if="index === 3" />
<Trend term="日同比" :percentage="11" v-if="index === 3" :type="false" /> <Trend term="日同比" :percentage="11" v-if="index === 3" :type="false" />-->
</template> </template>
<template #footer v-else> <template #footer v-else>
<span <span
@ -50,15 +49,16 @@
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, computed } from 'vue'; import { ref, computed, onMounted } from 'vue';
import { Icon } from '/@/components/Icon'; import { Icon } from '/@/components/Icon';
import { Progress } from 'ant-design-vue'; import { Progress } from 'ant-design-vue';
import ChartCard from '/@/components/chart/ChartCard.vue'; import ChartCard from '/@/components/chart/ChartCard.vue';
import Trend from '/@/components/chart/Trend.vue'; import Trend from '/@/components/chart/Trend.vue';
import Bar from '/@/components/chart/Bar.vue'; import Bar from '/@/components/chart/Bar.vue';
import SingleLine from '/@/components/chart/SingleLine.vue'; import SingleLine from '/@/components/chart/SingleLine.vue';
import { chartCardList, bdcCardList } from '../data'; import { bdcCardList } from '../data';
import { useRootSetting } from '/@/hooks/setting/useRootSetting'; import { useRootSetting } from '/@/hooks/setting/useRootSetting';
import { getChartCardList } from '@/views/dashboard/Analysis/api';
const { getThemeColor } = useRootSetting(); const { getThemeColor } = useRootSetting();
const props = defineProps({ const props = defineProps({
@ -70,7 +70,14 @@
default: 'chart', default: 'chart',
}, },
}); });
const option = ref({ xAxis: { show: false, boundaryGap: false }, yAxis: { show: false, boundaryGap: false, max: 220 } });
const chartCardList = ref([]); // chartCardList
const chartLoading = ref(false);
const option = ref({
xAxis: { show: false, boundaryGap: false },
yAxis: { show: false, boundaryGap: false, max: 220 },
});
const chartData = ref([ const chartData = ref([
{ {
@ -100,10 +107,28 @@
]); ]);
const seriesColor = computed(() => { const seriesColor = computed(() => {
return getThemeColor.value; return getThemeColor.value;
}) });
const dataList = computed(() => (props.type === 'dbc' ? bdcCardList : chartCardList)); const dataList = computed(() => (props.type === 'dbc' ? bdcCardList : chartCardList.value));
// chartCardList
async function getChartCard() {
chartLoading.value = true;
try {
const response = await getChartCardList({});
console.log('获取 chartCardList 成功:', response);
chartCardList.value = response.result || [];
} catch (error) {
console.error('获取 chartCardList 失败:', error);
} finally {
chartLoading.value = false;
}
}
function getTotal(total, index) { function getTotal(total, index) {
return index === 0 ? `${total}` : index === 3 ? `${total}%` : total; return index === 0 ? `${total}` : index === 3 ? `${total}` : total;
} }
onMounted(() => {
getChartCard();
});
</script> </script>

View File

@ -45,30 +45,24 @@ export const growCardList: GrowCardItem[] = [
export const chartCardList: GrowCardItem[] = [ export const chartCardList: GrowCardItem[] = [
{ {
title: '总销售额', title: '总库存数量',
icon: 'visit-count|svg', icon: 'visit-count|svg',
total: 126560, total: 126560,
value: 234.56,
footer: '日均销售额',
}, },
{ {
title: '订单量', title: '日均入库量',
icon: 'total-sales|svg', icon: 'total-sales|svg',
value: 1234,
total: 8846, total: 8846,
color: 'blue', color: 'blue',
footer: '日订单量',
}, },
{ {
title: '支付笔数', title: '日均出库量',
icon: 'download-count|svg', icon: 'download-count|svg',
value: 60,
total: 6560, total: 6560,
color: 'orange', color: 'orange',
footer: '转化率',
}, },
{ {
title: '运营活动效果', title: '库存周转率',
icon: 'transaction|svg', icon: 'transaction|svg',
total: 78, total: 78,
}, },

View File

@ -2,7 +2,7 @@
<div class="p-4"> <div class="p-4">
<ChartGroupCard class="enter-y" :loading="loading" type="chart" /> <ChartGroupCard class="enter-y" :loading="loading" type="chart" />
<SaleTabCard class="!my-4 enter-y" :loading="loading" /> <SaleTabCard class="!my-4 enter-y" :loading="loading" />
<a-row> <!-- <a-row>
<a-col :span="24"> <a-col :span="24">
<a-card :loading="loading" :bordered="false" title="最近一周访问量统计"> <a-card :loading="loading" :bordered="false" title="最近一周访问量统计">
<div class="infoArea"> <div class="infoArea">
@ -13,7 +13,7 @@
<LineMulti :chartData="lineMultiData" height="33vh" type="line" :option="{ legend: { top: 'bottom' } }"></LineMulti> <LineMulti :chartData="lineMultiData" height="33vh" type="line" :option="{ legend: { top: 'bottom' } }"></LineMulti>
</a-card> </a-card>
</a-col> </a-col>
</a-row> </a-row>-->
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>