<template>
	<view>
		<h-dark :title="t('kefu.title')"></h-dark>
		<view class="mx-[30rpx] mt-[20rpx]">
			<view v-for="(item, index) in data.list" :key="index"
				class="flex items-center bg-[#2C326B] rounded-lg p-[30rpx] mb-[20rpx]" @click="handleClick(item.link)">
				<u-image width="64" height="64" :src="item.logo" alt="" />
				<view class="ml-[20rpx] flex-1">{{ item.name }}</view>
				<view class="text-muted">
					<u-icon name="arrow-right" />
				</view>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import { onLoad } from '@dcloudio/uni-app'
	import { reactive } from 'vue'
	import { getKefuLists } from '@/api/kefu'
	import { jumpTo, t } from '@/utils/util'
	uni.setNavigationBarTitle({ title: t('kefu.title') })

	const data = reactive({
		list: []
	})
	const handleClick = (link : any) => {
		jumpTo(link)
	}

	const getData = async () => {
		const res = await getKefuLists()
		data.list = res;
	}
	onLoad(() => {

		getData()
	})
</script>

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