add entrance transition
This commit is contained in:
Timi
@@ -25,40 +25,45 @@
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<customer-profile-card class="customer" :customer="selectedCustomer" />
|
||||
<customer-profile-card v-entrance-transition class="customer" :customer="selectedCustomer" />
|
||||
<div class="charts">
|
||||
<customer-chart-summary
|
||||
v-if="selectedCustomer"
|
||||
:customer="selectedCustomer"
|
||||
:month-cursor="monthCursor"
|
||||
:selected-event-id-list="selectedEventIdList"
|
||||
/>
|
||||
<customer-event-record-calendar-section
|
||||
v-if="selectedCustomer"
|
||||
v-model="monthCursor"
|
||||
v-model:selected-event-id-list="selectedEventIdList"
|
||||
:customer-id="selectedCustomer.id || ''"
|
||||
:customer-name="selectedCustomer.name"
|
||||
:store-id="selectedCustomer.storeId"
|
||||
@list="toEventRecordList"
|
||||
/>
|
||||
<customer-record-trend-chart
|
||||
v-if="selectedCustomer"
|
||||
:customer-id="selectedCustomer.id || ''"
|
||||
:date-text-list="chartDateTextList"
|
||||
:selected-event-id-list="selectedEventIdList"
|
||||
/>
|
||||
<customer-event-structure-chart
|
||||
v-if="selectedCustomer"
|
||||
:customer-id="selectedCustomer.id || ''"
|
||||
:date-text-list="monthDateTextList"
|
||||
:selected-event-id-list="selectedEventIdList"
|
||||
/>
|
||||
<customer-selector
|
||||
v-model="selectedCustomerId"
|
||||
v-model:visible="selectorVisible"
|
||||
@change="handleCustomerSelected"
|
||||
/>
|
||||
<customer-chart-summary
|
||||
v-entrance-transition="70"
|
||||
v-if="selectedCustomer"
|
||||
:customer="selectedCustomer"
|
||||
:month-cursor="monthCursor"
|
||||
:selected-event-id-list="selectedEventIdList"
|
||||
/>
|
||||
<customer-event-record-calendar-section
|
||||
v-entrance-transition="140"
|
||||
v-if="selectedCustomer"
|
||||
v-model="monthCursor"
|
||||
v-model:selected-event-id-list="selectedEventIdList"
|
||||
:customer-id="selectedCustomer.id || ''"
|
||||
:customer-name="selectedCustomer.name"
|
||||
:store-id="selectedCustomer.storeId"
|
||||
@list="toEventRecordList"
|
||||
/>
|
||||
<customer-record-trend-chart
|
||||
v-entrance-transition="210"
|
||||
v-if="selectedCustomer"
|
||||
:customer-id="selectedCustomer.id || ''"
|
||||
:date-text-list="chartDateTextList"
|
||||
:selected-event-id-list="selectedEventIdList"
|
||||
/>
|
||||
<customer-event-structure-chart
|
||||
v-entrance-transition="280"
|
||||
v-if="selectedCustomer"
|
||||
:customer-id="selectedCustomer.id || ''"
|
||||
:date-text-list="monthDateTextList"
|
||||
:selected-event-id-list="selectedEventIdList"
|
||||
/>
|
||||
<customer-selector
|
||||
v-entrance-transition="350"
|
||||
v-model="selectedCustomerId"
|
||||
v-model:visible="selectorVisible"
|
||||
@change="handleCustomerSelected"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,10 +1,11 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.customer.read" class="customer-detail">
|
||||
<customer-profile-card
|
||||
v-entrance-transition
|
||||
class="customer"
|
||||
:customer="customer"
|
||||
/>
|
||||
<t-cell-group v-if="customer" class="info" theme="card">
|
||||
<t-cell-group v-entrance-transition="70" v-if="customer" class="info" theme="card">
|
||||
<t-cell title="出生日期">
|
||||
<span
|
||||
v-if="isLunarBirthdate"
|
||||
@@ -43,9 +44,10 @@
|
||||
v-if="customer && canReadTag"
|
||||
:editable="canApplyTag"
|
||||
:tag-list="customerTagList"
|
||||
v-entrance-transition="140"
|
||||
@edit="openTagSelector"
|
||||
/>
|
||||
<t-cell-group v-if="customer" theme="card">
|
||||
<t-cell-group v-if="customer" theme="card" v-entrance-transition="210">
|
||||
<t-cell v-if="canReadStat" title="客户数据图表" arrow @click="toCustomerDataCharts">
|
||||
<template #left-icon>
|
||||
<t-icon name="chart" />
|
||||
@@ -63,13 +65,19 @@
|
||||
</template>
|
||||
</t-cell>
|
||||
</t-cell-group>
|
||||
<t-cell-group v-if="inviter" :title="`由 ${inviter.name} 邀请`" theme="card">
|
||||
<t-cell-group
|
||||
v-if="inviter"
|
||||
:title="`由 ${inviter.name} 邀请`"
|
||||
theme="card"
|
||||
v-entrance-transition="280"
|
||||
>
|
||||
<customer-profile-card :customer="inviter" @click="toCustomerDetail(inviter)"/>
|
||||
</t-cell-group>
|
||||
<t-cell-group v-if="customer" theme="card">
|
||||
<t-cell title="邀请客户" :note="inviteeCountText" arrow @click="toInviteeList" />
|
||||
</t-cell-group>
|
||||
<t-button
|
||||
v-if="customer"
|
||||
v-can="permissionCodes.customer.delete"
|
||||
class="delete-action"
|
||||
theme="danger"
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div v-can="savePermissionCode" class="customer-edit">
|
||||
<t-form class="form" label-align="left" label-width="6rem">
|
||||
<t-form class="form" label-align="left" label-width="6rem" v-entrance-transition>
|
||||
<t-form-item label="客户编码">
|
||||
<t-input
|
||||
v-model.trim="formData.code"
|
||||
@@ -112,9 +112,10 @@
|
||||
class="tag-card"
|
||||
:editable="canEditTag"
|
||||
:tag-list="customerTagList"
|
||||
v-entrance-transition="70"
|
||||
@edit="openTagSelector"
|
||||
/>
|
||||
<t-form class="form" label-align="left" label-width="3rem">
|
||||
<t-form class="form" label-align="left" label-width="3rem" v-entrance-transition="140">
|
||||
<t-form-item label="住址">
|
||||
<t-textarea
|
||||
class="textarea"
|
||||
@@ -162,7 +163,7 @@
|
||||
<bottom-popup
|
||||
v-model="bodyAreaPickerVisible"
|
||||
title="选择调理部位"
|
||||
height="38rem"
|
||||
height="32rem"
|
||||
@left-button-click="cancelBodyAreaPicker"
|
||||
@right-button-click="confirmBodyAreaPicker"
|
||||
>
|
||||
|
||||
@@ -38,18 +38,19 @@
|
||||
@scrolltolower="fetch"
|
||||
>
|
||||
<t-cell-group class="items" theme="card">
|
||||
<customer-cell
|
||||
class="item"
|
||||
v-for="(item, index) in pageResult.list"
|
||||
:key="item.id || item.code || index"
|
||||
:customer="item"
|
||||
arrow
|
||||
@click="router.push(`/management/customers/${item.id}`)"
|
||||
>
|
||||
<template #description>
|
||||
<telephone-link :value="item.telephone" />
|
||||
</template>
|
||||
</customer-cell>
|
||||
<customer-cell
|
||||
v-entrance-transition="index * 30"
|
||||
v-for="(item, index) in pageResult.list"
|
||||
:key="item.id || item.code || index"
|
||||
class="item"
|
||||
:customer="item"
|
||||
arrow
|
||||
@click="router.push(`/management/customers/${item.id}`)"
|
||||
>
|
||||
<template #description>
|
||||
<telephone-link :value="item.telephone" />
|
||||
</template>
|
||||
</customer-cell>
|
||||
</t-cell-group>
|
||||
<div v-if="!pageResult.list.length" class="load-state" v-text="isLoading ? '正在加载客户' : '暂无客户数据'" />
|
||||
<div v-if="pageResult.list.length" class="load-state" v-text="isLoading ? '正在加载更多' : isNoMore ? '已经到底了' : '上拉加载更多'" />
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.qrCode.create" class="qr-page">
|
||||
<t-form class="form" label-align="left">
|
||||
<t-form class="form" label-align="left" v-entrance-transition>
|
||||
<t-form-item label="编码前缀">
|
||||
<t-input v-model.trim="formModel.prefix" placeholder="如 GAO" borderless />
|
||||
</t-form-item>
|
||||
@@ -32,11 +32,11 @@
|
||||
/>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
<t-cell-group theme="card">
|
||||
<t-cell-group theme="card" v-entrance-transition="70">
|
||||
<t-cell title="最终起始编码" :note="finalStartCode" />
|
||||
<t-cell title="最终结束编码" :note="finalEndCode" />
|
||||
</t-cell-group>
|
||||
<div class="actions">
|
||||
<div class="actions" v-entrance-transition="140">
|
||||
<t-button
|
||||
class="bg-white"
|
||||
theme="primary"
|
||||
@@ -54,8 +54,8 @@
|
||||
<span v-text="downloadText" />
|
||||
</t-button>
|
||||
</div>
|
||||
<div class="actions orange tips">微信内可能无法发起打印或批量下载，建议使用默认浏览器打开</div>
|
||||
<section class="preview">
|
||||
<div class="actions orange tips" v-entrance-transition="140">微信内可能无法发起打印或批量下载，建议使用默认浏览器打开</div>
|
||||
<section class="preview" v-entrance-transition="210">
|
||||
<div class="header">
|
||||
<h2 class="title">预览</h2>
|
||||
<p class="tips" v-text="previewSummary" />
|
||||
|
||||
Reference in New Issue
Block a user