gaoluyang
2026-06-24 712aa51536236d43e87273e4ce45ac5691dffad8
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<script lang="ts" setup>
import { ref } from 'vue';
 
import { DocAlert, Page } from '..\..\..\..\packages\effects\common-ui\src';
 
import { Tabs } from 'ant-design-vue';
import dayjs from 'dayjs';
 
import TeamView from './modules/team-view.vue';
import TypeView from './modules/type-view.vue';
import UserView from './modules/user-view.vue';
 
import 'dayjs/locale/zh-cn';
 
dayjs.locale('zh-cn');
 
const activeTab = ref<string>('type');
</script>
 
<template>
  <Page auto-content-height>
    <template #doc>
      <DocAlert
        title="【排班】排班计划、排班日历"
        url="https://doc.iocoder.cn/mes/cal/calendar/"
      />
    </template>
    <div class="bg-card rounded-md p-3">
      <Tabs v-model:active-key="activeTab" type="card">
        <Tabs.TabPane key="type" tab="按分类" force-render>
          <TypeView />
        </Tabs.TabPane>
        <Tabs.TabPane key="team" tab="按班组" force-render>
          <TeamView />
        </Tabs.TabPane>
        <Tabs.TabPane key="user" tab="按个人" force-render>
          <UserView />
        </Tabs.TabPane>
      </Tabs>
    </div>
  </Page>
</template>