<script setup>
	// 关注店铺
	import {
		ref,
		reactive,
		getCurrentInstance
	} from 'vue'
	import {
		onReachBottom,
		onPullDownRefresh,
		onShow,
		onLoad,
		onReady,
	} from '@dcloudio/uni-app';
	// 工具库
	import util from '@/common/js/util.js'
	// 
	import api from '@/api/index.js'
	// 列表
	const list = reactive([])

	onLoad(() => {
		getList()
	})

	// 获取关注的店铺
	function getList() {
		api.shop.getFollowShopList({}).then(rs => {
			if (rs.code == 200) {
				list.length = 0
				list.push(...rs.data)
				return
			}
			util.alert({
				content: rs.msg,
				showCancel: false
			})
		})
	}

	/**
	 * 关注切换
	 * @param {Object} item
	 */
	function handleFocus(item) {
		api.shop.followShop({
			data: {
				shopId: item.id,
				status: item.isFollow || 0,
			}
		}).then(rs => {
			if (rs.code == 200) {
				if (!item.isFollow) item.isFollow = 1
				else if (item.isFollow == 1) item.isFollow = 0
				return
			}
			util.alert({
				content: rs.msg,
				showCancel: false
			})
		})
	}
</script>

<template>
	<view class="app">
		<view class="list mtb20 plr20 bfff">
			<!-- 店铺 -->
			<view class="item line df aic ptb25 thd f1 f32" v-for="(item,index) in list" :key="index">
				<image class="wh90 br10" :src="item.rectangleLogo" mode="aspectFill" />
				<view class="name mlr20 c333 f1">{{item.name}}</view>

				<view @click="handleFocus(item,index)">
					<view class="btn sm warm w150" v-if="item.isFollow == 1">关注</view>
					<view class="btn sm warmHollow w150" v-else>取消关注</view>
				</view>
			</view>

		</view>
	</view>
</template>

<style lang="scss" scoped>
	// 列表
	.list {
		.item+.item {
			border-top: 2rpx solid #eee;
		}
	}
</style>