nsgk_mobile/src/views/yinnong/mailList.vue

<template>
  <div class="app-container">
    <van-nav-bar
      title="通讯录"
      left-arrow
      @click-left="$router.back(-1)"
    />
    <van-row style="margin-top: 20px">
      <van-col span="16" :offset="2">
        <h3>张村村民联系方式</h3>
      </van-col>
    </van-row>
    <van-cell-group style="width: 96%;margin:2%;border-radius: 6px;overflow: hidden;padding-top: 10px;padding-bottom: 10px;box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);">
      <van-cell v-for="(item,index) in list" :key="index">
        <template #icon>
          <p style="color: #fff;line-height:14px;background: #1D6FE9;padding:8px 3px;height: 30px;border-radius: 8px;display: inline-block">{{item.name.substring(item.name.length-2)}}</p>
        </template>
        <template #title>
          <van-row>
            <van-col span="5" :offset="1">
              <h3 style="line-height: 30px">{{item.name}}</h3>
            </van-col>
            <van-col span="5" :offset="1">
              <h3 style="line-height: 30px;color: #878787">{{item.phone}}</h3>
            </van-col>
            <van-col span="2" :offset="10" >
              <a :href="'tel:' + item.phone">
                <van-image
                  height="30"
                  width="20"
                  src="../../../static/images/onlineHome/phone.png" />
              </a>
            </van-col>
          </van-row>
        </template>
      </van-cell>
    </van-cell-group>
  </div>
</template>

<script>
  import onlineHomeIndex from "../onlineHomeIndex";
  import {getInfo} from "../../api/login";
  import {ListPhones} from "../../api/addressBook/phoneList";

  export default {
    components: {
      onlineHomeIndex
    },
    name: "mailList",
    data() {
      return {
        activeName: 'a',
        list: [

          ],
        loading: false,
        finished: false,
        result:[],
      };
    },
    created() {
      if(this.list.length==0){
        this.getList();
      }
    },
    methods: {
      callPhone (phoneNumber) {
        window.location.href = 'tel://' + phoneNumber
      },
      getList(){
        this.loading = true;
        ListPhones(this.queryParams).then(response => {
          this.list = response.rows
          this.loading = false;
        });
      },
    },
  }
</script>

<style scoped>
</style>