Merge branch 'master' of http://47.109.37.87:3000/by2025/admin-vben5
This commit is contained in:
@@ -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({
|
||||||
|
@@ -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" />
|
||||||
|
@@ -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: '计费单价',
|
||||||
|
Reference in New Issue
Block a user