考试相关，优化日程页面

apps/web-ele/src/api/knowledge/category.ts

@@ -0,0 +1,17 @@
+import { requestClient } from '#/api/request';
+enum Api {
+  baseknowledgeCategory = '/knowledgeCategory/category',
+  queryknowledgeCategory = '/knowledgeCategory/category/list',
+}
+//新增知识库分类
+export function addKnowledgeCategory(data: any) {
+  return requestClient.post(Api.baseknowledgeCategory, data, {
+    successMessageMode: 'message',
+  });
+}
+//查询知识库分类列表
+export function queryKnowledgeCategory() {
+  return requestClient.get(Api.queryknowledgeCategory, {
+    isTransformResponse: false,
+  });
+}

apps/web-ele/src/router/routes/core.ts

@@ -37,6 +37,44 @@ const coreRoutes: RouteRecordRaw[] = [
     redirect: DEFAULT_HOME_PATH,
     children: [],
   },
+  //考试相关通过链接进入
+  {
+    name: 'Examin',
+    path: '/examin',
+    component: () =>
+      import('#/views/examManage/myExamPaper/cpn/examInfo/index.vue'),
+    meta: {
+      title: '考试信息',
+    },
+  },
+  {
+    name: 'Startexamin',
+    path: '/startexamin',
+    component: () =>
+      import('#/views/examManage/myExamPaper/cpn/startexamin/index.vue'),
+    meta: {
+      title: '开始考试',
+    },
+  },
+  {
+    name: 'Examcompleted',
+    path: '/examcompleted',
+    component: () =>
+      import('#/views/examManage/myExamPaper/cpn/endexamin/examcompleted.vue'),
+    meta: {
+      title: '考试完成',
+    },
+  },
+  {
+    name: 'Viewexamin',
+    path: '/viewexamin',
+    component: () =>
+      import('#/views/examManage/myExamPaper/cpn/endexamin/viewexamin.vue'),
+    meta: {
+      title: '查看考试结果',
+    },
+  },
+  //结束
   {
     component: AuthPageLayout,
     meta: {

apps/web-ele/src/router/routes/local.ts

@@ -201,6 +201,39 @@ const localRoutes: RouteRecordStringComponent[] = [
     path: '/examManage/myExamPaper/examInfo/:id',
   },
   // 新增路由结束
+  {
+    component: '/examManage/myExamPaper/cpn/startexamin/index',
+    meta: {
+      activePath: '/examManage/myExamPaper',
+      icon: 'carbon:information',
+      title: '开始考试',
+      hideInMenu: true,
+    },
+    name: 'Startexamin',
+    path: '/examManage/myExamPaper/cpn/startexamin/index',
+  },
+  {
+    component: '/examManage/myExamPaper/cpn/endexamin/examcompleted',
+    meta: {
+      activePath: '/examManage/myExamPaper',
+      icon: 'carbon:information',
+      title: '考试完成',
+      hideInMenu: true,
+    },
+    name: 'ExamCompleted',
+    path: '/examManage/myExamPaper/cpn/endexamin/examcompleted',
+  },
+  {
+    component: '/examManage/myExamPaper/cpn/endexamin/viewexamin',
+    meta: {
+      activePath: '/examManage/myExamPaper',
+      icon: 'carbon:information',
+      title: '查看考试结果',
+      hideInMenu: true,
+    },
+    name: 'Viewexamin',
+    path: '/examManage/myExamPaper/cpn/endexamin/viewexamin',
+  },
 ];
 
 /**

apps/web-ele/src/views/examManage/myExamPaper/cpn/endexamin/examcompleted.vue

@@ -0,0 +1,59 @@
+<script lang="ts" setup>
+import { Page } from '@vben/common-ui';
+import { ref } from 'vue';
+import { useRouter, useRoute } from 'vue-router';
+import { CircleCheckFilled } from '@element-plus/icons-vue';
+const router = useRouter();
+const route = useRoute();
+const handleClick = () => {
+  if(route.path==='/examcompleted'){
+  router.replace({ path: '/viewexamin' });
+
+  }else{
+  router.replace({ path: '/examManage/myExamPaper/cpn/endexamin/viewexamin' });
+
+  }
+};
+</script>
+<template>
+  <Page title="考试完成">
+    <div class="exam-completed-container">
+      <el-icon class="exam-completed-icon"><CircleCheckFilled /></el-icon>
+      <div class="exam-completed-title">考试完成</div>
+      <div class="exam-completed-desc">
+        请稍后在【我的考试-已考试】中查看成绩。
+      </div>
+      <el-button class="exam-completed-btn" @click="handleClick"
+        >查看结果</el-button
+      >
+    </div>
+  </Page>
+</template>
+<style lang="scss" scoped>
+.exam-completed-container {
+  margin-top: 120px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 24px;
+  .exam-completed-icon {
+    font-size: 88px;
+    color: #52c41a;
+  }
+  .exam-completed-title {
+    font-size: 18px;
+    font-weight: 500;
+    color: #31373d;
+  }
+  .exam-completed-desc {
+    font-size: 14px;
+    font-weight: 400;
+    color: #31373d;
+  }
+  .exam-completed-btn {
+    width: 160px;
+    height: 40px;
+  }
+}
+</style>

apps/web-ele/src/views/examManage/myExamPaper/cpn/examInfo/index.vue

@@ -1,17 +1,20 @@
 <script lang="ts" setup>
 import { Page } from '@vben/common-ui';
+import { ref } from 'vue';
+import havetoken from './istokenexamin/havetoken.vue';
+import notoken from './istokenexamin/notoken.vue';
+const userinfo = localStorage.getItem(
+  'Smart-Steward-Admin-5.5.4-dev-core-access',
+) as any;
+const token = ref('');
+if (userinfo) {
+  token.value = JSON.parse(userinfo).accessToken || '';
+}
 </script>
 <template>
-<Page>
-<div class="wrap">
-        开发中
-</div>
-</Page>
+  <view>
+    <havetoken v-if="token" />
+    <notoken v-else />
+  </view>
 </template>
-<style lang="scss" scoped>
-.wrap {
-padding: 16px;
-background-color: #fff;
-border-radius: 6px;
-}
-</style>
+<style lang="scss" scoped></style>

apps/web-ele/src/views/examManage/myExamPaper/cpn/examInfo/istokenexamin/havetoken.vue

@@ -0,0 +1,110 @@
+<script lang="ts" setup>
+import { Page } from '@vben/common-ui';
+import { useRouter } from 'vue-router';
+import { useTabs } from '@vben/hooks';
+const { closeCurrentTab } = useTabs();
+const router = useRouter();
+const examinformation = {
+  ExamName: '考试名称 1',
+  TotalExamScore: '100',
+  Passingscore: '60',
+  Examduration: '30分钟',
+  ExamInstructions: '这是考试说明',
+};
+const handlclick = async () => {
+  await closeCurrentTab();
+  router.push({
+    path: '/examManage/myExamPaper/cpn/startexamin/index',
+  });
+};
+</script>
+<template>
+  <Page title="考试信息">
+    <div class="examinformation">
+      <div class="examinformation_item">
+        <div class="examinformation_item_left">考试名称</div>
+        <div class="examinformation_item_right">
+          {{ examinformation.ExamName }}
+        </div>
+      </div>
+      <div class="examinformation_item">
+        <div class="examinformation_item_left">考试总分</div>
+        <div class="examinformation_item_right">
+          {{ examinformation.TotalExamScore }}
+        </div>
+      </div>
+      <div class="examinformation_item">
+        <div class="examinformation_item_left">及格分数</div>
+        <div class="examinformation_item_right">
+          {{ examinformation.Passingscore }}
+        </div>
+      </div>
+      <div class="examinformation_item">
+        <div class="examinformation_item_left">考试时长</div>
+        <div class="examinformation_item_right">
+          {{ examinformation.Examduration }}
+        </div>
+      </div>
+      <div class="examinformation_item">
+        <div class="examinformation_item_left">考试说明</div>
+        <div class="examinformation_item_right">
+          {{ examinformation.ExamInstructions }}
+        </div>
+      </div>
+    </div>
+    <div class="btn">
+      <el-button style="flex: 1">返 回</el-button>
+      <el-button style="flex: 1" type="primary" @click="handlclick"
+        >开 始 考 试</el-button
+      >
+    </div>
+  </Page>
+</template>
+<style lang="scss" scoped>
+.examinformation {
+  width: 100%;
+  height: 180px;
+  border: 1px solid #d4d6d9;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  .examinformation_item {
+    flex: 1;
+    border-bottom: 1px solid #d4d6d9;
+    display: flex;
+    justify-content: space-between;
+    color: #31373d;
+    font-size: 14px;
+    .examinformation_item_left {
+      background-color: #f2f3f5;
+      width: 240px;
+      font-weight: 500;
+      display: flex;
+      align-items: center;
+      justify-content: end;
+      box-sizing: border-box;
+      padding-right: 16px;
+    }
+    .examinformation_item_right {
+      border-left: 1px solid #d4d6d9;
+      flex: 1;
+      font-weight: 400;
+      display: flex;
+      align-items: center;
+      box-sizing: border-box;
+      padding-left: 16px;
+    }
+    &:last-child {
+      border-bottom: none;
+    }
+  }
+}
+.btn {
+  width: 352px;
+  height: 40px;
+  display: flex;
+  justify-content: space-between;
+  gap: 32px;
+  margin: 24px auto;
+}
+</style>

apps/web-ele/src/views/examManage/myExamPaper/cpn/examInfo/istokenexamin/notoken.vue

@@ -0,0 +1,172 @@
+<script lang="ts" setup>
+import { Page } from '@vben/common-ui';
+import { reactive, ref } from 'vue';
+import { useRouter, useRoute } from 'vue-router';
+import type { FormInstance, FormRules } from 'element-plus';
+const router = useRouter();
+const route = useRoute();
+const ruleFormRef = ref<FormInstance>();
+const examinformation = {
+  ExamName: '考试名称 1',
+  TotalExamScore: '100',
+  Passingscore: '60',
+  Examduration: '30分钟',
+  ExamInstructions: '这是考试说明',
+};
+const ruleForm = reactive({
+  username: '',
+  mobilenumber: '',
+});
+
+const rules = reactive<FormRules<typeof ruleForm>>({
+  username: [
+    {
+      required: true,
+      message: '姓名不能为空！',
+      trigger: 'change',
+    },
+  ],
+  mobilenumber: [
+    {
+      required: true,
+      message: '手机号不能为空！',
+      trigger: 'change',
+    },
+  ],
+});
+
+const submitForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  formEl.validate((valid) => {
+    if (valid) {
+      router.replace({
+        path: '/startexamin',
+      });
+    } else {
+      console.log('error submit!');
+    }
+  });
+};
+</script>
+<template>
+  <Page>
+    <div style="display: flex; flex-direction: column; align-items: center">
+      <div class="title">欢迎进入联合汇能考试中心</div>
+      <div class="examinformation">
+        <div class="examinformation_item">
+          <div class="examinformation_item_left">考试名称</div>
+          <div class="examinformation_item_right">
+            {{ examinformation.ExamName }}
+          </div>
+        </div>
+        <div class="examinformation_item">
+          <div class="examinformation_item_left">考试总分</div>
+          <div class="examinformation_item_right">
+            {{ examinformation.TotalExamScore }}
+          </div>
+        </div>
+        <div class="examinformation_item">
+          <div class="examinformation_item_left">及格分数</div>
+          <div class="examinformation_item_right">
+            {{ examinformation.Passingscore }}
+          </div>
+        </div>
+        <div class="examinformation_item">
+          <div class="examinformation_item_left">考试时长</div>
+          <div class="examinformation_item_right">
+            {{ examinformation.Examduration }}
+          </div>
+        </div>
+        <div class="examinformation_item">
+          <div class="examinformation_item_left">考试说明</div>
+          <div class="examinformation_item_right">
+            {{ examinformation.ExamInstructions }}
+          </div>
+        </div>
+      </div>
+      <div class="examinformation_content">
+        <el-form
+          ref="ruleFormRef"
+          style="width: 400px"
+          :model="ruleForm"
+          status-icon
+          :rules="rules"
+          label-width="auto"
+          class="demo-ruleForm"
+        >
+          <el-form-item label="姓名" prop="username">
+            <el-input v-model="ruleForm.username" autocomplete="off" />
+          </el-form-item>
+          <el-form-item label="手机号" prop="mobilenumber">
+            <el-input v-model="ruleForm.mobilenumber" autocomplete="off" />
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              style="margin: 0 auto; width: 160px; height: 40px"
+              type="primary"
+              @click="submitForm(ruleFormRef)"
+            >
+              开 始 考 试
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
+  </Page>
+</template>
+<style lang="scss" scoped>
+.title {
+  font-size: 22px;
+  font-weight: 600;
+  margin-bottom: 48px;
+}
+.examinformation {
+  width: 100%;
+  height: 180px;
+  border: 1px solid #d4d6d9;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  .examinformation_item {
+    flex: 1;
+    border-bottom: 1px solid #d4d6d9;
+    display: flex;
+    justify-content: space-between;
+    color: #31373d;
+    font-size: 14px;
+    .examinformation_item_left {
+      background-color: #f2f3f5;
+      width: 240px;
+      font-weight: 500;
+      display: flex;
+      align-items: center;
+      justify-content: end;
+      box-sizing: border-box;
+      padding-right: 16px;
+    }
+    .examinformation_item_right {
+      border-left: 1px solid #d4d6d9;
+      flex: 1;
+      font-weight: 400;
+      display: flex;
+      align-items: center;
+      box-sizing: border-box;
+      padding-left: 16px;
+    }
+    &:last-child {
+      border-bottom: none;
+    }
+  }
+}
+.examinformation_content {
+  margin-top: 129px;
+  //   border: 1px solid red;
+  // display: flex;
+  //   width: 352px;
+  //   height: 40px;
+  //   display: flex;
+  //   justify-content: space-between;
+  //   gap: 32px;
+  //   margin: 24px auto;
+}
+</style>

apps/web-ele/src/views/knowledge/type/create.vue

@@ -93,8 +93,14 @@ const selectDefaultIcon = (iconValue: string) => {
 // 表单提交
 const submitForm = () => {
   // 这里可以添加表单提交逻辑
-  emit('save', form.value);
-  ElMessage.success(props.mode === 'create' ? '创建成功' : '编辑成功');
+  formRef.value.validate((valid) => {
+    if (valid) {
+      emit('save', form.value);
+      ElMessage.success(props.mode === 'create' ? '创建成功' : '编辑成功');
+    } else {
+      ElMessage.error('请填写正确的信息');
+    }
+  });
 };
 
 // 关闭表单
@@ -159,7 +165,7 @@ const closeForm = () => {
             @click="selectDefaultIcon(icon.value)"
           >
             <!-- 这里可以根据icon.value显示不同的图标 -->
-            <div class="icon-placeholder" :class="icon.value"></div>
+            <ElIcon class="icon-placeholder" :class="icon.value"></ElIcon>
           </div>
         </div>
       </div>

apps/web-ele/src/views/knowledge/type/index.vue

@@ -3,9 +3,12 @@ import { Page } from '@vben/common-ui';
 import { ElButton, ElCard, ElIcon, ElPagination } from 'element-plus';
 import { Edit, Delete } from '@element-plus/icons-vue';
 import KnowledgeCreate from './create.vue';
-import { ref } from 'vue';
+import { ref, onMounted, reactive } from 'vue';
 import { useRouter } from 'vue-router';
-
+import {
+  addKnowledgeCategory,
+  queryKnowledgeCategory,
+} from '#/api/knowledge/category';
 // 导入 FormData 类型
 interface FormData {
   name: string;
@@ -21,24 +24,24 @@ interface FormData {
 const router = useRouter();
 
 // 示例数据
-const categories = [
-  { id: 1, name: '悬浮态', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-  { id: 2, name: '常规态', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-  { id: 3, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-  { id: 4, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Document', color: '#9254DE' },
-  { id: 5, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#FF7D00' },
-  { id: 6, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#00B42A' },
-  { id: 7, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#FF7D00' },
-  { id: 8, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#9254DE' },
-  { id: 9, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-  { id: 10, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-  { id: 11, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-  { id: 12, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-  { id: 13, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-  { id: 14, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-  { id: 15, name: '我的文件', description: '位使用人员提供了知识管理场景示例', creator: '张三', createTime: '2025-01-01', icon: 'Menu', color: '#3370FF' },
-];
-
+const categories = ref([]) as any;
+const total = ref<number>(0);
+// const currentPage = ref(1);
+const pageSize = ref<number>(15);
+const createCategory = async () => {
+  try {
+    const res = await queryKnowledgeCategory();
+    if (res.code === 200) {
+      categories.value = res.rows || [];
+      total.value = res.total || 0;
+    }
+  } catch (error) {
+    console.log(error);
+  }
+};
+onMounted(() => {
+  createCategory();
+});
 // 抽屉控制
 const drawerVisible = ref(false);
 const drawerMode = ref('create');
@@ -93,10 +96,12 @@ const closeDrawer = () => {
 };
 
 // 保存知识类别
-const saveCategory = (data: any) => {
+const saveCategory = async (data: any) => {
   if (drawerMode.value === 'create') {
     // 这里可以添加创建逻辑
-    console.log('创建知识库:', data);
+    // console.log('创建知识库:', data);
+    const res = await addKnowledgeCategory(data);
+    console.log(res);
   } else {
     // 这里可以添加编辑逻辑
     console.log('编辑知识库:', data);
@@ -104,72 +109,91 @@ const saveCategory = (data: any) => {
 };
 </script>
 <template>
-<Page>
-<div class="wrap">
-    <!-- 页面头部 -->
-    <div class="header">
-      <ElButton type="primary" @click="openCreateDrawer">+ 添加类别</ElButton>
-      <!-- <ElButton type="default">管理</ElButton> -->
-    </div>
-    <!-- 卡片列表 -->
-    <div class="card-list">
-      <div v-for="category in categories" :key="category.id" class="card-item">
-        <ElCard :bordered="false" class="category-card" @click="navigateToDetail(category.id)">
-          <div class="card-content">
-            <!-- 左侧图标 -->
-            <div class="card-icon" :style="{ backgroundColor: category.color + '20', color: category.color }">
-              <ElIcon :icon="category.icon" size="24" />
-            </div>
-            <!-- 中间内容 -->
-            <div class="card-main">
-              <h3 class="card-title">{{ category.name }}</h3>
-              <p class="card-description">{{ category.description }}</p>
-            </div>
-            <!-- 右侧信息 -->
-            <div class="card-info">
-              <div class="creator">{{ category.creator }}</div>
-              <div class="create-time">{{ category.createTime }}</div>
-              <!-- 操作按钮 -->
-              <div class="card-actions">
-                <ElButton type="text" :icon="Edit" circle @click.stop="openEditDrawer(category)" />
-              <ElButton type="text" :icon="Delete" circle />
+  <Page>
+    <div class="wrap">
+      <!-- 页面头部 -->
+      <div class="header">
+        <ElButton type="primary" @click="openCreateDrawer">+ 添加类别</ElButton>
+        <!-- <ElButton type="default">管理</ElButton> -->
+      </div>
+      <!-- 卡片列表 -->
+      <div class="card-list">
+        <div
+          v-for="category in categories"
+          :key="category.id"
+          class="card-item"
+        >
+          <ElCard
+            :bordered="false"
+            class="category-card"
+            @click="navigateToDetail(category.id)"
+          >
+            <div class="card-content">
+              <!-- 左侧图标 -->
+              <div
+                class="card-icon"
+                :style="{
+                  backgroundColor: category.color + '20',
+                  color: category.color,
+                }"
+              >
+                <ElIcon :icon="category.icon" size="24" />
+              </div>
+              <!-- 中间内容 -->
+              <div class="card-main">
+                <h3 class="card-title">{{ category.name }}</h3>
+                <p class="card-description">{{ category.description }}</p>
+              </div>
+              <!-- 右侧信息 -->
+              <div class="card-info">
+                <div class="creator">{{ category.createBy }}</div>
+                <div class="create-time">{{ category.createTime }}</div>
+                <!-- 操作按钮 -->
+                <div class="card-actions">
+                  <ElButton
+                    type="text"
+                    :icon="Edit"
+                    circle
+                    @click.stop="openEditDrawer(category)"
+                  />
+                  <ElButton type="text" :icon="Delete" circle />
+                </div>
               </div>
             </div>
-          </div>
-        </ElCard>
+          </ElCard>
+        </div>
       </div>
-    </div>
-    <!-- 分页 -->
-    <div class="pagination">
-      <ElPagination 
-        layout="prev, pager, next" 
-        :total="categories.length" 
-        :page-size="15"
-      />
-    </div>
-    <!-- 创建/编辑抽屉 -->
-    <ElDrawer
-      v-model="drawerVisible"
-      :title="drawerMode === 'create' ? '创建知识库' : '编辑知识库'"
-      size="30%"
-      direction="rtl"
-      @close="closeDrawer"
-    >
-      <KnowledgeCreate
-        :mode="drawerMode"
-        :initial-data="selectedCategory"
+      <!-- 分页 -->
+      <div class="pagination">
+        <ElPagination
+          layout="prev, pager, next"
+          :total="total"
+          :page-size="pageSize"
+        />
+      </div>
+      <!-- 创建/编辑抽屉 -->
+      <ElDrawer
+        v-model="drawerVisible"
+        :title="drawerMode === 'create' ? '创建知识库' : '编辑知识库'"
+        size="30%"
+        direction="rtl"
         @close="closeDrawer"
-        @save="saveCategory"
-      />
-    </ElDrawer>
-</div>
-</Page>
+      >
+        <KnowledgeCreate
+          :mode="drawerMode"
+          :initial-data="selectedCategory"
+          @close="closeDrawer"
+          @save="saveCategory"
+        />
+      </ElDrawer>
+    </div>
+  </Page>
 </template>
 <style lang="scss" scoped>
 .wrap {
-padding: 16px;
-background-color: #fff;
-border-radius: 6px;
+  padding: 16px;
+  background-color: #fff;
+  border-radius: 6px;
 }
 
 .header {
@@ -192,11 +216,11 @@ border-radius: 6px;
 }
 
 .category-card:hover {
-  background-color: #E8F3FF;
+  background-color: #e8f3ff;
 }
 
 .category-card:hover .card-title {
-  color: #2D64D0;
+  color: #2d64d0;
 }
 
 .category-card:hover .creator,
@@ -275,4 +299,3 @@ border-radius: 6px;
   justify-content: center;
 }
 </style>
-

apps/web-ele/src/views/schedule/view/components/day/index.vue

@@ -15,16 +15,18 @@ const emergencyTasks = [
     title: '应急演练',
     icon: 'warning',
     color: '#D34B27',
+    mainColor: '#FFE6E0',
     deadline: '12-31 23:59',
     days: 61,
     status: '可授权',
-    statusColor: 'blue',
+    statusColor: '#215ACD',
   },
   {
     id: 2,
     title: '纳税人普查',
     icon: 'document',
     color: '#D34B27',
+    mainColor: '#FFE6E0',
     deadline: '12-31 23:59',
     days: 61,
     status: '被授权',
@@ -38,24 +40,27 @@ const todayTasks = [
     title: '监控录像抽检',
     icon: 'monitor',
     color: '#FF9428',
+    mainColor: '#FFEAD6',
     deadline: '12-07 23:59',
     status: '可授权',
-    statusColor: 'blue',
+    statusColor: '#215ACD',
   },
   {
     id: 2,
     title: '爆缸试水1',
     icon: 'water',
     color: '#FF9428',
+    mainColor: '#FFEAD6',
     deadline: '12-14 23:00',
     status: '已授权',
-    statusColor: 'green',
+    statusColor: '#339169',
   },
   {
     id: 3,
     title: '应急消防用品月检',
     icon: 'fire',
-    color: '#67C23A',
+    color: '#FF9428',
+    mainColor: '#FFEAD6',
     deadline: '12-31 13:59',
     status: '被授权',
     statusColor: 'orange',
@@ -64,16 +69,18 @@ const todayTasks = [
     id: 4,
     title: '核对销售（油品）调查1',
     icon: 'check',
-    color: '#E6A23C',
+    color: '#FF9428',
+    mainColor: '#FFEAD6',
     deadline: '12-15 23:59',
     status: '可授权',
-    statusColor: 'blue',
+    statusColor: '#215ACD',
   },
   {
     id: 5,
     title: '便利店盘点',
     icon: 'shopping',
-    color: '#E6A23C',
+    color: '#FF9428',
+    mainColor: '#FFEAD6',
     deadline: '12-31 23:59',
     status: '被授权',
     statusColor: 'orange',
@@ -82,25 +89,28 @@ const todayTasks = [
     id: 6,
     title: '新员工三级教育',
     icon: 'user',
-    color: '#409EFF',
+    color: '#339169',
+    mainColor: '#D6EFE6',
     deadline: '12-06 23:00',
     status: '已授权',
-    statusColor: 'green',
+    statusColor: '#339169',
   },
   {
     id: 7,
     title: '厨房宿舍月检',
     icon: 'home',
-    color: '#909399',
+    color: '#339169',
+    mainColor: '#D6EFE6',
     deadline: '12-31 23:59',
     status: '可授权',
-    statusColor: 'blue',
+    statusColor: '#215ACD',
   },
   {
     id: 8,
     title: '收油流程巡检',
     icon: 'oil',
-    color: '#409EFF',
+    color: '#339169',
+    mainColor: '#D6EFE6',
     deadline: '12-07 23:59',
     status: '被授权',
     statusColor: 'orange',
@@ -109,28 +119,31 @@ const todayTasks = [
     id: 9,
     title: '第一次例会',
     icon: 'meeting',
-    color: '#409EFF',
+    color: '#339169',
+    mainColor: '#D6EFE6',
     deadline: '12-15 23:00',
     status: '可授权',
-    statusColor: 'blue',
+    statusColor: '#215ACD',
   },
   {
     id: 10,
     title: '建军计划',
     icon: 'plan',
-    color: '#67C23A',
+    color: '#339169',
+    mainColor: '#D6EFE6',
     deadline: '12-03 23:00',
     status: '已授权',
-    statusColor: 'green',
+    statusColor: '#339169',
   },
   {
     id: 11,
     title: '员工培训',
     icon: 'training',
-    color: '#409EFF',
+    color: '#339169',
+    mainColor: '#D6EFE6',
     deadline: '12-31 23:59',
     status: '可授权',
-    statusColor: 'blue',
+    statusColor: '#215ACD',
   },
 ];
 
@@ -139,25 +152,28 @@ const tomorrowTasks = [
     id: 1,
     title: '巡检日检',
     icon: 'check',
-    color: '#67C23A',
+    color: '#215ACD',
+    mainColor: '#E4EDFF',
     deadline: '12-31 13:59',
     status: '可授权',
-    statusColor: 'blue',
+    statusColor: '#215ACD',
   },
   {
     id: 2,
     title: '爆缸试水1',
     icon: 'water',
-    color: '#409EFF',
+    color: '#215ACD',
+    mainColor: '#E4EDFF',
     deadline: '12-14 23:00',
     status: '已授权',
-    statusColor: 'green',
+    statusColor: '#339169',
   },
   {
     id: 3,
     title: '应急消防用品月检',
     icon: 'fire',
-    color: '#67C23A',
+    color: '#215ACD',
+    mainColor: '#E4EDFF',
     deadline: '12-31 13:59',
     status: '被授权',
     statusColor: 'orange',
@@ -166,25 +182,28 @@ const tomorrowTasks = [
     id: 4,
     title: '核对销售（油品）调查1',
     icon: 'check',
-    color: '#E6A23C',
+    color: '#215ACD',
+    mainColor: '#E4EDFF',
     deadline: '12-15 23:59',
     status: '可授权',
-    statusColor: 'blue',
+    statusColor: '#215ACD',
   },
   {
     id: 5,
     title: '便利店盘点',
     icon: 'shopping',
-    color: '#E6A23C',
+    color: '#86909C',
+    mainColor: '#F1F1F1',
     deadline: '12-31 23:59',
     status: '已授权',
-    statusColor: 'green',
+    statusColor: '#339169',
   },
   {
     id: 6,
     title: '新员工三级教育',
     icon: 'user',
-    color: '#409EFF',
+    color: '#86909C',
+    mainColor: '#F1F1F1',
     deadline: '12-06 23:00',
     status: '被授权',
     statusColor: 'orange',
@@ -193,10 +212,11 @@ const tomorrowTasks = [
     id: 7,
     title: '巡检日检',
     icon: 'check',
-    color: '#67C23A',
+    color: '#86909C',
+    mainColor: '#F1F1F1',
     deadline: '12-31 13:59',
     status: '可授权',
-    statusColor: 'blue',
+    statusColor: '#215ACD',
   },
 ];
 // 模拟图标映射
@@ -231,31 +251,37 @@ function hexToRgb(hex) {
   <div class="mb-6">
     <h3 class="mb-3 text-lg font-semibold">逾期待处理</h3>
     <div
-      class="grid grid-cols-4 gap-4 sm:grid-cols-4 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6"
+      class="grid grid-cols-4 gap-3 sm:grid-cols-4 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-5"
     >
       <div
         v-for="task in emergencyTasks"
         :key="task.id"
-        class="cursor-pointer rounded-lg shadow-sm transition-all hover:shadow-md"
+        class="h-[96px] w-[240px] cursor-pointer rounded shadow-sm transition-all hover:shadow-md"
         @click="handleTaskClick(task.id)"
       >
         <div
-          class="flex h-8 items-center justify-center rounded-t-lg text-sm font-medium text-white"
+          class="flex h-8 items-center justify-center rounded-t text-sm font-medium text-white"
           :style="{ backgroundColor: task.color }"
         >
           已逾期 {{ task.days }} 天
         </div>
-        <div
-          class="flex items-center justify-between rounded-b-lg border border-t-0 border-gray-200 p-4"
-          :style="{ backgroundColor: `rgba(${hexToRgb(task.color)}, 0.35)` }"
+        <div 
+          class="flex items-center justify-between rounded-b border border-t-0 border-gray-200 p-4 h-[64px]" 
+          :style="{ backgroundColor: task.mainColor }" 
         >
           <div class="flex items-center" style="margin-right: 8px">
             <span
               class="flex-none rounded px-2 py-0.5 text-xs font-medium"
-              :class="{
-                'bg-blue-100 text-blue-600': task.statusColor === 'blue',
-                'bg-orange-100 text-orange-600': task.statusColor === 'orange',
-                'bg-green-100 text-green-600': task.statusColor === 'green',
+              style="color: #ffffff"
+              :style="{
+                backgroundColor:
+                  task.statusColor === '#215ACD'
+                    ? '#215ACD'
+                    : task.statusColor === '#339169'
+                      ? '#339169'
+                      : task.statusColor === 'orange'
+                        ? '#ea580c'
+                        : '',
               }"
             >
               {{ task.status }}
@@ -277,32 +303,38 @@ function hexToRgb(hex) {
   <div class="mb-6">
     <h3 class="mb-3 text-lg font-semibold">当日</h3>
     <div
-      class="grid grid-cols-4 gap-4 sm:grid-cols-4 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6"
+      class="grid grid-cols-4 gap-3 sm:grid-cols-4 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-5"
     >
       <div
         v-for="task in todayTasks"
         :key="task.id"
-        class="cursor-pointer rounded-lg shadow-sm transition-all hover:shadow-md"
+        class="h-[96px] w-[240px] cursor-pointer rounded shadow-sm transition-all hover:shadow-md"
         @click="handleTaskClick(task.id)"
       >
         <div
-          class="flex h-8 items-center justify-center rounded-t-lg text-sm font-medium text-white"
+          class="flex h-8 items-center justify-center rounded-t text-sm font-medium text-white"
           :style="{ backgroundColor: task.color }"
         >
           {{ task.deadline }}
         </div>
         <div
-          class="flex items-center justify-between rounded-b-lg border border-t-0 border-gray-200 p-4"
-          :style="{ backgroundColor: `rgba(${hexToRgb(task.color)}, 0.35)` }"
+          class="flex items-center justify-between rounded-b border border-t-0 border-gray-200 p-4 h-[64px]"
+          :style="{ backgroundColor: task.mainColor }"
         >
           <div class="flex items-center" style="margin-right: 8px">
             <span
               v-if="task.status"
               class="flex-none rounded px-2 py-0.5 text-xs font-medium"
-              :class="{
-                'bg-blue-100 text-blue-600': task.statusColor === 'blue',
-                'bg-orange-100 text-orange-600': task.statusColor === 'orange',
-                'bg-green-100 text-green-600': task.statusColor === 'green',
+              style="color: #ffffff"
+              :style="{
+                backgroundColor:
+                  task.statusColor === '#215ACD'
+                    ? '#215ACD'
+                    : task.statusColor === '#339169'
+                      ? '#339169'
+                      : task.statusColor === 'orange'
+                        ? '#ea580c'
+                        : '',
               }"
             >
               {{ task.status }}
@@ -322,32 +354,38 @@ function hexToRgb(hex) {
   <div>
     <h3 class="mb-3 text-lg font-semibold">明日</h3>
     <div
-      class="grid grid-cols-4 gap-4 sm:grid-cols-4 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6"
+      class="grid grid-cols-4 gap-3 sm:grid-cols-4 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-5"
     >
       <div
         v-for="task in tomorrowTasks"
         :key="task.id"
-        class="cursor-pointer rounded-lg shadow-sm transition-all hover:shadow-md"
+        class="h-[96px] w-[240px] cursor-pointer rounded shadow-sm transition-all hover:shadow-md"
         @click="handleTaskClick(task.id)"
       >
         <div
-          class="flex h-8 items-center justify-center rounded-t-lg text-sm font-medium text-white"
+          class="flex h-8 items-center justify-center rounded-t text-sm font-medium text-white"
           :style="{ backgroundColor: task.color }"
         >
           {{ task.deadline }}
         </div>
         <div
-          class="flex items-center justify-between rounded-b-lg border border-t-0 border-gray-200 p-4"
-          :style="{ backgroundColor: `rgba(${hexToRgb(task.color)}, 0.35)` }"
+          class="flex items-center justify-between rounded-b border border-t-0 border-gray-200 p-4 h-[64px]"
+          :style="{ backgroundColor: task.mainColor }"
         >
           <div class="flex items-center" style="margin-right: 8px">
             <span
               v-if="task.status"
               class="flex-none rounded px-2 py-0.5 text-xs font-medium"
-              :class="{
-                'bg-blue-100 text-blue-600': task.statusColor === 'blue',
-                'bg-orange-100 text-orange-600': task.statusColor === 'orange',
-                'bg-green-100 text-green-600': task.statusColor === 'green',
+              style="color: #ffffff"
+              :style="{
+                backgroundColor:
+                  task.statusColor === '#215ACD'
+                    ? '#215ACD'
+                    : task.statusColor === '#339169'
+                      ? '#339169'
+                      : task.statusColor === 'orange'
+                        ? '#ea580c'
+                        : '',
               }"
             >
               {{ task.status }}