1.0.0 • Published 1 year ago

vue-time-table-and-timesheet v1.0.0

Weekly downloads
-
License
-
Repository
-
Last release
1 year ago

Usage

import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
import TimeTable from "../src/index";

Vue.use(ElementUI);
Vue.use(TimeTable);
<TimeTable
      :originData="people"
      :headerData="headerData"
      :mainKey="'name'"
      :statusColor="statusColor"
      :showTimeLine="showTimeLine"
      @showView="showView"
      @changeStatus="changeStatus"
    >
      <div slot="popover" slot-scope="{ row }">
        <div class="title">
          {{ row.name }}
        </div>
      </div>
      <div slot="timeDetail" slot-scope="{ row }">
        <div class="time-content">
          <div class="title">
            {{ row.name }}
          </div>
        </div>
      </div>
    </TimeTable>

attribute

属性名类型默认值描述
originDataArray[]表格原数据
headerDataArray[]表头的数据
showTimeLineBooleanfalse是否显示当前的时间线
mainKeyStringname用于表头数据与表格数剧的对比 找出相应时间块的位置等等
blockWidthNumber130一个表格的宽度
blockHeightNumber45一个表格的高度
timeRangerArray"8:00", "22:00"时间跨度
minuteHeightNumber1每一分钟的高度px
statusColorArray[]状态 用于表格底部的高度显示
popoverslot默认空弹窗的显示内容 slot-scope返回内容
timeDetailslot默认空时间块的显示内容 slot-scope返回内容
showViewevent点击时间块的事件 返回行内容
changeStatusevent点击时间块的事件 返回点击的状态类型 以及勾选状态
1.0.0

1 year ago

0.1.3

1 year ago

0.1.2

1 year ago

0.1.1

1 year ago

0.1.0

1 year ago