<script>
import { useStore } from "./cool";

export default {
	onLaunch: function () {
		const { dict } = useStore();
		dict.refresh();
		console.log("App Launch");
	},
	onShow: function () {
		console.log("App Show");
	},
	onHide: function () {
		console.log("App Hide");
	},
};
</script>

<style lang="scss">
@import "/@/ui/index.scss";
.-img{
	width: 100%;
	height: 100%;
}
page {
	background-color: #f6f7fa;
}
.page{
	background-color: #ffffff;
	min-height: 100vh;
}
.tj-container{
	width: 100%;
	display: flex;
	flex-direction: column;
	min-height: 200rpx;
	background-color: #FBFBFB;
	margin-top: 30rpx;
	border-radius: 20rpx;
	.-title{
		display: flex;
		width: calc(100% - 60rpx);
		margin-left: 30rpx;
		justify-content: space-between;
		height: 80rpx;
		align-items: center;
		.-title-text{
			font-size: 34rpx;
			font-weight: bold;
			color: #393939;
			position: relative;
			z-index: 2;
			.-title-text-text{
				position: relative;
				z-index: 2;
			}
		}
		.-title-text::after{
			content: '';
			display: block;
			width: 120rpx;
			height: 8rpx;
			background-image: linear-gradient(to right, #EBB287, #FFFFFF);
			border-radius: 3rpx;
			position: absolute;
			bottom: 6rpx;
			left: 0;
			z-index: 1;
		}
		.-title-more{
			color: #DADADA;
			font-size: 24rpx;
		}
	}
	.-inner-banner{
		width: calc(100% - 60rpx);
		margin-left: 30rpx;
	}
	.-inner-card-list{
		display: flex;
		width: calc(100% - 60rpx);
		margin-left: 30rpx;
		.-inner-card-item{
			width: 216rpx;
			height: 106rpx;
			background-color: #f1f1f1;
			border-radius: 20rpx;
			margin-right: 20rpx;
			overflow: hidden;
		}
		.-inner-card-item:last-child{
			margin-right: 0rpx;
		}
	}
	.-desc-container{
		width: calc(100% - 60rpx);
		margin-left: 30rpx;
		margin-top: 30rpx;
	  font-size: 28rpx;
	}
}
</style>