diff --git a/packages/extra/AppConsole/AppConsole.vue b/packages/extra/AppConsole/AppConsole.vue
new file mode 100644
index 00000000..8934cdb2
--- /dev/null
+++ b/packages/extra/AppConsole/AppConsole.vue
@@ -0,0 +1,505 @@
+<template>
+  <section class="AppConsole">
+    <el-row type="flex" class="header-text">
+      <el-row style="width: 392px" type="flex" align="middle">
+        <i class="iconfont iconDate1"/>
+        <span v-text="`今天是 ${$moment().format('YYYY年M月D日 dddd')}`"/>
+      </el-row>
+      <el-row type="flex" align="middle" class="notice fill">
+        <el-button type="primary" icon="iconfont iconNotice">通知公告</el-button>
+        <div class="notice-content nowarp-text fill">
+          <el-carousel ref="noticeCarousel" height="32px" direction="vertical" indicator-position="none">
+            <template v-if="noticeList.length">
+              <el-carousel-item v-for="(notice,i) in noticeList" :key="i">
+                <div style="text-align: left">{{ notice.title }}</div>
+              </el-carousel-item>
+            </template>
+            <el-carousel-item v-else style="text-align: left">暂无通知</el-carousel-item>
+          </el-carousel>
+        </div>
+        <el-button type="text" style="color:rgba(153,153,153,1)" @click="$router.push({name:'通知公告'})">更多</el-button>
+        <el-button type="text" style="color:rgba(153,153,153,1);margin-left: 0;padding: 8px 0"
+                   icon="iconfont iconTriangle_Up" @click="$refs.noticeCarousel.prev()"></el-button>
+        <el-button type="text" style="color:rgba(153,153,153,1);margin-left: 0;padding: 8px 8px 8px 0"
+                   icon="iconfont iconTriangle_Down" @click="$refs.noticeCarousel.next()"></el-button>
+      </el-row>
+    </el-row>
+    <div class="main-console">
+      <el-row type="flex">
+        <!--用户信息卡片-->
+        <div class="card-panel userinfo-panel">
+          <el-row type="flex" class="top-panel" align="middle">
+            <div class="avatar">
+              <el-avatar :size="64" :src="user.info.avatar">
+                {{ defaultAvatar }}
+              </el-avatar>
+            </div>
+            <el-row type="flex" justify="space-between" align="middle">
+              <div class="basic-info">
+                {{ $moment().format("A") + "好，" + user.info.name }}
+                <br>{{ welcomeWord() }}
+              </div>
+              <el-button type="text" @click="$router.push({name:'个人中心'})">
+                个人中心 <i class="iconfont iconArrow_Right"/></el-button>
+            </el-row>
+          </el-row>
+          <div class="user-info-panel">
+            <li>
+              <div>所属单位</div>
+              {{ user.info.unitName }}
+            </li>
+            <li>
+              <div>当前职务</div>
+              {{ user.info.position }}
+            </li>
+            <li>
+              <div>所属党组织</div>
+              {{ user.info.organizationName }}
+            </li>
+            <li>
+              <div>上次登录</div>
+              <span style="color: #2266ff">{{ user.info.lastLoginTime }}</span></li>
+          </div>
+        </div>
+        <div class="fill mar-l20 topLeft">
+          <el-row type="flex" justify="space-between">
+            <div class="data-panel-area">
+              <div class="card-panel data-panel" @click="$router.push({name:'待办事项'})">
+                <div class="item-label">
+                  <svg class="icon" aria-hidden="true">
+                    <use xlink:href="#iconBacklog"></use>
+                  </svg>
+                  <div style="margin-left: 8px">待办事项</div>
+                </div>
+                <b style="font-size: 20px">{{ todoTotal }}</b>
+              </div>
+            </div>
+            <div class="data-panel-area">
+              <div class="card-panel data-panel" @click="$router.push({name:'消息中心'})">
+                <div class="item-label">
+                  <svg class="icon" aria-hidden="true">
+                    <use xlink:href="#iconUnread_message"></use>
+                  </svg>
+                  <div style="margin-left: 8px">未读消息</div>
+                </div>
+                <b style="font-size: 20px">{{ msgTotal }}</b>
+              </div>
+            </div>
+            <div class="data-panel-area">
+              <div class="card-panel data-panel"
+                   @click="$router.push({name:'33',query:{listType: 1,meetingStatus: 1}})">
+                <div class="item-label">
+                  <svg class="icon" aria-hidden="true">
+                    <use xlink:href="#iconAttend_The_Meeting"></use>
+                  </svg>
+                  <div style="margin-left: 8px">待参加会议</div>
+                </div>
+                <b style="font-size: 20px">{{ conferenceTotal }}</b>
+              </div>
+            </div>
+          </el-row>
+          <ai-card title="待办事项" class="mar-t20 fill">
+            <template #content>
+              <el-row type="flex">
+                <el-col :span="3" class="todo-item" v-for="(todo,i) in todoList" :key="i"
+                        @click.native="$router.push({name:$dict.getLabel('todoFrom',todo.type),query:$dict.getLabel('todoParams',todo.type)})">
+                  <div style="width: 48px;margin: 8px auto 0">
+                    <el-badge type="warning" :value="todo.count">
+                      <svg class="icon" aria-hidden="true">
+                        <use :xlink:href="$dict.getLabel('todoIcon',todo.type)"></use>
+                      </svg>
+                    </el-badge>
+                  </div>
+                  <div class="item-label">{{ $dict.getLabel("todoFrom", todo.type) }}</div>
+                </el-col>
+              </el-row>
+            </template>
+          </ai-card>
+        </div>
+      </el-row>
+      <el-row type="flex" class="conference-and-message">
+        <ai-card title="未读消息" class="fill">
+          <template #right>
+            <el-button type="text" @click="$router.push({name:'消息中心'})">消息中心<i class="iconfont iconArrow_Right"/></el-button>
+          </template>
+          <template #content>
+            <div class="unread-message-list">
+              <li v-for="(msg,i) in msgList" :key="i" class="nowarp-text">
+                <div class="list-type">&nbsp;</div>
+                <div style="width: calc(100% - 16px)">
+                  <p class="nowarp-text">{{ msg.content }}</p>
+                  <span style="color: #26f" v-text="`[${msg.title}]`"/><span style="color:#999" v-text="msg.receiveTime"/>
+                </div>
+              </li>
+              <ai-empty v-if="!msgList.length">暂无消息</ai-empty>
+            </div>
+          </template>
+        </ai-card>
+        <ai-card title="我的会议" class="fill">
+          <template #right>
+            <el-button type="text" @click="$router.push({name:'33'})">更多会议<i class="iconfont iconArrow_Right"/></el-button>
+          </template>
+          <template #content>
+            <div class="conference-list">
+              <li v-for="(item,i) in conferenceList" :key="i" @click="$router.push({name:'33',query:{listType: 1,meetingStatus: 1,confirmStatus:1}})">
+                <div class="list-type"></div>
+                <div>
+                  <span>{{ item.title }}</span><br>
+                  <span
+                      style="color:#999">{{
+                      [$moment(item.startTime).format("YYYY-MM-DD hh:mm"), item.address].join(" ")
+                    }}</span>
+                </div>
+              </li>
+            </div>
+            <ai-empty v-if="!conferenceList.length">暂无会议</ai-empty>
+          </template>
+        </ai-card>
+      </el-row>
+    </div>
+  </section>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: "AppConsole",
+  label: "工作台",
+  computed: {
+    ...mapState(['user']),
+    defaultAvatar() {
+      return this.user.info.name?.slice(-2) || "游客"
+    }
+  },
+  data() {
+    return {
+      todoList: [],
+      todoTotal: 0,
+      msgList: [],
+      msgTotal: 0,
+      conferenceList: [],
+      conferenceTotal: 0,
+      noticeList: []
+    }
+  },
+  methods: {
+    getTodoList() {
+      this.$request.post("/message/systodolist/type-count").then(res => {
+        this.todoList = res.data.list
+        this.todoTotal = res.data.total
+      })
+    },
+    getUnreadMessage() {
+      this.$request.post("/message/appmessage/list", null, {
+        params: {readStatus: 0}
+      }).then(res => {
+        this.msgList = res.data.records
+        this.msgTotal = res.data.total
+      })
+    },
+    getConferences() {
+      this.$request.post("/app/appmeetinginfo/list", null, {
+        params: {listType: 1, meetingStatus: 1}
+      }).then(res => {
+        this.conferenceList = res.data.records
+        this.conferenceTotal = res.data.total
+      })
+    },
+    getNotice() {
+      this.$request.post("/app/appannouncement/list-latest", null, {
+        params: {
+          areaId: this.user.info.areaId,
+          current: 1,
+          size: 3
+        }
+      }).then(res => {
+        this.noticeList = res.data.records
+      })
+    },
+    welcomeWord() {
+      let word = "", hour = this.$moment().hour()
+      if (hour < 6) {
+        word = "你来的似乎有点早~"
+      } else if (hour < 9) {
+        word = "又是愉快的一天!"
+      } else if (hour < 12) {
+        word = "好好工作!"
+      } else if (hour < 14) {
+        word = "养精蓄锐,以逸待劳!"
+      } else if (hour < 17) {
+        word = "欢迎回来!"
+      } else if (hour < 19) {
+        word = "要按时下班哦~"
+      } else if (hour < 22) {
+        word = "忙碌了一天,注意休息~"
+      } else {
+        word = "夜深了,该休息了~"
+      }
+      return word;
+    }
+  },
+  create() {
+    this.$dict.load("todoFrom", "todoIcon", "todoParams")
+  }
+}
+</script>
+<style lang="scss" scoped>
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+
+.AppConsole {
+  .header-text {
+    font-weight: normal;
+    color: #333333;
+    padding: 0 calc(50% - 580px);
+    background: #fff;
+
+
+    span {
+      font-size: 14px;
+      margin-left: 8px;
+    }
+
+    .notice {
+      margin: 8px auto;
+      background: rgba(247, 247, 247, 1);
+      border-radius: 2px;
+      border: 1px solid rgba(221, 221, 221, 1);
+      text-align: center;
+      height: 32px;
+      font-size: 14px;
+
+      .label {
+        padding: 0 8px;
+        min-width: 112px;
+        color: white;
+        background: rgba(34, 102, 255, 1);
+        border-radius: 2px 0 0 2px;
+        line-height: 32px;
+        box-sizing: border-box;
+      }
+
+      .notice-content {
+        padding: 0 8px;
+        color: rgba(51, 51, 51, 1);
+        line-height: 32px;
+      }
+    }
+  }
+
+  .topLeft {
+    display: flex;
+    flex-direction: column;
+
+    .ai-card:last-of-type {
+      margin-bottom: 0;
+    }
+  }
+
+  .main-console {
+    height: calc(100% - 92px);
+    padding: 20px 20px 24px;
+    width: 1200px;
+    margin: auto;
+
+    .userinfo-panel {
+      min-width: 372px;
+
+      .top-panel {
+        padding: 0 16px;
+        background-image: url("./assets/bg_prolife.png");
+        background-size: 100%;
+        background-repeat: no-repeat;
+
+        ::v-deep .avatar {
+          padding: 8px;
+          width: initial;
+          height: initial;
+          border-radius: 50%;
+          border: 2px solid rgba(34, 102, 255, 0.5);
+          background: white;
+          font-size: 24px;
+          box-sizing: border-box;
+          margin-right: 8px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+
+          img {
+            width: 100%;
+          }
+
+          .el-avatar:hover {
+            animation: rotate 15s ease-in-out;
+          }
+        }
+
+        .basic-info {
+          font-size: 16px;
+          color: rgba(51, 51, 51, 1);
+          line-height: 24px;
+          margin: 36px 0;
+        }
+
+        .el-row {
+          flex: 1;
+          min-width: 0;
+
+          .el-button {
+            color: #999;
+          }
+        }
+      }
+
+      .user-info-panel {
+        padding: 24px;
+
+        li {
+          font-size: 14px;
+          line-height: 19px;
+          margin-bottom: 8px;
+          display: flex;
+
+          div {
+            width: 94px;
+            color: rgba(102, 102, 102, 1);
+          }
+        }
+      }
+    }
+
+    .card-panel {
+      background: rgba(255, 255, 255, 1);
+      box-shadow: 0 16px 32px 0 rgba(0, 0, 0, 0.02);
+      border-radius: 4px;
+    }
+
+    .todo-item {
+      background: rgba(243, 246, 249, 0);
+      border-radius: 4px;
+      cursor: pointer;
+
+      svg {
+        height: 48px;
+        width: 48px;
+      }
+
+      .item-label {
+        color: #333;
+        text-align: center;
+        font-size: 14px;
+        line-height: 32px
+      }
+
+      &:hover {
+        background: rgba(239, 246, 255, 1);
+      }
+    }
+
+    .data-panel-area:hover > .data-panel {
+      transform: translateY(-2px);
+      box-shadow: 0 16px 32px -16px rgba(36, 103, 255, 0.3);
+    }
+
+    .data-panel {
+      width: 224px;
+      height: 80px;
+      background: rgba(255, 255, 255, 1);
+      border-radius: 4px;
+      display: flex;
+      justify-content: space-between;
+      padding: 0 16px;
+      line-height: 80px;
+      cursor: pointer;
+
+      svg {
+        margin: 29px 0;
+        width: 24px;
+        height: 24px;
+      }
+
+      .item-label {
+        display: flex;
+        font-size: 14px;
+      }
+
+      b {
+        font-size: 20px;
+        color: rgba(51, 51, 51, 1);
+        font-family: Arial, serif;
+      }
+    }
+
+    .conference-and-message {
+      height: calc(100% - 296px);
+      margin-top: 20px;
+      gap: 20px;
+    }
+
+    .unread-message-list {
+      height: calc(100% - 48px);
+      overflow-y: auto;
+      overflow-x: hidden;
+
+      .list-type {
+        width: 5px;
+        height: 5px;
+        border-radius: 50%;
+        border: 3px solid #26f;
+        margin: 4px 8px;
+      }
+
+      li {
+        display: flex;
+        font-size: 14px;
+        margin: 0 16px;
+        padding: 15px 8px;
+        line-height: 19px;
+
+        &:hover {
+          background: rgba(239, 246, 255, 1);
+        }
+      }
+
+    }
+
+    .conference-list {
+      height: calc(100% - 48px);
+      overflow-y: auto;
+
+      .list-type {
+        width: 2px;
+        height: 40px;
+        background: rgba(255, 136, 34, 1);
+        border-radius: 2px;
+        margin-right: 14px;
+      }
+
+      li {
+        display: flex;
+        font-size: 14px;
+        margin: 0 16px;
+        padding: 15px 8px;
+        line-height: 19px;
+        cursor: pointer;
+
+        &:hover {
+          background: rgba(239, 246, 255, 1);
+        }
+      }
+    }
+  }
+}
+
+@keyframes rotate {
+  to {
+    transform: rotate(60turn);
+  }
+}
+</style>
diff --git a/packages/extra/AppConsole/assets/bg_prolife.png b/packages/extra/AppConsole/assets/bg_prolife.png
new file mode 100644
index 00000000..98f605c1
Binary files /dev/null and b/packages/extra/AppConsole/assets/bg_prolife.png differ