|
<!DOCTYPE html>
<html lang="en">
<head>
<title>日程-日</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<link rel="stylesheet" type="text/css" href="ipu/ui/css/ipuUI.css">
<link rel="stylesheet" type="text/css" href="biz/lib/remixicon/remixicon.css">
<link rel="stylesheet" type="text/css" href="biz/css/base.css">
<script src="ipu/lib/requirejs/require.js"></script>
<script src="biz/js/require-config.js"></script>
<script src="biz/js/page/schedule.js"></script>
</head>
<body class="pages-schedule">
<div class="ipu-flex-row ipu-flex-vertical">
<div class="ipu-flex-col ipu-fn-bd-b">
<header class="ipu-toolbar">
<h1 class="ipu-toolbar-title">日程</h1>
<a class="ipu-fn-left head-icon-config" href="javascript:;">
<i class="ipu-icon ri-settings-4-line"></i>
</a>
<div class="ipu-fn-right">
<div class="switch-time ipu-flex-middle-center">
<div class="switch-option-wrap ipu-flex">
<div class="switch-option switch-option-day on">日</div>
<div class="switch-option switch-option-month">月</div>
</div>
</div>
</div>
</header>
</div>
<div class="ipu-flex-col ipu-flex-col-auto ">
<!-- 日程的日展现形式 -->
<div class="ipu-flex-content common-bg-white calendar-item calendar-item-day on">
<div class="ipu-flex-row ipu-flex-vertical">
<div class="ipu-flex-col">
<div class="common-bg-white">
<div class="calendar-day-table">
<div class="calendar-day-table-head">
<div class="common-flex-tiled table-tr">
<div class="table-th">日</div>
<div class="table-th">一</div>
<div class="table-th">二</div>
<div class="table-th">三</div>
<div class="table-th">四</div>
<div class="table-th">五</div>
<div class="table-th">六</div>
</div>
</div>
<div class="calendar-day-table-body">
</div>
</div>
<div class="calendar-day-more">
<i class="icon-flag ri-arrow-down-s-line"></i>
<i class="icon-flag ri-arrow-up-s-line"></i>
</div>
</div>
<div class="date-choose"></div>
</div>
<div class="ipu-flex-col ipu-flex-col-auto">
<div class="ipu-list ipu-list-media common-list day-schedule-list">
<ul>
<li class="">
<a class="ipu-list-item ">
<div class="ipu-list-item-media ipu-flex-align-start">
<div class="schedule-item-flag"></div>
</div>
<div class="ipu-list-item-inner">
<div class="ipu-list-item-title-row">
<div class="ipu-list-item-title">
<div class="schedule-item-title">X部落例会，讨论原型设计相关问题</div>
</div>
</div>
<div class="ipu-list-item-subtitle">
<div class="schedule-item-date">全天</div>
</div>
</div>
</a>
</li>
<li class="">
<a class="ipu-list-item ">
<div class="ipu-list-item-media ipu-flex-align-start">
<div class="schedule-item-flag"></div>
</div>
<div class="ipu-list-item-inner">
<div class="ipu-list-item-title-row">
<div class="ipu-list-item-title">
<div class="schedule-item-title">X部落例会，讨论原型设计相关问题</div>
</div>
</div>
<div class="ipu-list-item-subtitle">
<div class="schedule-item-date">全天</div>
</div>
</div>
</a>
</li>
<li class="">
<a class="ipu-list-item">
<div class="ipu-list-item-media ipu-flex-align-start">
<div class="schedule-item-flag"></div>
</div>
<div class="ipu-list-item-inner">
<div class="ipu-list-item-title-row">
<div class="ipu-list-item-title">
<div class="schedule-item-title">X部落例会，讨论原型设计相关问题</div>
</div>
</div>
<div class="ipu-list-item-subtitle">
<div class="schedule-item-date">全天</div>
</div>
</div>
</a>
</li>
<li class="">
<a class="ipu-list-item">
<div class="ipu-list-item-media ipu-flex-align-start">
<div class="schedule-item-flag"></div>
</div>
<div class="ipu-list-item-inner">
<div class="ipu-list-item-title-row">
<div class="ipu-list-item-title">
<div class="schedule-item-title">X部落例会，讨论原型设计相关问题</div>
</div>
</div>
<div class="ipu-list-item-subtitle">
<div class="schedule-item-date">全天</div>
</div>
</div>
</a>
</li>
<li class="">
<a class="ipu-list-item">
<div class="ipu-list-item-media ipu-flex-align-start">
<div class="schedule-item-flag"></div>
</div>
<div class="ipu-list-item-inner">
<div class="ipu-list-item-title-row">
<div class="ipu-list-item-title">
<div class="schedule-item-title">X部落例会，讨论原型设计相关问题</div>
</div>
</div>
<div class="ipu-list-item-subtitle">
<div class="schedule-item-date">全天</div>
</div>
</div>
</a>
</li>
<li class="">
<a class="ipu-list-item">
<div class="ipu-list-item-media ipu-flex-align-start">
<div class="schedule-item-flag"></div>
</div>
<div class="ipu-list-item-inner">
<div class="ipu-list-item-title-row">
<div class="ipu-list-item-title">
<div class="schedule-item-title">X部落例会，讨论原型设计相关问题</div>
</div>
</div>
<div class="ipu-list-item-subtitle">
<div class="schedule-item-date">全天</div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
<div class="schedule-add"></div>
</div>
</div>
<!-- 日程的月展现形式 -->
<div class="ipu-flex-content common-bg-white calendar-item calendar-item-month ">
<div class="calendar-month-title">
2020年4月
</div>
<div class="calendar-month-table">
<div class="calendar-month-table-head">
<div class="common-flex-tiled table-tr">
<div class="table-th weekday">
日
</div>
<div class="table-th">
一
</div>
<div class="table-th">
二
</div>
<div class="table-th">
三
</div>
<div class="table-th">
四
</div>
<div class="table-th">
五
</div>
<div class="table-th weekday">
六
</div>
</div>
</div>
<div class="calendar-month-table-body">
</div>
</div>
<!-- 月列表全 -->
<div class="month-day-schedule-list-all">
<div class="arrow-flag arrow-flag-up"></div>
<div class="arrow-flag arrow-flag-down"></div>
<div class="ipu-list common-list common-list-last-clear">
<ul></ul>
</div>
</div>
</div>
</div>
</div>
<script type="text/html" id="schedule-day-tpl">
{{ each data list dataindex }}
<div class="common-flex-tiled table-tr">
{{ each list item}}
<div class="table-td {{item.className}}">
<div class="day ">
<div class="num">{{item.num}}</div>
<div class="old-num">{{item.oldNum}}</div>
</div>
</div>
{{ /each}}
</div>
{{/each}}
</script>
<!-- 月界面，日历列表 -->
<script type="text/html" id="schedule-month-tpl">
{{ each data item }}
<div class="table-td">
<div class="ipu-flex ipu-flex-vertical month-day {{item.className}} month-day-{{item.dateStr}}">
<div class="ipu-flex-grow-0 ipu-flex-center-middle month-day-num">
<span class="num">{{item.num}}</span>
<span class="old-num">{{item.oldNum}}</span>
</div>
</div>
</div>
{{/each}}
</script>
<!-- 月界面，日期后台数据模板 -->
<script type="text/html" id="schedule-month-tpl-child">
{{set event = item.event}}
{{if event && event.length != 0 }}
<div class="month-day-over">
<div class="ipu-flex-middle-center">
<i class="icon ri-close-line"></i>
</div>
</div>
<div class="ipu-flex-grow-1 month-day-schedule-list">
{{each event ev index}}
{{if index < 4 || index == 4 && event.length == 5 }}
<div class="month-day-schedule-item ipu-fn-row">{{ev.title}}</div>
{{else if index == 4 && event.length > 5 }}
<div class="month-day-schedule-item month-day-schedule-item-more ipu-fn-row">还有{{event.length-4}}项...</div>
{{else}}
<!-- 不显示 -->
{{/if}}
{{/each}}
{{/if}}
</div>
{{if item.workday}}
<div class="flag-workday">班</div>
{{/if}}
{{if item.holiday}}
<div class="flag-holiday">休</div>
{{/if}}
</script>
<!-- 月界面，日程列表全 -->
<script type="text/html" id="schedule-month-list-tpl">
{{ each list item}}
<li class="ipu-list-item ipu-flex-align-start">
<div class="item-flag">
</div>
<div class="ipu-list-item-inner">
<div class="ipu-flex ipu-flex-vertical">
<div class="item-title">{{item.title}}</div>
<div class="item-time">{{item.time}}</div>
</div>
</div>
</li>
{{/each}}
</script>
</body>
</html>
|
