feat(ui): 添加二维码功能按钮

- 在医生和患者首页添加二维码图标按钮
- 实现点击二维码按钮的提示功能
- 添加二维码按钮的样式设计
- 设置按钮阴影和圆角效果
- 使用remixicon中的二维码图标
- 按钮布局与现有用户信息对齐

src/pages/doctor/index/index.vue

@@ -13,6 +13,9 @@
             <text class="username">{{ user.nickname || '未登录' }}</text>
             <text class="user-title" v-if="user.title">职称: {{ user.title }}</text>
           </view>
+          <view class="qr-button" @click="onQrClick">
+            <image src="/static/icons/remixicon/qr-code-line.svg" class="qr-icon" />
+          </view>
         </view>
       </view>
 
@@ -259,6 +262,10 @@ function onItemClick(type: string) {
     uni.showToast({ title: '功能正在开发中', icon: 'none' })
   }
 }
+
+function onQrClick() {
+  uni.showToast({ title: '二维码功能开发中', icon: 'none' })
+}
 </script>
 
 <style>
@@ -333,6 +340,23 @@ function onItemClick(type: string) {
   margin-bottom: 10rpx;
 }
 
+.qr-button {
+  width: 100rpx;
+  height: 100rpx;
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-left: 20rpx;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+}
+
+.qr-icon {
+  width: 60rpx;
+  height: 60rpx;
+}
+
 .function-container {
   padding-inline: 20rpx;
 }

src/pages/patient/index/index.vue

@@ -13,6 +13,9 @@
             <text class="username">{{ user.nickname || '未登录' }}</text>
             <text class="user-age" v-if="user.age">年龄: {{ user.age }}</text>
           </view>
+          <view class="qr-button" @click="onQrClick">
+            <image src="/static/icons/remixicon/qr-code-line.svg" class="qr-icon" />
+          </view>
         </view>
       </view>
 
@@ -214,6 +217,10 @@ function onItemClick(type: string) {
   else {
     uni.showToast({ title: '功能正在开发中', icon: 'none' })
   }
+}
+
+function onQrClick() {
+  uni.showToast({ title: '二维码功能开发中', icon: 'none' })
 }</script>
 
 <style>
@@ -293,6 +300,23 @@ function onItemClick(type: string) {
   color: #666;
 }
 
+.qr-button {
+  width: 100rpx;
+  height: 100rpx;
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-left: 20rpx;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+}
+
+.qr-icon {
+  width: 60rpx;
+  height: 60rpx;
+}
+
 .function-container {
   padding-inline: 20rpx;
 }