<script lang="ts" setup>
import {appMerchantSwitchListGet} from "@/service";
import usePage from "@/hooks/usePage";

const {t} = useI18n();

function appShopSettlementList(pageNum: number, pageSize: number) {
  return new Promise(resolve => {
    appMerchantSwitchListGet({
      options: {
        query: {
          pageNum: pageNum,
          pageSize: pageSize,
        }
      }
    }).then(res => {
      console.log(res)
      resolve({rows: res.data})
    })
  })
}

const {paging, loading, firstLoaded, dataList, queryList} = usePage(appShopSettlementList)

function handleClickItem(item: any) {
  uni.navigateTo({
    url: '/pages-user/pages/store-management/index?id=' + item.id
  })
}

onShow(() => {
  nextTick(() => {
    paging.value.refresh()
  })
})
</script>

<template>
  <z-paging ref="paging" v-model="dataList" :auto="false" @query="queryList">
    <template #top>
      <navbar :title="t('pages-user.store-management.index.title')"/>
    </template>
    <!-- z-paging默认铺满全屏，此时页面所有view都应放在z-paging标签内，否则会被盖住 -->
    <!-- 需要固定在页面顶部的view请通过slot="top"插入，包括自定义的导航栏 -->
    <view class="p-30rpx">
      <view v-for="(item,index) in dataList" :key="index"
            class="flex-center-sb bg-white rounded-16rpx px-30rpx py-36rpx mb-30rpx last:mb-0"
            @click="handleClickItem(item)">
        <view class="flex items-center">
          <image v-if="item.logo" :src="item.logo" class="w-96rpx h-96rpx shrink-0 rounded-10rpx mr-20rpx"></image>
          <image
              v-else
              class="w-96rpx h-96rpx shrink-0 rounded-50% mr-20rpx"
              mode="aspectFill"
              src="@img/chef/default_avatar.png"
          />
          <view class="flex flex-col justify-between h-96rpx py-4rpx">
            <text class="text-30rpx text-#333 font-500">{{ item.merchantName }}</text>
            <view class="text-24rpx text-#999 line-clamp-1">{{ item.merchantAddress }}</view>
          </view>
        </view>
        <view class="flex items-center shrink-0 ml-20rpx">
          <image class="w-28rpx h-28rpx ml-4rpx" src="@img/chef/115.png"></image>
        </view>
      </view>
    </view>
  </z-paging>
</template>

<style lang="scss" scoped>

</style>