<template>
  <!-- 任务列表 -->
  <van-nav-bar left-arrow
    @click-left="router.back()">
  </van-nav-bar>
  <van-list v-model:loading="loading"
    :finished="finished"
    finished-text="没有更多结果了"
    class="result-list">
    <van-cell-group inset>
      <van-cell v-for="(item, index) in resultList"
        :key="index"
        class="result-item"
        @click="handleClickStore(item)">
        <template #title>
          <div class="item-title">{{ item.name }}（{{ item.code }}）</div>
        </template>
        <template #label>
          <div class="item-company">{{ item.company }}</div>
          <div class="item-address">{{ item.address }}</div>
        </template>
      </van-cell>
    </van-cell-group>
  </van-list>

</template>

<script setup>
const router = useRouter();
const resultList = ref([
  {
    name: '门店1',
    code: '123456',
    company: '公司1',
    address: '地址1'
  },
  {
    name: '门店2',
    code: '123457',
    company: '公司2',
    address: '地址2'
  },
  {
    name: '门店3',
    code: '123458',
    company: '公司3',
    address: '地址3'
  },
])
</script>

<style scoped>
.result-list {
  background-color: transparent;
  padding: 0 20px;
  margin-top: 10px;

  .van-cell-group {
    margin: 0;
    background-color: transparent;

    .result-item {
      background-color: white;
      margin-bottom: 10px;

      .item-title {
        font-weight: 600;
        color: #333;
        margin-bottom: 4px;
      }

      .item-company {
        font-size: 14px;
        color: #a6a4a4;
        margin-bottom: 2px;
      }

      .item-address {
        font-size: 13px;
        color: #a6a4a4;
        line-height: 1.4;
      }
    }
  }

}
</style>