diff --git a/src/components/image-merge/index.ts b/src/components/image-merge/index.ts
index e46c449..aa0fe2c 100644
--- a/src/components/image-merge/index.ts
+++ b/src/components/image-merge/index.ts
@@ -139,7 +139,7 @@ Component({
const textY = yPositions[index] + 40
ctx.fillStyle = '#ffffff'
- ctx.font = 'bold 28px sans-serif'
+ ctx.font = 'bold 38px sans-serif'
ctx.textAlign = 'left'
ctx.shadowColor = 'rgba(0, 0, 0, 0.5)'
ctx.shadowBlur = 4
@@ -155,7 +155,7 @@ Component({
if (index === imageInfos.length - 1) {
const lastImageBottom = yPositions[index] + scaledHeights[index]
ctx.fillStyle = 'rgba(255, 255, 255, 0.8)'
- ctx.font = '24px sans-serif'
+ ctx.font = '32px sans-serif'
ctx.textAlign = 'right'
ctx.fillText('由-TED关爱小助手-小程序生成', canvasWidth - 20, lastImageBottom - 20)
}
diff --git a/src/components/noteImagePreview/index.scss b/src/components/noteImagePreview/index.scss
index 5736736..bce7c81 100644
--- a/src/components/noteImagePreview/index.scss
+++ b/src/components/noteImagePreview/index.scss
@@ -27,12 +27,69 @@
align-items: center;
justify-content: center;
overflow: hidden;
+ position: relative;
.preview-image {
display: block;
width: 100%;
height: 100%;
}
+
+ // 左右切换按钮
+ .nav-btn {
+ position: absolute;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 72rpx;
+ height: 72rpx;
+ border-radius: 50%;
+ background: rgba(0, 0, 0, 0.4);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ z-index: 10;
+
+ &:active:not(.disabled) {
+ background: rgba(0, 0, 0, 0.6);
+ }
+
+ &.disabled {
+ opacity: 0.3;
+ }
+
+ &.nav-prev {
+ left: 24rpx;
+ }
+
+ &.nav-next {
+ right: 24rpx;
+ }
+ }
+}
+
+// 页码指示器
+.indicator {
+ position: absolute;
+ left: 0;
+ right: 0;
+ text-align: center;
+ color: #fff;
+ font-size: 28rpx;
+ z-index: 10;
+ bottom: calc(168rpx + env(safe-area-inset-bottom));
+
+ .current {
+ font-weight: 600;
+ }
+
+ .separator {
+ margin: 0 8rpx;
+ opacity: 0.6;
+ }
+
+ .total {
+ opacity: 0.6;
+ }
}
// 底部操作栏
diff --git a/src/components/noteImagePreview/index.ts b/src/components/noteImagePreview/index.ts
index 6884178..ff4db82 100644
--- a/src/components/noteImagePreview/index.ts
+++ b/src/components/noteImagePreview/index.ts
@@ -11,12 +11,34 @@ Component({
type: String,
value: '',
},
+ images: {
+ type: Array,
+ value: [],
+ },
+ currentIndex: {
+ type: Number,
+ value: 0,
+ },
},
data: {
visible: false,
src: '',
+ images: [] as string[],
+ currentIndex: 0,
navHeight: wx.getSystemInfoSync().statusBarHeight + 44,
+ startX: 0,
+ startY: 0,
+ },
+
+ observers: {
+ 'currentIndex, images': function (currentIndex: number, images: string[]) {
+ if (images && images.length > 0 && images[currentIndex]) {
+ this.setData({
+ src: images[currentIndex],
+ })
+ }
+ },
},
methods: {
@@ -42,10 +64,66 @@ Component({
handleHidePreview() {
this.setData({
visible: false,
- sec: '',
+ src: '',
+ })
+ },
+
+ // 上一张
+ handlePrev() {
+ const { currentIndex, images } = this.data
+ if (currentIndex > 0) {
+ const newIndex = currentIndex - 1
+ this.setData({
+ currentIndex: newIndex,
+ })
+ this.triggerEvent('change', { index: newIndex })
+ }
+ },
+
+ // 下一张
+ handleNext() {
+ const { currentIndex, images } = this.data
+ if (currentIndex < images.length - 1) {
+ const newIndex = currentIndex + 1
+ this.setData({
+ currentIndex: newIndex,
+ })
+ this.triggerEvent('change', { index: newIndex })
+ }
+ },
+
+ // 滑动手势 - 开始
+ handleTouchStart(e: any) {
+ this.setData({
+ startX: e.touches[0].clientX,
+ startY: e.touches[0].clientY,
})
},
+ // 滑动手势 - 结束
+ handleTouchEnd(e: any) {
+ const { startX, startY, currentIndex, images } = this.data
+ const endX = e.changedTouches[0].clientX
+ const endY = e.changedTouches[0].clientY
+ const diffX = endX - startX
+ const diffY = endY - startY
+
+ // 水平滑动距离大于50且大于垂直滑动距离时才触发切换
+ if (Math.abs(diffX) > 50 && Math.abs(diffX) > Math.abs(diffY)) {
+ if (diffX > 0) {
+ // 右滑 - 上一张
+ if (currentIndex > 0) {
+ this.handlePrev()
+ }
+ } else {
+ // 左滑 - 下一张
+ if (currentIndex < images.length - 1) {
+ this.handleNext()
+ }
+ }
+ }
+ },
+
// 删除
handleDelete() {
wx.showModal({
diff --git a/src/components/noteImagePreview/index.wxml b/src/components/noteImagePreview/index.wxml
index a01528c..4af199f 100644
--- a/src/components/noteImagePreview/index.wxml
+++ b/src/components/noteImagePreview/index.wxml
@@ -3,8 +3,20 @@
-
+
+
+
+
+
+
+
+
+
+
+ {{currentIndex + 1}}
+ /
+ {{images.length}}
diff --git a/src/pages/d_noteDiff/index.wxml b/src/pages/d_noteDiff/index.wxml
index 4fb7db6..c6308f0 100644
--- a/src/pages/d_noteDiff/index.wxml
+++ b/src/pages/d_noteDiff/index.wxml
@@ -6,7 +6,7 @@
- 您可以同时选择多个日期，系统将按时间顺序排列照片。点击右上角按钮可预览并保存生成的对比长图。
+ 您可以同时选择多个日期，系统将按时间顺序排列照片。点击生成对比图按钮可以生成对比长图。
diff --git a/src/patient/components/camera/index.ts b/src/patient/components/camera/index.ts
index 366aa03..8e5be4f 100644
--- a/src/patient/components/camera/index.ts
+++ b/src/patient/components/camera/index.ts
@@ -313,8 +313,14 @@ Component({
switchCamera() {
const newPosition = this.data.devicePosition === 'back' ? 'front' : 'back'
+ // 前置摄像头镜像，左侧45度和右侧45度需要互换 frame 图片
+ const frame = { ...this.data.frame }
+ const temp6 = { ...frame[6] }
+ frame[6] = { ...frame[7] }
+ frame[7] = temp6
this.setData({
devicePosition: newPosition,
+ frame,
})
this.triggerEvent('positionchange', { position: newPosition })
},
diff --git a/src/patient/pages/note/index.scss b/src/patient/pages/note/index.scss
index 0abe980..da731f5 100644
--- a/src/patient/pages/note/index.scss
+++ b/src/patient/pages/note/index.scss
@@ -139,7 +139,7 @@ page {
right: 0;
width: 60rpx;
height: 60rpx;
- background: linear-gradient(45deg, #e5d2ff 0%, #f6f8f9 50%, #f6f8f9 100%);
+ background: linear-gradient(45deg, #f6edff 0%, #f6edff 50%, #f6f8f9 50%, #f6f8f9 100%);
border-radius: 0 0 0 18rpx;
}
}
diff --git a/src/patient/pages/noteAdd/index.scss b/src/patient/pages/noteAdd/index.scss
index caafd64..97c107a 100644
--- a/src/patient/pages/noteAdd/index.scss
+++ b/src/patient/pages/noteAdd/index.scss
@@ -10,6 +10,7 @@ page {
font-size: 28rpx;
color: #211d2e;
.wx-checkbox-input {
+ padding: 2rpx;
background: rgba(173, 172, 178, 0.36);
border-color: transparent;
width: 32rpx;
@@ -17,6 +18,9 @@ page {
}
.wx-checkbox-input-checked {
background: linear-gradient(0deg, #e98ff8 0%, #b073ff 100%);
+ width: 32rpx;
+ height: 33rpx;
+ border: none;
}
}
}
@@ -87,7 +91,7 @@ page {
}
}
.container {
- margin-top: 72rpx;
+ margin-top: 32rpx;
padding: 32rpx 40rpx 0;
background-color: #fff;
border-radius: 32rpx 32rpx 0 0;
@@ -110,6 +114,7 @@ page {
margin-top: 30rpx;
display: flex;
align-items: center;
+ justify-content: center;
gap: 22rpx;
.btn {
flex: 1;
@@ -119,6 +124,7 @@ page {
padding: 26rpx;
border-radius: 18rpx;
.icon {
+ flex-shrink: 0;
width: 36rpx;
height: 36rpx;
}
diff --git a/src/patient/pages/noteAdd/index.ts b/src/patient/pages/noteAdd/index.ts
index ed0db6a..5ac733d 100644
--- a/src/patient/pages/noteAdd/index.ts
+++ b/src/patient/pages/noteAdd/index.ts
@@ -41,6 +41,9 @@ Page({
imagePreview: false,
previewImageSrc: '',
currentPhotoAngle: '',
+ previewImages: [] as string[],
+ previewAngles: [] as string[],
+ previewCurrentIndex: 0,
recordId: '',
// 表单数据
@@ -377,10 +380,30 @@ Page({
const { angle } = e.currentTarget.dataset
const photo = this.data.photoMap[angle]
if (photo) {
+ // 构建已上传图片列表（按 cameraList 顺序）
+ const allAngles = [
+ ...this.data.cameraList.frontend,
+ ...this.data.cameraList.backend,
+ ...this.data.cameraList.other,
+ ]
+ const previewAngles: string[] = []
+ const previewImages: string[] = []
+ allAngles.forEach((item) => {
+ const p = this.data.photoMap[item.angle]
+ if (p) {
+ previewAngles.push(item.angle)
+ previewImages.push(p.photoUrl)
+ }
+ })
+ const currentIndex = previewAngles.indexOf(angle)
+
this.setData({
imagePreview: true,
previewImageSrc: photo.photoUrl,
currentPhotoAngle: angle,
+ previewImages,
+ previewAngles,
+ previewCurrentIndex: currentIndex >= 0 ? currentIndex : 0,
})
}
},
@@ -392,6 +415,18 @@ Page({
})
},
+ // 预览图片切换
+ handleImageChange(e: any) {
+ const { index } = e.detail
+ const angle = this.data.previewAngles[index]
+ if (angle) {
+ this.setData({
+ currentPhotoAngle: angle,
+ previewCurrentIndex: index,
+ })
+ }
+ },
+
// 重新拍摄
handleImageRetake() {
this.setData({
diff --git a/src/patient/pages/noteAdd/index.wxml b/src/patient/pages/noteAdd/index.wxml
index ffd7720..36bcbb0 100644
--- a/src/patient/pages/noteAdd/index.wxml
+++ b/src/patient/pages/noteAdd/index.wxml
@@ -143,9 +143,12 @@
id="note-image-preview"
visible="{{imagePreview}}"
src="{{previewImageSrc}}"
+ images="{{previewImages}}"
+ currentIndex="{{previewCurrentIndex}}"
bind:close="handleImagePreviewClose"
bind:delete="handleImageDel"
bind:retake="handleImageRetake"
+ bind:change="handleImageChange"
>
- 您可以同时选择多个日期，系统将按时间顺序排列照片。点击右上角按钮可预览并保存生成的对比长图。
+ 您可以同时选择多个日期，系统将按时间顺序排列照片。点击生成对比图按钮可以生成对比长图。
diff --git a/src/patient/pages/noteHistory/index.scss b/src/patient/pages/noteHistory/index.scss
index ec6b8b8..97ead62 100644
--- a/src/patient/pages/noteHistory/index.scss
+++ b/src/patient/pages/noteHistory/index.scss
@@ -18,7 +18,7 @@
padding: 2rpx 12rpx;
font-size: 24rpx;
color: #ffa300;
- line-height: 32rpx;
+ line-height: 36rpx;
border-radius: 6rpx;
&.tag1 {
background: rgba(255, 163, 0, 0.17);