<template>
  <view>
    <view class="flex justify-center" v-if="storeList.length > 0">
      <view
        class="bg-white rounded-[15px] mt-3 p-2 w-[95%] flex items-center"
        v-for="(item, index) in storeList"
        :key="index"
        @click="goDetail(item)">
        <image
          class="w-[200px] h-[200px] rounded-[15px] mr-2"
          :src="item.head_photo" />
        <view class="flex-1">
          <view class="text-[#333333] text-[30px] font-bold">{{
            item.name
          }}</view>
          <nut-rate
            spacing="1"
            active-color="rgba(252, 207, 10, 1)"
            v-model="item.rate" />
          <view class="text-[#9E9E9E] text-[25px]">销量：10000</view>
          <view class="text-[#9E9E9E] text-[25px]"
            >营业时间：{{ item.week_start }}-{{ item.week_end }}</view
          >
          <view class="text-[#999999] text-[23px]">{{ item.address }}</view>
        </view>
      </view>
    </view>
    <nut-empty v-else description="暂无数据"></nut-empty>
  </view>
</template>

<script setup lang="ts">
import {getStoreList} from '@/api/home';
import Taro from '@tarojs/taro';
import {ref} from 'vue';
const name = defineModel({
  default: '',
});

const storeList = ref<any>([]);

Taro.useLoad(() => {
  getList();
});

const getList = async () => {
  const res = await getStoreList({
    name: name.value,
  });
  storeList.value = res.data.data;
};

const goDetail = item => {
  Taro.setStorageSync('mer_info', item);
  Taro.navigateTo({
    url: `/pages/mer/mer_detail/index`,
  });
};
</script>

<style lang="scss"></style>
