diff --git a/src/saas/AppCountryAlbum/Attendance.vue b/src/saas/AppCountryAlbum/Attendance.vue
new file mode 100644
index 00000000..39ddd434
--- /dev/null
+++ b/src/saas/AppCountryAlbum/Attendance.vue
@@ -0,0 +1,250 @@
+<template>
+  <div class="Attendance">
+    <div class="Attendance-top">
+      <div>
+        <div class="left">
+          <h2>09</h2>
+          <div class="left-wrapper__right">
+            <h3>2022年2月</h3>
+            <p>日·数据统计</p>
+          </div>
+        </div>
+        <div class="right">
+          <image src="./images/qiehuan.png" />
+          <span>切换日期</span>
+        </div>
+      </div>
+    </div>
+    <div class="info">
+      <div class="info-tab">
+        <div class="left">
+          <span @click="currIndex = 0" :class="[currIndex === 0 ? 'active' : '']">全部 10</span>
+          <span @click="currIndex = 1" :class="[currIndex === 1 ? 'active' : '']">已出勤 10</span>
+          <span @click="currIndex = 2" :class="[currIndex === 2 ? 'active' : '']">未出勤 10</span>
+        </div>
+        <div class="right" @click="linkTo('/saas/AppCountryAlbum/AttendanceSetting')">考勤设置</div>
+      </div>
+      <div class="info-table">
+        <div class="table-header">
+          <span>人员</span>
+          <span>上下班时间</span>
+          <span>工作时长</span>
+        </div>
+        <div class="table-body">
+          <div class="table-row" v-for="(item, index) in 10" :key="index">
+            <div class="table-row__left">
+              <h2>陶白白</h2>
+              <p>已上传1张</p>
+            </div>
+            <span>8:30-6:00</span>
+            <span>10.5小时</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'Attendance',
+
+    appName: '考勤统计',
+
+    data () {
+      return {
+        currIndex: 0
+      }
+    },
+
+    onLoad () {
+
+    },
+
+    methods: {
+      linkTo (url) {
+        uni.navigateTo({
+          url
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .Attendance {
+    padding: 0 0 0;
+
+    * {
+      box-sizing: border-box;
+      line-height: 1;
+    }
+
+    i, em {
+      font-style: normal;
+    }
+
+    .info-table {
+      margin-top: 32px;
+      padding: 0 32px;
+
+      .table-header {
+        display: flex;
+        align-items: center;
+        height: 96px;
+        background: #F4F9FD;
+        border-radius: 8px;
+
+        span {
+          flex: 1;
+          text-align: center;
+          color: #333333;
+          font-size: 28px;
+        }
+      }
+
+      .table-body {
+        .table-row {
+          display: flex;
+          align-items: center;
+          height: 160px;
+          border-radius: 8px;
+          text-align: center;
+
+          &:nth-of-type(2n) {
+            background: #F4F9FD;
+          }
+
+          div {
+            h2 {
+              margin-bottom: 16px;
+              color: #333333;
+              font-size: 34px;
+            }
+
+            p {
+              color: #999999;
+              font-size: 28px;
+            }
+          }
+
+          div, span {
+            flex: 1;
+          }
+
+          span {
+            color: #333;
+            font-size: 28px;
+          }
+        }
+      }
+    }
+
+    .info {
+      position: relative;
+      top: -116px;
+      margin: 0 32px;
+      padding: 0 0 86px 0;
+      background: #FFFFFF;
+      box-shadow: 0px 4px 8px 0px rgba(17, 67, 110, 0.02);
+      border-radius: 16px;
+
+      .info-tab {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 108px;
+        padding: 0 32px 0 16px;
+
+        .left {
+          display: flex;
+          align-items: center;
+          height: 100%;
+
+          span {
+            width: 124px;
+            height: 108px;
+            line-height: 108px;
+            margin-right: 32px;
+            text-align: center;
+            color: #999999;
+            font-size: 28px;
+            transition: all ease 0.3s;
+
+            &:last-child {
+              margin-right: 0;
+            }
+
+            &.active {
+              color: #1365DD;
+              border-bottom: 2px solid #1365DD;
+            }
+          }
+        }
+
+        .right {
+          font-size: 28px;
+          font-weight: 400;
+          color: #3975C6;
+        }
+      }
+    }
+
+    .Attendance-top {
+      height: 320px;
+      width: 100%;
+      padding: 58px 32px 0;
+      background: #3975C6;
+
+      & > div {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+      }
+
+      .right {
+        display: flex;
+        align-items: center;
+        height: 56px;
+        padding: 0 36px;
+        background: #285DA4;
+        border-radius: 28px;
+
+        image {
+          width: 36px;
+          height: 26px;
+          margin-right: 12px;
+        }
+
+        span {
+          color: #FFFFFF;
+          font-size: 28px;
+        }
+      }
+
+      .left {
+        display: flex;
+        align-items: center;
+        line-height: 1;
+
+        h2 {
+          margin-right: 16px;
+          font-size: 100px;
+          font-weight: 600;
+          color: #FFFFFF;
+        }
+
+        h3 {
+          margin-bottom: 8px;
+          color: #a9c3e6;
+          font-size: 28px;
+        }
+
+        p {
+          font-size: 32px;
+          color: #FFFFFF;
+        }
+      }
+    }
+  }
+</style>
\ No newline at end of file
diff --git a/src/saas/AppCountryAlbum/AttendanceFiexdTime.vue b/src/saas/AppCountryAlbum/AttendanceFiexdTime.vue
new file mode 100644
index 00000000..e89a59b4
--- /dev/null
+++ b/src/saas/AppCountryAlbum/AttendanceFiexdTime.vue
@@ -0,0 +1,262 @@
+<template>
+  <div class="AttendanceFiexdTime">
+    <div class="form-group">
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>上班打卡时间</span>
+        </div>
+        <div class="right">
+          <span>09:00</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>下班打卡时间</span>
+        </div>
+        <div class="right">
+          <span>18:00</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="form-group__item form-group__checked">
+        <div class="left">
+          <h2>是否开启休息时间</h2>
+          <p>若开启休息时间，则休息时间不计入工作时长</p>
+        </div>
+        <div class="right">
+          <switch color="#1088F9" checked />
+        </div>
+      </div>
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>休息开始</span>
+        </div>
+        <div class="right">
+          <span>请设置时间</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>休息结束</span>
+        </div>
+        <div class="right">
+          <span>请设置时间</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="form-group__item form-group__checked">
+        <div class="left">
+          <h2>允许打卡时间范围</h2>
+          <p>超过打卡时间则记为迟到，提前打卡则记为早退</p>
+        </div>
+      </div>
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>上班打卡</span>
+        </div>
+        <div class="right">
+          <span>上班前2小时可打卡</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>下班打卡</span>
+        </div>
+        <div class="right">
+          <span>下班后2小时可打卡</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="form-group__item form-group__checked">
+        <div class="left">
+          <h2>是否开启固定打卡点</h2>
+          <p>若开启，不在固定范围内打卡将不计入考勤</p>
+        </div>
+        <div class="right">
+          <switch color="#1088F9" checked />
+        </div>
+      </div>
+      <div class="form-group__item form-group__checked">
+        <div class="left">
+          <h2>绿地蓝海A座</h2>
+          <p>湖北省武汉市武昌区和平大道750号</p>
+          <p style="margin-top: 8px;">允许打卡范围200米</p>
+        </div>
+        <div class="right">
+          <image :src="`${$cdn}askform/sc1.png`" />
+          <span>删除</span>
+        </div>
+      </div>
+      <div class="form-group__item form-group__checked">
+        <div class="left left-add" @click="linkTo('/saas/AppCountryAlbum/ChooseAddess')">
+          <div class="add-btn"></div>
+          <h2 style="color: #1088F9;">添加打卡点</h2>
+        </div>
+      </div>
+    </div>
+    <div class="form-btn" hover-class="text-hover">保存</div>
+  </div>
+</template>
+<script>
+  export default {
+    name: 'AttendanceFiexdTime',
+
+    appName: '固定时间打卡设置',
+
+    data () {
+      return {
+
+      }
+    },
+
+    onLoad () {
+
+    },
+
+    methods: {
+      linkTo (url) {
+        uni.navigateTo({
+          url
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .AttendanceFiexdTime {
+    padding-bottom: 130px;
+
+    * {
+      line-height: 1;
+      box-sizing: border-box;
+    }
+
+    .form-btn {
+      position: fixed;
+      bottom: 0;
+      left: 0;
+      z-index: 1;
+      width: 100%;
+      height: 112px;
+      line-height: 112px;
+      text-align: center;
+      color: #fff;
+      font-size: 32px;
+      background: #1365DD;
+
+      &:active {
+        opacity: 0.8;
+      }
+    }
+    .form-group {
+      margin-bottom: 16px;
+      padding: 0 32px;
+      background: #fff;
+
+      .form-group__item {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 112px;
+        font-size: 32px;
+        color: #333333;
+        border-bottom: 1px solid #DDDDDD;
+
+        &.form-group__checked {
+          height: auto;
+          padding: 32px 0;
+
+          .left {
+            h2 {
+              margin-bottom: 12px;
+              color: #333333;
+              font-size: 32px;
+            }
+
+            &.left-add {
+              display: flex;
+              align-items: center;
+
+              h2 {
+                margin-bottom: 0;
+              }
+            }
+
+            .add-btn {
+              position: relative;
+              width: 48px;
+              height: 48px;
+              margin-right: 16px;
+              border-radius: 50%;
+              overflow: hidden;
+              background: #1088F9;
+
+              &::after {
+                position: absolute;
+                top: 50%;
+                left: 50%;
+                z-index: 1;
+                width: 4px;
+                height: 24px;
+                background: #fff;
+                content: ' ';
+                transform: translate(-50%, -50%);
+              }
+
+              &::before {
+                position: absolute;
+                top: 50%;
+                left: 50%;
+                z-index: 1;
+                width: 24px;
+                height: 4px;
+                background: #fff;
+                content: ' ';
+                transform: translate(-50%, -50%);
+              }
+            }
+
+            p {
+              color: #999999;
+              font-size: 28px;
+            }
+          }
+        }
+
+        label {
+          color: #FF4466;
+        }
+
+        &:last-child {
+          border: none;
+        }
+
+        .right {
+          display: flex;
+          align-items: center;
+          color: #999999;
+          image {
+            width: 32px;
+            height: 32px;
+          }
+        }
+      }
+    }
+  }
+</style>
\ No newline at end of file
diff --git a/src/saas/AppCountryAlbum/AttendanceFlexibleTime.vue b/src/saas/AppCountryAlbum/AttendanceFlexibleTime.vue
new file mode 100644
index 00000000..d4c14d7e
--- /dev/null
+++ b/src/saas/AppCountryAlbum/AttendanceFlexibleTime.vue
@@ -0,0 +1,246 @@
+<template>
+  <div class="AttendanceFiexdTime">
+    <div class="form-group">
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>最早允许打卡时间</span>
+        </div>
+        <div class="right">
+          <span>09:00</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>最晚允许打卡时间</span>
+        </div>
+        <div class="right">
+          <span>18:00</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="form-group__item form-group__checked">
+        <div class="left">
+          <h2>是否开启休息时间</h2>
+          <p>若开启休息时间，则休息时间不计入工作时长</p>
+        </div>
+        <div class="right">
+          <switch color="#1088F9" checked />
+        </div>
+      </div>
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>休息开始</span>
+        </div>
+        <div class="right">
+          <span>请设置时间</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>休息结束</span>
+        </div>
+        <div class="right">
+          <span>请设置时间</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="form-group__item form-group__checked">
+        <div class="left">
+          <h2>工作时长要求</h2>
+        </div>
+      </div>
+      <div class="form-group__item">
+        <div class="left">
+          <label>*</label>
+          <span>时长要求</span>
+        </div>
+        <div class="right">
+          <span>8小时</span>
+          <image src="./images/right.png" />
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="form-group__item form-group__checked">
+        <div class="left">
+          <h2>是否开启固定打卡点</h2>
+          <p>若开启，不在固定范围内打卡将不计入考勤</p>
+        </div>
+        <div class="right">
+          <switch color="#1088F9" checked />
+        </div>
+      </div>
+      <div class="form-group__item form-group__checked">
+        <div class="left">
+          <h2>绿地蓝海A座</h2>
+          <p>湖北省武汉市武昌区和平大道750号</p>
+          <p style="margin-top: 8px;">允许打卡范围200米</p>
+        </div>
+        <div class="right">
+          <image :src="`${$cdn}askform/sc1.png`" />
+          <span>删除</span>
+        </div>
+      </div>
+      <div class="form-group__item form-group__checked">
+        <div class="left left-add">
+          <div class="add-btn"></div>
+          <h2 style="color: #1088F9;">添加打卡点</h2>
+        </div>
+      </div>
+    </div>
+    <div class="form-btn" hover-class="text-hover">保存</div>
+  </div>
+</template>
+<script>
+  export default {
+    name: 'AttendanceFlexibleTime',
+
+    appName: '灵活时间打卡设置',
+
+    data () {
+      return {
+
+      }
+    },
+
+    onLoad () {
+
+    },
+
+    methods: {
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .AttendanceFiexdTime {
+    padding-bottom: 130px;
+
+    * {
+      line-height: 1;
+      box-sizing: border-box;
+    }
+
+    .form-btn {
+      position: fixed;
+      bottom: 0;
+      left: 0;
+      z-index: 1;
+      width: 100%;
+      height: 112px;
+      line-height: 112px;
+      text-align: center;
+      color: #fff;
+      font-size: 32px;
+      background: #1365DD;
+
+      &:active {
+        opacity: 0.8;
+      }
+    }
+    .form-group {
+      margin-bottom: 16px;
+      padding: 0 32px;
+      background: #fff;
+
+      .form-group__item {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 112px;
+        font-size: 32px;
+        color: #333333;
+        border-bottom: 1px solid #DDDDDD;
+
+        &.form-group__checked {
+          height: auto;
+          padding: 32px 0;
+
+          .left {
+            h2 {
+              margin-bottom: 12px;
+              color: #333333;
+              font-size: 32px;
+            }
+
+            &.left-add {
+              display: flex;
+              align-items: center;
+
+              h2 {
+                margin-bottom: 0;
+              }
+            }
+
+            .add-btn {
+              position: relative;
+              width: 48px;
+              height: 48px;
+              margin-right: 16px;
+              border-radius: 50%;
+              overflow: hidden;
+              background: #1088F9;
+
+              &::after {
+                position: absolute;
+                top: 50%;
+                left: 50%;
+                z-index: 1;
+                width: 4px;
+                height: 24px;
+                background: #fff;
+                content: ' ';
+                transform: translate(-50%, -50%);
+              }
+
+              &::before {
+                position: absolute;
+                top: 50%;
+                left: 50%;
+                z-index: 1;
+                width: 24px;
+                height: 4px;
+                background: #fff;
+                content: ' ';
+                transform: translate(-50%, -50%);
+              }
+            }
+
+            p {
+              color: #999999;
+              font-size: 28px;
+            }
+          }
+        }
+
+        label {
+          color: #FF4466;
+        }
+
+        &:last-child {
+          border: none;
+        }
+
+        .right {
+          display: flex;
+          align-items: center;
+          color: #999999;
+          image {
+            width: 32px;
+            height: 32px;
+          }
+        }
+      }
+    }
+  }
+</style>
\ No newline at end of file
diff --git a/src/saas/AppCountryAlbum/AttendanceSetting.vue b/src/saas/AppCountryAlbum/AttendanceSetting.vue
new file mode 100644
index 00000000..640962d0
--- /dev/null
+++ b/src/saas/AppCountryAlbum/AttendanceSetting.vue
@@ -0,0 +1,109 @@
+<template>
+  <div class="AttendanceSetting">
+    <div class="cell-group">
+      <div class="cell-item" hover-class="bg-hover" @click="linkTo('/saas/AppCountryAlbum/AttendanceFiexdTime')">
+        <div class="cell-item__left">
+          <h2>固定时间上下班</h2>
+          <p>有固定的上下班时间，考核迟到早退</p>
+        </div>
+        <image src="./images/right.png" />
+      </div>
+      <div class="cell-item" hover-class="bg-hover" @click="linkTo('/saas/AppCountryAlbum/AttendanceFlexibleTime')">
+        <div class="cell-item__left">
+          <h2>灵活时间上下班</h2>
+          <p>上下班时间不固定，考核工时时长</p>
+        </div>
+        <image src="./images/right.png" />
+      </div>
+    </div>
+    <div class="tips">
+      当前考勤时间为00:00~24:00，若新增考勤规则则以
+      新增规则为准；
+      工作时长=（最晚拍照时间）-（最早拍照时间）；
+      若员工“最早”或者“最晚”拍照时间缺失，对应工作时长为空；
+      上班时间=最早拍照时间；
+      下班时间=最晚拍照时间。
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'AttendanceSetting',
+
+    appName: '考勤设置',
+
+    data () {
+      return {
+
+      }
+    },
+
+    onLoad () {
+
+    },
+
+    methods: {
+      linkTo (url) {
+        uni.navigateTo({
+          url
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .text-hover {
+    opacity: 0.7;
+  }
+
+  .bg-hover {
+    background: #eee;
+  }
+  .AttendanceSetting {
+    .tips {
+      line-height: 44px;
+      margin: 32px;
+      font-size: 28px;
+      color: #999999;
+      white-space: pre-line;
+    }
+
+    .cell-group {
+      .cell-item {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 156px;
+        margin-bottom: 16px;
+        padding: 0 32px;
+        background: #FFFFFF;
+
+        &:active {
+          background: #eee;
+        }
+
+        image {
+          width: 32px;
+          height: 32px;
+        }
+
+        &:last-child {
+          margin-bottom: 0;
+        }
+
+        h2 {
+          margin-bottom: 12px;
+          color: #333333;
+          font-size: 32px;
+        }
+
+        p {
+          color: #999999;
+          font-size: 28px;
+        }
+      }
+    }
+  }
+</style>
\ No newline at end of file
diff --git a/src/saas/AppCountryAlbum/ChooseAddess.vue b/src/saas/AppCountryAlbum/ChooseAddess.vue
new file mode 100644
index 00000000..42e73980
--- /dev/null
+++ b/src/saas/AppCountryAlbum/ChooseAddess.vue
@@ -0,0 +1,253 @@
+<template>
+  <div class="Attendance-address">
+    <map @tap="onClick"></map>
+    <u-popup v-model="isShow" :closeable="false" border-radius="32" height="70%" mode="bottom">
+			<div class="wrapper">
+        <div class="top">
+          <span @click="isShow = false">取消</span>
+          <span>确定</span>
+        </div>
+        <div class="address-search">
+          <div class="address-search__wrapper">
+            <image src="./images/search.png" />
+            <input placeholder-style="color: #98A6B6" placeholder="搜索地点" v-model="address">
+          </div>
+        </div>
+        <scroll-view scroll-y>
+          <div class="address-item" v-for="(item, index) in 20" :key="index">
+            <div class="left">
+              <h2>苗栗路-地铁站</h2>
+              <p>50m内 | 江汉区轨道交通6号线</p>
+            </div>
+            <div class="right" :class="[currIndex === index ? 'active' : '']"></div>
+          </div>
+				</scroll-view>
+        <div class="address-btn">
+          <span>打卡有效范围</span>
+          <div class="right" @click="isShowScope = true">
+            <i>200米</i>
+            <image src="./images/w-right.png" />
+          </div>
+        </div>
+      </div>
+		</u-popup>
+    <u-popup v-model="isShowScope" :closeable="false" :z-index="11111" border-radius="16" mode="bottom">
+			<div class="ActionSheet">
+        <div class="ActionSheet-list">
+          <div :class="[chooseIndex === 0 ? 'active' : '']">100米</div>
+          <div :class="[chooseIndex === 1 ? 'active' : '']">200米</div>
+          <div :class="[chooseIndex === 2 ? 'active' : '']">300米</div>
+          <div :class="[chooseIndex === 3 ? 'active' : '']">400米</div>
+          <div :class="[chooseIndex === 4 ? 'active' : '']">500米</div>
+        </div>
+        <div class="cancel-btn" @click="isShowScope = false">取消</div>
+      </div>
+		</u-popup>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'ChooseAddess',
+
+    appName: '选择打卡点',
+
+    data () {
+      return {
+        latitude: '',
+        longitude: '',
+        isShow: false,
+        address: '',
+        currIndex: 0,
+        chooseIndex: 1,
+        isShowScope: false
+      }
+    },
+
+    onLoad () {
+      uni.getLocation({
+        type: 'wgs84',
+        success: res => {
+          console.log(res)
+          this.longitude = res.longitude
+          this.latitude = res.latitude
+        }
+      })
+    },
+
+    methods: {
+      onClick (e) {
+        console.log(e)
+        this.isShow = true
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .Attendance-address {
+    width: 100%;
+    height: 100vh;
+
+    .ActionSheet {
+      background: #F5F6F6;
+
+      .ActionSheet-list {
+        margin-bottom: 8px;
+        background: #fff;
+
+        div {
+          height: 112px;
+          line-height: 112px;
+          text-align: center;
+          color: #333333;
+          font-size: 32px;
+          border-bottom: 1px solid #D8DDE6;
+
+          &.active {
+            color: #1365DD;
+            font-weight: 600;
+          }
+
+          &:last-child {
+            border: none;
+          }
+        }
+      }
+
+      .cancel-btn {
+        height: 112px;
+        line-height: 112px;
+        color: #333;
+        font-size: 32px;
+        text-align: center;
+        font-weight: 600;
+        background: #fff;
+      }
+    }
+
+    * {
+      box-sizing: border-box;
+      line-height: 1;
+      font-style: normal;
+    }
+    
+    .wrapper {
+      height: 100%;
+      overflow: hidden;
+
+      scroll-view {
+        height: calc(100% - 308px);
+        padding: 0 32px;
+
+        .address-item {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          padding: 32px 0;
+          border-bottom: 1px solid #EEEEEE;
+
+          &:last-child {
+            border: none;
+          }
+
+          .right {
+            width: 32px;
+            height: 32px;
+            border-radius: 50%;
+            border: 4px solid #CCCCCC;
+            transition: all ease 0.3s;
+
+            &.active {
+              border: 10px solid #1365DD;
+            }
+          }
+
+          h2 {
+            margin-bottom: 20px;
+            color: #222222;
+            font-weight: 600;
+            font-size: 34px;
+          }
+
+          p {
+            color: #999999;
+            font-size: 28px;
+          }
+        }
+      }
+
+      .address-search {
+        display: flex;
+        align-items: center;
+        height: 100px;
+        padding: 0 32px;
+
+        .address-search__wrapper {
+          display: flex;
+          align-items: center;
+          width: 100%;
+          height: 72px;
+          padding: 0 32px;
+          background: #F6F7F9;
+          border-radius: 36px;
+
+          image {
+            width: 48px;
+            height: 48px;
+          }
+
+          input {
+            flex: 1;
+            font-size: 26px;
+            color: #333;
+          }
+        }
+      }
+
+      .address-btn {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 112px;
+        line-height: 112px;
+        padding: 0 32px;
+        text-align: center;
+        color: #FFFFFF;
+        font-size: 32px;
+        background: #1365DD;
+
+        image {
+          width: 32px;
+          height: 32px;
+          margin-left: 4px;
+        }
+
+        .right {
+          display: flex;
+          align-items: center;
+        }
+      }
+
+      .top {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 96px;
+        padding: 0 32px;
+        font-size: 32px;
+        color: #999;
+        font-weight: 600;
+
+        span:last-child {
+          color: #222;
+        }
+      }
+    }
+
+    map {
+      width: 100%;
+      height: 100%;
+    }
+  }
+</style>
\ No newline at end of file
diff --git a/src/saas/AppCountryAlbum/components/Organize.vue b/src/saas/AppCountryAlbum/components/Organize.vue
index c7d4c5ba..7e823522 100644
--- a/src/saas/AppCountryAlbum/components/Organize.vue
+++ b/src/saas/AppCountryAlbum/components/Organize.vue
@@ -47,7 +47,7 @@
       <div class="info-item info-work">
         <div class="info-item__title">
           <h2>考勤统计</h2>
-          <image src="../images/right.png" />
+          <image src="../images/right.png" @click="linkTo('/saas/AppCountryAlbum/Attendance')" />
         </div>
         <div class="info-work__wrapper">
           <div class="top">
@@ -104,7 +104,11 @@
     },
 
     methods: {
-
+      linkTo (url) {
+        uni.navigateTo({
+          url
+        })
+      }
     }
   }
 </script>
diff --git a/src/saas/AppCountryAlbum/images/search.png b/src/saas/AppCountryAlbum/images/search.png
new file mode 100644
index 00000000..601a7b3c
Binary files /dev/null and b/src/saas/AppCountryAlbum/images/search.png differ
diff --git a/src/saas/AppCountryAlbum/images/w-right.png b/src/saas/AppCountryAlbum/images/w-right.png
new file mode 100644
index 00000000..551fbf62
Binary files /dev/null and b/src/saas/AppCountryAlbum/images/w-right.png differ