经销商拜访

src/api/info.js

@@ -0,0 +1,10 @@
+import request from '@/utils/request';
+
+// 我的经销商拜访历史。 分页查询
+export function myChainsVisits(query) {
+  return request({
+    url: '/mobile/chainsGroup/myChainsVisits',
+    method: 'get',
+    params: query,
+  });
+}

src/components/tabBar.vue

@@ -0,0 +1,68 @@
+<template>
+  <div class="tabBar">
+    <van-tabbar
+      v-model="ActiveMessage"
+      @change="tabBarChange"
+      active-color="#0057ba"
+      inactive-color="#222">
+      <van-tabbar-item name="home">
+        <span>经销商</span>
+        <template #icon>
+          <van-icon :name="tabBarActive == 'home' ? activedChain : chains" />
+        </template>
+      </van-tabbar-item>
+      <van-tabbar-item name="info">
+        <span>我的</span>
+        <template #icon>
+          <van-icon :name="tabBarActive == 'info' ? activedInfo : info" />
+        </template>
+      </van-tabbar-item>
+    </van-tabbar>
+  </div>
+</template>
+
+<script>
+import chains from '@/assets/icon/chain.svg';
+import activedChain from '@/assets/icon/activedChain.svg';
+import info from '@/assets/icon/info.svg';
+import activedInfo from '@/assets/icon/activedInfo.svg';
+export default {
+  name: 'tabBar',
+  props: {
+    tabBarActive: {
+      type: String,
+      default: 'home',
+    },
+  },
+  data() {
+    return {
+      chains: chains,
+      activedChain: activedChain,
+      info: info,
+      activedInfo: activedInfo,
+      tabBarAct: this.tabBarActive,
+      show: false,
+    };
+  },
+  computed: {
+    ActiveMessage: {
+      get() {
+        return (this.tabBarAct = this.tabBarActive);
+      },
+      set(newValue) {
+        return newValue;
+      },
+    },
+  },
+  methods: {
+    tabBarChange(index) {
+      this.$router.push({ name: index + '' });
+    },
+  },
+};
+</script>
+<style lang="scss">
+.tabBar {
+  z-index: 9999;
+}
+</style>

src/router/index.js

@@ -82,6 +82,29 @@ const router = new VueRouter({
         },
       ],
     },
+    {
+      path: '/info',
+      component: layout,
+      redirect: '/info',
+      children: [
+        {
+          path: '/info',
+          name: 'info',
+          component: () => import('@/views/info/index.vue'),
+          meta: {
+            title: '我的',
+          },
+        },
+        {
+          path: '/infoHistorVisit',
+          name: 'infoHistorVisit',
+          component: () => import('@/views/info/infoHistorVisit.vue'),
+          meta: {
+            title: '历史拜访',
+          },
+        },
+      ],
+    },
     {
       path: '/err',
       name: 'err',

src/views/home/index.vue

@@ -251,21 +251,13 @@
       </div>
       <object style="flex: 1" :data="objectPath" type="text/html" width="100%"></object>
     </div>
+    <tab-bar></tab-bar>
   </div>
 </template>
 
 <script>
-import {
-  checkVisit,
-  addVisitsPosition,
-  mobileReposition,
-  getStoreTypeListlp,
-  getStoreLabels,
-  getCustomerList,
-  buryingPoint,
-} from '@/api/index';
-import { checkStoreAddressByStoreCode } from '@/api/visitstore';
-import { getPosition, getMapPoi, getkeywordPoi, getTicketFun } from '@/utils/TXApiFun';
+import { addVisitsPosition, mobileReposition, getStoreLabels, buryingPoint } from '@/api/index';
+import { getPosition, getTicketFun } from '@/utils/TXApiFun';
 import { mapState } from 'vuex';
 import store from '@/store';
 import { scrollTopMixins } from '@/mixin/scrollTop';
@@ -275,6 +267,7 @@ import {
   checkChainsAddressByChainCode,
   getMainchains,
 } from '@/api/home';
+import tabBar from '@/components/tabBar';
 export default {
   name: 'outsidelist',
   mixins: [scrollTopMixins],
@@ -283,6 +276,7 @@ export default {
       deviceOutsidePage: (state) => state.isRefreshPage.deviceOutsidePage,
     }),
   },
+  components: { tabBar },
   data() {
     return {
       otherShow: false,

src/views/info/index.vue

@@ -0,0 +1,144 @@
+<template>
+  <div class="userPage">
+    <div class="navBarTOP">
+      <van-nav-bar class="navBar" title="我的" />
+    </div>
+    <div class="content">
+      <div class="myHeader">
+        <van-row>
+          <van-col span="7">
+            <van-image round width="8rem" height="8rem" :src="avatar" @click="login" />
+          </van-col>
+          <van-col span="17">
+            <div class="avatarContent">
+              <p class="nickName">{{ nickName }}</p>
+              <p>
+                <span class="postName">{{ postName }}</span>
+              </p>
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+      <div class="container">
+        <van-cell-group inset class="mtb10">
+          <van-cell title="历史拜访" is-link to="/infoHistorVisit">
+            <template #icon>
+              <van-icon :name="history" class="zicon" />
+            </template>
+          </van-cell>
+        </van-cell-group>
+      </div>
+    </div>
+    <tab-bar tabBarActive="info"></tab-bar>
+  </div>
+</template>
+
+<script>
+import history from '@/assets/icon/history.png';
+import avatar from '@/assets/icon/avatar2.png';
+import tabBar from '@/components/tabBar';
+import { getReportInfo } from '@/api/index';
+export default {
+  name: 'info',
+  components: { tabBar },
+  data() {
+    return {
+      history: history,
+      avatar: avatar,
+      num: 0,
+      nickName: '',
+      postName: '',
+    };
+  },
+  created() {
+    this.postName = localStorage.getItem('postName');
+    this.nickName = localStorage.getItem('nickName');
+    this.getReportInfo();
+  },
+  methods: {
+    getReportInfo() {
+      let loading1 = this.$toast.loading({
+        duration: 0,
+        message: '加载中...',
+        forbidClick: true,
+      });
+      getReportInfo({ isContent: false }).then((res) => {
+        loading1.clear();
+      });
+    },
+    login() {
+      if (this.num > 5) {
+        this.$router.push('/login');
+      } else {
+        this.num = this.num + 1;
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.userPage {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  .content {
+    flex: 1;
+    margin-top: 46px;
+    overflow-y: auto;
+  }
+  .tabBar {
+    height: 50px;
+  }
+}
+.myHeader {
+  background-color: #1c84c6;
+  padding: 24px 30px;
+  background: url('../../assets/icon/bg.png');
+  background-size: cover;
+}
+.mtb10 {
+  margin: 10px 16px;
+}
+
+.container {
+  margin: 16px 0;
+}
+
+.zicon {
+  margin-top: 4px;
+  padding-right: 8px;
+}
+
+.avatarContent {
+  padding: 10px 0;
+}
+
+.avatarContent .nickName {
+  color: white;
+  font-size: 14px;
+  margin-top: 0;
+}
+
+.avatarContent .postName {
+  display: inline-block;
+  padding: 4px 6px;
+  background-color: white;
+  border-radius: 4px;
+  color: #1c84c6;
+  font-size: 12px;
+}
+
+.MYTile .van-tag--danger {
+  border-radius: 20px;
+  padding: 0 6px;
+}
+
+.MYTile .van-icon-arrow {
+  font-size: 16px;
+  line-height: 24px;
+  color: #969799;
+  margin-left: 6px;
+}
+</style>

src/views/info/infoHistorVisit.vue

@@ -0,0 +1,318 @@
+<template>
+  <div class="bgcolor infoHistorVisit">
+    <div class="header">
+      <van-nav-bar class="navBar" title="历史拜访" left-arrow @click-left="onClickLeft" />
+    </div>
+    <div class="container">
+      <van-list
+        class="myList1"
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="onLoad">
+        <div v-if="list.length > 0">
+          <div class="cellcontent" v-for="(item, index) in list" :key="index">
+            <van-cell>
+              <div class="card" style="position: relative" @click="detilsFn(item)">
+                <span v-if="item.visitSource == 2" class="stateAbnormal">异常拜访</span>
+                <span v-if="item.visitSource == 1" class="state">正常拜访</span>
+                <div class="title">
+                  <span>{{ item.chainName }}</span> (<span style="color: #0057ba">{{
+                    item.chainCode
+                  }}</span
+                  >)
+                </div>
+                <div class="info">经销商类型：{{ verifyChainType(item.typeCode2) }}</div>
+                <div class="info">拜访人：{{ item.nickName }}</div>
+                <div class="info">拜访时间：{{ item.visitsTime }}</div>
+              </div>
+              <!-- 分销店 -->
+              <template
+                v-if="
+                  item.sfaStoreType &&
+                  item.sfaStoreType.type == 'fxd' &&
+                  item.sfaStoreChainsContactList
+                ">
+                <div class="info">
+                  经销商：
+                  <div class="TCFXListItem" v-for="(item, index) in item.sfaStoreChainsContactList">
+                    <el-popover
+                      popper-class="zpover zpoverStoreztype"
+                      placement="bottom-start"
+                      trigger="click">
+                      <div>
+                        <div>{{ item.chainCode }}</div>
+                        <div>{{ item.chainName }}</div>
+                      </div>
+                      <div slot="reference" :key="index">
+                        {{ item.categoryDescribe }}
+                      </div>
+                    </el-popover>
+                  </div>
+                </div>
+              </template>
+              <template v-else>
+                <div class="info">经销商：{{ item.chainName }}</div>
+              </template>
+            </van-cell>
+            <div class="lineGrey"></div>
+          </div>
+        </div>
+      </van-list>
+    </div>
+  </div>
+</template>
+
+<script>
+import { myChainsVisits } from '@/api/info';
+
+export default {
+  name: 'infoHistorVisit',
+  data() {
+    return {
+      list: [],
+      loading: false,
+      finished: true,
+      pageNum: 1, // 当前页码  int类型
+      pageSize: 10, // 当前每页条数  int类型
+    };
+  },
+  created() {
+    this.pageNum = 1;
+    this.list = [];
+    this.powerGrade = localStorage.getItem('powerGrade');
+    this.getVisitsListFn();
+  },
+  methods: {
+    onLoad() {
+      this.getVisitsListFn();
+    },
+    detilsFn(val) {
+      this.$router.push({
+        path: '/visitHistoryDetail',
+        query: {
+          id: val.id,
+          typeCode2: val.typeCode2,
+          chainId: val.chainId,
+          customerManager: val.customerManager,
+          close: val.close,
+          freeze: val.freeze,
+          visitId: val.visitId,
+          chainName: val.chainName,
+          chainCode: val.chainCode,
+        },
+      });
+    },
+    onClickLeft() {
+      this.$router.go(-1);
+    },
+    getVisitsListFn() {
+      let loading1 = this.$toast.loading({
+        duration: 0,
+        message: '数据获取中...',
+        forbidClick: true,
+      });
+      if (this.refreshing) {
+        this.list = [];
+        this.refreshing = false;
+      }
+      myChainsVisits({
+        pageNum: this.pageNum,
+        pageSize: this.pageSize,
+      }).then((res) => {
+        loading1.clear();
+        if (res.code == 200) {
+          this.loading = false;
+          this.list = this.list.concat(res.rows);
+          if (this.list.length >= res.total) {
+            this.finished = true;
+          } else {
+            this.finished = false;
+          }
+          this.pageNum = this.pageNum + 1;
+        } else {
+          this.$toast.fail(res.msg);
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="scss">
+.searchDiv {
+  .van-search {
+    background: #fff;
+  }
+  .van-search__action {
+    font-size: 14px;
+    color: #1989fa;
+    font-weight: bold;
+    background: #f5f5f5;
+    border-bottom-right-radius: 60px;
+    border-top-right-radius: 60px;
+    border: 1px solid #ccc;
+    padding: 0 20px;
+  }
+
+  .van-search--show-action {
+    padding-right: 12px;
+  }
+
+  .van-search__content {
+    border: 1px solid #ccc;
+    border-bottom-left-radius: 60px;
+    border-top-left-radius: 60px;
+    background: #f5f5f5;
+    border-right: 0;
+  }
+}
+
+.myList1 {
+  .van-cell {
+    padding: 10px 16px;
+
+    &:after {
+      border-bottom: none;
+    }
+  }
+}
+.historAllVisit {
+  .TCFXListItem {
+    display: inline-block;
+    border: 1px solid #ccc;
+    padding: 3px 5px;
+    margin: 0 5px;
+    border-radius: 6px;
+  }
+}
+</style>
+<style lang="scss" scoped>
+.infoHistorVisit {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+.bgcolor {
+  background-color: #f5f5f5;
+}
+
+.container {
+  overflow-y: auto;
+  flex: 1;
+  padding-bottom: 10px;
+}
+
+.monthNow {
+  height: 34px;
+  line-height: 34px;
+  text-align: left;
+  font-weight: bold;
+  padding: 0 16px;
+  box-sizing: border-box;
+  background-color: #f1f1f1;
+  border-radius: 20px;
+  margin: 8px;
+  border: 1px solid #ccc;
+  position: relative;
+  color: #333;
+  font-size: 14px;
+  .van-cell__left-icon,
+  .van-cell__right-icon {
+    line-height: 34px;
+  }
+  .CalendarIcon {
+    float: right;
+    font-size: 24px;
+    color: #1989fa;
+    margin-top: 6px;
+    position: absolute;
+    right: 12px;
+    img {
+      height: 0.8em;
+    }
+  }
+}
+.serchInput {
+  padding: 0 4px;
+}
+.selectcell {
+  width: 92%;
+}
+.card {
+  box-sizing: border-box;
+
+  .title {
+    font-size: 16px;
+    font-weight: bold;
+    color: #333;
+    line-height: 30px;
+    width: 78%;
+  }
+
+  .info {
+    font-size: 14px;
+    color: #909090;
+    line-height: 26px;
+  }
+}
+
+/**/
+.searcTime {
+  background-color: white;
+}
+.btnbox {
+  padding: 0 16px;
+}
+.cellcontent .centerBtn {
+  margin: 0 auto 10px;
+  display: block;
+  width: 92%;
+  border-radius: 5px;
+}
+
+.statstext {
+  background-color: #1c84c6;
+  position: absolute;
+  right: 0;
+  top: 16px;
+  padding: 2px 6px 2px 12px;
+  border-bottom-left-radius: 60px;
+  border-top-left-radius: 60px;
+  color: #fff;
+}
+
+.stateAbnormal {
+  position: absolute;
+  right: 0;
+  top: 0;
+  color: #fff;
+  background-color: red;
+  border-radius: 5px;
+  display: inline-block;
+  padding: 0 5px;
+}
+
+.state {
+  position: absolute;
+  right: 0;
+  top: 0;
+  color: #fff;
+  background-color: #1c84c6;
+  border-radius: 5px;
+  display: inline-block;
+  padding: 0 5px;
+}
+
+.navBarTOP {
+  position: fixed;
+  width: 100%;
+  z-index: 2;
+  top: 0;
+}
+.cellcontent .textRight {
+  float: right;
+  color: #0057ba;
+}
+</style>