<template>
  <layout-page class="ss-m-x-15">
    <view class="box" v-for="item in items" :key="item.id" @tap="handleTo(item)">
			<view class="box-header">
				<image
					class="enterAvatar"
					:src="item.headers"
				></image>
			</view>
			<view class="box-content">
				<view class="box-content-names">
					<view class="name">{{ item.name }}</view>
					<view class="time">{{ item.updateTime }}</view>
				</view>
				<view class="box-content-text">{{ item.history }}</view>
			</view>
		</view>
		<image
			v-if=" items.length===0 "
			src="https://minio.citupro.com/dev/static/nodata.png"
			mode="widthFix"
			style="width: 100vw;height: 100vh;">
		</image>
  </layout-page>
</template>

<script setup>
import { ref, watch } from 'vue'
import layoutPage from '@/layout'
import { getAccessToken } from '@/utils/request'
import { showAuthModal } from '@/hooks/useModal'
import { getConversationSync } from '@/api/common'
import { onShow } from '@dcloudio/uni-app'

import { userStore } from '@/store/user'

const useUserStore = userStore()

const items = ref([])

watch(() => useUserStore.isLogin, (newVal, oldVal) => {
  if (useUserStore.isLogin) {
		// 监听登录状态
		console.log('重新登录了')
		init()
	}
})

onShow(() => {
	init()
})



const handleTo = (item) => {
	uni.navigateTo({
    url: `/pagesA/chart/index?id=${item.id}&name=${item.name}`
  })
}

// if (!getAccessToken()) {
// 	uni.showToast({
// 		title: '请先登录',
// 		icon: 'none'
// 	})
// 	showAuthModal()
// 	return
// }

async function init () {
	try {
		const resp = await getConversationSync({ msg_count: 1 })
		if (!resp) {
			return
		}
		console.log(resp)
	} catch (error) {

	}
}



</script>

<style scoped lang="scss">
.box {
	height: 130rpx;
	padding: 20rpx;
	box-sizing: border-box;
	display: flex;
	border-bottom: 2rpx solid #eee;
	&-header {
		width: 120rpx;
		height: 100%;
	}
	&-content {
		flex: 1;
		width: 0;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		&-names {
			display: flex;
			justify-content: space-between;
			
			.name {
				flex: 1;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
			}
			.time {
				color: #999;
				font-size: .85em;
			}
		}
		&-text {
			color: #999;
			font-size: .85em;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		}
	}
}
.enterAvatar{
	width: 80rpx;
	height: 80rpx;
	border-radius: 50%;
	margin: 0 auto;
}
</style>
