diff --git a/src/components/chart/Bar.vue b/src/components/chart/Bar.vue
index 43e4d70..2ce645f 100644
--- a/src/components/chart/Bar.vue
+++ b/src/components/chart/Bar.vue
@@ -24,6 +24,14 @@
         type: String as PropType<string>,
         default: 'calc(100vh - 78px)',
       },
+      itemStyleLabel: {
+        type: Boolean as PropType<boolean>,
+        default: true,
+      },
+      seriesName: {
+        type: String as PropType<string>,
+        default: 'bar',
+      },
       // update-begin--author:liaozhiyang---date:20240407---for：【QQYUN-8762】首页默认及echars颜色调整
       seriesColor: {
         type: String,
@@ -54,10 +62,11 @@
         },
         series: [
           {
-            name: 'bar',
+            name: props.seriesName,
             type: 'bar',
             data: [],
             color: props.seriesColor,
+            itemStyle : { normal: {label : {show: props.itemStyleLabel, position: 'inside'}}},
           },
         ],
       });
@@ -78,7 +87,9 @@
         });
         option.series[0].data = seriesData;
         // update-begin--author:liaozhiyang---date:20240407---for：【QQYUN-8762】首页默认及echars颜色调整
+        option.series[0].name = props.seriesName;
         option.series[0].color = props.seriesColor;
+        option.series[0].itemStyle.normal.label.show = props.itemStyleLabel;
         // update-end--author:liaozhiyang---date:20240407---for：【QQYUN-8762】首页默认及echars颜色调整
         option.xAxis.data = xAxisData;
         setOptions(option);
diff --git a/src/views/zh/hy/zc/hy.api.ts b/src/views/zh/hy/zc/hy.api.ts
new file mode 100644
index 0000000..4ef393c
--- /dev/null
+++ b/src/views/zh/hy/zc/hy.api.ts
@@ -0,0 +1,11 @@
+import { defHttp } from '/@/utils/http/axios';
+
+enum Api {
+  registerList = '/zh/hy/queryPageList',
+}
+
+/**
+ * 会员注册时间段统计
+ * @param params
+ */
+export const registerList = (params) => defHttp.get({ url: Api.registerList, params });
diff --git a/src/views/zh/hy/zc/index.vue b/src/views/zh/hy/zc/index.vue
new file mode 100644
index 0000000..daf080d
--- /dev/null
+++ b/src/views/zh/hy/zc/index.vue
@@ -0,0 +1,56 @@
+<template>
+  <div class="p-4">
+    <a-card :bordered="false" style="height: 100%">
+      <a-row>
+        <a-col :span="10">
+          <a-date-picker :value-format="valueFormat" :default-value="defaultValue" v-model:value="parmas.dateString" @change="changeDate" />
+        </a-col>
+      </a-row>
+      <Bar :chartData="dataSource" height="80vh" :option="{ title: { text: '会员注册时间段统计', left: 'center' }}" :itemStyleLabel="false" :seriesName="'个数'"></Bar>
+    </a-card>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import {ref, unref, reactive, onMounted} from 'vue';
+  import Bar from '/@/components/chart/Bar.vue';
+  import { registerList } from './hy.api';
+  import type { Dayjs } from 'dayjs';
+  const valueFormat = 'YYYY-MM-DD';
+  const dataSource = ref([]);
+  const dateValue = ref();
+
+  const parmas = reactive<any>({
+    beginTime: '',
+    endTime: '',
+    dateString: '',
+    housingestateId: '',
+  })
+
+  const changeDate = (date, dateString) => {
+    parmas.dateString = dateString;
+  };
+  async function loadDate() {
+    if(parmas.dateString!=''){
+      parmas.beginTime = parmas.dateString+' 00:00:00';
+      parmas.endTime = parmas.dateString+' 23:59:59';
+    }
+    const res = await registerList(parmas);
+    console.log(res);
+    dataSource.value = [];
+    for (let i = 0; i < res.length; i++) {
+      dataSource.value.push({
+        name: `${res[i].shortHour}时`,
+        value: res[i].cn,
+      });
+    }
+  }
+
+  onMounted(() => {
+    if(parmas.dateString==''){
+      parmas.dateString='2025-06-30';
+    }
+    loadDate();
+  })
+
+</script>
diff --git a/src/views/zh/monitor/index.vue b/src/views/zh/monitor/index.vue
new file mode 100644
index 0000000..c741e7d
--- /dev/null
+++ b/src/views/zh/monitor/index.vue
@@ -0,0 +1,80 @@
+<template>
+  <div>
+    <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleHousingestate"> 1获取区域信息</a-button>
+  </div>
+  <div>
+    <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleDevice"> 2获取设备信息</a-button>
+  </div>
+  <div>
+    <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleUser"> 3获取用户信息</a-button>
+  </div>
+  <div>
+    <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleDeviceOverflow"> 4获取设备满溢</a-button>
+  </div>
+  <div>
+    <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleDeviceClear"> 5获取设备清运</a-button>
+  </div>
+  <div>
+    <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleOrder"> 6获取订单信息</a-button>
+  </div>
+  <div>新增日期：
+    <a-date-picker v-model:value="startedAt" />
+    <a-date-picker v-model:value="endedAt" />
+  </div>
+<!--  <div>新增时间：
+    <a-date-picker show-time v-model:value="startedAt" />
+    <a-date-picker show-time v-model:value="endedAt" />
+  </div>-->
+  <div>更新时间：
+    <a-date-picker show-time v-model:value="updatedStartAt" />
+    <a-date-picker show-time v-model:value="updatedEndAt" />
+  </div>
+</template>
+<script lang="ts" name="system-role" setup>
+  import { ref } from 'vue';
+  import type { Dayjs } from 'dayjs';
+  type RangeValue = [Dayjs, Dayjs];
+  import {
+    monitorDevice,
+    monitorOverflow,
+    monitorClear,
+    monitorUser,
+    monitorHousingestate,
+    monitorOrder
+  } from './monitor.api';
+
+  const startedAt = ref<RangeValue>();
+  const endedAt = ref<RangeValue>();
+  const updatedStartAt = ref<RangeValue>();
+  const updatedEndAt = ref<RangeValue>();
+
+  function handleHousingestate() {
+    monitorHousingestate({});
+  }
+
+  function handleDevice() {
+    monitorDevice({updatedStartAt: updatedStartAt.value,updatedEndAt: updatedEndAt.value});
+  }
+
+  function handleUser() {
+    monitorUser({startedAt: startedAt.value,endedAt: endedAt.value,updatedStartAt: updatedStartAt.value,updatedEndAt: updatedEndAt.value});
+  }
+
+  function handleDeviceOverflow() {
+    monitorOverflow({});
+  }
+
+  function handleDeviceClear() {
+    monitorClear({startedAt: startedAt.value,endedAt: endedAt.value,updatedStartAt: updatedStartAt.value,updatedEndAt: updatedEndAt.value});
+  }
+
+  function handleOrder() {
+    monitorOrder({startedAt: startedAt.value,endedAt: endedAt.value,updatedStartAt: updatedStartAt.value,updatedEndAt: updatedEndAt.value});
+  }
+
+</script>
+<style scoped="scoped">
+  div {
+    margin: 10px 10px 10px 50px;
+  }
+</style>