diff --git a/src/views/modules/communityParty/calendar/index.vue b/src/views/modules/communityParty/calendar/index.vue
index 15d3deb77..eb45bbd05 100644
--- a/src/views/modules/communityParty/calendar/index.vue
+++ b/src/views/modules/communityParty/calendar/index.vue
@@ -1,54 +1,118 @@
 <template>
   <div class="g-cnt">
-    <div class="m-cal">
-      <div class="sizer">
-        <div class="sizer-year">
-          <el-date-picker
-            v-model="currentYearStr"
-            value-format="yyyy"
-            type="year"
-            placeholder="选择年"
-            size="small"
-            style="width: 150px"
-          >
-          </el-date-picker>
-        </div>
-        <div class="sizer-month">
-          <div
-            class="month-item"
-            :class="{ 'z-on': m - 1 == currentMonth }"
-            :key="'month' + m"
-            @click="currentMonth = m - 1"
-            v-for="m in 12"
-          >
-            <el-badge :value="12" :hidden="m != 3" class="item">
-              <div class="month-text">{{ m }}月</div>
-            </el-badge>
+    <el-row :gutter="15">
+      <el-col :span="6">
+        <div class="m-sizer">
+          <div class="item">
+            <el-cascader
+              v-model="fmData.party"
+              :options="partyOptions"
+              @change="handleChangeParty"
+            ></el-cascader>
+          </div>
+          <div class="item">
+            <el-radio v-model="radio" label="1">备选项</el-radio>
+            <el-radio v-model="radio" label="2">备选项</el-radio>
           </div>
         </div>
-        <div class="sizer-btn">
-          <el-button type="primary" size="small">批量生成年度报表</el-button>
+
+        <div class="m-date">
+          <div class="date-top">2222年2月22日</div>
+          <div class="date-big">22</div>
+          <div class="date-week">星期五</div>
         </div>
-      </div>
-      <calendar
-        :currentYear="currentYear"
-        :currentMonth="currentMonth"
-        @clickDate="handleChangeDate"
-      >
-        <template v-slot:date-item="{ info }">
-          <div class="tip">
-            <div class="tip-text">
-              <span class="z-on">主题当日</span> (已发布)
+
+        <div class="m-list">
+          <div class="list-title">今日活动</div>
+          <div class="list">
+            <div class="item">
+              <div class="item-title">
+                不忘初心牢记使命巴巴爸爸不不嘻嘻，分 额阿发文发文额
+              </div>
+              <div class="item-prop">
+                <span>活动类型：</span>
+                <span>发发发发发发付付</span>
+              </div>
+              <div class="item-prop">
+                <span>活动类型：</span>
+                <span>发发发发发发付付</span>
+              </div>
+              <div class="item-prop">
+                <span>活动类型：</span>
+                <span>发发发发发发付付</span>
+              </div>
+              <div class="item-prop">
+                <span>活动类型：</span>
+                <span>发发发发发发付付</span>
+              </div>
+              <div class="item-ope">
+                <el-button type="primary" size="mini">发布</el-button>
+                <el-button type="success" size="mini">编辑</el-button>
+                <el-button size="mini">删除</el-button>
+              </div>
             </div>
-            <div class="tip-cnt">巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉</div>
           </div>
-          <div class="corn">
-            <div class="corn-num">8</div>
-            <div class="corn-text">日程</div>
+        </div>
+
+        <div class="m-ope">
+          <el-button type="warning" style="width: 48%">添加活动计划</el-button>
+          <el-button style="width: 48%">添加日程</el-button>
+        </div>
+      </el-col>
+      <el-col :span="18">
+        <div class="m-cal">
+          <div class="hd">
+            <div class="hd-year">
+              <el-date-picker
+                v-model="currentYearStr"
+                value-format="yyyy"
+                type="year"
+                placeholder="选择年"
+                size="small"
+                style="width: 150px"
+              >
+              </el-date-picker>
+            </div>
+            <div class="hd-month">
+              <div
+                class="month-item"
+                :class="{ 'z-on': m - 1 == currentMonth }"
+                :key="'month' + m"
+                @click="currentMonth = m - 1"
+                v-for="m in 12"
+              >
+                <el-badge :value="12" :hidden="m != 3" class="item">
+                  <div class="month-text">{{ m }}月</div>
+                </el-badge>
+              </div>
+            </div>
+            <div class="hd-btn">
+              <el-button type="primary" size="small"
+                >批量生成年度报表</el-button
+              >
+            </div>
           </div>
-        </template>
-      </calendar>
-    </div>
+          <calendar
+            :currentYear="currentYear"
+            :currentMonth="currentMonth"
+            @clickDate="handleChangeDate"
+          >
+            <template v-slot:date-item="{ info }">
+              <div class="tip">
+                <div class="tip-text">
+                  <span class="z-on">主题当日</span> (已发布)
+                </div>
+                <div class="tip-cnt">巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉</div>
+              </div>
+              <div class="corn">
+                <div class="corn-num">8</div>
+                <div class="corn-text">日程</div>
+              </div>
+            </template>
+          </calendar>
+        </div>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
@@ -68,6 +132,12 @@ export default {
     return {
       currentYearStr: todayObj.getFullYear() + "",
       currentMonth: todayObj.getMonth(),
+
+      partyOptions: [],
+
+      fmData: {
+        party: "",
+      },
     };
   },
   computed: {
@@ -79,6 +149,8 @@ export default {
     // await this.getPartyOggList()
   },
   methods: {
+    handleChangeParty() {},
+
     handleChangeDate(item) {
       console.log("handleChangeDate");
       this.currentYearStr = item.year + "";
@@ -105,16 +177,19 @@ export default {
 @import "@/assets/scss/c/config.scss";
 @import "@/assets/scss/c/function.scss";
 
+$blue: #3e8ef7;
+$red: #f33;
+
 .g-cnt {
   background-color: #ffffff;
   padding: 20px;
 }
 .m-cal {
-  .sizer {
+  .hd {
     display: flex;
     margin-bottom: 20px;
 
-    .sizer-month {
+    .hd-month {
       display: flex;
 
       .month-item {
@@ -127,7 +202,7 @@ export default {
 
         &.z-on {
           .month-text {
-            background-color: #3e8ef7;
+            background-color: $blue;
             color: #ffffff;
           }
         }
@@ -145,6 +220,10 @@ export default {
         }
       }
     }
+
+    .hd-btn {
+      margin-left: auto;
+    }
   }
 
   .tip {
@@ -159,7 +238,7 @@ export default {
     cursor: pointer;
     color: #999999;
     .z-on {
-      color: #ff3333;
+      color: $red;
     }
     .tip-text {
       @include toe;
@@ -182,7 +261,7 @@ export default {
       width: 4px;
       height: 4px;
       border-radius: 100%;
-      background-color: #ff3333;
+      background-color: $red;
     }
   }
 
@@ -231,4 +310,61 @@ export default {
     }
   }
 }
+.m-sizer {
+  .item {
+    margin-bottom: 10px;
+  }
+}
+
+.m-date {
+  text-align: center;
+  color: $blue;
+  line-height: 1.5;
+  background-color: #f3f4f5;
+  padding: 20px;
+  .date-top {
+    font-size: 24px;
+  }
+  .date-big {
+    font-size: 100px;
+  }
+  .date-week {
+    font-size: 24px;
+  }
+}
+
+.m-list {
+  margin-top: 20px;
+  .list-title {
+    width: 100px;
+    text-align: center;
+    line-height: 24px;
+    background-color: $red;
+    color: #ffffff;
+  }
+  .list {
+    .item {
+      border-top: 1px solid #eee;
+      padding: 10px 0;
+      line-height: 1.5;
+      overflow: hidden;
+      .item-title {
+        font-weight: bold;
+      }
+      .item-prop {
+        margin: 4px 0;
+      }
+
+      .item-ope {
+        margin-top: 10px;
+        float: right;
+      }
+    }
+  }
+}
+.m-ope {
+  margin-top: 40px;
+  display: flex;
+  justify-content: space-between;
+}
 </style>