feat: 完成宠物列表接口对接

src/api/pet.ts

@@ -0,0 +1,10 @@
+import type { CreatePetRequest, Pet } from '@/model/pet'
+import httpClient from '@/api/httpClient'
+
+export function createPet(createPetRequest: CreatePetRequest) {
+  return httpClient.post('/pets', createPetRequest)
+}
+
+export function getOwnPets() {
+  return httpClient.get<Pet[]>('/pets/own')
+}

src/model/base.ts

@@ -10,7 +10,7 @@ export interface BaseModel {
   updateTime: string
 }
 
-export interface AuditBaseModel extends BaseModel {
+export interface TraceableModel extends BaseModel {
   createBy: User
   updateBy: User
 }

src/model/pet.ts

@@ -0,0 +1,19 @@
+import type { TraceableModel } from '@/model/base'
+
+export interface Pet extends TraceableModel {
+  birthday: string
+  bodyType: string
+  gender: number
+  isActive: boolean
+  isLactation: boolean
+  isPregnant: boolean
+  isSterilization: boolean
+  name: string
+  photo: string
+  type: string
+  weight: number
+}
+
+export interface CreatePetRequest extends Omit<Pet, keyof TraceableModel> {
+
+}

src/model/user.ts

@@ -1,6 +1,6 @@
-import type { AuditBaseModel, BaseFilterRequest } from '@/model/base'
+import type { BaseFilterRequest, TraceableModel } from '@/model/base'
 
-export interface User extends AuditBaseModel {
+export interface User extends TraceableModel {
   username: string
   locked: boolean
   enabled: boolean

src/pages/feed-plan/index.vue

@@ -1,10 +1,11 @@
 <script setup lang="ts">
-import avator from '@/static/image/pet-parameters/avator.png'
+import type { Pet } from '@/model/pet'
+import { getOwnPets } from '@/api/pet'
+import avatar from '@/static/image/pet-parameters/avator.png'
 import addBtn from '@/static/image/pet-plan/add_btn.png'
 import card from '@/static/image/pet-plan/card.png'
 import editBtn from '@/static/image/pet-plan/edit.png'
 import userAddBtn from '@/static/image/pet-plan/user_add_btn.png'
-import ToolApi from '@/utils'
 
 interface User {
   name: string
@@ -13,19 +14,14 @@ interface User {
   isClick: boolean
   plan: { image: string, name: string, weight: string, energy: string, label: string[] }[]
 }
-const safeHeight = ToolApi.getSafeHeight()
-// 用户存在情况
-// const userList = ref<User[]>([
-//   { name: '子龙', image: avator, label: ['1岁', '孟加拉豹猫', '8kg'], plan: [
-//     { image: miniGoods, name: 'MINI主食包', weight: '500', energy: '1200kcal', label: ['湿粮', '呵护肠胃'] },
-//     { image: nutritionGoods, name: '营养加焙烘焙粮', weight: '500', energy: '1200kcal', label: ['湿粮', '呵护肠胃'] },
-//   ], isClick: true },
-//   { name: '广坤', image: avator, label: ['12岁', '孟加拉豹猫', '8kg'], plan: [
-//     { image: miniGoods, name: 'MINI主食包', weight: '600', energy: '1300kcal', label: ['湿粮', '呵护肠胃'] },
-//     { image: nutritionGoods, name: '营养加焙烘焙粮', weight: '1000', energy: '1300kcal', label: ['湿粮', '呵护肠胃'] },
-//   ], isClick: false },
-// ])
-// 用户不存在情况
+
+const pets = ref<Pet[]>([])
+async function fetchPets() {
+  pets.value = await getOwnPets()
+}
+
+onMounted(fetchPets)
+
 const userList = ref<User[]>([])
 const clickUser = computed(() => {
   return userList.value.filter(user => user.isClick === true)
@@ -46,9 +42,9 @@ function handleEdit() {
 </script>
 
 <template>
-  <view class="flex flex-col bg-[#F5F6F7] overflow-y-auto" :style="`height:calc(100vh - ${safeHeight}px)`">
+  <view class="flex flex-col bg-[#F5F6F7] overflow-y-auto h-screen">
     <!--  喂养计划未注册  -->
-    <view v-if="userList.length === 0" class="w-[calc(100% - 32px)] min-h-[135px]  rounded-lg m-[16px] relative">
+    <view v-if="pets.length === 0" class="w-[calc(100% - 32px)] min-h-[135px]  rounded-lg m-[16px] relative">
       <image :src="card" class="w-full h-full absolute z-20" />
       <view class="z-20 absolute w-full mt-[35px] flex flex-col">
         <image :src="addBtn" class="w-[47px] h-[47px] mx-auto" @click="handleAdd" />
@@ -75,7 +71,7 @@ function handleEdit() {
       </view>
 
       <view v-for="(item, index) in clickUser" :key="index" class="w-[calc(100% - 32px)] min-h-[129px] rounded-lg m-[16px] relative bg-[white] p-[16px] flex items-center">
-        <image :src="avator" class="w-[64px] h-[64px] rounded-full" />
+        <image :src="avatar" class="w-[64px] h-[64px] rounded-full" />
         <view class="ml-[16px] min-h-[54px] flex-1">
           <text class="font-600">
             {{ item.name }}