storevisit-ui-mobile/src/views/storeManagement/storeAddress.vue

<template>
  <div class="bgcolor">
    <div class="navBarTOP" style="background-color: #fff">
      <van-nav-bar class="navBar" title="待规范门店地址" left-arrow @click-left="onClickLeft" />
    </div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
    <div class="lineGrey" style="height: 4px"></div>
    <div class="container">
      <van-list
        class="myList"
        v-model="loading"
        :finished="finished"
        finished-text="--已经到底了--"
        @load="onLoad">
        <div class="cellcontent srore" v-for="(item, index) in list" :key="index">
          <van-cell>
            <div class="card" @click="storeDetailFn(item)">
              <div
                class="title btn"
                style="padding-right: 74px"
                :data-clipboard-text="item.storeCode">
                <span>{{ item.storeName }}</span
                >(<span style="color: #0057ba">{{ item.storeCode }}</span
                >)
              </div>
              <van-button type="info" size="small" plain class="centerBtn ctns1"
                >更改地址<van-icon name="arrow"
              /></van-button>
              <div class="info">地址：{{ item.addressLine }}</div>
              <div class="info">创建时间：{{ item.createTime }}</div>
              <div class="info" style="color: #ff976a">不规范原因：{{ item.exceptionCause }}</div>
            </div>
          </van-cell>
          <div class="lineGrey"></div>
        </div>
        <van-empty v-if="list.length == 0" />
      </van-list>
      <br />
      <br />
      <br />
      <br />
    </div>
  </div>
</template>

<script>
import { getStoreTypeList, getStoreyslTypeList } from '@/api/index';
import ord from '@/assets/ord.png';
import paste from '@/assets/paste.png';
import mpimg from '@/assets/mpimg.png';
import order from '@/assets/order.png';
import axios from 'axios';
import order60 from '@/assets/order60.png';
import targetOne from '@/assets/targetOne.png';
import visitTimes from '@/assets/visitTimes.png';
import ordernum from '@/assets/ordernum.png';
import { getStoreAddress } from '@/api/visitstore';
export default {
  name: 'storeAddress',
  data() {
    return {
      disabled: false,
      list: [],
      ord: ord,
      addShow: false,
      ordernum: ordernum,
      mapShows: false,
      visitTimess: visitTimes,
      paste: paste,
      storeTypeList: [],
      loading: false,
      finished: false,
      mpimg: mpimg,
      order: order,
      order60: order60,
      targetOne: targetOne,
      pageSize: 12,
      pageNum: 1,
      cont: 0,
      tabVal: '1',
      showProvincePicker: false,
      showCityPicker: false,
      showDistrictPicker: false,
      provinceList: [],
      cityList: [],
      districtList: [],
      validFlag: '',
      addShow1: false,
      addBTN: '新建工地',
      title: '我的',
      fromValue: {
        storeName: '',
        provinceName: '全部省',
        districtName: '全部县区',
        cityName: '全部市',
        province: '',
        city: '',
        pageSize: 12,
        pageNum: 1,
        district: '',
        timeData: '',
      },
    };
  },
  activated() {
    this.$router.replace({ path: '/home' });
  },
  created() {
    // this.onLoad()
  },
  watch: {
    // $route(to, from) {
    //   if (from.path == "/home" || from.path == "/storeDetail"){
    //     this.onLoad()
    //   }
    // }
  },
  methods: {
    linkList(val) {
      this.$router.push({
        path: '/pItem',
        query: { id: val.storeCode, detilId: 'a' },
      });
    },
    onLoad() {
      this.getStoreAddress();
    },
    getStoreAddress() {
      if (this.refreshing) {
        this.list = [];
        this.refreshing = false;
      }
      let loading1 = this.$toast.loading({
        duration: 0,
        message: '加载中...',
        forbidClick: true,
      });
      getStoreAddress({}).then((res) => {
        loading1.clear();
        if (res.code == 200) {
          this.loading = false;
          this.list = res.data;
          this.finished = true;
        } else {
          this.$toast.fail(res.msg);
        }
      });
    },
    storeDetailFn(id) {
      this.$router.push({
        path: '/storeDetail',
        query: { id: id.storeId, type: 'address', storeAddressId: id.storeAddressId },
      });
    },
    onClickLeft() {
      // this.$router.go(-1)
      this.$router.push('/');
    },
  },
};
</script>
<style lang="scss">
.searchDiv {
  .van-search {
    background: #fff;
  }

  .van-search__action {
    font-size: 14px;
    color: #0057ba;
    font-weight: bold;
    background: #f1f1f1;
    border-bottom-right-radius: 60px;
    border-top-right-radius: 60px;
    border: 1px solid #c1c1c1;
    padding: 0 20px;
  }

  .van-search--show-action {
    padding-right: 12px;
  }

  .van-search__content {
    border: 1px solid #c1c1c1;
    border-bottom-left-radius: 60px;
    border-top-left-radius: 60px;
    background: #f1f1f1;
    border-right: 0;
  }
}

.myList {
  .van-cell {
    padding: 0;
    &:after {
      border-bottom: none;
    }
  }
}
.myTab {
  .van-tabs__nav--card {
    margin: 0 !important;
    border-left: 0;
    border-right: 0;
  }
  .van-tabs__wrap,
  .van-tabs__nav--card {
    height: 39px;
  }
  .van-tab {
    line-height: 40px;
  }
}
.van-tabs__nav--card .van-tab.van-tab--active {
  background-color: #0057ba !important;
}
</style>
<style lang="scss" scoped>
.container {
  padding-bottom: 50px;
}

.card {
  padding: 10px 16px;
  box-sizing: border-box;

  .title {
    font-size: 16px;
    font-weight: bold;
    color: #333;
    line-height: 30px;
  }

  .info {
    font-size: 14px;
    color: #909090;
    line-height: 26px;
  }
}
.cellcontent .van-cell__right-icon {
  height: 144px;
  line-height: 144px;
  margin-right: 10px;
}

.srore .van-cell {
  padding: 0;
}

.contentpd16 .van-cell {
  background-color: #ebf4ff;
  margin: 8px 0;
  border-radius: 5px;
  padding: 4px 16px;
}
.visitStoreIco {
  float: left;
  float: left;
  width: 26px;
  text-align: center;
  background-color: #ffba13;
  color: #fff;
  border-radius: 100%;
  margin-left: 14px;
  line-height: 26px;
  height: 26px;
}
.centerBtn {
  margin: 0 auto 10px;
  display: block;
  width: 92%;
  color: #0057ba;
  border-radius: 5px;
  padding: 0 6px;
  height: 28px;
}
.ctns1 {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 76px;
}
.positionContent {
  position: fixed;
  color: #666;
  display: inline-block;
  box-shadow: 0px 2px 7px -5px #000;
  border-radius: 100px;
  overflow: hidden;
  right: 14px;
  cursor: pointer;
  bottom: 60px;
  background-color: white;
}
.positionContent .img {
  border-radius: 100px;
  float: left;
}
.positionContent .img .van-icon__image {
  border-radius: 100px;
}
</style>