This commit is contained in:
fyy
2025-09-12 22:58:48 +08:00
3 changed files with 49 additions and 20 deletions

View File

@@ -2,9 +2,18 @@
import type { EchartsUIType } from '@vben/plugins/echarts'; import type { EchartsUIType } from '@vben/plugins/echarts';
import { EchartsUI, useEcharts } from '@vben/plugins/echarts'; import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
import { onMounted, ref, defineExpose } from 'vue'; import { onMounted, ref, defineExpose, watch } from 'vue';
import { meterRecordTrend } from '#/api/property/energyManagement/meterRecord'; import { meterRecordTrend } from '#/api/property/energyManagement/meterRecord';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
const props = defineProps({
meterType: {
type: Number,
default: 1,
},
});
const meterType = ref<Number>(1);
const chartRef = ref<EchartsUIType>(); const chartRef = ref<EchartsUIType>();
const { renderEcharts } = useEcharts(chartRef); const { renderEcharts } = useEcharts(chartRef);
// 添加日期选择相关逻辑 // 添加日期选择相关逻辑
@@ -16,12 +25,12 @@ const getDaysInMonth = (date: any) => {
const daysInMonth = new Date(year, month, 0).getDate(); const daysInMonth = new Date(year, month, 0).getDate();
return Array.from({ length: daysInMonth }, (_, i) => i + 1); return Array.from({ length: daysInMonth }, (_, i) => i + 1);
}; };
const getMeterRecordTrend = async (selectedDate: any) => { const getMeterRecordTrend = async (selectedDate: any, meterType: any) => {
const res = await meterRecordTrend({ const res = await meterRecordTrend({
day: dayjs().format('YYYY-MM-DD'), day: dayjs().format('YYYY-MM-DD'),
month: selectedDate.value, month: selectedDate.value,
year: dayjs().format('YYYY'), year: dayjs().format('YYYY'),
meterType: 1, meterType: meterType.value,
meterId: null, meterId: null,
floorId: null, floorId: null,
}); });
@@ -109,7 +118,7 @@ const getMeterRecordTrend = async (selectedDate: any) => {
}); });
}; };
onMounted(async () => { onMounted(async () => {
getMeterRecordTrend(selectedDate); getMeterRecordTrend(selectedDate, meterType);
}); });
// 暴露方法给父组件调用 // 暴露方法给父组件调用
defineExpose({ defineExpose({

View File

@@ -12,7 +12,7 @@ import AnalyticsVisitsData from './analytics-visits-data.vue';
import AnalyticsVisitsSales from './analytics-visits-sales.vue'; import AnalyticsVisitsSales from './analytics-visits-sales.vue';
import AnalyticsVisitsSource from './analytics-visits-source.vue'; import AnalyticsVisitsSource from './analytics-visits-source.vue';
import { ref, onMounted } from 'vue'; import { ref, onMounted } from 'vue';
import { DatePicker } from 'ant-design-vue'; import { DatePicker, message } from 'ant-design-vue';
import { Radio } from 'ant-design-vue'; import { Radio } from 'ant-design-vue';
import { import {
getIndexCount, getIndexCount,
@@ -52,7 +52,7 @@ const overviewItems = ref<any[]>([
]); ]);
//tab选择 //tab选择
const timeUnit = ref(1); const meterType = ref<Number>(1);
// 月份选择 // 月份选择
const selectedDate = ref<any>(null); const selectedDate = ref<any>(null);
const paramDate = ref(null); const paramDate = ref(null);
@@ -65,12 +65,28 @@ const analyticsTrendsRef = ref<InstanceType<typeof AnalyticsTrends> | null>(
); );
const handleDateChange = (date: any) => { const handleDateChange = (date: any) => {
paramDate.value = date.format('YYYY-MM'); paramDate.value = date.format('YYYY-MM');
console.log('meterType', meterType);
// 调用子组件的方法 // 调用子组件的方法
if ( if (
analyticsTrendsRef.value && analyticsTrendsRef.value &&
analyticsTrendsRef.value.getMeterRecordTrend analyticsTrendsRef.value.getMeterRecordTrend
) { ) {
analyticsTrendsRef.value.getMeterRecordTrend(paramDate); analyticsTrendsRef.value.getMeterRecordTrend(paramDate, meterType);
}
};
const handleMeterTypeChange = (e: Event) => {
if (!selectedDate.value) {
message.warning('请选择月份');
return;
}
paramDate.value = selectedDate.value.format('YYYY-MM');
// 调用子组件的方法
if (
analyticsTrendsRef.value &&
analyticsTrendsRef.value.getMeterRecordTrend
) {
analyticsTrendsRef.value.getMeterRecordTrend(paramDate, meterType);
} }
}; };
@@ -199,8 +215,13 @@ onMounted(() => {
class="flex items-center justify-between p-5" class="flex items-center justify-between p-5"
style="width: 100%; height: 100px" style="width: 100%; height: 100px"
> >
<Radio.Group v-model:value="timeUnit" size="large"> <Radio.Group
size="large"
v-model:value="meterType"
@change="handleMeterTypeChange"
>
<Radio.Button value="1">电量</Radio.Button> <Radio.Button value="1">电量</Radio.Button>
<Radio.Button value="2">水量</Radio.Button>
</Radio.Group> </Radio.Group>
<DatePicker <DatePicker
v-model:value="selectedDate" v-model:value="selectedDate"
@@ -210,15 +231,15 @@ onMounted(() => {
@change="handleDateChange" @change="handleDateChange"
/> />
</div> </div>
<div v-if="timeUnit == 1"> <div>
<AnalyticsTrends <AnalyticsTrends
:meterType="meterType"
ref="analyticsTrendsRef" ref="analyticsTrendsRef"
:selected-date="selectedDate" :selected-date="selectedDate"
/> />
</div> </div>
</div> </div>
<div class="mt-5 w-full md:flex"> <div class="mt-5 w-full md:flex">
<AnalysisChartCard class="mt-5 md:mr-4 md:mt-0 md:w-1/3" title="预警类型"> <AnalysisChartCard class="mt-5 md:mr-4 md:mt-0 md:w-1/3" title="预警类型">
<AnalyticsVisitsData :statisticsData="statisticsList" /> <AnalyticsVisitsData :statisticsData="statisticsList" />

View File

@@ -158,15 +158,15 @@ export const modalSchema: FormSchemaGetter = () => [
placeholder: '请输入(如:元)', placeholder: '请输入(如:元)',
}, },
}, },
{ // {
label: '付费方式', // label: '付费方式',
fieldName: 'paymentMode', // fieldName: 'paymentMode',
component: 'Select', // component: 'Select',
componentProps: { // componentProps: {
options: getDictOptions('wy_fffs'), // options: getDictOptions('wy_fffs'),
}, // },
rules: 'selectRequired', // rules: 'selectRequired',
}, // },
{ {
label: '进位方式', label: '进位方式',
fieldName: 'roundingMode', fieldName: 'roundingMode',
@@ -202,7 +202,6 @@ export const modalSchema: FormSchemaGetter = () => [
options: getDictOptions('pro_calculation_formula'), options: getDictOptions('pro_calculation_formula'),
}, },
rules: 'selectRequired', rules: 'selectRequired',
formItemClass: 'col-span-2',
}, },
{ {
label: '计费单价', label: '计费单价',