增添移动端管理页面及移动端访问时间设置

src/views/cees/h5/h5.api.ts

@@ -0,0 +1,19 @@
+import { defHttp } from '/@/utils/http/axios';
+import { useMessage } from '/@/hooks/web/useMessage';
+
+const { createConfirm } = useMessage();
+
+enum Api {
+  setH5Time = '/cees/ceesAdminInfo/setH5Time',
+  getH5Time = '/cees/ceesAdminInfo/getH5Time',
+}
+
+// 获取访问时间
+export function getH5Time() {
+  return defHttp.get({ url: Api.getH5Time });
+}
+
+// 设置访问时间
+export function setH5Time(data) {
+  return defHttp.post({ url: Api.setH5Time, params: data });
+}

src/views/cees/h5/index.vue

@@ -0,0 +1,84 @@
+<template>
+  <div style="padding: 24px; height: 100%">
+    <a-card bordered style="height: 100%">
+      <!-- 可访问时间段 -->
+      <div style="font-size: 16px; margin-bottom: 16px; display: flex; gap: 8px; align-items: center">
+        当前可访问时间：
+
+        <a-date-picker v-model:value="tempStart" format="YYYY-MM-DD HH:mm" show-time style="width: 180px" @change="onTimeChange('start')" />
+
+        ——
+
+        <a-date-picker v-model:value="tempEnd" format="YYYY-MM-DD HH:mm" show-time style="width: 180px" @change="onTimeChange('end')" />
+      </div>
+
+      <a-card style="height: 500px" type="inner" bordered> 移动端各页面元素替换（开发中） </a-card>
+    </a-card>
+  </div>
+</template>
+
+<script setup>
+  import { ref, onMounted } from 'vue';
+  import { message, Modal } from 'ant-design-vue';
+  import dayjs from 'dayjs';
+  import { getH5Time, setH5Time } from './h5.api';
+
+  const startTime = ref('');
+  const endTime = ref('');
+  const tempStart = ref(null);
+  const tempEnd = ref(null);
+
+  // 初始化：从后端加载时间
+  onMounted(async () => {
+    try {
+      const res = await getH5Time();
+      startTime.value = res.startTime;
+      endTime.value = res.endTime;
+      tempStart.value = dayjs(startTime.value);
+      tempEnd.value = dayjs(endTime.value);
+    } catch (err) {
+      message.error('访问时间获取失败');
+    }
+  });
+
+  const onTimeChange = (type) => {
+    const newStart = type === 'start' ? tempStart.value : dayjs(startTime.value);
+    const newEnd = type === 'end' ? tempEnd.value : dayjs(endTime.value);
+
+    if (newStart.isAfter(newEnd)) {
+      message.error('开始时间不能晚于结束时间');
+      if (type === 'start') tempStart.value = dayjs(startTime.value);
+      else tempEnd.value = dayjs(endTime.value);
+      return;
+    }
+
+    Modal.confirm({
+      title: '确认修改时间？',
+      content:
+        `是否将${type === 'start' ? '开始' : '结束'}时间修改为：` +
+        (type === 'start' ? newStart.format('YYYY-MM-DD HH:mm') : newEnd.format('YYYY-MM-DD HH:mm')),
+      okText: '确认',
+      cancelText: '取消',
+      async onOk() {
+        const payload = {
+          startTime: newStart.format('YYYY-MM-DD HH:mm:ss'),
+          endTime: newEnd.format('YYYY-MM-DD HH:mm:ss'),
+        };
+        try {
+          await setH5Time(payload);
+          startTime.value = payload.startTime;
+          endTime.value = payload.endTime;
+          message.success('访问时间已修改');
+        } catch (e) {
+          message.error('修改失败');
+          tempStart.value = dayjs(startTime.value);
+          tempEnd.value = dayjs(endTime.value);
+        }
+      },
+      onCancel() {
+        tempStart.value = dayjs(startTime.value);
+        tempEnd.value = dayjs(endTime.value);
+      },
+    });
+  };
+</script>