diff --git a/src/api/common.js b/src/api/common.js
index d4ab267..ec25b5d 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -1,31 +1,39 @@
-import request from '@/utils/request'
+import request from '@/utils/request'
 
 
 
 
 
-export function listCommondepartment(params) {
-  return request({
-    url: '/api/admin/other/admin-department-list',
-    method: 'get',
-    params:params
-  })
+export function listCommondepartment(params) {
+  return request({
+    url: '/api/admin/other/admin-department-list',
+    method: 'get',
+    params:params
+  })
 }
 
 
-export function listCommonuser(params) {
-  return request({
-    url: '/api/admin/other/admin-user-list',
-    method: 'get',
-    params:params
-  })
+export function listCommonuser(params) {
+  return request({
+    url: '/api/admin/other/admin-user-list',
+    method: 'get',
+    params:params
+  })
 }
 
 
-export function remoteStatistic(params) {
-  return request({
-    url: '/api/admin/other/remot-statistic',
-    method: 'get',
-    params:params
-  })
+export function remoteStatistic(params) {
+  return request({
+    url: '/api/admin/other/remot-statistic',
+    method: 'get',
+    params:params
+  })
+}
+
+export function sendSms (params) {
+  return request({
+    url: "/api/admin/auth/send-sms",
+    method: "get",
+    params
+  })
 }
diff --git a/src/store/modules/bigdata.js b/src/store/modules/bigdata.js
index 2009784..0d83671 100644
--- a/src/store/modules/bigdata.js
+++ b/src/store/modules/bigdata.js
@@ -5,6 +5,8 @@ const state = {
   leases: [],
   adventLeases: [],
   safety: [],
+  safetyPlan: [],
+  adventSafetyPlan: [],
   type: 1,
 }
 let config = {}
@@ -19,6 +21,12 @@ const mutations = {
   SET_ADVENT_LEASES: (state, adventLeases) => {
     state.adventLeases = adventLeases
   },
+  SET_SAFETY_PLAN: (state, safetyPlan) => {
+    state.safetyPlan = safetyPlan
+  },
+  SET_ADVENT_SAFETY_PLAN: (state, adventSafetyPlan) => {
+    state.adventSafetyPlan = adventSafetyPlan
+  },
   SET_TYPE: (state, type) => {
     state.type = type
   },
@@ -130,6 +138,73 @@ const actions = {
         reject(err)
       })
     })
+  },
+  getSafetyPlan({ commit, state }) {
+    return new Promise((resolve, reject) => {
+      index({
+        table_name: "asset_safety_plans",
+        page: 1,
+        page_size: 999,
+        filter: [
+          {
+            key: "jihuajieshushijian",
+            op: "range",
+            value: `${$moment().format("YYYY-MM-DD")},2999-12-31`
+          },
+          {
+            key: "jihuakaishishijian",
+            op: "range",
+            value: `${$moment(0).format("YYYY-MM-DD")},${$moment().format("YYYY-MM-DD")}`
+          }
+        ]
+      }).then(res => {
+        commit("SET_SAFETY_PLAN", res.data)
+        resolve(res)
+      }).catch(err => {
+        reject(err)
+      })
+    })
+  },
+  async getAdventSafetyPlan({ commit, state }) {
+    if (!config.time || !config.unit) {
+      const res = await index({
+        table_name: 'warnings',
+        filter: [
+          {
+            key: 'flag',
+            op: 'eq',
+            value: 'contract'
+          }
+        ]
+      },false)
+      config.time = Number(res.data[0]?.time);
+      config.unit = res.data[0]?.unit;
+    }
+    return new Promise((resolve, reject) => {
+      let preDate = $moment().add(config.time, config.unit).format("YYYY-MM-DD")
+      index({
+        table_name: "asset_safety_plans",
+        page: 1,
+        page_size: 999,
+        filter: [
+          {
+            key: "jihuajieshushijian",
+            op: "range",
+            value: `${$moment().format("YYYY-MM-DD")},${preDate}`
+          },
+          {
+            key: "jihuakaishishijian",
+            op: "range",
+            value: ``
+          }
+        ]
+      }).then(res => {
+        commit("SET_ADVENT_SAFETY_PLAN", res.data)
+        resolve(res)
+      }).catch(err => {
+        reject(err)
+      })
+    })
   }
 }
 
diff --git a/src/views/dataShow/index.vue b/src/views/dataShow/index.vue
index feddf5a..d69a55a 100644
--- a/src/views/dataShow/index.vue
+++ b/src/views/dataShow/index.vue
@@ -7,13 +7,13 @@
 
         <HeaderComponent></HeaderComponent>
 
-        <div class="body d-flex">
+        <div class="body d-flex flex-1">
           <btns></btns>
           <div class="left d-flex flex-column">
-            <dv-border-box-12 style="padding: 14px;">
+            <dv-border-box-12 style="padding: 14px;" class="flex-1">
               <MapComponent v-show="$store.state.bigdata.type === 1"></MapComponent>
-              <Map1Component v-show="$store.state.bigdata.type === 2 || $store.state.bigdata.type === 3"></Map1Component>
-
+              <Map1Component v-show="$store.state.bigdata.type === 2"></Map1Component>
+              <Map2Component v-show="$store.state.bigdata.type === 3"></Map2Component>
             </dv-border-box-12>
             <leftBottom class="mt-2"></leftBottom>
           </div>
@@ -32,6 +32,7 @@
 import drawMixin from "@/mixin/drawMixin";
 import MapComponent from "./map.vue";
 import Map1Component from "./map1.vue";
+import Map2Component from "./map2.vue";
 import HeaderComponent from "./header.vue";
 import right1 from "./right1.vue";
 import right2 from "./right2.vue";
@@ -44,6 +45,7 @@ export default {
   components: {
     MapComponent,
     Map1Component,
+    Map2Component,
     HeaderComponent,
     right1,
     right2,
@@ -65,20 +67,27 @@ export default {
       getAssets: "getAssets",
       getAdventLeases: "getAdventLeases",
       getSafety: "getSafety",
+      getSafetyPlan: "getSafetyPlan",
+      getAdventSafetyPlan: "getAdventSafetyPlan"
     })
   },
   computed: {
+    type () {
+      return this.$store.state.bigdata.type;
+    }
   },
   mounted() {
     setTimeout(() => {
       this.loading = false;
-    },500)
+    },1000)
   },
   created() {
     this.getAssets()
     this.getLeases()
     this.getAdventLeases()
     this.getSafety()
+    this.getSafetyPlan()
+    this.getAdventSafetyPlan()
   }
 }
 </script>
diff --git a/src/views/dataShow/map.vue b/src/views/dataShow/map.vue
index 6a9e06e..530a597 100644
--- a/src/views/dataShow/map.vue
+++ b/src/views/dataShow/map.vue
@@ -206,5 +206,6 @@ export default {
 #map {
   width: 100%;
   height: 100%;
+  background: linear-gradient(to bottom, #00000022 , #61b9ac66);
 }
 </style>
diff --git a/src/views/dataShow/map1.vue b/src/views/dataShow/map1.vue
index 0a9824b..ea55757 100644
--- a/src/views/dataShow/map1.vue
+++ b/src/views/dataShow/map1.vue
@@ -1,5 +1,33 @@
 <template>
-  <div id="map1">
+  <div class="map-container">
+    <div id="map1">
+    </div>
+
+    <div class="info-window" ref="leaseInfoWindow" v-show="isShowWindow">
+      <el-descriptions border :column="2">
+        <el-descriptions-item label="地块名称">
+          {{ row.dikuaimingcheng }}
+        </el-descriptions-item>
+        <el-descriptions-item label="出租房">
+          {{ row.chuzufang }}
+        </el-descriptions-item>
+        <el-descriptions-item label="承租方">
+          {{ row.chengzufang }}
+        </el-descriptions-item>
+        <el-descriptions-item label="租赁开始期限">
+          {{ row.zulinkaishiqixian }}
+        </el-descriptions-item>
+        <el-descriptions-item label="租赁结束期限">
+          {{ row.zulinjieshuqixian }}
+        </el-descriptions-item>
+        <el-descriptions-item label="年租赁价">
+          {{ row.nianzujindanjia }}
+        </el-descriptions-item>
+        <el-descriptions-item label="实收租金">
+          {{ row.shishouzujin }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </div>
   </div>
 </template>
 
@@ -7,8 +35,10 @@
 export default {
   data() {
     return {
+      isShowWindow: false,
       markerList: [],
-      cluster: ""
+      cluster: "",
+      row: {}
     }
   },
   computed: {
@@ -18,18 +48,18 @@ export default {
   },
   methods: {
     pickRow({ row }) {
-      //this.isShowInfoWindow = true;
-      //this.openData = row;
+      this.row = row;
+      this.isShowWindow = true;
       let location = row.land_id_lands_id_relation ? row.land_id_lands_id_relation.zichanweizhi : row.house_id_houses_id_relation.zichanweizhi;
       if (location) {
         let lat, lng;
         [lng, lat] = location.split(",");
         this.map.panTo([lng, lat]);
         this.map.setZoom(30);
-       // this.infoWindow.open(this.map, [lng, lat]);
+       this.infoWindow.open(this.map, [lng, lat]);
       } else {
         this.map.panTo(this.center);
-        //this.infoWindow.open(this.map, this.center);
+        this.infoWindow.open(this.map, this.center);
       }
     },
     init(adcode = ["320200"]) {
@@ -42,6 +72,14 @@ export default {
         zoom: 20,
         mapStyle: "amap://styles/blue"
       });
+      this.infoWindow = new AMap.InfoWindow({
+        isCustom: true,
+        autoMove: true,
+        avoid: [20, 20, 20, 20],
+        content: this.$refs["leaseInfoWindow"],
+        closeWhenClickMap: true,
+        offset: new AMap.Pixel(-10, -10),
+      });
       this.map.on('click',e => {
         console.log(e)
       })
@@ -145,6 +183,10 @@ export default {
 </script>
 
 <style scoped lang="scss">
+.map-container {
+  height: 100%;
+  width: 100%;
+}
 #map1 {
   width: 100%;
   height: 100%;
@@ -167,3 +209,22 @@ export default {
   }
 }
 </style>
+<style>
+.info-window {
+  filter: drop-shadow(2px 2px 5px #00000055);
+  border-radius: 0 4px 4px 4px;
+  background: #fff;
+
+  padding: 2px;
+  animation: fade-in 0.4s forwards;
+  position: relative;
+}
+@keyframes fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+</style>
diff --git a/src/views/dataShow/map2.vue b/src/views/dataShow/map2.vue
new file mode 100644
index 0000000..5fbc184
--- /dev/null
+++ b/src/views/dataShow/map2.vue
@@ -0,0 +1,202 @@
+<template>
+  <div class="map-container">
+    <div id="map2">
+    </div>
+
+    <div class="info-window" ref="safetyInfoWindow" v-show="isShowWindow">
+      <el-descriptions border :column="2">
+        <el-descriptions-item label="资产名称">
+          {{ row.zichanmingcheng }}
+        </el-descriptions-item>
+        <el-descriptions-item label="检查记录">
+          {{ row.jianchajilu }}
+        </el-descriptions-item>
+        <el-descriptions-item label="资产名称">
+          {{ (row.land_id_lands_id_relation && row.house_id_houses_id_relation) ? (row.land_id ? row.land_id_lands_id_relation.name : row.house_id_houses_id_relation.name) : "" }}
+        </el-descriptions-item>
+        <el-descriptions-item label="资产类型">
+          {{ row.zichanleixing }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isShowWindow: false,
+      row: {},
+      markerList: [],
+      cluster: ""
+    }
+  },
+  computed: {
+    leases () {
+      return this.$store.state.bigdata.safety;
+    }
+  },
+  methods: {
+    pickRow({ row }) {
+      this.isShowWindow = true;
+      this.row = row;
+      let location = row.land_id_lands_id_relation ? row.land_id_lands_id_relation.zichanweizhi : row.house_id_houses_id_relation.zichanweizhi;
+      if (location) {
+        let lat, lng;
+        [lng, lat] = location.split(",");
+        this.map.panTo([lng, lat]);
+        this.map.setZoom(30);
+        this.infoWindow.open(this.map, [lng, lat]);
+      } else {
+        this.map.panTo(this.center);
+        this.infoWindow.open(this.map, this.center);
+      }
+    },
+    init(adcode = ["320200"]) {
+
+      this.map = new AMap.Map("map2", {
+        pitch: 50,
+        viewMode: "3D",
+        center: [120.283692, 31.614211],
+        rotation: -12, //初始地图顺时针旋转的角度
+        zoom: 20,
+        mapStyle: "amap://styles/blue"
+      });
+      this.infoWindow = new AMap.InfoWindow({
+        isCustom: true,
+        autoMove: true,
+        avoid: [20, 20, 20, 20],
+        content: this.$refs["safetyInfoWindow"],
+        closeWhenClickMap: true,
+        offset: new AMap.Pixel(-10, -10),
+      });
+      this.map.on('click',e => {
+        console.log(e)
+      })
+    },
+    setMapMarker() {
+      this.map.remove(this.markerList);
+      this.markerList = [];
+
+      this.leases.forEach((item) => {
+        let location = item.land_id_lands_id_relation ? item.land_id_lands_id_relation.zichanweizhi : item.house_id_houses_id_relation.zichanweizhi;
+        if (location) {
+          let lat, lng;
+          [lng, lat] = location.split(",");
+          let marker = new AMap.Marker({
+            icon: "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png",
+            position: [Number(lng), Number(lat)],
+            offset: new AMap.Pixel(-13, -30),
+          });
+          let markerContent = document.createElement("div");
+          markerContent.setAttribute("class", "map-marker");
+          markerContent.onclick = () => {
+            this.pickRow({ row: item });
+          };
+          let markerImg = document.createElement("img");
+          markerImg.src = "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png";
+          let markerSpan = document.createElement("span");
+          markerSpan.setAttribute("class", "map-marker__text");
+          markerSpan.innerText =
+            item.zichanmingcheng?.length > 4
+              ? item.zichanmingcheng.slice(0, 2) +
+              ".." +
+              item.zichanmingcheng.slice(item.zichanmingcheng.length - 2)
+              : item.zichanmingcheng;
+          markerContent.appendChild(markerImg);
+          markerContent.appendChild(markerSpan);
+          marker.setContent(markerContent);
+          this.markerList.push(marker);
+        }
+      });
+      this.map.add(this.markerList);
+
+      this.addCluster();
+    },
+    addCluster() {
+      if (this.cluster) {
+        this.cluster.setMap(null);
+      }
+      this.cluster = new AMap.MarkerClusterer(this.map, this.markerList, {
+        gridSize: 50, // 设置网格像素大小
+        //renderClusterMarker: this.renderClusterMarker, // 自定义聚合点样式
+        //renderMarker: this.renderMarker, // 自定义非聚合点样式
+      });
+    },
+    renderMarker(context) {
+      let content =
+        '<div style="background-color: hsla(180, 100%, 50%, 0.3); height: 18px; width: 18px; border: 1px solid hsl(180, 100%, 40%); border-radius: 12px; box-shadow: hsl(180, 100%, 50%) 0px 0px 3px;"></div>';
+      let offset = new AMap.Pixel(-9, -9);
+      context.marker.setContent(content);
+      context.marker.setOffset(offset);
+    },
+    renderClusterMarker(context) {
+      let factor = Math.pow(context.count / this.list.length, 1 / 18);
+      let div = document.createElement("div");
+      let Hue = 180 - factor * 180;
+      let bgColor = "hsla(" + Hue + ",100%,40%,0.7)";
+      let fontColor = "hsla(" + Hue + ",100%,90%,1)";
+      let borderColor = "hsla(" + Hue + ",100%,40%,1)";
+      let shadowColor = "hsla(" + Hue + ",100%,90%,1)";
+      div.style.backgroundColor = bgColor;
+      let size = Math.round(
+        30 + Math.pow(context.count / this.list.length, 1 / 5) * 20
+      );
+      div.style.width = div.style.height = size + "px";
+      div.style.border = "solid 1px " + borderColor;
+      div.style.borderRadius = size / 2 + "px";
+      div.style.boxShadow = "0 0 5px " + shadowColor;
+      div.innerHTML = context.count;
+      div.style.lineHeight = size + "px";
+      div.style.color = fontColor;
+      div.style.fontSize = "14px";
+      div.style.textAlign = "center";
+      context.marker.setOffset(new AMap.Pixel(-size / 2, -size / 2));
+      context.marker.setContent(div);
+    },
+  },
+  watch: {
+    leases () {
+      if (this.map) {
+        this.$nextTick(() => {
+          this.setMapMarker();
+        })
+      }
+    }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.init()
+    })
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.map-container {
+  height: 100%;
+  width: 100%;
+}
+#map2 {
+  width: 100%;
+  height: 100%;
+  padding: 20px;
+}
+</style>
+<style lang="scss">
+.map-marker {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  &__text {
+    background: #fff;
+    zoom: 0.75;
+    padding: 2px 6px;
+    border-radius: 4px;
+    white-space: nowrap;
+    filter: drop-shadow(2px 2px 5px #00000055);
+  }
+}
+</style>
diff --git a/src/views/dataShow/right1.vue b/src/views/dataShow/right1.vue
index fabd431..9afa0d3 100644
--- a/src/views/dataShow/right1.vue
+++ b/src/views/dataShow/right1.vue
@@ -5,10 +5,11 @@
          <span>
           <SvgIcon icon-class="tudi" class="text-icon"></SvgIcon>
         </span>
-        <span class="fs-xl text">{{ type === 1 ? '土地资产' : '合约中' }}</span>
+        <span class="fs-xl text">{{ title }}</span>
       </div>
 
-      <dv-scroll-ranking-board class="dv-scr-rank-board mt-1" :config="ranking" />
+      <dv-scroll-board v-show="type === 3" :config="config" class="dv-scr-board mt-1" />
+      <dv-scroll-ranking-board v-show="type !== 3" class="dv-scr-rank-board mt-1" :config="ranking" />
     </div>
   </div>
 </template>
@@ -25,6 +26,24 @@ export default {
   },
   methods: {},
   computed: {
+    config () {
+      return {
+        header: ['年度', '月度', '计划名称'],
+        data: this.$store.state.bigdata.safetyPlan.map(i => [i.niandu, i.yuedu, i.jihuamingcheng])
+      }
+    },
+    title () {
+      switch (this.type) {
+        case 1:
+          return '土地资产'
+        case 2:
+          return '合约中'
+        case 3:
+          return '安全检查计划'
+        default:
+          return '土地资产'
+      }
+    },
     type () {
       return this.$store.state.bigdata.type
     },
@@ -71,6 +90,11 @@ export default {
 .ranking {
   padding: 20px 10px;
   width: 100%;
+  .dv-scr-board {
+    width: 346px;
+    height: 180px;
+    padding: 10px;
+  }
   .dv-scr-rank-board {
     height: 180px;
     padding: 10px 20px;
diff --git a/src/views/dataShow/right2.vue b/src/views/dataShow/right2.vue
index d3f5317..e5898ea 100644
--- a/src/views/dataShow/right2.vue
+++ b/src/views/dataShow/right2.vue
@@ -8,7 +8,8 @@
         <span class="fs-xl text">{{ type === 1 ? '房屋资产' : '临期' }}</span>
       </div>
 
-      <dv-scroll-ranking-board class="dv-scr-rank-board mt-1" :config="ranking"/>
+      <dv-scroll-board v-show="type === 3" :config="config" class="dv-scr-board mt-1" />
+      <dv-scroll-ranking-board v-show="type !== 3" class="dv-scr-rank-board mt-1" :config="ranking"/>
     </div>
   </div>
 </template>
@@ -25,6 +26,12 @@ export default {
   },
   methods: {},
   computed: {
+    config () {
+      return {
+        header: ['年度', '月度', '计划名称'],
+        data: this.$store.state.bigdata.adventSafetyPlan.map(i => [i.niandu, i.yuedu, i.jihuamingcheng])
+      }
+    },
     type () {
       return this.$store.state.bigdata.type
     },
@@ -71,7 +78,11 @@ export default {
 .ranking {
   padding: 20px 10px;
   width: 100%;
-
+  .dv-scr-board {
+    width: 346px;
+    height: 180px;
+    padding: 10px;
+  }
   .dv-scr-rank-board {
     height: 180px;
     padding: 10px 20px;
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index d50357a..d922e18 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -1,251 +1,272 @@
-<template>
-  <div class="login-container">
-
-    <vue-particles color="#ffffff" :particleOpacity="0.7" :particlesNumber="80" shapeType="circle" :particleSize="4"
-      linesColor="#ffffff" :linesWidth="1" :lineLinked="true" :lineOpacity="0.4" :linesDistance="150" :moveSpeed="3"
-      :hoverEffect="true" hoverMode="grab" :clickEffect="true" clickMode="push"> </vue-particles>
-
-    <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on"
-      label-position="left">
-
-      <div class="title-container">
-        <h3 class="title">{{title}}</h3>
-      </div>
-
-      <el-form-item prop="username">
-        <span class="svg-container">
-          <svg-icon icon-class="user" />
-        </span>
-        <el-input ref="username" v-model="loginForm.username" placeholder="请输入登录名" name="username" type="text"
-          tabindex="1" auto-complete="on" />
-      </el-form-item>
-
-      <el-form-item prop="password">
-        <span class="svg-container">
-          <svg-icon icon-class="password" />
-        </span>
-        <el-input :key="passwordType" ref="password" v-model="loginForm.password" :type="passwordType"
-          placeholder="请输入密码" name="password" tabindex="2" auto-complete="on" @keyup.enter.native="handleLogin" />
-        <span class="show-pwd" @click="showPwd">
-          <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
-        </span>
-      </el-form-item>
-
-      <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;"
-        @click.native.prevent="handleLogin">登录</el-button>
-
-
-    </el-form>
-  </div>
-</template>
-
-<script>
-  import {
-    validUsername
-  } from '@/utils/validate'
-
-  const defaultSettings = require('../../../src/settings.js')
-  export default {
-    name: 'Login',
-    data() {
-      const validateUsername = (rule, value, callback) => {
-        if (!validUsername(value)) {
-          callback(new Error('请正确输入登录名'))
-        } else {
-          callback()
-        }
-      }
-      const validatePassword = (rule, value, callback) => {
-        if (value.length < 6) {
-          callback(new Error('密码输入错误'))
-        } else {
-          callback()
-        }
-      }
-      return {
-        title: "",
-        loginForm: {
-          username: '',
-          password: ''
-        },
-        loginRules: {
-          username: [{
-            required: true,
-            trigger: 'blur',
-            validator: validateUsername
-          }],
-          password: [{
-            required: true,
-            trigger: 'blur',
-            validator: validatePassword
-          }]
-        },
-        loading: false,
-        passwordType: 'password',
-        redirect: undefined
-      }
-    },
-    watch: {
-      $route: {
-        handler: function(route) {
-          this.redirect = route.query && route.query.redirect
-        },
-        immediate: true
-      }
-    },
-    created() {
-      this.title = defaultSettings.title;
-    },
-    methods: {
-      showPwd() {
-        if (this.passwordType === 'password') {
-          this.passwordType = ''
-        } else {
-          this.passwordType = 'password'
-        }
-        this.$nextTick(() => {
-          this.$refs.password.focus()
-        })
+<template>
+  <div class="login-container">
+
+    <vue-particles color="#ffffff" :particleOpacity="0.7" :particlesNumber="80" shapeType="circle" :particleSize="4"
+      linesColor="#ffffff" :linesWidth="1" :lineLinked="true" :lineOpacity="0.4" :linesDistance="150" :moveSpeed="3"
+      :hoverEffect="true" hoverMode="grab" :clickEffect="true" clickMode="push"> </vue-particles>
+
+    <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on"
+      label-position="left">
+
+      <div class="title-container">
+        <h3 class="title">{{title}}</h3>
+      </div>
+
+      <el-form-item prop="username">
+        <span class="svg-container">
+          <svg-icon icon-class="user" />
+        </span>
+        <el-input ref="username" v-model="loginForm.username" placeholder="请输入登录名" name="username" type="text"
+          tabindex="1" auto-complete="on" />
+      </el-form-item>
+
+      <el-form-item prop="password">
+        <span class="svg-container">
+          <svg-icon icon-class="password" />
+        </span>
+        <el-input :key="passwordType" ref="password" v-model="loginForm.password" :type="passwordType"
+          placeholder="请输入密码" name="password" tabindex="2" auto-complete="on" @keyup.enter.native="handleLogin" />
+        <span class="show-pwd" @click="showPwd">
+          <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
+        </span>
+      </el-form-item>
+
+      <el-form-item prop="verification">
+        <div style="display: flex;">
+          <span class="svg-container">
+          <svg-icon icon-class="message" />
+        </span>
+          <el-input ref="username" v-model="loginForm.verification" placeholder="请输入验证码" name="username" type="text"
+                    tabindex="1" auto-complete="on" />
+          <el-button type="primary" size="small" @click="sendSms">发送验证</el-button>
+        </div>
+      </el-form-item>
+
+      <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;"
+        @click.native.prevent="handleLogin">登录</el-button>
+
+
+    </el-form>
+  </div>
+</template>
+
+<script>
+  import {
+    validUsername
+  } from '@/utils/validate'
+
+  const defaultSettings = require('../../../src/settings.js')
+  export default {
+    name: 'Login',
+    data() {
+      const validateUsername = (rule, value, callback) => {
+        if (!validUsername(value)) {
+          callback(new Error('请正确输入登录名'))
+        } else {
+          callback()
+        }
+      }
+      const validatePassword = (rule, value, callback) => {
+        if (value.length < 6) {
+          callback(new Error('密码输入错误'))
+        } else {
+          callback()
+        }
+      }
+      return {
+        title: "",
+        loginForm: {
+          username: '',
+          password: '',
+          verification: ''
+        },
+        loginRules: {
+          username: [{
+            required: true,
+            trigger: 'blur',
+            validator: validateUsername
+          }],
+          password: [{
+            required: true,
+            trigger: 'blur',
+            validator: validatePassword
+          }],
+          // verification: [{
+          //   required: true,
+          //   trigger: 'blur',
+          //   message: '请输入验证码'
+          // }]
+        },
+        loading: false,
+        passwordType: 'password',
+        redirect: undefined
+      }
+    },
+    watch: {
+      $route: {
+        handler: function(route) {
+          this.redirect = route.query && route.query.redirect
+        },
+        immediate: true
+      }
+    },
+    created() {
+      this.title = defaultSettings.title;
+    },
+    methods: {
+      sendSms () {
+
       },
-      //处理登录
-      handleLogin() {
-        this.$refs.loginForm.validate(valid => {
-          if (valid) {
-            this.loading = true
-            this.$store.dispatch('user/login', this.loginForm).then(() => {
-
-              this.$router.push({
-                path: this.redirect || '/'
-              })
-              this.loading = false
-            }).catch(() => {
-              this.loading = false
-            })
-          } else {
-            console.log('error submit!!')
-            return false
-          }
-        })
-      }
-    }
-  }
-</script>
-
-<style lang="scss">
-  #particles-js {
-    width: 100%;
-    height: 99%;
-    position: absolute;
-  }
-
-  /* 修复input 背景不协调 和光标变色 */
-  /* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
-
-  $bg:#122583;
-  $light_gray:#122583;
-  $cursor: #122583;
-
-  @supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
-    .login-container .el-input input {
-      color: $cursor;
-    }
-  }
-
-  /* reset element-ui css */
-  .login-container {
-    .el-input {
-      display: inline-block;
-      height: 47px;
-      width: 85%;
-
-      input {
-        background: transparent;
-        border: 0px;
-        -webkit-appearance: none;
-        border-radius: 0px;
-        padding: 12px 5px 12px 15px;
-        color: $light_gray;
-        height: 47px;
-        caret-color: $cursor;
-
-        &:-webkit-autofill {
-          //box-shadow: 0 0 0px 1000px $bg inset !important;
-          //-webkit-text-fill-color: $cursor !important;
-        }
-      }
-    }
-
-    .el-form-item {
-      border: 1px solid rgba(255, 255, 255, 0.1);
-      background: rgba(0, 0, 0, 0.1);
-      border-radius: 5px;
-      color: #454545;
-    }
-  }
-</style>
-
-<style lang="scss" scoped>
-  $bg:#122583;
-  $dark_gray:#122583;
-  $light_gray:#122583;
-
-  .login-container {
-    min-height: 100%;
-    width: 100%;
-    //background-color: $bg;
-    background: url("../../assets/bg.jpg") no-repeat;
-    overflow: hidden;
-
-    .login-form {
-      position: relative;
-      width: 520px;
-      max-width: 100%;
-      padding: 20px 35px 0;
-      margin: 160px auto;
-      overflow: hidden;
-      background-color: #fff;
-    }
-
-    .tips {
-      font-size: 14px;
-      color: #fff;
-      margin-bottom: 10px;
-
-      span {
-        &:first-of-type {
-          margin-right: 16px;
-        }
-      }
-    }
-
-    .svg-container {
-      padding: 6px 5px 6px 15px;
-      color: $dark_gray;
-      vertical-align: middle;
-      width: 30px;
-      display: inline-block;
-    }
-
-    .title-container {
-      position: relative;
-
-      .title {
-        font-size: 26px;
-        color: $light_gray;
-        margin: 0px auto 40px auto;
-        text-align: center;
-        font-weight: bold;
-      }
-    }
-
-    .show-pwd {
-      position: absolute;
-      right: 10px;
-      top: 7px;
-      font-size: 16px;
-      color: $dark_gray;
-      cursor: pointer;
-      user-select: none;
-    }
-  }
+
+      showPwd() {
+        if (this.passwordType === 'password') {
+          this.passwordType = ''
+        } else {
+          this.passwordType = 'password'
+        }
+        this.$nextTick(() => {
+          this.$refs.password.focus()
+        })
+      },
+      //处理登录
+      handleLogin() {
+        this.$refs.loginForm.validate(valid => {
+          if (valid) {
+            this.loading = true
+            this.$store.dispatch('user/login', this.loginForm).then(() => {
+
+              this.$router.push({
+                path: this.redirect || '/'
+              })
+              this.loading = false
+            }).catch(() => {
+              this.loading = false
+            })
+          } else {
+            console.log('error submit!!')
+            return false
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss">
+  #particles-js {
+    width: 100%;
+    height: 99%;
+    position: absolute;
+  }
+
+  /* 修复input 背景不协调 和光标变色 */
+  /* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
+
+  $bg:#122583;
+  $light_gray:#122583;
+  $cursor: #122583;
+
+  @supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
+    .login-container .el-input input {
+      color: $cursor;
+    }
+  }
+
+  /* reset element-ui css */
+  .login-container {
+    .el-input {
+      display: inline-block;
+      height: 47px;
+      width: 85%;
+
+      input {
+        background: transparent;
+        border: 0px;
+        -webkit-appearance: none;
+        border-radius: 0px;
+        padding: 12px 5px 12px 15px;
+        color: $light_gray;
+        height: 47px;
+        caret-color: $cursor;
+
+        &:-webkit-autofill {
+          //box-shadow: 0 0 0px 1000px $bg inset !important;
+          //-webkit-text-fill-color: $cursor !important;
+        }
+      }
+    }
+
+    .el-form-item {
+      border: 1px solid rgba(255, 255, 255, 0.1);
+      background: rgba(0, 0, 0, 0.1);
+      border-radius: 5px;
+      color: #454545;
+    }
+  }
+</style>
+
+<style lang="scss" scoped>
+  $bg:#122583;
+  $dark_gray:#122583;
+  $light_gray:#122583;
+
+  .login-container {
+    min-height: 100%;
+    width: 100%;
+    //background-color: $bg;
+    background: url("../../assets/bg.jpg") no-repeat;
+    overflow: hidden;
+
+    .login-form {
+      position: relative;
+      width: 520px;
+      max-width: 100%;
+      padding: 20px 35px 0;
+      margin: 160px auto;
+      overflow: hidden;
+      background-color: #fff;
+    }
+
+    .tips {
+      font-size: 14px;
+      color: #fff;
+      margin-bottom: 10px;
+
+      span {
+        &:first-of-type {
+          margin-right: 16px;
+        }
+      }
+    }
+
+    .svg-container {
+      padding: 6px 5px 6px 15px;
+      color: $dark_gray;
+      vertical-align: middle;
+      width: 30px;
+      display: inline-block;
+    }
+
+    .title-container {
+      position: relative;
+
+      .title {
+        font-size: 26px;
+        color: $light_gray;
+        margin: 0px auto 40px auto;
+        text-align: center;
+        font-weight: bold;
+      }
+    }
+
+    .show-pwd {
+      position: absolute;
+      right: 10px;
+      top: 7px;
+      font-size: 16px;
+      color: $dark_gray;
+      cursor: pointer;
+      user-select: none;
+    }
+  }
 </style>
diff --git a/src/views/system/user.vue b/src/views/system/user.vue
index dd59bdf..0ac1804 100644
--- a/src/views/system/user.vue
+++ b/src/views/system/user.vue
@@ -61,6 +61,9 @@
           <el-form-item label="密码" prop="password">
             <el-input v-model="form.password" type="password" autocomplete="off"></el-input>
           </el-form-item>
+          <el-form-item label="手机号" prop="mobile">
+            <el-input v-model="form.mobile" autocomplete="off"></el-input>
+          </el-form-item>
           <el-form-item label="部门" prop="department_id">
             <el-select v-model="form.department_id">
               <el-option v-for="item in departmentList" :key="item.id" :label="item.name" :value="item.id"></el-option>
@@ -116,6 +119,7 @@
           username: "",
           password: "",
           department_id: "",
+          mobile: ""
         },
         rules: {
           name: [{
@@ -134,6 +138,15 @@
             required: true,
             message: '请输入密码',
             trigger: 'blur',
+          }],
+          mobile: [{
+            required: true,
+            message: '请输入手机号',
+            trigger: 'blur',
+          },{
+            pattern: /^1[3456789]\d{9}$/,
+            message: "手机号格式不正确",
+            trigger: "blur",
           }]
         },
         tableHeight: 0,