重点位

src/pages/modules/home.vue

@@ -1,6 +1,6 @@
 <template>
   <el-row type="flex" class="navs_wraper" justify="center" align="middle">
-    <el-col :span="7" class="nav_item" v-for="(e, i) in visibleNav" :key="i" :class="'nav_item_' + (i + 1)">
+    <el-col :span="visibleNav.length === 4 ? 5 : 7" class="nav_item" v-for="(e, i) in visibleNav" :key="i" :class="'nav_item_' + (i + 1)">
       <div class="nav_item_i" @click="toPage(e)">
         <div class="nav_icon"></div>
         <p>{{ e[$langPre.computedProp('title')] }}</p>
@@ -24,7 +24,8 @@ export default {
       return [
         { title: '操作', zh_title: '操作', en_title: 'Operation', router: '/index/device', isVisible: true },
         { title: '建图', zh_title: '建图', en_title: 'Map building', router: '/index/building', isVisible: this.userRole === 1 },
-        { title: '地图', zh_title: '地图', en_title: 'Map', router: '/index/map', isVisible: true }
+        { title: '地图', zh_title: '地图', en_title: 'Map', router: '/index/map', isVisible: true },
+        { title: '重定位', zh_title: '重定位', en_title: 'Relocation', router: '/index/relocation', isVisible: true }
       ]
     },
     visibleNav () {
@@ -58,7 +59,7 @@ export default {
 @import '../../style/mixin'
 .navs_wraper
   width 100%
-  padding 0 12%
+  padding 0 2%
   flex-wrap wrap
   align-content center
 .nav_item

src/pages/modules/relocation.vue

@@ -0,0 +1,88 @@
+<template>
+  <div class="page_container">
+    <div class="t_box">
+      <el-row type="flex" class="r_box">
+        <el-col class="point_item" v-for="(e, i) in dataList" :key="'cdw' + i">
+          <div class="zbox point_item_i" @click="toConfirm(e)"><p>{{ e.station_name }}</p></div>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script>
+import { queryStation } from '../../config/mork.js'
+export default {
+  name: 'ModuleRelocation',
+  data () {
+    return {
+      dataList: []
+    }
+  },
+  mounted () {
+    this._queryStation()
+  },
+  methods: {
+    // 站点查询
+    async _queryStation () {
+      this.dataList = []
+      try {
+        let res = await queryStation()
+        if (res && res.data) {
+          this.dataList = [...res.data]
+        }
+      } catch (e) {
+        this.$message.error(e)
+      }
+    },
+    toConfirm (e) {
+      this.$confirm('是否确定点位重定位?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        console.log(e)
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消操作'
+        })
+      })
+    }
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+.t_box
+  height 100%
+  background-color rgba(0, 19, 48, 70%)
+  box-shadow inset 1px 1px 7px 2px #4d9bcd
+  padding .1rem
+  overflow hidden
+.r_box
+  height 100%
+  overflow-y auto
+  flex-wrap wrap
+  align-content flex-start
+.point_item
+  width 20%
+  height 0.6rem
+  padding 0.1rem
+  margin-bottom 0.02rem
+  background center / 100% 100% url(../../images/new/bg2.png) no-repeat
+  p
+    font-size .2rem
+    font-family 'SourceHanSansCN-Bold'
+    line-height .2rem
+    color #B4C1D8
+    text-align center
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3; /* 定义显示的行数 */
+    overflow: hidden;
+    text-overflow: ellipsis;
+.point_item_i
+  display flex
+  align-items center
+  justify-content center
+</style>

src/router/index.js

@@ -3,11 +3,12 @@ import VueRouter from 'vue-router'
 
 // const Login = r => require.ensure([], () => r(require('../pages/modules/login/login.vue')), 'login')
 const IndexComponent = r => require.ensure([], () => r(require('../pages/shells/index.vue')), 'index')
-const Home = r => require.ensure([], () => r(require('../pages/modules/home.vue')), 'modules')
-const Device = r => require.ensure([], () => r(require('../pages/modules/device.vue')), 'modules')
-const Warning = r => require.ensure([], () => r(require('../pages/modules/warning.vue')), 'modules')
-const Building = r => require.ensure([], () => r(require('../pages/modules/building.vue')), 'modules')
-const Map = r => require.ensure([], () => r(require('../pages/modules/map.vue')), 'modules')
+const Home = r => require.ensure([], () => r(require('../pages/modules/home.vue')), 'Home')
+const Device = r => require.ensure([], () => r(require('../pages/modules/device.vue')), 'Device')
+const Warning = r => require.ensure([], () => r(require('../pages/modules/warning.vue')), 'Warning')
+const Building = r => require.ensure([], () => r(require('../pages/modules/building.vue')), 'Building')
+const Map = r => require.ensure([], () => r(require('../pages/modules/map.vue')), 'Map')
+const Relocation = r => require.ensure([], () => r(require('../pages/modules/relocation.vue')), 'Relocation')
 Vue.use(VueRouter)
 
 const router = new VueRouter({
@@ -34,6 +35,9 @@ const router = new VueRouter({
       }, {
         path: 'map',
         component: Map
+      }, {
+        path: 'relocation',
+        component: Relocation
       }]
     }
   ]