You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
103 lines
2.2 KiB
103 lines
2.2 KiB
4 years ago
|
<template>
|
||
|
|
<div class="list-box">
|
||
|
|
<div class="task-box">
|
||
|
|
<div class="task-time flex items-center justify-between">
|
||
|
|
<div class="flex items-center">
|
||
|
|
<div class="circular"></div>
|
||
|
|
<span>2020年08月16日 13:30</span>
|
||
|
|
</div>
|
||
|
|
<div class="task-action"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="task-info">
|
||
|
|
<div>
|
||
|
|
<div class="task-card">
|
||
|
|
<div class="task-name cursor-pointer flex justify-between items-center">
|
||
|
|
<span class="leading-none color-3">第一次科研需求分析会议</span>
|
||
|
|
<RightOutlined style="color: #666" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="task-box">
|
||
|
|
<div class="task-time flex items-center justify-between">
|
||
|
|
<div class="flex items-center">
|
||
|
|
<div class="circular"></div>
|
||
|
|
<span>2020年08月16日 13:30</span>
|
||
|
|
</div>
|
||
|
|
<div class="task-action"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="task-info">
|
||
|
|
<div>
|
||
|
|
<div class="task-card">
|
||
|
|
<div class="task-name cursor-pointer flex justify-between items-center">
|
||
|
|
<span class="leading-none color-3">第一次科研需求分析会议</span>
|
||
|
|
<RightOutlined style="color: #666" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import { RightOutlined } from '@ant-design/icons-vue';
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
.list-box {
|
||
|
|
padding: 10px 16px 50px;
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-box {
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-time {
|
||
|
|
height: 32px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-time .circular {
|
||
|
|
margin-right: 8px;
|
||
|
|
width: 14px;
|
||
|
|
height: 14px;
|
||
|
|
border-radius: 50%;
|
||
|
|
background-color: #1890ff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-time span {
|
||
|
|
font-size: 14px;
|
||
|
|
color: #595959;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-info {
|
||
|
|
margin: 8px 0;
|
||
|
|
padding-left: 8px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-info > div {
|
||
|
|
padding-left: 15px;
|
||
|
|
border-left: 1px solid #d2d2d2;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-info .task-card {
|
||
|
|
padding: 16px;
|
||
|
|
border-radius: 8px;
|
||
|
|
-moz-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.12);
|
||
|
|
-webkit-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.12);
|
||
|
|
box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.12);
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-con {
|
||
|
|
margin-top: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-con > div {
|
||
|
|
height: 30px;
|
||
|
|
}
|
||
|
|
</style>
|