fix

src/project/xicheng/AppMerchanGird/AddMerchan.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="AddFamily">
+  <div class="AddMerchan">
     <div class="search">
       <div class="left">
         <AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="areaSelect" :name.sync="areaName" style="color: #666">
@@ -134,7 +134,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.AddFamily {
+.AddMerchan {
     .search{
     width: 100%;
     height: 112px;

src/project/xicheng/AppMerchanGird/AppMerchanGrid.vue

@@ -1,23 +1,46 @@
 <template>
   <div class="AppMerchanGrid">
     <template v-if="isGridMember">
-      <div class="pad-t32" v-if="component != 'Map'"/>
+      <div class="pad-t32" />
-      <div class="select-gird" v-if="component != 'Map'" flex>
+      <div class="select-gird" flex>
         <AiPagePicker type="gird" class="fill" @select="handleSelectGird">
           <div flex>
             <img src="./components/img/gird-icon.png" alt="" class="gird-icon">
-            <AiMore v-model="params.girdName" icon="arrow-down"/>
+            <AiMore v-model="userGird.girdName" icon="arrow-down"/>
           </div>
         </AiPagePicker>
-        <span @click="linkTo('./SetGird?id='+params.id)" v-if="isGridAdmin&&!!params.id">网格配置</span>
+        <span @click="linkTo('./SetGird?id='+userGird.id)" v-if="isGridAdmin&&!!userGird.id">网格配置</span>
       </div>
-      <component v-if="refresh" :is="component" @change="onChange" :params="params"/>
+      <div class="title">网格人员</div>
-      <!-- <div class="tabs" v-if="isTab">
+      <div class="user-content" v-for="(item, index) in dataInfo.parentGirdMembers" :key="item.id">
-        <div class="item" @click="tabClick(index, item.component)" v-for="(item, index) in tabs" :key="index">
+        <div>
-          <img :src="tabIndex == index ? item.activeImg : item.img" alt=""/>
+          <!-- <image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" /> -->
-          <p :class="{'color-3267F0':tabIndex == index}" v-text="item.text"/>
+          <img :src="item.photo" alt="" v-if="item.photo">
+          <img src="./components/img/big-user.png" alt="" v-else>
         </div>
-      </div> -->
+        <div class="right">
+          <div class="name">{{ item.name }}</div>
+          <div class="gird">{{ item.checkType == 2 ? '网格长' : '网格员' }}</div>
+          <p>{{ item.girdName }}</p>
+        </div>
+      </div>
+      <div class="user-content user-item" v-for="(item, index) in dataInfo.girdMembers" :key="item.id" @click="viewUser(item.wxUserId)">
+        <div>
+          <!-- <image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" /> -->
+          <img :src="item.photo" alt="" v-if="item.photo">
+          <img src="./components/img/big-user.png" alt="" v-else>
+        </div>
+        <div class="right">
+          <div class="name">{{ item.name }}
+            <span class="gird">{{ item.checkType == 2 ? '网格长' : '网格员' }}</span>
+            <span class="family-btn" @click.stop="linkTo(`./FamilyList?id=${item.id}&girdId=${userGird.id}`)" v-if="item.checkType == 1">责任家庭 ></span>
+          </div>
+          <p>{{ item.girdName }} </p>
+        </div>
+      </div>
+      <AiEmpty description="暂无数据" class="emptyWrap"
+              v-if="dataInfo.parentGirdMembers && !dataInfo.parentGirdMembers.length && !dataInfo.girdMembers.length"></AiEmpty>
+      <AiGap h="112"/>
     </template>
     <div v-if="!isGridMember" class="empty">
       <img src="./components/img/no-admin.png" alt="">
@@ -28,39 +51,12 @@
 </template>
 
 <script>
-import Organization from './Organization.vue'
 import {mapState} from 'vuex'
-
 export default {
-  name: 'AppMerchanGrid',
-  appName: '网格管理',
   data() {
     return {
-      component: 'Organization',
+      dataInfo: {},
-      params: {},
+      userGird: {}
-      refresh: true,
-      tabIndex: 0,
-      tabs: [
-        {
-          img: require('./components/img/statistics-icon.png'),
-          activeImg: require('./components/img/statistics-icon-active.png'),
-          text: '统计',
-          component: 'Statistics',
-        },
-        {
-          img: require('./components/img/org-icon.png'),
-          activeImg: require('./components/img/org-icon-active.png'),
-          text: '组织',
-          component: 'Organization',
-        },
-        {
-          img: require('./components/img/map-icon.png'),
-          activeImg: require('./components/img/map-icon-active.png'),
-          text: '地图',
-          component: 'Map'
-        }
-      ],
-      isTab: true,
     }
   },
   computed: {
@@ -72,58 +68,148 @@ export default {
       return this.user.girdCheckType == 2
     }
   },
-  components: {
+  onLoad() {
-    Organization,
+    this.handleSelectGird(this.user.gridInfo)
   },
-  methods: {
+  onShow() {
-    onChange(e) {
+    document.title = '网格管理'
-      this.params = e.params
+
-      this.component = e.type
   },
-    refreshHome() {
+  mounted() {
-      this.refresh = false
+    this.getGirdUserList()
-      this.$nextTick(() => {
+    uni.$on('goback', (res) => {
-        this.refresh = true
+      this.userGird = res
+      this.getGirdUserList()
     })
   },
-    tabClick(index, component) {
+  methods: {
-      this.tabIndex = index
+    handleSelectGird(v) {
-      this.component = component
+      this.userGird = v || {}
-      this.refreshHome();
+      this.getGirdUserList()
+    },
+    getGirdUserList() {
+      this.$http.post(`/app/appgirdmemberinfo/listGirdMemberByGirdId?girdId=${this.userGird.id}`).then((res) => {
+        if (res.code == 0) {
+          this.dataInfo = res.data
+        }
+      })
     },
     linkTo(url) {
       uni.navigateTo({url})
     },
-    handleSelectGird(v) {
+    viewUser(userid) {
-      this.params = v || {}
+      userid && this.injectJWeixin('openUserProfile').then(() => {
-      this.refreshHome()
+        this.wxInvoke(['openUserProfile', {type: 1, userid}, () => 0])
-    }
-  },
-  onLoad() {
-    this.handleSelectGird(this.user.gridInfo)
-    uni.$on('hideTab', () => {
-      this.isTab = false
-    })
-    uni.$on('showTab', () => {
-      this.isTab = true
       })
     },
-  onShow() {
-    document.title = '网格管理'
-  },
-  onReachBottom() {
-    if (!this.tabIndex) {
-      uni.$emit('nextList')
-    }
   },
 }
 </script>
 
 <style lang="scss" scoped>
 .AppMerchanGrid {
-  height: 100vh;
+  background-color: #f5f5f5;
+
+  .title {
+    font-size: 38px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #333;
+    line-height: 52px;
+    padding-left: 32px;
+    margin-bottom: 32px;
   }
 
+  .user-content {
+    width: calc(100% - 64px);
+    margin: 0 0 32px 32px;
+    background-color: #fff;
+    padding: 32px;
+    box-sizing: border-box;
+    display: flex;
+
+    img {
+      display: inline-block;
+      width: 200px;
+      height: 200px;
+      margin-right: 32px;
+    }
+
+    image {
+      width: 200px;
+      height: 200px;
+      margin-right: 32px;
+    }
+
+    .right {
+      width: 100%;
+
+      .name {
+        font-size: 32px;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #333;
+        line-height: 44px;
+        margin-bottom: 12px;
+      }
+
+      .gird {
+        display: inline-block;
+        line-height: 44px;
+        background: #E8EFFF;
+        border-radius: 8px;
+        padding: 0 8px;
+        font-size: 26px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        color: #26F;
+        margin-bottom: 12px;
+      }
+
+      p {
+        font-size: 26px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        color: #666;
+        line-height: 36px;
+      }
+    }
+  }
+
+  .user-item {
+    img {
+      width: 96px;
+      height: 96px;
+      border-radius: 50%;
+    }
+
+    image {
+      width: 96px;
+      height: 96px;
+      border-radius: 50%;
+    }
+
+    .gird {
+      display: inline-block;
+      margin-left: 16px;
+      margin-bottom: 0 !important;
+    }
+
+    .name {
+      margin-bottom: 8px !important;
+    }
+  }
+
+  .family-btn {
+    font-size: 26px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    color: #3975C6;
+    line-height: 36px;
+    float: right;
+  }
+
+  .pad-b112 {
+    padding-bottom: 112px;
+  }
+}
 .pad-t32 {
   padding-top: 32px;
 }

src/project/xicheng/AppMerchanGird/Organization.vue

@@ -1,181 +0,0 @@
-<template>
-  <div class="Organization">
-    <div class="title">网格人员</div>
-    <div class="user-content" v-for="(item, index) in dataInfo.parentGirdMembers" :key="item.id">
-      <div>
-        <!-- <image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" /> -->
-        <img :src="item.photo" alt="" v-if="item.photo">
-        <img src="./components/img/big-user.png" alt="" v-else>
-      </div>
-      <div class="right">
-        <div class="name">{{ item.name }}</div>
-        <div class="gird">{{ item.checkType == 2 ? '网格长' : '网格员' }}</div>
-        <p>{{ item.girdName }}</p>
-      </div>
-    </div>
-    <div class="user-content user-item" v-for="(item, index) in dataInfo.girdMembers" :key="item.id" @click="viewUser(item.wxUserId)">
-      <div>
-        <!-- <image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" /> -->
-        <img :src="item.photo" alt="" v-if="item.photo">
-        <img src="./components/img/big-user.png" alt="" v-else>
-      </div>
-      <div class="right">
-        <div class="name">{{ item.name }}
-          <span class="gird">{{ item.checkType == 2 ? '网格长' : '网格员' }}</span>
-          <span class="family-btn" @click.stop="linkTo(`./FamilyList?id=${item.id}&girdId=${userGird.id}`)" v-if="item.checkType == 1">责任家庭 ></span>
-        </div>
-        <p>{{ item.girdName }} </p>
-      </div>
-    </div>
-    <AiEmpty description="暂无数据" class="emptyWrap"
-             v-if="dataInfo.parentGirdMembers && !dataInfo.parentGirdMembers.length && !dataInfo.girdMembers.length"></AiEmpty>
-    <AiGap h="112"/>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      userGird: {},
-      dataInfo: {},
-    }
-  },
-  props: ['params'],
-  onShow() {
-    document.title = '网格管理'
-
-  },
-  mounted() {
-    this.userGird = this.params
-    this.getGirdUserList()
-    uni.$on('goback', (res) => {
-      this.userGird = res
-      this.getGirdUserList()
-    })
-  },
-  methods: {
-    getGirdUserList() {
-      this.$http.post(`/app/appgirdmemberinfo/listGirdMemberByGirdId?girdId=${this.userGird.id}`).then((res) => {
-        if (res.code == 0) {
-          this.dataInfo = res.data
-        }
-      })
-    },
-    linkTo(url) {
-      uni.navigateTo({url})
-    },
-    viewUser(userid) {
-      userid && this.injectJWeixin('openUserProfile').then(() => {
-        this.wxInvoke(['openUserProfile', {type: 1, userid}, () => 0])
-      })
-    },
-  },
-}
-</script>
-
-<style lang="scss" scoped>
-.Organization {
-  background-color: #f5f5f5;
-
-  .title {
-    font-size: 38px;
-    font-family: PingFangSC-Semibold, PingFang SC;
-    font-weight: 600;
-    color: #333;
-    line-height: 52px;
-    padding-left: 32px;
-    margin-bottom: 32px;
-  }
-
-  .user-content {
-    width: calc(100% - 64px);
-    margin: 0 0 32px 32px;
-    background-color: #fff;
-    padding: 32px;
-    box-sizing: border-box;
-    display: flex;
-
-    img {
-      display: inline-block;
-      width: 200px;
-      height: 200px;
-      margin-right: 32px;
-    }
-
-    image {
-      width: 200px;
-      height: 200px;
-      margin-right: 32px;
-    }
-
-    .right {
-      width: 100%;
-
-      .name {
-        font-size: 32px;
-        font-family: PingFangSC-Medium, PingFang SC;
-        font-weight: 500;
-        color: #333;
-        line-height: 44px;
-        margin-bottom: 12px;
-      }
-
-      .gird {
-        display: inline-block;
-        line-height: 44px;
-        background: #E8EFFF;
-        border-radius: 8px;
-        padding: 0 8px;
-        font-size: 26px;
-        font-family: PingFangSC-Regular, PingFang SC;
-        color: #26F;
-        margin-bottom: 12px;
-      }
-
-      p {
-        font-size: 26px;
-        font-family: PingFangSC-Regular, PingFang SC;
-        color: #666;
-        line-height: 36px;
-      }
-    }
-  }
-
-  .user-item {
-    img {
-      width: 96px;
-      height: 96px;
-      border-radius: 50%;
-    }
-
-    image {
-      width: 96px;
-      height: 96px;
-      border-radius: 50%;
-    }
-
-    .gird {
-      display: inline-block;
-      margin-left: 16px;
-      margin-bottom: 0 !important;
-    }
-
-    .name {
-      margin-bottom: 8px !important;
-    }
-  }
-
-  .family-btn {
-    font-size: 26px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    color: #3975C6;
-    line-height: 36px;
-    float: right;
-  }
-
-  .pad-b112 {
-    padding-bottom: 112px;
-  }
-}
-</style>

src/project/xicheng/AppMerchanGird/merchanList.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="FamilyList">
+  <div class="merchanList">
     <div class="title">
       <div>户主列表({{ total }})</div>
       <div v-if="list.length">
@@ -118,7 +118,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.FamilyList {
+.merchanList {
   min-height: 100vh;
   .title {
     display: flex;

src/project/xicheng/AppPageMerchant/AppPageMerchant.vue

@@ -1,58 +1,93 @@
 <template>
   <div class="AppPageMerchant">
-    <AiListPage :label="label" :appList="appList" :headerBg="headerBg" />
+    
+    <div class="list">
+      <div class="item" v-for="(item, index) in appList" :key="index" @click="linkTo(item.url)" :style="item.isBottom ? 'border-bottom: 1px solid #eee;' : ''">
+        <div class="icon" :style="`backgroundImage: url(${item.icon});`"></div>
+        <p>{{item.name}}</p>
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
 export default {
   name: 'AppPageMerchant',
-  appName: '西城-商户管理',
+  appName: '商户入口',
   data() {
     return {
       label: '西城-商户管理',
       appList: [
         {
           name: '商户档案',
-          icon: require('./img/police-logo.jpg'),
+          icon: require('./img/shanghudangan.png'),
           url: '../AppMerchantManage/AppMerchantManage',
           isBottom: true
         },
         {
           name: '网格管理',
-          icon: require('./img/jmqgl.png'),
+          icon: require('./img/wanggeguanli.png'),
           url: '../AppMerchanGird/AppMerchanGird',
           isBottom: true
         },
         {
           name: '商户地图',
-          icon: require('./img/police-logo.jpg'),
+          icon: require('./img/shanghuditu.png'),
           url: '../AppMerchantMap/AppMerchantMap',
           isBottom: true
         },
         {
           name: '网格统计',
-          icon: require('./img/police-logo.jpg'),
+          icon: require('./img/wanggetongji.png'),
           url: '../AppMerchanStatistics/AppMerchanStatistics'
         }
       ],
-      headerBg: require('./img/header-bg.png'),
     }
   },
   onShow() {
-    document.title = '西城-商户管理'
+    document.title = '商户入口'
   },
   methods: {
-
+    linkTo(url) {
+      console.log(url)
+      uni.navigateTo({url})
+    }
   },
 }
 </script>
 
 <style lang="scss" scoped>
-uni-page-body{
-  height: 100%;
-}
 .AppPageMerchant{
-  height: 100%;
+  padding: 20px;
+  .list{
+    background-color: #fff;
+    border-radius: 16px;
+    overflow: hidden;
+    .item{
+      text-align: center;
+      padding-bottom: 38px;
+      border-right: 1px solid #eee;
+      width: calc(33% - 1px);
+      float: left;
+      .icon{
+        display: inline-block;
+        width: 80px;
+        height: 80px;
+        margin: 40px 0 8px 0;
+        background-size: 100% 100%;
+        text-align: center;
+      }
+      p{
+        font-size: 28px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        font-weight: 400;
+        color: #3D434A;
+        line-height: 40px;
+      }
+    }
+    .item:nth-of-type(3n) {
+      border-right: 0;
+    }
+  }
 }
 </style>