ID1766-暂存

zhangchen

2025-09-09 0c994fd068adf276a3f7216dee0a843e78ae0a8c

 src/views/mobile/bedsideAuxiliaryScreen/components/Header.vue

@@ -65,7 +65,8 @@
        alt=""
        @click="openSettingDeviceDialog"
      />
      <img :src="userImg" class="btn-img" alt="" @click="openLoginDialog" />
      <img v-if="userInfo?.code" :src="generateCircularAvatar(userInfo.userName)" class="btn-img" alt="" @click="openLoginDialog" />
      <img v-else :src="userImg" class="btn-img" alt="" @click="openLoginDialog" />
    </div>
  </div>
  <!-- 设置设备编号组件 -->
@@ -164,6 +165,11 @@
  }
});


const userInfo = computed(() => {
  return bedsideAuxiliaryScreenStore.userInfo;
});

watch(
  () => bedsideAuxiliaryScreenStore.taskData?.[0]?.countdown,
  (val) => {
@@ -246,6 +252,28 @@
    loginDialogRef.value.openDialog();
};

function generateCircularAvatar(name: string, size = 100): string {
  const canvas = document.createElement('canvas');
  canvas.width = size;
  canvas.height = size;
  const ctx = canvas.getContext('2d')!;
  
  // 绘制圆形背景
  ctx.fillStyle = '#dae5ec';
  ctx.beginPath();
  ctx.arc(size / 2, size / 2, size / 2, 0, Math.PI * 2);
  ctx.fill();
  
  // 绘制文字（第一个字）
  ctx.fillStyle = '#70a3dd'; // 字体颜色
  ctx.font = `${size * 0.5}px sans-serif`; // 字体大小为头像大小的一半
  ctx.textAlign = 'center';
  ctx.textBaseline = 'middle';
  ctx.fillText(name.charAt(0), size / 2, size / 2);
  
  return canvas.toDataURL('image/png'); // 返回 Base64 图片
}

onUnmounted(() => {
  clearTimer();
});