<template>
  <PageLayout>
    <infinite-scroll :load="load" :list="list" ref="scrollRef">
      <template v-slot="{ item,index }">
        <q-separator v-if="index" />
        <q-item class="bg-white" :to="item.audit_state == 1?{path:'/cooperate/shop/'+item.cooperate_id}:''">
          <q-item-section avatar>
            <UserAvatar color="accent" :src="item.cooperate.avatar_url||item.cooperate.avatar"/>
          </q-item-section>
          <q-item-section>
            <div class="row text-weight-bold">
              <q-item-label class="col">{{ item.cooperate.name }}</q-item-label>
            </div>
            <q-item-label caption v-if="item.apply_message">
                申请说明：{{ item.apply_message }}
            </q-item-label>
            <q-item-label caption v-if="item.audit_state === 2">
                拒绝原因：{{ item.audit_message }}
            </q-item-label>
          </q-item-section>
          <q-item-section side>
          <q-badge v-if="item.audit_state == 1" outline color="positive" label="已同意" />
          <q-badge v-else-if="item.audit_state == 3" outline color="primary" label="审批中" />
          <q-badge v-else-if="item.audit_state == 2" outline color="orange" label="已拒绝" />
          </q-item-section>
        </q-item>
      </template>
    </infinite-scroll>
  </PageLayout>
</template>
<script setup>
import { ref, onMounted, reactive,watch,onActivated } from "vue";
import { onBeforeRouteUpdate, useRoute, useRouter } from "vue-router";
import { useSelfStore } from "stores/self";
import { api } from "boot/axios";
import { useQuasar } from "quasar";
import { useInfiniteScroll } from 'src/composables/infiniteScroll';
import { formatMoney } from 'src/utils/tools'
const $q = useQuasar();
const route = useRoute();
const router = useRouter();
const store = useSelfStore();

const { list, refresh, load,scrollRef } = useInfiniteScroll((page)=>{
  return api.getPartnerList({
    page,
    type: 1
  }).then((res) => {
    return res.list
  });
})
</script>
<style lang="scss" scoped></style>
