meeting

app.json

 {
   "pages": [
+    "pages/meetingDetail/meetingDetail",
     "pages/index/index",
     "pages/createMeeting/createMeeting",
     "pages/outLookContact/outLookContact",

pages/meetingDetail/meetingDetail.acss

+page {
+    background: #fff;
+}
+
+.list {
+    padding: 48rpx 32rpx;
+}
+
+.list>view {
+    margin-bottom: 48rpx;
+}
+
+.simple-column {
+    color: rgba(25, 31, 37, 0.4);
+    font-size: 26rpx;
+    line-height: 68rpx;
+    text-align: center;
+}
+
+.compose-column {
+    position: relative;
+    padding-left: 104rpx;
+}
+.compose-column .desc{
+    color: rgba(25, 31, 37, 1);
+    font-size: 32rpx;
+    line-height: 48rpx;
+    margin-top: 10rpx;
+}
+
+.compose-column>.avater {
+    width: 80rpx;
+    height: 80rpx;
+    border-radius: 50%;
+    background-color: rgba(21, 188, 131, 1);
+    background-position: center;
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+    position: absolute;
+    left: 0;
+    top: 0;
+}
+
+.compose-column .title {
+    color: rgba(27, 38, 61, 1);
+    font-size: 32rpx;
+}
+
+.compose-column .title>text {
+    color: rgba(25, 31, 37, 0.4);
+    font-size: 28rpx;
+    margin-left: 32rpx;
+}
+
+.task-list {
+    border: 1rpx solid rgba(245, 246, 247, 1);
+    border-radius: 16rpx;
+    border-radius: 16rpx;
+    padding: 14rpx 16rpx 0;
+    margin-top: 16rpx;
+}
+
+.task-list>.task-box {
+    background: rgba(255, 255, 255, 1);
+    border-radius: 8rpx;
+    box-shadow: 0 0 8rpx 0rpx rgba(0, 0, 0, 0.04);
+    padding: 16rpx 26rpx;
+    color: rgba(27, 38, 61, 1);
+    font-size: 28rpx;
+    line-height: 28rpx;
+    margin-bottom: 14rpx;
+    position: relative;
+    display: flex;
+    align-items: center;
+}
+
+.task-box>.avater {
+    width: 48rpx;
+    height: 48rpx;
+    border-radius: 50%;
+    background-color: rgba(21, 188, 131, 1);
+    background-position: center;
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+    position: absolute;
+    right: 14rpx;
+    top: 16rpx;
+}
+
+.task-box>.checkbox {
+    border: 3rpx solid rgba(77, 217, 100, 1);
+    border-radius: 4rpx;
+    width: 28rpx;
+    height: 28rpx;
+    margin-right: 18rpx;
+}
+
+.task-list>.file-box {
+    position: relative;
+    padding: 10rpx 10px 10rpx 76rpx;
+    margin-bottom: 14rpx;
+}
+
+.file-box>.file-icon {
+    position: absolute;
+    width: 64rpx;
+    height: 64rpx;
+    background: rgba(246, 105, 100, 1);
+    left: 6rpx;
+    top: 10rpx;
+}
+
+.file-box>.file-title {
+    font-size: 28rpx;
+    color: rgba(25, 31, 37, 1);
+    display: flex;
+}
+.file-box>.file-title >text:first-child{
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+}
+.file-box>.file-title >text:last-child{
+    white-space: nowrap;
+}
+.file-box>.file-size {
+    color: rgba(25, 31, 37, 0.56);
+    font-size: 24rpx;
+    line-height: 40rpx;
+}
+.footer{
+    background: #fff;
+    border-top:2rpx solid rgba(25, 31, 37, 0.12);
+    height:94rpx;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    width: 100%;
+}
+.footer >view{
+    width: 35rpx;
+    height:35rpx;
+    background: red;
+    margin:0 38rpx;
+}
+.footer >view:last-child{
+    margin:0 24rpx 0 0;
+}
+.devider{
+    background:rgba(227, 228, 228, 1);
+    height:48rpx;
+    width:1rpx;
+    margin: 0 28rpx;
+}
\ No newline at end of file

pages/meetingDetail/meetingDetail.axml

+<view class="list">
+  <view class='simple-column'>大鹏创建了任务</view>
+  <view class='compose-column'>
+    <view class="avater"></view>
+    <view class="title">
+         会议任务
+      <text>15分钟之前</text>
+    </view>
+    <view class="task-list">
+      <view class="task-box">
+        <view class="checkbox"></view>
+         树立产品流程图
+        <view class="avater"></view>
+      </view>
+      <view class="task-box">
+        <view class="checkbox"></view>
+        树立产品流程图
+        <view class="avater"></view>
+      </view>
+    </view>
+  </view>
+  <view class='compose-column'>
+    <view class="avater"></view>
+    <view class="title">
+         小雨
+      <text>15分钟之前</text>
+    </view>
+    <view class="desc">
+      产品MVP核心流程中用后中用后
+    </view>
+    <view class="task-list">
+      <view class="file-box">
+        <view class="file-icon"></view>
+        <view class="file-title">
+          <text>产品MVP核心流程中用后中用后</text>
+          <text>汇总.pdf</text></view>
+        <view class="file-size">103kb</view>
+      </view>
+      <view class="file-box">
+        <view class="file-icon"></view>
+        <view class="file-title">
+          <text>产品MVP核心流程中用后中用后</text>
+          <text>汇总.pdf</text></view>
+        <view class="file-size">103kb</view>
+      </view>
+    </view>
+  </view>
+  <view class='simple-column'>大鹏创建了任务</view>
+</view>
+<view class="footer">
+  <view></view>
+  <view></view>
+  <text class="devider"></text>
+  <view></view>
+</view>
+
+<button size="default" type="primary" onTap="showPop">Button</button>
+
+<popup 
+  show="{{show}}"
+  onClose="closePop"
+  title="会议任务"
+>
+<!-- <view>
+ <view class="checkbox"></view>树立产品流程图
+</view> -->
+<meeting-time-picker
+    onClose="closePop"
+    onComplete="Complete"
+    visibleItemCount="3"
+    startTime="{{startTime}}"
+    endTime="{{endTime}}"
+ ></meeting-time-picker>
+</popup>
\ No newline at end of file

pages/meetingDetail/meetingDetail.js

+Page({
+  data: {
+    show:false
+  },
+  onLoad() {},
+  showPop(){
+    this.setData({
+      show: true
+    })
+  },
+  closePop(){
+    this.setData({
+      show: false
+    })
+  },
+  Complete(data){
+    console.log(data)
+    this.closePop();
+  }
+});

pages/meetingDetail/meetingDetail.json

+{
+    "title": "会议详情",
+    "usingComponents": {
+        "popup": "../../components/popup/index",
+        "meeting-time-picker": "../../components/meetingTimePicker/meetingTimePicker"
+    }
+}
\ No newline at end of file