diff --git a/src/resource-scheduler/components/schedule-table/schedule-table.scss b/src/resource-scheduler/components/schedule-table/schedule-table.scss
index 25bc3331039bdf15fff47134dcf7de969dce3012..5a90feccf3a489189154281b65928ec2bfcaeb94 100644
--- a/src/resource-scheduler/components/schedule-table/schedule-table.scss
+++ b/src/resource-scheduler/components/schedule-table/schedule-table.scss
@@ -43,4 +43,8 @@
         width: 100%;
         min-height: 100%;
     }
+
+    .schedule-toolbar-extra{
+        height: 40px;
+    }
 }
\ No newline at end of file
diff --git a/src/resource-scheduler/components/schedule-table/schedule-table.tsx b/src/resource-scheduler/components/schedule-table/schedule-table.tsx
index 240c9bc788d0763929c0a4e9342dba4141421562..336ff4d8615188a93d6fa9f675c39f0b884ef639 100644
--- a/src/resource-scheduler/components/schedule-table/schedule-table.tsx
+++ b/src/resource-scheduler/components/schedule-table/schedule-table.tsx
@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable no-unused-vars */
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import { computed, defineComponent, ref } from "vue";
+import { computed, defineComponent, ref, useSlots} from "vue";
 import { IResourceViewModel, ITaskViewModel } from "../../interface";
 import { initStore } from "../../store";
 import {
@@ -13,6 +13,7 @@ import {
 } from "../../hooks";
 import { ScheduleTableEvent, ScheduleTableProps } from "./schedule-table-type";
 import "./schedule-table.scss";
+import { useScheduleToolbarEvent } from "../../hooks/use-schedule-table";
 
 export const ScheduleTable = defineComponent({
   name: "ScheduleTable",
@@ -38,8 +39,18 @@ export const ScheduleTable = defineComponent({
       coordinateElement
     );
 
+    // 处理工具栏事件
+    const { onRefresh, onSave, onSaveAs, onConfigRefresh } =
+    useScheduleToolbarEvent(coordinateElement);
+
+    // 插槽
+    const slots = useSlots();
+    
     // 计算表格样式
-    const { headerStyle, bodyStyle } = useScheduleTableStyle(props);
+    const { headerStyle, bodyStyle } = useScheduleTableStyle(
+      props,
+      slots && !!slots.extraToolbar,
+    );
 
     // 监听视图大小变化
     useScheduleTableReSize(props, headerCanvas, bodyCanvas, coordinateElement);
@@ -88,11 +99,28 @@ export const ScheduleTable = defineComponent({
       handleDragOver,
       handleDragStart,
       handleDragLeave,
+      onRefresh,
+      onSave,
+      onSaveAs,
+      onConfigRefresh,
     };
   },
   render() {
     return (
       <div class="schedule-table">
+         <div class='schedule-toolbar'>
+          <ScheduleToolbar
+            onRefresh={this.onRefresh}
+            onSave-as={this.onSaveAs}
+            onSave={this.onSave}
+            onConfig-change={this.onConfigRefresh}
+          ></ScheduleToolbar>
+          {this.$slots.extraToolbar ? (
+            <div class='schedule-toolbar-extra'>
+              {this.$slots.extraToolbar()}
+            </div>
+          ) : null}
+        </div>
         <div class="schedule-table-header" style={this.headerStyle}>
           <canvas
             ref="headerCanvas"
diff --git a/src/resource-scheduler/components/schedule-toolbar/schedule-toolbar.scss b/src/resource-scheduler/components/schedule-toolbar/schedule-toolbar.scss
new file mode 100644
index 0000000000000000000000000000000000000000..d8d3c8edfabb7079495587ca1bd671b31dc03fc8
--- /dev/null
+++ b/src/resource-scheduler/components/schedule-toolbar/schedule-toolbar.scss
@@ -0,0 +1,152 @@
+.schedule-toolbar-container {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  width: 100%;
+}
+
+.schedule-toolbar-content {
+  display: block;
+  flex: 1;
+  flex-wrap: nowrap;
+  gap: 8px;
+  align-items: center;
+  justify-content: left;
+  height: 40px;
+  padding: 4px;
+  overflow: hidden;
+  white-space: nowrap;
+  transition: scroll 0.3s ease;
+  scroll-behavior: smooth;
+
+  &::-webkit-scrollbar {
+    display: none;
+  }
+}
+
+.schedule-toolbar-item {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 32px;
+  height: 100%;
+  margin-right: 8px;
+  font-size: 16px;
+  vertical-align: middle;
+  cursor: pointer;
+  border-radius: 4px;
+
+  &.is-btn {
+    border: 1px solid lightgray;
+  }
+
+  &.is-btn:hover {
+    background-color: #f5f5f5;
+  }
+
+  > span {
+    display: flex;
+    align-items: center;
+  }
+}
+
+.schedule-toolbar-days {
+  display: flex;
+  gap: 4px;
+  align-items: center;
+
+  .schedule-toolbar-days-reduce,
+  .schedule-toolbar-days-add {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 32px;
+    height: 32px;
+    text-align: center;
+    border-radius: 4px;
+
+    &:hover {
+      background-color: #f5f5f5;
+    }
+
+    > span {
+      display: flex;
+      align-items: center;
+    }
+  }
+}
+
+.schedule-toolbar-trains-standards {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+.schedule-toolbar-scale-list {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+.schedule-toolbar-date-picker-container {
+  position: relative;
+  cursor: pointer;
+}
+
+.schedule-toolbar-date-picker {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: -10;
+  width: 100%;
+  height: 100%;
+  opacity: 0;
+}
+
+.schedule-toolbar-toleft {
+  display: none;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  font-size: 16px;
+  cursor: pointer;
+  border: 1px solid lightgray;
+  border-radius: 4px;
+
+  &:hover {
+    background-color: #f5f5f5;
+  }
+
+  &.is-visible {
+    display: inline-flex;
+  }
+}
+
+.schedule-toolbar-toright {
+  display: none;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  font-size: 16px;
+  cursor: pointer;
+  border: 1px solid lightgray;
+  border-radius: 4px;
+
+  &:hover {
+    background-color: #f5f5f5;
+  }
+
+  &.is-visible {
+    display: inline-flex;
+  }
+}
+
+.schedule-toolbar-arrow {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+}
diff --git a/src/resource-scheduler/components/schedule-toolbar/schedule-toolbar.tsx b/src/resource-scheduler/components/schedule-toolbar/schedule-toolbar.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..4a1c76c2c3fc4f9b0b2c2535b04659f28e7765df
--- /dev/null
+++ b/src/resource-scheduler/components/schedule-toolbar/schedule-toolbar.tsx
@@ -0,0 +1,466 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/explicit-function-return-type */
+import { defineComponent, ref } from 'vue';
+import './schedule-toolbar.scss';
+import {
+  useInitScheduleToolbar,
+  useScheduleToolbarReSize,
+} from '../../hooks/use-schedule-toolbar';
+import {
+  addday,
+  datepicker,
+  lock,
+  nextday,
+  nextmonth,
+  nextweek,
+  prevday,
+  prevmonth,
+  prevweek,
+  reduceday,
+  refreesh,
+  save,
+  saveAs,
+  today,
+} from './svg-icon';
+
+export const ScheduleToolbar = defineComponent({
+  emits: ['save', 'save-as', 'refresh', 'config-change'],
+  setup(props, { emit }) {
+    // 日期选择器
+    const datePickerRef = ref();
+
+    // 工具栏
+    const scheduleToolbarContentRef = ref();
+
+    // 是否显示日期选择器
+    const isShowDatePicker = ref(false);
+
+    const {
+      hours,
+      days,
+      currentDay,
+      scale,
+      scaleStartTime,
+      scaleEndTime,
+      trainsStandards,
+      onRefresh,
+      onJupmToNow,
+      onMonthChange,
+      onWeekChange,
+      onDateChange,
+      onLockClick,
+      onHoursChange,
+      onDaysChange,
+      onDaysClickChange,
+      onScaleChange,
+      onScaleTimeChange,
+      onScaleRangeChange,
+      onDatePickerChange,
+      onSave,
+      onSaveAs,
+    } = useInitScheduleToolbar(emit);
+
+    // 渲染小时列表
+    const renderHoursList = (_hours: number = 24) => {
+      const options = [
+        { value: 4, label: '4小时' },
+        { value: 2, label: '2小时' },
+        { value: 1, label: '1小时' },
+        { value: 0.5, label: '30分钟' },
+        { value: 0.25, label: '15分钟' },
+      ];
+      return (
+        <el-select
+          v-model={hours.value}
+          style='width: 150px'
+          onChange={onHoursChange}
+        >
+          {options.map(item => {
+            return (
+              <el-option
+                key={item.value}
+                label={item.label}
+                value={item.value}
+              />
+            );
+          })}
+        </el-select>
+      );
+    };
+
+    // 渲染显示天数列表
+    const renderDaysList = () => {
+      const options = [
+        {
+          value: 1,
+          label: '1天',
+        },
+        {
+          value: 7,
+          label: '7天',
+        },
+        {
+          value: 15,
+          label: '15天',
+        },
+        {
+          value: 31,
+          label: '1月',
+        },
+        {
+          value: 32,
+          label: '2月',
+        },
+        {
+          value: 93,
+          label: '3月',
+        },
+      ];
+      return (
+        <div class='schedule-toolbar-days'>
+          <div
+            class='schedule-toolbar-days-add'
+            title='增加天数'
+            onClick={() => onDaysClickChange(1)}
+          >
+            <span v-html={addday}></span>
+          </div>
+          <el-select
+            v-model={days.value}
+            style='width: 150px'
+            onChange={onDaysChange}
+          >
+            {options.map(item => {
+              return (
+                <el-option
+                  key={item.value}
+                  label={item.label}
+                  value={item.value}
+                />
+              );
+            })}
+          </el-select>
+          <div
+            class='schedule-toolbar-days-reduce'
+            title='减少天数'
+            onClick={() => onDaysClickChange(-1)}
+          >
+            <span v-html={reduceday}></span>
+          </div>
+        </div>
+      );
+    };
+
+    // 渲染开始时间列表
+    const rendertempStartTime = (min: number = 0, max: number = 23) => {
+      const options = [];
+      for (let i = min; i <= max; i++) {
+        options.push({
+          value: i,
+          label: i,
+        });
+      }
+      return (
+        <el-select
+          v-model={scaleStartTime.value}
+          style='width: 100px'
+          placeholder='请选择'
+          onChange={onScaleTimeChange}
+        >
+          {options.map(item => {
+            return (
+              <el-option
+                key={item.value}
+                label={item.label}
+                value={item.value}
+              />
+            );
+          })}
+        </el-select>
+      );
+    };
+
+    // 渲染结束时间列表
+    const rendertempEndTime = (min: number = 1, max: number = 24) => {
+      const options = [];
+      for (let i = min; i <= max; i++) {
+        options.push({
+          value: i,
+          label: i,
+        });
+      }
+      return (
+        <el-select
+          v-model={scaleEndTime.value}
+          style='width: 100px'
+          placeholder='请选择'
+          onChange={onScaleTimeChange}
+        >
+          {options.map(item => {
+            return (
+              <el-option
+                key={item.value}
+                label={item.label}
+                value={item.value}
+              />
+            );
+          })}
+        </el-select>
+      );
+    };
+
+    // 渲染训练日标准下拉
+    const renderTrainsStandards = () => {
+      const options = [
+        {
+          value: '0,24',
+          label: `0:00 - 24:00`,
+        },
+      ];
+      return (
+        <div class='schedule-toolbar-trains-standards'>
+          <div>训练日标准</div>
+          <el-select
+            v-model={trainsStandards.value}
+            style='width: 150px'
+            placeholder='请选择'
+            onChange={onScaleRangeChange}
+          >
+            {options.map(item => {
+              return (
+                <el-option
+                  key={item.value}
+                  label={item.label}
+                  value={item.value}
+                />
+              );
+            })}
+          </el-select>
+        </div>
+      );
+    };
+
+    // 渲染刻度下拉
+    const renderScaleList = () => {
+      const options = [
+        {
+          value: 4,
+          label: '自动',
+        },
+        {
+          value: 12,
+          label: '上下午',
+        },
+      ];
+      return (
+        <div class='schedule-toolbar-scale-list'>
+          <div>刻度</div>
+          <el-select
+            v-model={scale.value}
+            style='width: 100px'
+            placeholder='请选择'
+            onChange={onScaleChange}
+          >
+            {options.map(item => {
+              return (
+                <el-option
+                  key={item.value}
+                  label={item.label}
+                  value={item.value}
+                />
+              );
+            })}
+          </el-select>
+        </div>
+      );
+    };
+
+    // 日期选择器点击
+    const onDateClick = () => {
+      if (datePickerRef.value && !isShowDatePicker.value) {
+        datePickerRef.value.focus();
+      }
+    };
+
+    // 日期选择器显示隐藏改变
+    const onVisibleChange = (visible: boolean) => {
+      isShowDatePicker.value = visible;
+    };
+
+    const { visibleArrow } = useScheduleToolbarReSize(
+      scheduleToolbarContentRef,
+    );
+
+    const scrollToLeft = () => {
+      if (scheduleToolbarContentRef.value) {
+        scheduleToolbarContentRef.value.scrollLeft -=
+          scheduleToolbarContentRef.value.clientWidth;
+      }
+    };
+
+    const scrollToRight = () => {
+      if (scheduleToolbarContentRef.value) {
+        scheduleToolbarContentRef.value.scrollLeft +=
+          scheduleToolbarContentRef.value.clientWidth;
+      }
+    };
+
+    return {
+      currentDay,
+      datePickerRef,
+      scheduleToolbarContentRef,
+      visibleArrow,
+      onSave,
+      onSaveAs,
+      onRefresh,
+      onJupmToNow,
+      onMonthChange,
+      onWeekChange,
+      onDateChange,
+      onLockClick,
+      onDateClick,
+      onDatePickerChange,
+      onVisibleChange,
+      renderHoursList,
+      renderDaysList,
+      rendertempStartTime,
+      rendertempEndTime,
+      renderTrainsStandards,
+      renderScaleList,
+      scrollToLeft,
+      scrollToRight,
+    };
+  },
+  render() {
+    return (
+      <div class='schedule-toolbar-container'>
+        <div
+          class={{
+            'schedule-toolbar-toleft': true,
+            'is-visible': this.visibleArrow,
+          }}
+          onClick={this.scrollToLeft}
+          title='向左滚动'
+        >
+          <i class='fa fa-angle-left' aria-hidden='true' />
+        </div>
+        <div class='schedule-toolbar-content' ref='scheduleToolbarContentRef'>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='保存数据'
+            onClick={this.onSave}
+          >
+            <span v-html={save}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='另存数据'
+            onClick={this.onSaveAs}
+          >
+            <span v-html={saveAs}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='刷新当前视图数据'
+            onClick={this.onRefresh}
+          >
+            <span v-html={refreesh}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='定位到今日'
+            onClick={this.onJupmToNow}
+          >
+            <span v-html={today}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn schedule-toolbar-date-picker-container'
+            title='选择定位日期'
+            onClick={this.onDateClick}
+          >
+            <el-date-picker
+              ref='datePickerRef'
+              class='schedule-toolbar-date-picker'
+              v-model={this.currentDay}
+              type='date'
+              onChange={this.onDatePickerChange}
+              onVisibleChange={this.onVisibleChange}
+            />
+            <span v-html={datepicker}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='上一个月'
+            onClick={() => this.onMonthChange(-1)}
+          >
+            <span v-html={prevmonth}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='上一周'
+            onClick={() => this.onWeekChange(-1)}
+          >
+            <span v-html={prevweek}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='上一天'
+            onClick={() => this.onDateChange(-1)}
+          >
+            <span v-html={prevday}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='下一天'
+            onClick={() => this.onDateChange(1)}
+          >
+            <span v-html={nextday}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='下一周'
+            onClick={() => this.onWeekChange(1)}
+          >
+            <span v-html={nextweek}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='下一月'
+            onClick={() => this.onMonthChange(1)}
+          >
+            <span v-html={nextmonth}></span>
+          </div>
+          <div
+            class='schedule-toolbar-item is-btn'
+            title='锁定拖动'
+            onClick={this.onLockClick}
+          >
+            <span v-html={lock}></span>
+          </div>
+          <div class='schedule-toolbar-item' title='小时列表'>
+            {this.renderHoursList()}
+          </div>
+          <div class='schedule-toolbar-item' title='显示天数'>
+            {this.renderDaysList()}
+          </div>
+          <div class='schedule-toolbar-item'>
+            {this.renderTrainsStandards()}
+          </div>
+          <div class='schedule-toolbar-item'>{this.rendertempStartTime()}</div>
+          <div class='schedule-toolbar-item'>{this.rendertempEndTime()}</div>
+          <div class='schedule-toolbar-item'>{this.renderScaleList()}</div>
+        </div>
+        <div
+          class={{
+            'schedule-toolbar-toright': true,
+            'is-visible': this.visibleArrow,
+          }}
+          onClick={this.scrollToRight}
+          title='向右滚动'
+        >
+          <i class='fa fa-angle-right' aria-hidden='true' />
+        </div>
+      </div>
+    );
+  },
+});
diff --git a/src/resource-scheduler/components/schedule-toolbar/svg-icon.ts b/src/resource-scheduler/components/schedule-toolbar/svg-icon.ts
new file mode 100644
index 0000000000000000000000000000000000000000..eb07f7ff9e7ab85d736dba4638bbecf5d9e24c07
--- /dev/null
+++ b/src/resource-scheduler/components/schedule-toolbar/svg-icon.ts
@@ -0,0 +1,206 @@
+// 保存
+export const save = `<svg
+              class='icon'
+              viewBox='0 0 1024 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='9393'
+              width='20'
+              height='20'
+            >
+              <path
+                d='M712.4 115.5c-11 0-20 9-20 20v353.7c0 11-9 20-20 20h-369c-11 0-20-9-20-20V135.5c0-11-9-20-20-20h-15c-11 0-20 9-20 20v409c0 11 9 20 20 20h479.3c11 0 20-9 20-20v-409c0-11-9-20-20-20h-15.3z'
+                fill='#2680F0'
+                p-id='9394'
+              ></path>
+              <path
+                d='M615 388.4c0 11-9 20-20 20h-14.9c-11 0-20-9-20-20V220.9c0-11 9-20 20-20H595c11 0 20 9 20 20v167.5z'
+                fill='#2680F0'
+                p-id='9395'
+              ></path>
+              <path
+                d='M118 98.2c-11 0-20 9-20 20v789.3c0 11 9 20 20 20h740.1c11 0 20-9 20-20V118.2c0-11-9-20-20-20H118z m705.1 754.4c0 11-9 20-20 20H173c-11 0-20-9-20-20V173.2c0-11 9-20 20-20h630.2c11 0 20 9 20 20v679.4z'
+                fill='#2680F0'
+                p-id='9396'
+              ></path>
+            </svg>`;
+
+// 另存为
+export const saveAs = `<svg
+              class='icon'
+              viewBox='0 0 1024 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='7384'
+              width='20'
+              height='20'
+            >
+              <path
+                d='M497.344 507.52V320.512h66.176v187.008H497.344z m125.184 27.52V262.336H238.912v272.704h383.616zM169.536 262.336c-39.424 0-71.36 32.256-71.36 71.744v518.784c0 39.424 31.936 71.744 71.36 71.744h522.368c39.488 0 71.36-32.32 71.36-71.744V333.696c0-39.488-31.872-71.744-71.36-71.744h-2.816v340.48H172.736V261.952h-3.2v0.384z m0 729.664c-75.712 0-137.536-62.592-137.536-139.136V333.696c0-76.928 61.824-139.136 137.536-139.136h522.368c75.776 0 137.536 62.592 137.536 139.136v519.168c0 76.928-61.76 139.136-137.536 139.136H169.536z m25.024-797.44v-23.424c0-76.928 61.76-139.136 137.536-139.136h522.368c75.712 0 137.536 62.592 137.536 139.136v519.168c0 76.928-61.824 139.136-137.536 139.136h-25.024v-67.392h25.024c39.424 0 71.36-32.256 71.36-71.744V171.136c0-39.424-31.936-71.744-71.36-71.744h-2.816v340.48h-22.208V333.696c0-40.32-17.088-76.736-44.352-102.208V99.776H401.472v94.784H335.296V99.392h-3.2v0.384c-39.488 0-71.36 32.32-71.36 71.808v22.976H194.56z m465.28 0v-36.544h66.176v40.896c-10.88-2.88-22.336-4.352-34.112-4.352h-32.064z'
+                p-id='7385'
+                fill='#1966e3'
+              ></path>
+            </svg>`;
+// 刷新
+export const refreesh = `<svg
+              class='icon'
+              viewBox='0 0 1029 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='11301'
+              width='20'
+              height='20'
+            >
+              <path
+                d='M1007.2 262.4c-12.8-6.4-32 0-38.4 19.2l-25.6 70.4C904.8 256 847.2 179.2 757.6 128c-108.8-64-230.4-89.6-352-57.6C232.8 108.8 104.8 236.8 60 409.6 53.6 428.8 66.4 441.6 79.2 448 98.4 448 111.2 441.6 117.6 422.4c38.4-153.6 153.6-268.8 307.2-300.8 108.8-25.6 217.6-6.4 307.2 51.2 76.8 44.8 134.4 115.2 166.4 198.4l-76.8-32c-12.8-6.4-32 0-38.4 19.2-6.4 12.8 0 32 12.8 38.4l128 51.2c6.4 6.4 12.8 6.4 19.2 6.4 0 0 6.4 0 6.4 0 0 0 0 0 0 0 0 0 0 0 6.4 0 6.4 0 12.8-6.4 12.8-12.8L1026.4 294.4C1032.8 281.6 1020 268.8 1007.2 262.4zM949.6 576c-12.8-6.4-32 6.4-32 19.2-38.4 153.6-153.6 268.8-307.2 300.8-108.8 25.6-217.6 6.4-307.2-51.2-76.8-44.8-134.4-115.2-166.4-198.4l76.8 32c12.8 6.4 32 0 38.4-19.2 6.4-12.8 0-32-12.8-38.4L104.8 576C98.4 576 92 569.6 85.6 569.6c0 0-6.4 0-6.4 0 0 0 0 0 0 0 0 0 0 0-6.4 0C66.4 576 60 582.4 60 588.8L2.4 729.6c-6.4 12.8 0 32 19.2 38.4 12.8 6.4 32 0 38.4-19.2l25.6-70.4C124 768 181.6 844.8 271.2 896c108.8 64 230.4 89.6 352 57.6 172.8-38.4 307.2-172.8 345.6-345.6C975.2 595.2 962.4 582.4 949.6 576z'
+                fill='#0f5ede'
+                p-id='11302'
+              ></path>
+            </svg>`;
+// 定位到今日
+export const today = ` <svg
+              class='icon'
+              viewBox='0 0 1024 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='2875'
+              width='20'
+              height='20'
+            >
+              <path
+                d='M300.169335 461.861208h285.108139v62.412034H300.169335zM187.256423 462.154936h67.42566v62.412034h-67.42566zM187.256423 620.484199h67.42566v62.412034h-67.42566zM187.256423 779.117318h67.42566v62.412035h-67.42566z'
+                p-id='2876'
+                fill='#0f5ede'
+              ></path>
+              <path
+                d='M695.607608 960.124372H81.200531V234.050193H179.88285v101.568952h403.227117V234.050193h112.497641v198.650962c0 19.456916 12.964525 34.244578 35.804373 33.758408s31.631416-20.257071 31.631415-31.712444V171.638159H479.879936c-16.205656-34.619334-52.779797-56.851468-93.851008-56.851469s-77.645351 22.282778-93.861136 56.851469H13.774871v850.898247h749.268525a61.935993 61.935993 0 0 0-55.706944-61.622008c-5.145296-0.526684-9.33851-0.83054-11.728844-0.790026zM247.349023 234.050193h108.618412a3.555116 3.555116 0 0 0 2.684062-5.864422 29.372752 29.372752 0 0 1-7.393831-19.416402c0-17.410952 15.597944-31.580773 34.771262-31.580773s34.761133 14.179949 34.761133 31.580773a29.372752 29.372752 0 0 1-7.393831 19.416402 3.555116 3.555116 0 0 0 2.684062 5.864422h99.604016v39.156917H247.349023z'
+                p-id='2877'
+                fill='#0f5ede'
+              ></path>
+              <path
+                d='M516.849089 62.412034c19.163189 0 34.761133 14.179949 34.761133 31.570645a29.433523 29.433523 0 0 1-7.39383 19.42653 3.544987 3.544987 0 0 0 2.684062 5.854294h279.547573l-0.435527 315.412717a71.507459 71.507459 0 0 0 36.219642 62.452548l0.678612 0.384884a20.712855 20.712855 0 0 0 30.973061-17.988278V56.851468H610.700097C594.484312 22.282778 557.9203 0 516.849089 0c-41.911879 0-79.134246 23.153832-94.823347 58.978461l-1.600308 3.656401 3.828586 1.17491c0.162057 0.050643 16.276556 4.973111 29.433524 13.531723 9.358767 6.077121 17.21851 14.686376 20.520412 18.363035 0.75964 0.83054 2.613162 1.012854 4.253985 0.810283a4.598355 4.598355 0 0 0 3.25126-1.964936 1.894036 1.894036 0 0 0 0.384884-0.90144c0.182314-17.259024 15.69923-31.236403 34.751004-31.236403zM512.787547 778.823591H300.169335v62.412034h242.183406a240.309628 240.309628 0 0 1-29.565194-62.412034zM518.530426 620.2006H300.169335v62.401906h203.289831a239.884229 239.884229 0 0 1 15.07126-62.401906z'
+                p-id='2878'
+                fill='#0f5ede'
+              ></path>
+              <path
+                d='M764.714605 632.800498a26.060721 26.060721 0 0 1 17.329923 7.089975 25.047868 25.047868 0 0 1 7.089975 17.329923v121.268953a24.379384 24.379384 0 1 1-48.74864 0V657.169754a24.045143 24.045143 0 0 1 24.369256-24.369256z m0 121.319595h72.581083a24.379384 24.379384 0 0 1 0 48.748641h-72.581083a24.308485 24.308485 0 0 1-24.369256-24.379385 24.622469 24.622469 0 0 1 24.369256-24.369256z m0-169.531423A193.900679 193.900679 0 1 1 570.844311 778.489349c0.546941-106.693991 87.206689-193.353738 193.900679-193.900679m0-48.738512c-133.777694 0-242.649319 108.375327-242.649319 242.639191 0 133.787822 108.375327 242.649319 242.649319 242.64932 133.747308 0 242.639191-108.324685 242.639191-242.64932 0-133.777694-108.871626-242.639191-242.649319-242.639191z'
+                p-id='2879'
+                fill='#0f5ede'
+              ></path>
+              <path
+                d='M764.714605 1023.994915a245.505566 245.505566 0 1 1 0-491.001004c135.367874 0 245.505566 110.168078 245.505566 245.495438A245.454924 245.454924 0 0 1 764.714605 1023.994915z m0-485.28851a239.81333 239.81333 0 1 0 239.793072 239.782944c0-132.217899-107.52453-239.782944-239.793072-239.782944z m0 436.53987a196.756926 196.756926 0 0 1 0-393.503723 196.756926 196.756926 0 1 1 0 393.503723z m0-387.801358a190.85199 190.85199 0 1 0 135.145046 55.899386A190.831733 190.831733 0 0 0 764.714605 587.455045z m72.581083 218.280063h-72.581083a27.255888 27.255888 0 0 1-27.225503-27.235631V657.169754c0-6.867147 2.684062-13.511466 7.758458-19.244217a1.833265 1.833265 0 0 1 0.243085-0.243085c5.712494-5.064268 12.356813-7.758458 19.244217-7.758458s13.511466 2.684062 19.244217 7.758458l0.121542 0.121542a27.853472 27.853472 0 0 1 7.869872 19.345503v94.094092h45.355581a27.235631 27.235631 0 0 1 0 54.461134z m-55.919643-5.712493h55.919643a21.523137 21.523137 0 0 0 0-43.036147h-45.355581v21.513009a27.17486 27.17486 0 0 1-10.564062 21.523138z m-38.174449-21.523138a21.523137 21.523137 0 1 0 43.036146 0v-21.513009h-21.523137a21.806736 21.806736 0 0 0-21.513009 21.513009z m6.208792-136.633941a23.194346 23.194346 0 0 0-6.208792 15.314346v104.870854a27.347045 27.347045 0 0 1 21.513009-10.776762h21.523137v-94.094092a22.384063 22.384063 0 0 0-6.148021-15.253574 21.999179 21.999179 0 0 0-30.679333-0.060772z'
+                p-id='2880'
+                fill='#0f5ede'
+              ></path>
+            </svg>`;
+// 选择定位
+export const datepicker = `<svg
+              class='icon schedule-toolbar-date-picker-trigger'
+              viewBox='0 0 1024 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='4913'
+              width='20'
+              height='20'
+            >
+              <path
+                d='M334.079798 811.499212h61.398372v-343.830883h-45.680389c-1.964748 10.483772-6.139837 19.325138-12.525268 26.524097-6.385431 7.206122-14.083763 13.101389-23.085788 17.682731-9.010211 4.589528-19.079544 7.858992-30.207999 9.823739-11.135618 1.964748-22.594601 2.947122-34.383088 2.947122v44.206828h84.48416v242.646366zM683.068144 749.608629c-5.080715 6.877641-11.711739 12.279674-19.893073 16.210194-8.188496 3.929496-18.173918 5.894244-29.961382 5.894244-18.343787 0-33.078373-4.988618-44.206828-14.981203-11.136641-9.985422-17.522072-24.314779-19.157315-42.978861h-55.995315c0.652869 17.36039 4.175089 32.502251 10.56052 45.433772 6.385431 12.94073 14.981203 23.822568 25.787316 32.663934 10.806113 8.842389 23.331381 15.47239 37.575804 19.893073 14.244422 4.419659 29.716812 6.630001 46.417169 6.630001 20.952194 0 38.96443-3.852748 54.030567-11.541871 15.057951-7.691169 27.421536-17.513886 37.084617-29.472242 9.654894-11.949146 16.699334-25.211195 21.12104-39.786145 4.420683-14.56574 6.630001-28.734438 6.63-42.487673 0-16.369829-2.378164-31.597649-7.122211-45.680389-4.751211-14.075577-11.710716-26.279526-20.874423-36.594453-9.171893-10.314926-20.469194-18.334577-33.891901-24.068162-13.430894-5.725398-28.65769-8.595772-45.680389-8.595772-11.466146 0-23.00904 2.210341-34.629705 6.631024-11.626805 4.420683-21.204951 10.891048-28.734438 19.401886l-0.982374-0.982374 17.682731-87.431282h136.058792v-50.101071h-177.809685l-36.839023 188.124611h55.995315c4.582365-12.110829 12.034081-20.384259 22.349008-24.803918 10.314926-4.420683 21.367657-6.631024 33.155121-6.631025 11.128455 0 20.875446 1.964748 29.225625 5.894244 8.350179 3.930519 15.142885 9.171893 20.385282 15.717983 5.233188 6.554276 9.162684 14.167674 11.788488 22.840195 2.617617 8.679683 3.929496 17.766642 3.929496 27.260877 0 10.483772-1.066285 20.307512-3.192716 29.471218-2.134617 9.17394-5.733585 17.193591-10.806113 24.069185z'
+                p-id='4914'
+                fill='#0f5ede'
+              ></path>
+              <path
+                d='M838.026378 126.409015h-59.445904V79.237669c0-6.723122-5.64251-12.254092-12.603039-12.254092h-34.219359c-7.118118 0-12.602016 5.485945-12.602016 12.254092v47.171346h-415.973969V79.237669c0-6.723122-5.64251-12.254092-12.602016-12.254092h-34.220383c-7.118118 0-12.602016 5.485945-12.602016 12.254092v47.171346H184.311773c-65.738213 0-118.828362 53.168943-118.828363 118.755707v594.434478c0 65.448618 53.200666 118.755708 118.828363 118.755707h653.715628c65.738213 0 118.828362-53.168943 118.828363-118.755707V245.164722c-0.001023-65.448618-53.202713-118.755708-118.829386-118.755707z m59.402925 713.191208c0 32.806173-26.523073 59.331293-59.402925 59.331293H184.310749c-32.757055 0-59.402925-26.65201-59.402925-59.331293V364.107695h772.521479v475.492528z m0-534.916942H124.907824v-59.518559c0-32.806173 26.523073-59.331293 59.402925-59.331293h59.445904v47.171346c0 6.723122 5.64251 12.254092 12.602016 12.254091h34.220382c7.118118 0 12.602016-5.485945 12.602016-12.254091v-47.171346h415.972947v47.171346c0 6.723122 5.64251 12.254092 12.602015 12.254091h34.21936c7.119141 0 12.603039-5.485945 12.603039-12.254091v-47.171346h59.445904c32.757055 0 59.402925 26.65201 59.402924 59.331293v59.518559z'
+                p-id='4915'
+                fill='#0f5ede'
+              ></path>
+            </svg>`;
+// 上一个月
+export const prevmonth = `<svg t="1759145420055" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="80314" width="16" height="16"><path d="M93.530291 448.05373L536.703833 4.880189c8.517839-8.524836 34.085351 0 34.085351 17.048673v340.894497L920.213515 13.405025c8.523837-8.523837 34.091349 0 34.091348 17.040677v971.564458c0 17.048673-17.049673 25.57251-34.091348 17.048674L570.789184 652.590828V993.491322c0 17.042676-17.042676 25.566512-34.085351 17.042675L93.530291 550.316781c-34.090349-25.564513-34.090349-76.697538 0-102.263051z m0 0" p-id="80315" fill="#0f5ede"></path></svg>`;
+// 上一周
+export const prevweek = `<svg t="1759145346279" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="78490" width="20" height="20"><path d="M731.325335 786.969654v-549.216655c0-27.460833-22.402258-50.585745-50.585744-50.585744-11.562456 0-23.124912 4.335921-32.519408 11.562456L312.186309 476.951306a50.585745 50.585745 0 0 0-6.503881 71.542695l7.226535 7.226535 336.033874 270.99506c21.679605 18.066337 53.476359 14.45307 71.542696-7.949188 7.226535-8.671842 10.839802-20.234298 10.839802-31.796754z" p-id="78491" fill="#0f5ede"></path></svg>`;
+// 上一天
+export const prevday = `<svg t="1759145301624" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="77300" width="16" height="16"><path d="M831.8464 176.4864l-512 298.6496a42.6496 42.6496 0 0 0 0 73.728l512 298.6496a42.6496 42.6496 0 0 0 64.1536-36.864V213.3504a42.7008 42.7008 0 0 0-64.1536-36.864zM170.6496 170.6496c21.6576 0 39.8336 16.2304 42.3936 37.6832l0.3072 5.0176v597.2992a42.6496 42.6496 0 0 1-85.0432 5.0176l-0.3072-5.0176V213.3504c0-23.552 19.0976-42.7008 42.6496-42.7008z" p-id="77301" fill="#0f5ede"></path></svg>`;
+// 下一天
+export const nextday = `<svg t="1759145475867" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="81457" width="16" height="16"><path d="M128 213.3504v597.2992a42.7008 42.7008 0 0 0 64.1536 36.864l512-298.6496a42.6496 42.6496 0 0 0 0-73.728l-512-298.6496a42.6496 42.6496 0 0 0-64.1536 36.864zM853.3504 170.6496c21.6064 0 39.8336 16.2304 42.3424 37.6832l0.3072 5.0176v597.2992a42.6496 42.6496 0 0 1-84.992 5.0176l-0.3584-5.0176V213.3504c0-23.552 19.0976-42.7008 42.7008-42.7008z" p-id="81458" fill="#0f5ede"></path></svg>`;
+// 下一周
+export const nextweek = `<svg t="1759145513234" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="82682" width="20" height="20"><path d="M293.397318 786.247001v-549.216655c0-27.460833 22.402258-50.585745 50.585745-50.585745 11.562456 0 23.124912 4.335921 32.519407 11.562456l336.033874 278.221595a50.585745 50.585745 0 0 1 6.503882 71.542696l-7.226535 7.226535L375.779817 825.992943c-21.679605 18.066337-53.476359 14.45307-71.542696-7.949189-7.226535-8.671842-10.839802-20.234298-10.839803-31.796753z" p-id="82683" fill="#0f5ede"></path></svg>`;
+// 下一个月
+export const nextmonth = `<svg t="1759145548383" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="84289" width="16" height="16"><path d="M929.270154 576.446084l-443.173541 443.173542c-8.517839 8.523837-34.085351 0-34.085352-17.048674V661.676456l-349.42533 349.419333c-8.523837 8.523837-34.091349 0-34.091349-17.041676V22.490654c0-17.048673 17.049673-25.57251 34.091349-17.048673l349.42533 366.468006V31.008493c0-17.042676 17.042676-25.566512 34.085352-17.042676l443.173541 460.217217c34.08935 25.564513 34.08935 76.698538 0 102.26305z m0 0" p-id="84290" fill="#0f5ede"></path></svg>`;
+// 锁定
+export const lock = `<svg
+              class='icon'
+              viewBox='0 0 1024 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='25244'
+              width='16'
+              height='16'
+            >
+              <path
+                d='M372.138667 405.333333V298.666667c0-78.506667 72.192-142.208 161.194666-142.208 89.002667 0 161.194667 63.658667 161.194667 142.208v106.666666h80.597333V298.666667c0-117.76-108.330667-213.333333-241.792-213.333334-133.461333 0-241.792 95.573333-241.792 213.333334v106.666666h80.64z m443.306666 35.541334H251.221333C206.805333 441.002667 170.794667 472.789333 170.666667 512v355.541333c0.128 39.253333 36.138667 70.997333 80.597333 71.125334H815.36c44.458667-0.128 80.469333-31.872 80.597333-71.125334V512c-0.128-39.253333-36.138667-70.997333-80.597333-71.125333z m-241.834666 313.941333v112.725333h-80.554667v-112.725333c-55.509333-17.322667-88.832-67.413333-78.890667-118.613333 9.984-51.2 60.288-88.618667 119.168-88.618667 58.88 0 109.226667 37.418667 119.168 88.618667 9.941333 51.2-23.381333 101.290667-78.890666 118.613333z'
+                fill='#ECA63B'
+                p-id='25245'
+              ></path>
+            </svg>`;
+// 增加天数
+export const addday = `<svg
+              class='icon'
+              viewBox='0 0 1024 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='39601'
+              width='20'
+              height='20'
+            >
+              <path
+                d='M736 64a32 32 0 0 1 32 32V128h140.8a51.2 51.2 0 0 1 51.2 51.2v665.6a51.2 51.2 0 0 1-51.2 51.2H115.2a51.2 51.2 0 0 1-51.2-51.2V179.2A51.2 51.2 0 0 1 115.2 128H256V96a32 32 0 0 1 64 0V128h384V96a32 32 0 0 1 32-32zM256 192H128v640h768V192h-128v96a32 32 0 1 1-64 0V192H320v96a32 32 0 0 1-64 0V192z'
+                fill='#0f5ede'
+                p-id='39602'
+              ></path>
+            </svg>
+            <svg
+              class='icon schedule-toolbar-arrow'
+              viewBox='0 0 1024 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='67727'
+              width='10'
+              height='10'
+            >
+              <path
+                d='M908.8 448H640v-256C640 128 601.6 89.6 550.4 89.6s-102.4 38.4-102.4 102.4v256h-256c-64 0-102.4 51.2-102.4 102.4s38.4 89.6 102.4 89.6h256v256c0 51.2 38.4 102.4 102.4 102.4s89.6-38.4 89.6-89.6V640h256c51.2 0 102.4-38.4 102.4-102.4s-38.4-89.6-89.6-89.6z'
+                fill='#0f5ede'
+                p-id='67728'
+              ></path>
+            </svg>`;
+// 减少天数
+export const reduceday = `<svg
+              class='icon'
+              viewBox='0 0 1024 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='39601'
+              width='20'
+              height='20'
+            >
+              <path
+                d='M736 64a32 32 0 0 1 32 32V128h140.8a51.2 51.2 0 0 1 51.2 51.2v665.6a51.2 51.2 0 0 1-51.2 51.2H115.2a51.2 51.2 0 0 1-51.2-51.2V179.2A51.2 51.2 0 0 1 115.2 128H256V96a32 32 0 0 1 64 0V128h384V96a32 32 0 0 1 32-32zM256 192H128v640h768V192h-128v96a32 32 0 1 1-64 0V192H320v96a32 32 0 0 1-64 0V192z'
+                fill='#0f5ede'
+                p-id='39602'
+              ></path>
+            </svg>
+            <svg
+              class='icon schedule-toolbar-arrow'
+              viewBox='0 0 2730 1024'
+              version='1.1'
+              xmlns='http://www.w3.org/2000/svg'
+              p-id='71994'
+              width='10'
+              height='10'
+            >
+              <path
+                d='M2423.466667 238.933333H512c-170.666667 0-273.066667 102.4-273.066667 273.066667 0 136.533333 102.4 273.066667 273.066667 273.066667h1911.466667c136.533333 0 273.066667-102.4 273.066666-273.066667S2560 238.933333 2423.466667 238.933333z'
+                fill='#0f5ede'
+                p-id='71995'
+              ></path>
+            </svg>`;
diff --git a/src/resource-scheduler/hooks/use-schedule-table.ts b/src/resource-scheduler/hooks/use-schedule-table.ts
index c0b750d5215c9e9146fde67a96ff99ca5a7cf827..60c1fcecfa6b882e62c4dd80af152854600fafd4 100644
--- a/src/resource-scheduler/hooks/use-schedule-table.ts
+++ b/src/resource-scheduler/hooks/use-schedule-table.ts
@@ -1,3 +1,4 @@
+/* eslint-disable no-use-before-define */
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable @typescript-eslint/explicit-module-boundary-types */
 import {
@@ -17,7 +18,10 @@ import {
 } from '../interface';
 
 // 组件样式
-export function useScheduleTableStyle(props: any): {
+export function useScheduleTableStyle(
+  props: any,
+  hasExtraToolbar: boolean = false,
+): {
   headerStyle: WritableComputedRef<Record<string, string>>;
   bodyStyle: WritableComputedRef<Record<string, string>>;
 } {
@@ -33,7 +37,7 @@ export function useScheduleTableStyle(props: any): {
   const bodyStyle = computed(() => {
     return {
       width: '100%',
-      height: `calc(100% - ${props.headerRowHeight * 2}px)`,
+      height: `calc(100% - ${props.headerRowHeight * 2}px - 40px - ${hasExtraToolbar ? '40px' : '0px'})`,
     };
   });
 
@@ -80,7 +84,10 @@ export function useInitScheduleTable(
     $renderLayer.destory();
   });
 
-  return { resourceViewModels, taskViewModels };
+  return {
+    resourceViewModels,
+    taskViewModels,
+  };
 }
 
 // 通用能力
@@ -248,3 +255,46 @@ export function useVirtualScroll(
     handleScroll,
   };
 }
+
+// 工具栏事件
+export function useScheduleToolbarEvent(
+  coordinateElement: Ref<HTMLDivElement | null>,
+): {
+  onRefresh: (params: any) => void;
+  onSave: (params: any) => void;
+  onSaveAs: (params: any) => void;
+  onConfigRefresh: (params: any) => void;
+} {
+  const { $config } = useStore();
+  const { refresh } = useCommonAbility(coordinateElement);
+  // 刷新
+  const onRefresh = (): void => {
+    refresh();
+  };
+
+  // 保存-todo
+  const onSave = (): void => {
+    alert('点击触发保存');
+  };
+
+  // 另存为-todo
+  const onSaveAs = (): void => {
+    alert('点击触发另存数据');
+  };
+
+  // 配置刷新
+  const onConfigRefresh = (_config: any): void => {
+    const config = {
+      ...$config.getConfig(),
+      ..._config,
+    };
+    refresh(config);
+  };
+
+  return {
+    onRefresh,
+    onSave,
+    onSaveAs,
+    onConfigRefresh,
+  };
+}
diff --git a/src/resource-scheduler/hooks/use-schedule-toolbar.ts b/src/resource-scheduler/hooks/use-schedule-toolbar.ts
new file mode 100644
index 0000000000000000000000000000000000000000..6dca69fd7db209266a2d8828c47a9ef3547b0f05
--- /dev/null
+++ b/src/resource-scheduler/hooks/use-schedule-toolbar.ts
@@ -0,0 +1,236 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+
+import { onMounted, onUnmounted, Ref, ref } from 'vue';
+import Variables from '../constant/vars';
+import { debounce } from '../utils';
+
+/* eslint-disable @typescript-eslint/explicit-function-return-type */
+export function useInitScheduleToolbar(emit: any) {
+  // 默认小时间隔
+  const hours = ref(Variables.default.dragInterval);
+  // 默认显示天数
+  const days: Ref<number | null> = ref(15);
+  // 加减后的临时天数
+  const tempDay = ref(15);
+  // 当前激活日期
+  const currentDay = ref(Variables.default.startTime);
+  // 刻度
+  const scale = ref(Variables.default.scaleValue);
+  // 开始时间
+  const scaleStartTime = ref(Variables.default.scaleRange[0]);
+  // 结束时间
+  const scaleEndTime = ref(Variables.default.scaleRange[1]);
+  // 训练日标准
+  const trainsStandards = ref(Variables.default.scaleRange.toString());
+
+  const onRefresh = () => {
+    // console.log('refresh');
+    emit('refresh');
+  };
+
+  // 配置改变刷新
+  const onConfigChangeRefresh = (_config: any = {}) => {
+    emit('config-change', _config);
+  };
+
+  // 跳转到当前时间
+  const onJupmToNow = () => {
+    console.log('jupmToNow');
+    currentDay.value = new Date();
+    onConfigChangeRefresh({
+      startTime: currentDay.value,
+      endTime: new Date(currentDay.value.getTime() + 86400000 * 15),
+    });
+  };
+
+  // 月份改变 统一按照31天间隔进行计算
+  const onMonthChange = (month: number) => {
+    // console.log('onMonthChange');
+    const time = Variables.time.millisecondOf.day * 31 * month;
+    currentDay.value = new Date(currentDay.value.getTime() + time);
+    onConfigChangeRefresh({
+      startTime: currentDay.value,
+      endTime: new Date(currentDay.value.getTime() + 86400000 * 15),
+    });
+  };
+
+  // 周改变
+  const onWeekChange = (week: number) => {
+    // console.log('onWeekChange');
+    const time = Variables.time.millisecondOf.week * week;
+    currentDay.value = new Date(currentDay.value.getTime() + time);
+    onConfigChangeRefresh({
+      startTime: currentDay.value,
+      endTime: new Date(currentDay.value.getTime() + 86400000 * 15),
+    });
+  };
+
+  // 天改变
+  const onDateChange = (day: number) => {
+    // console.log('onDateChange');
+    const time = Variables.time.millisecondOf.day * day;
+    currentDay.value = new Date(currentDay.value.getTime() + time);
+    onConfigChangeRefresh({
+      startTime: currentDay.value,
+      endTime: new Date(currentDay.value.getTime() + 86400000 * 15),
+    });
+  };
+
+  // 锁定按钮点击
+  const onLockClick = () => {
+    // console.log('onLockClick');
+  };
+
+  // 小时改变
+  const onHoursChange = (_value: number) => {
+    // console.log('onHoursChange');
+    onConfigChangeRefresh({
+      dragInterval: hours.value,
+    });
+  };
+
+  // 天数改变
+  const onDaysChange = (_value: number) => {
+    // console.log('onDaysChange');
+    tempDay.value = days.value!;
+    onConfigChangeRefresh({
+      endTime: new Date(currentDay.value.getTime() + 86400000 * days.value!),
+    });
+  };
+
+  // 点击增加或减少天数,最少显示天数是1天
+  const onDaysClickChange = (_value: number) => {
+    // console.log('onDaysClickChange');
+    const tempDays = [1, 7, 15, 31, 62, 93];
+    tempDay.value = Math.max(1, tempDay.value! + _value);
+    days.value = null;
+    if (tempDays.includes(tempDay.value)) {
+      days.value = tempDay.value;
+    }
+    onConfigChangeRefresh({
+      endTime: new Date(currentDay.value.getTime() + 86400000 * tempDay.value),
+    });
+  };
+
+  // 训练日标准改变
+  const onScaleRangeChange = (_value: string) => {
+    const [start, end] = _value.split(',');
+    scaleStartTime.value = Number(start);
+    scaleEndTime.value = Number(end);
+    onConfigChangeRefresh({
+      scaleRange: [start, end],
+    });
+  };
+
+  // 刻度改变
+  const onScaleChange = () => {
+    // console.log('onScaleChange');
+    onConfigChangeRefresh({
+      scaleValue: scale.value,
+    });
+  };
+
+  // 刻度时间改变
+  const onScaleTimeChange = (_value: number) => {
+    // console.log('onScaleTimeChange');
+    if (scaleStartTime.value >= scaleEndTime.value) {
+      alert('结束时间需要大于开始时间');
+    } else {
+      onConfigChangeRefresh({
+        scaleRange: [scaleStartTime.value, scaleEndTime.value],
+      });
+    }
+  };
+
+  // 日期选择器改变
+  const onDatePickerChange = (_value: string) => {
+    onConfigChangeRefresh({
+      startTime: currentDay.value,
+      endTime: new Date(
+        currentDay.value.getTime() + Variables.time.millisecondOf.day * 15,
+      ),
+    });
+  };
+
+  const onSave = () => {
+    emit('save');
+  };
+
+  const onSaveAs = () => {
+    emit('save-as');
+  };
+
+  return {
+    hours,
+    days,
+    currentDay,
+    scale,
+    scaleStartTime,
+    scaleEndTime,
+    trainsStandards,
+    onJupmToNow,
+    onMonthChange,
+    onWeekChange,
+    onDateChange,
+    onLockClick,
+    onHoursChange,
+    onDaysChange,
+    onDaysClickChange,
+    onScaleChange,
+    onScaleTimeChange,
+    onScaleRangeChange,
+    onDatePickerChange,
+    onSave,
+    onSaveAs,
+    onRefresh,
+  };
+}
+
+export function useScheduleToolbarReSize(
+  scheduleToolbarContentRef: Ref<HTMLCanvasElement | null>,
+): { visibleArrow: Ref<boolean> } {
+  // 显示箭头
+  const visibleArrow = ref(false);
+  // 重绘函数
+  const redraw = (): void => {
+    if (scheduleToolbarContentRef.value) {
+      visibleArrow.value =
+        scheduleToolbarContentRef.value.scrollWidth >
+        scheduleToolbarContentRef.value.clientWidth;
+    } else {
+      visibleArrow.value = false;
+    }
+  };
+
+  // 防抖重绘函数
+  const debouncedRedraw = debounce(redraw, 100);
+
+  // 窗口resize防抖
+  const handleResize = (): void => {
+    debouncedRedraw();
+  };
+
+  // 监听 coordinateElement 的尺寸变化
+  let resizeObserver: ResizeObserver | null = null;
+
+  // 挂载后绑定事件监听
+  onMounted(() => {
+    if (window.ResizeObserver && scheduleToolbarContentRef.value) {
+      resizeObserver = new ResizeObserver(handleResize);
+      resizeObserver.observe(scheduleToolbarContentRef.value);
+    }
+  });
+
+  // 移除事件监听器
+  onUnmounted(() => {
+    if (resizeObserver && scheduleToolbarContentRef.value) {
+      resizeObserver.unobserve(scheduleToolbarContentRef.value);
+      resizeObserver = null;
+    }
+  });
+
+  return {
+    visibleArrow,
+  };
+}