add entrance transition

src/pages/store/StoreBusinessDayCalendar.vue

@@ -4,7 +4,7 @@
 		v-can="permissionCodes.store.read"
 		class="store-business-day-calendar"
 	>
-		<header class="summary bg-white">
+		<header class="summary bg-white" v-entrance-transition>
 			<header class="header">
 				<div class="text-bold" v-text="store.name" />
 				<t-tag variant="outline" :content="store.code" />
@@ -18,6 +18,7 @@
 			class="calendar-card"
 			description="设置门店休息日，该日无任何登记记录不视为中断连续登记事件。已有登记不可设为休息，标记休息不能产生登记"
 			tips="点击日期即可新增营休日"
+			v-entrance-transition="70"
 		>
 			<t-calendar
 				:key="calendarRenderKey"

src/pages/store/StoreDataCharts.vue

@@ -1,13 +1,12 @@
 <template>
 	<div v-can="permissionCodes.stat.read" class="data-charts-page">
-		<store-chart-summary :date-text-list="dateTextList" />
-
-		<store-event-record-calendar-section @list="toEventRecordList" />
-		<store-event-record-trend-chart :date-text-list="dateTextList" />
-		<store-event-record-number-value-chart :date-text-list="dateTextList" />
-		<store-event-structure-chart :date-text-list="dateTextList" />
-		<store-customer-growth-chart :date-text-list="dateTextList" />
-		<store-customer-gender-chart />
+		<store-chart-summary v-entrance-transition :date-text-list="dateTextList" />
+		<store-event-record-calendar-section v-entrance-transition="70" @list="toEventRecordList" />
+		<store-event-record-trend-chart v-entrance-transition="140" :date-text-list="dateTextList" />
+		<store-event-record-number-value-chart v-entrance-transition="210" :date-text-list="dateTextList" />
+		<store-event-structure-chart v-entrance-transition="280" :date-text-list="dateTextList" />
+		<store-customer-growth-chart v-entrance-transition="350" :date-text-list="dateTextList" />
+		<store-customer-gender-chart v-entrance-transition="420" />
 	</div>
 </template>
 

src/pages/store/StoreEdit.vue

@@ -1,6 +1,6 @@
 <template>
 	<div v-can="savePermissionCode" class="store-edit">
-		<t-form class="form" label-align="left">
+		<t-form class="form" label-align="left" v-entrance-transition>
 			<t-form-item v-if="!isStoreManagerScope" label="编码">
 				<t-input v-model.trim="formData.code" placeholder="门店编码" borderless />
 			</t-form-item>
@@ -20,7 +20,7 @@
 				<t-textarea v-model.trim="formData.remark" class="textarea" placeholder="备注" autosize borderless />
 			</t-form-item>
 		</t-form>
-		<t-cell-group v-if="!isCreateMode" theme="card">
+		<t-cell-group v-if="!isCreateMode" theme="card" v-entrance-transition="70">
 			<t-cell
 				title="营业日管理"
 				note="配置营业或休息日期"
@@ -36,7 +36,7 @@
 				</template>
 			</t-cell>
 		</t-cell-group>
-		<div v-if="!isCreateMode && !isStoreManagerScope" class="actions">
+		<div v-if="!isCreateMode && !isStoreManagerScope" class="actions" v-entrance-transition="140">
 			<t-button
 				v-can="permissionCodes.store.delete"
 				class="action"

src/pages/store/StoreList.vue

@@ -8,26 +8,27 @@
 			@scrolltolower="fetch"
 		>
 			<t-cell-group theme="card">
-				<t-cell
-					class="item"
-					v-for="item in pageResult.list"
-					:key="item.id"
-					arrow
-					@click="toEdit(item)"
-				>
-					<template #title>
-						<div class="header">
-							<div class="text-bold" v-text="item.name || '未命名门店'"></div>
-							<t-tag size="small" :theme="getStoreStatusTheme(item.status)" variant="outline" :content="getStoreStatusText(item.status)" />
-						</div>
-					</template>
-					<template #description>
-						<div class="description">
-							<span class="gray" v-text="item.telephone ? `电话：${item.telephone}` : '电话：-'" />
-							<span class="gray" v-text="item.address ? `地址：${item.address}` : '地址：-'" />
-						</div>
-					</template>
-				</t-cell>
+					<t-cell
+						v-entrance-transition="index * 30"
+						v-for="(item, index) in pageResult.list"
+						:key="item.id"
+						class="item"
+						arrow
+						@click="toEdit(item)"
+					>
+						<template #title>
+							<div class="header">
+								<div class="text-bold" v-text="item.name || '未命名门店'"></div>
+								<t-tag size="small" :theme="getStoreStatusTheme(item.status)" variant="outline" :content="getStoreStatusText(item.status)" />
+							</div>
+						</template>
+						<template #description>
+							<div class="description">
+								<span class="gray" v-text="item.telephone ? `电话：${item.telephone}` : '电话：-'" />
+								<span class="gray" v-text="item.address ? `地址：${item.address}` : '地址：-'" />
+							</div>
+						</template>
+					</t-cell>
 			</t-cell-group>
 			<div v-if="!pageResult.list.length" class="empty-block" v-text="isLoading ? '正在加载门店' : '暂无门店'" />
 			<div v-if="pageResult.list.length" class="load-state" v-text="isNoMore ? '已加载全部门店' : '上拉加载更多'" />