<div id="message-view" class="layui-card-body layui-tab layui-tab-brief" style="padding: 5px 0;margin: 0;">
|
<ul class="layui-tab-title" style="text-align: center;">
|
<li class="layui-this">通知({{notices.length}})</li>
|
<li>私信({{messages.length}})</li>
|
<li>待办({{schedules.length}})</li>
|
</ul>
|
<div class="layui-tab-content" style="padding: 5px 0;">
|
<div class="layui-tab-item message-list layui-show" p-each="notices">
|
<a class="message-list-item" href="javascript:;">
|
<img class="message-item-icon" p-bind="src:{{icon}}">
|
<div class="message-item-right">
|
<h2 class="message-item-title">{{title}}</h2>
|
<p class="message-item-text">{{time}}</p>
|
</div>
|
</a>
|
</div>
|
<div class="layui-tab-item" p-each="messages">
|
<a class="message-list-item" href="javascript:;">
|
<img class="message-item-icon" p-bind="src:{{icon}}">
|
<div class="message-item-right">
|
<h2 class="message-item-title">{{title}}</h2>
|
<p class="message-item-text">{{content}}</p>
|
<p class="message-item-text">{{time}}</p>
|
</div>
|
</a>
|
</div>
|
<div class="layui-tab-item" p-each="schedules">
|
<a class="message-list-item" href="javascript:;">
|
<div class="message-item-right">
|
<span class="layui-badge pull-right" p-if="{{state}}==1">待完成</span>
|
<span class="layui-badge layui-bg-gray pull-right" p-if="{{state}}==2">已完成</span>
|
<h2 class="message-item-title">{{title}}</h2>
|
<p class="message-item-text">{{time}}</p>
|
</div>
|
</a>
|
</div>
|
</div>
|
</div>
|
|
<script>
|
var dataList = {
|
notices: [{
|
icon: 'assets/images/message.png',
|
title: '你收到了14份新周报',
|
time: '10个月前'
|
}, {
|
icon: 'assets/images/message.png',
|
title: '你收到了14份新周报',
|
time: '10个月前'
|
}],
|
messages: [{
|
icon: 'assets/images/head.png',
|
title: 'xx评论了你',
|
content: '哈哈哈哈哈哈',
|
time: '10个月前'
|
}, {
|
icon: 'assets/images/head.png',
|
title: 'xx评论了你',
|
content: '哈哈哈哈哈哈',
|
time: '10个月前'
|
}],
|
schedules: [{
|
title: '你收到了14份新周报',
|
time: '10个月前',
|
state: 1
|
}, {
|
title: '你收到了14份新周报',
|
time: '10个月前',
|
state: 2
|
}]
|
};
|
|
layui.use('element', function () {
|
var element = layui.element;
|
|
$('#message-view').vm(dataList);
|
});
|
</script>
|
