feat: 搭建微信小程序展示端
- 初始化小程序工程配置与类型声明 - 增加首页、律所、律师列表、详情与历史页面 - 补充公共组件、运行时配置与示例素材
This commit is contained in:
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"usingComponents": {
|
||||
"app-header": "/components/app-header/app-header",
|
||||
"lawyer-card": "/components/lawyer-card/lawyer-card",
|
||||
"empty-state": "/components/empty-state/empty-state"
|
||||
}
|
||||
}
|
||||
39
frontend_miniprogram/miniprogram/pages/history/index.less
Normal file
39
frontend_miniprogram/miniprogram/pages/history/index.less
Normal file
@@ -0,0 +1,39 @@
|
||||
.history-page {
|
||||
background: var(--theme-bg);
|
||||
}
|
||||
|
||||
.actions {
|
||||
padding: 14rpx 24rpx 0;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.clear-btn {
|
||||
margin: 0;
|
||||
width: 156rpx;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
border-radius: 12rpx;
|
||||
border: 1rpx solid var(--theme-border);
|
||||
font-size: 24rpx;
|
||||
color: var(--theme-primary);
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.clear-btn::after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.history-list {
|
||||
padding: 16rpx 24rpx 30rpx;
|
||||
}
|
||||
|
||||
.history-item {
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.history-time {
|
||||
margin: 10rpx 10rpx 0;
|
||||
font-size: 22rpx;
|
||||
color: #8e96a6;
|
||||
}
|
||||
80
frontend_miniprogram/miniprogram/pages/history/index.ts
Normal file
80
frontend_miniprogram/miniprogram/pages/history/index.ts
Normal file
@@ -0,0 +1,80 @@
|
||||
import { clearCardViewHistory, getCardViewHistory } from '../../utils/history';
|
||||
import { formatTime } from '../../utils/util';
|
||||
import type { Lawyer } from '../../types/card';
|
||||
|
||||
interface HistoryCardItem {
|
||||
lawyer: Lawyer;
|
||||
viewedAt: number;
|
||||
timeText: string;
|
||||
}
|
||||
|
||||
function createFallbackLawyer(lawyerId: string): Lawyer {
|
||||
return {
|
||||
id: lawyerId,
|
||||
name: '历史浏览名片',
|
||||
title: '',
|
||||
office: '',
|
||||
phone: '',
|
||||
email: '',
|
||||
address: '',
|
||||
avatar: '',
|
||||
coverImage: '',
|
||||
specialties: [],
|
||||
bio: '',
|
||||
wechatQrImage: '',
|
||||
};
|
||||
}
|
||||
|
||||
Page({
|
||||
data: {
|
||||
items: [] as HistoryCardItem[],
|
||||
},
|
||||
|
||||
onShow() {
|
||||
this.loadHistory();
|
||||
},
|
||||
|
||||
loadHistory() {
|
||||
const history = getCardViewHistory();
|
||||
if (!history.length) {
|
||||
this.setData({ items: [] });
|
||||
return;
|
||||
}
|
||||
|
||||
const items = history
|
||||
.map((record) => ({
|
||||
lawyer: record.lawyer || createFallbackLawyer(record.lawyerId),
|
||||
viewedAt: record.viewedAt,
|
||||
timeText: formatTime(new Date(record.viewedAt)),
|
||||
}));
|
||||
|
||||
this.setData({ items });
|
||||
},
|
||||
|
||||
handleLawyerSelect(event: WechatMiniprogram.CustomEvent<{ id: string }>) {
|
||||
const lawyerId = event.detail.id;
|
||||
if (!lawyerId) {
|
||||
return;
|
||||
}
|
||||
wx.navigateTo({
|
||||
url: `/pages/lawyer-detail/index?id=${lawyerId}`,
|
||||
});
|
||||
},
|
||||
|
||||
clearHistory() {
|
||||
if (!this.data.items.length) {
|
||||
return;
|
||||
}
|
||||
wx.showModal({
|
||||
title: '清空记录',
|
||||
content: '确定清空所有名片查看记录吗?',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
clearCardViewHistory();
|
||||
this.setData({ items: [] });
|
||||
wx.showToast({ title: '已清空', icon: 'success' });
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
});
|
||||
22
frontend_miniprogram/miniprogram/pages/history/index.wxml
Normal file
22
frontend_miniprogram/miniprogram/pages/history/index.wxml
Normal file
@@ -0,0 +1,22 @@
|
||||
<view class="container-page history-page">
|
||||
<app-header title="名片查看记录" back="{{true}}" background="#f6f7fa"></app-header>
|
||||
|
||||
<scroll-view class="page-content" scroll-y="true" type="list">
|
||||
<block wx:if="{{items.length}}">
|
||||
<view class="actions">
|
||||
<button class="clear-btn" bindtap="clearHistory">清空记录</button>
|
||||
</view>
|
||||
|
||||
<view class="history-list">
|
||||
<view class="history-item" wx:for="{{items}}" wx:key="viewedAt" wx:for-item="item">
|
||||
<lawyer-card lawyer="{{item.lawyer}}" bind:select="handleLawyerSelect"></lawyer-card>
|
||||
<text class="history-time">查看时间:{{item.timeText}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<block wx:else>
|
||||
<empty-state text="还没有名片浏览记录"></empty-state>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
Reference in New Issue
Block a user