feat: 重构律师列表卡片展示

- 简化筛选栏与列表快捷入口

- 为律师卡片增加 featured 布局和联系方式展示

frontend_miniprogram/miniprogram/components/filter-bar/filter-bar.less

@@ -8,7 +8,7 @@
 
 .filter-item {
   height: 84rpx;
-  padding: 0 18rpx;
+  padding: 0 22rpx;
   border-radius: 14rpx;
   border: 1rpx solid var(--border-color);
   /* Use variable */
@@ -24,13 +24,6 @@ picker {
   min-width: 0;
 }
 
-.label {
-  font-size: 22rpx;
-  color: var(--text-tertiary);
-  /* Use variable */
-  flex-shrink: 0;
-}
-
 .value {
   flex: 1;
   min-width: 0;

frontend_miniprogram/miniprogram/components/filter-bar/filter-bar.wxml

@@ -1,14 +1,12 @@
 <view class="filter-wrap">
   <picker mode="selector" range="{{officeOptions}}" bindchange="handleOfficeChange">
     <view class="filter-item">
-      <text class="label">机构</text>
       <text class="value">{{selectedOffice}}</text>
       <text class="arrow">▾</text>
     </view>
   </picker>
   <picker mode="selector" range="{{areaOptions}}" bindchange="handleAreaChange">
     <view class="filter-item">
-      <text class="label">领域</text>
       <text class="value">{{selectedArea}}</text>
       <text class="arrow">▾</text>
     </view>

frontend_miniprogram/miniprogram/components/lawyer-card/lawyer-card.less

@@ -1,27 +1,47 @@
 .lawyer-card {
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   background: var(--bg-card);
-  border-radius: var(--border-radius-base);
+  border-radius: 18rpx;
   padding: var(--spacing-md);
-  box-shadow: var(--shadow-sm);
+  box-shadow: var(--shadow-base);
   position: relative;
   overflow: hidden;
   transition: transform 0.1s;
+  border: 1rpx solid rgba(142, 34, 48, 0.06);
 }
 
 .lawyer-card:active {
   transform: scale(0.98);
 }
 
+.lawyer-card--featured {
+  padding: 28rpx;
+  border-radius: 20rpx;
+  background: linear-gradient(180deg, #fff 0%, #fffaf9 100%);
+  box-shadow: 0 10rpx 28rpx rgba(26, 26, 26, 0.08);
+}
+
+.lawyer-card--compact {
+  align-items: center;
+}
+
 .avatar {
-  width: 100rpx;
+  width: 104rpx;
-  height: 100rpx;
+  height: 104rpx;
-  border-radius: 50%;
+  border-radius: 28rpx;
-  border: 4rpx solid var(--bg-page);
+  border: 4rpx solid #fff;
   flex-shrink: 0;
-  margin-right: var(--spacing-sm);
+  margin-right: 20rpx;
   background: var(--bg-surface);
+  box-shadow: 0 6rpx 18rpx rgba(0, 0, 0, 0.08);
+}
+
+.lawyer-card--featured .avatar {
+  width: 132rpx;
+  height: 132rpx;
+  border-radius: 32rpx;
+  margin-right: 24rpx;
 }
 
 .content {
@@ -29,69 +49,148 @@
   min-width: 0;
   display: flex;
   flex-direction: column;
-  justify-content: center;
+  gap: 14rpx;
+}
+
+.top-row {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16rpx;
+}
+
+.identity-block {
+  flex: 1;
+  min-width: 0;
 }
 
 .header-row {
   display: flex;
   align-items: center;
-  margin-bottom: 6rpx;
+  flex-wrap: wrap;
+  gap: 10rpx;
 }
 
 .name {
   font-size: 32rpx;
   font-weight: 600;
   color: var(--text-main);
-  margin-right: 12rpx;
+  line-height: 1.2;
+}
+
+.lawyer-card--featured .name {
+  font-size: 40rpx;
 }
 
 .title {
   font-size: 22rpx;
   color: var(--primary-color);
   background: rgba(142, 34, 48, 0.08);
-  /* Primary opacity */
+  padding: 6rpx 14rpx;
-  padding: 2rpx 10rpx;
+  border-radius: 10rpx;
-  border-radius: 8rpx;
   font-weight: 500;
+  line-height: 1;
 }
 
-.office {
+.lawyer-card--featured .title {
   font-size: 24rpx;
+  padding: 8rpx 16rpx;
+  background: rgba(142, 34, 48, 0.1);
+}
+
+.contact-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10rpx;
+  margin-top: 12rpx;
+}
+
+.contact-chip {
+  max-width: 100%;
+  font-size: 22rpx;
+  line-height: 1.2;
+  color: var(--text-secondary);
+  background: var(--bg-page);
+  border-radius: 999rpx;
+  padding: 8rpx 16rpx;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.lawyer-card--featured .contact-chip {
+  font-size: 24rpx;
+  padding: 10rpx 18rpx;
+  background: rgba(255, 255, 255, 0.86);
+  border: 1rpx solid rgba(142, 34, 48, 0.08);
+}
+
+.specialty-block {
+  display: flex;
+  flex-direction: column;
+  gap: 10rpx;
+}
+
+.specialty-label {
+  font-size: 22rpx;
   color: var(--text-tertiary);
-  margin-bottom: 12rpx;
+  line-height: 1;
 }
 
 .tags-row {
   display: flex;
   flex-wrap: wrap;
-  gap: 8rpx;
+  gap: 10rpx;
 }
 
 .tag {
-  font-size: 20rpx;
+  font-size: 22rpx;
   color: var(--text-secondary);
   background: var(--bg-page);
-  padding: 4rpx 12rpx;
+  padding: 8rpx 14rpx;
-  border-radius: 6rpx;
+  border-radius: 999rpx;
+  line-height: 1.2;
+}
+
+.lawyer-card--featured .tag {
+  font-size: 22rpx;
+  color: var(--primary-dark);
+  background: rgba(142, 34, 48, 0.06);
+  padding: 8rpx 14rpx;
 }
 
 .tag-more {
-  font-size: 20rpx;
+  font-size: 22rpx;
-  color: var(--text-tertiary);
+  color: var(--primary-color);
-  padding: 4rpx 0;
+  background: rgba(142, 34, 48, 0.08);
+  padding: 8rpx 14rpx;
+  border-radius: 999rpx;
+  line-height: 1.2;
 }
 
 .action-col {
-  margin-left: var(--spacing-md);
   display: flex;
   align-items: center;
+  flex-shrink: 0;
+  padding-top: 2rpx;
 }
 
 .consult-btn {
   font-size: 24rpx;
   color: var(--primary-color);
+  background: #fff;
   border: 1rpx solid var(--primary-color);
-  padding: 6rpx 20rpx;
+  padding: 10rpx 22rpx;
-  border-radius: 24rpx;
+  border-radius: 999rpx;
   font-weight: 500;
+  line-height: 1;
+}
+
+.lawyer-card--featured .consult-btn {
+  font-size: 26rpx;
+  padding: 14rpx 28rpx;
+  color: #fff;
+  background: var(--primary-color);
+  border: none;
+  box-shadow: 0 8rpx 18rpx rgba(142, 34, 48, 0.18);
 }

frontend_miniprogram/miniprogram/components/lawyer-card/lawyer-card.ts

@@ -1,24 +1,44 @@
 Component({
   data: {
-    specialtiesText: '',
+    isFeatured: false,
+    layoutClass: '',
+    visibleSpecialties: [] as string[],
+    moreSpecialtiesCount: 0,
+    contactItems: [] as string[],
   },
   properties: {
     lawyer: {
       type: Object,
       value: null,
     },
-    showOffice: {
+    layout: {
-      type: Boolean,
+      type: String,
-      value: true,
+      value: 'compact',
     },
   },
   observers: {
-    lawyer(lawyer: { specialties?: string[] } | null) {
+    'lawyer, layout'(lawyer: {
+      specialties?: string[];
+      phone?: string;
+      email?: string;
+    } | null, layout: string) {
       const specialties =
         lawyer && Array.isArray(lawyer.specialties) ? lawyer.specialties : [];
+      const isFeatured = layout === 'featured';
+      const visibleLimit = isFeatured ? 4 : 3;
+      const phone = lawyer && typeof lawyer.phone === 'string' ? lawyer.phone.trim() : '';
+      const email = lawyer && typeof lawyer.email === 'string' ? lawyer.email.trim() : '';
+      const phoneText = phone ? `电话：${phone}` : '';
+      const emailText = email ? `邮箱：${email}` : '';
+      const contactItems = isFeatured
+        ? [phoneText, emailText].filter((item) => Boolean(item)).slice(0, 2)
+        : [];
       this.setData({
-        specialties, // Expose array for wx:for
+        isFeatured,
-        specialtiesText: specialties.join(' | '),
+        layoutClass: isFeatured ? 'lawyer-card--featured' : 'lawyer-card--compact',
+        visibleSpecialties: specialties.slice(0, visibleLimit),
+        moreSpecialtiesCount: Math.max(0, specialties.length - visibleLimit),
+        contactItems,
       });
     },
   },

frontend_miniprogram/miniprogram/components/lawyer-card/lawyer-card.wxml

@@ -1,21 +1,30 @@
-<view class="lawyer-card" bindtap="handleTap">
+<view class="lawyer-card {{layoutClass}}" bindtap="handleTap">
   <image class="avatar" src="{{lawyer.avatar}}" mode="aspectFill"></image>
 
   <view class="content">
+    <view class="top-row">
+      <view class="identity-block">
         <view class="header-row">
           <text class="name">{{lawyer.name}}</text>
-      <text class="title">{{lawyer.title}}</text>
+          <text class="title" wx:if="{{lawyer.title}}">{{lawyer.title}}</text>
         </view>
 
-    <text wx:if="{{showOffice}}" class="office">{{lawyer.office}}</text>
+        <view class="contact-row" wx:if="{{contactItems.length}}">
-    
+          <text class="contact-chip" wx:for="{{contactItems}}" wx:key="*this">{{item}}</text>
-    <view class="tags-row">
-      <text class="tag" wx:for="{{specialties}}" wx:key="*this" wx:if="{{index < 3}}">{{item}}</text>
-      <text class="tag-more" wx:if="{{specialties.length > 3}}">...</text>
         </view>
       </view>
 
       <view class="action-col">
         <text class="consult-btn">咨询</text>
       </view>
+    </view>
+
+    <view class="specialty-block">
+      <text class="specialty-label" wx:if="{{isFeatured && visibleSpecialties.length}}">业务方向</text>
+      <view class="tags-row">
+        <text class="tag" wx:for="{{visibleSpecialties}}" wx:key="*this">{{item}}</text>
+        <text class="tag-more" wx:if="{{moreSpecialtiesCount > 0}}">...</text>
+      </view>
+    </view>
+  </view>
 </view>

frontend_miniprogram/miniprogram/pages/lawyer-list/index.less

@@ -44,73 +44,14 @@
   color: var(--text-placeholder);
 }
 
-.quick-actions {
-  display: flex;
-  gap: var(--spacing-md);
-  padding: 0 var(--spacing-md) var(--spacing-md);
-}
-
-.action-btn {
-  flex: 1;
-  height: 80rpx;
-  border-radius: var(--border-radius-base);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 28rpx;
-  font-weight: 500;
-  transition: opacity 0.2s;
-}
-
-.action-btn:active {
-  opacity: 0.8;
-}
-
-.hotline-btn {
-  background: rgba(142, 34, 48, 0.06);
-  /* Burgundy tint */
-  color: var(--primary-color);
-}
-
-.map-btn {
-  background: #fff;
-  color: var(--text-secondary);
-  border: 1rpx solid var(--border-color);
-}
-
 .list-wrap {
   padding: 0 var(--spacing-md);
 }
 
 .card-item {
-  margin-bottom: var(--spacing-md);
+  margin-bottom: 20rpx;
-  background: #fff;
-  /* Ensure card background is white */
-  border-radius: var(--border-radius-base);
 }
 
 .list-bottom-space {
   height: 120rpx;
 }
-
-/* History Floating Action Button styling */
-.history-fab {
-  position: fixed;
-  right: var(--spacing-md);
-  bottom: calc(var(--spacing-lg) + env(safe-area-inset-bottom));
-  background: rgba(255, 255, 255, 0.9);
-  backdrop-filter: blur(10px);
-  padding: 16rpx 32rpx;
-  border-radius: 40rpx;
-  box-shadow: var(--shadow-lg);
-  display: flex;
-  align-items: center;
-  z-index: 20;
-  border: 1rpx solid var(--border-color);
-}
-
-.history-text {
-  font-size: 26rpx;
-  color: var(--text-main);
-  font-weight: 500;
-}

frontend_miniprogram/miniprogram/pages/lawyer-list/index.ts

@@ -8,17 +8,12 @@ let searchDebounceTimer: number | null = null;
 
 Page({
   data: {
-    firmName: '',
-    firmAddress: '',
-    firmLatitude: 0,
-    firmLongitude: 0,
     keyword: '',
     selectedOffice: ALL_OFFICES,
     selectedArea: ALL_AREAS,
     officeOptions: [ALL_OFFICES],
     areaOptions: [ALL_AREAS],
     filteredLawyers: [] as Lawyer[],
-    hotlinePhone: '',
     loading: false,
   },
 
@@ -31,11 +26,6 @@ Page({
     try {
       const firm = await getFirmProfile();
       this.setData({
-        firmName: firm.name,
-        firmAddress: firm.hqAddress,
-        firmLatitude: firm.hqLatitude,
-        firmLongitude: firm.hqLongitude,
-        hotlinePhone: firm.hotlinePhone,
         officeOptions: [ALL_OFFICES, ...firm.officeList],
         areaOptions: [ALL_AREAS, ...firm.practiceAreas],
       });
@@ -68,6 +58,14 @@ Page({
     }, 250) as unknown as number;
   },
 
+  onSearchConfirm() {
+    if (searchDebounceTimer !== null) {
+      clearTimeout(searchDebounceTimer);
+      searchDebounceTimer = null;
+    }
+    this.loadLawyers();
+  },
+
   handleOfficeChange(event: WechatMiniprogram.CustomEvent<{ value: string }>) {
     this.setData({ selectedOffice: event.detail.value });
     this.loadLawyers();
@@ -104,44 +102,4 @@ Page({
       url: `/pages/lawyer-detail/index?id=${lawyerId}`,
     });
   },
-
-  callHotline() {
-    if (!this.data.hotlinePhone) {
-      wx.showToast({
-        title: '暂无联系电话',
-        icon: 'none',
-      });
-      return;
-    }
-
-    wx.makePhoneCall({
-      phoneNumber: this.data.hotlinePhone,
-      fail: () => {
-        wx.showToast({ title: '拨号失败', icon: 'none' });
-      },
-    });
-  },
-
-  openOffice() {
-    if (!this.data.firmLatitude || !this.data.firmLongitude) {
-      wx.showToast({ title: '暂未配置地图位置', icon: 'none' });
-      return;
-    }
-    wx.openLocation({
-      latitude: this.data.firmLatitude,
-      longitude: this.data.firmLongitude,
-      name: this.data.firmName,
-      address: this.data.firmAddress,
-      scale: 18,
-      fail: () => {
-        wx.showToast({ title: '打开地图失败', icon: 'none' });
-      },
-    });
-  },
-
-  goHistory() {
-    wx.navigateTo({
-      url: '/pages/history/index',
-    });
-  },
 });

frontend_miniprogram/miniprogram/pages/lawyer-list/index.wxml

@@ -12,6 +12,8 @@
           placeholder="搜索律师姓名、专业领域..."
           value="{{keyword}}"
           bindinput="onSearchInput"
+          bindconfirm="onSearchConfirm"
+          confirm-type="search"
         />
       </view>
     </view>
@@ -26,21 +28,11 @@
     ></filter-bar>
   </view>
 
-  <view class="quick-actions">
-    <view class="action-btn hotline-btn" bindtap="callHotline">
-      <image class="action-icon" src="/assets/icons/phone.svg" mode="aspectFit" wx:if="{{false}}"></image> <!-- Placeholder for icon -->
-      <text>联系电话</text>
-    </view>
-    <view class="action-btn map-btn" bindtap="openOffice">
-      <text>总部导航</text>
-    </view>
-  </view>
-
   <scroll-view class="page-content list-scroll" scroll-y="true" type="list">
     <view class="list-wrap">
       <block wx:if="{{filteredLawyers.length}}">
         <view class="card-item" wx:for="{{filteredLawyers}}" wx:key="id" wx:for-item="item">
-          <lawyer-card lawyer="{{item}}" bind:select="handleLawyerSelect"></lawyer-card>
+          <lawyer-card lawyer="{{item}}" layout="featured" bind:select="handleLawyerSelect"></lawyer-card>
         </view>
       </block>
       <block wx:else>
@@ -49,8 +41,4 @@
       <view class="list-bottom-space"></view>
     </view>
   </scroll-view>
-
-  <view class="history-fab" bindtap="goHistory">
-    <text class="history-text">浏览记录</text>
-  </view>
 </view>