Skip to content

飞
飞鹤小程序
Commit 84c72061 authored by weishengfei's avatar weishengfei
Browse files
Options

产检详情页面开发

parent cf40d44c
Hide whitespace changes
Inline Side-by-side
Showing with 702 additions and 29 deletions
pages.json
View file @ 84c72061
...@@ -117,6 +117,16 @@ ...@@ -117,6 +117,16 @@
"enablePullDownRefresh" : false, "enablePullDownRefresh" : false,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
},
// 产检详情
{
"path" : "pages/productionDetails/productionDetails",
"style" :
{
"navigationBarTitleText" : "产检详情",
"navigationBarBackgroundColor":"#ffffff",
"enablePullDownRefresh" : false
}
} }
], ],
"globalStyle": { "globalStyle": {
......
pages/addPostnatal/addPostnatal.vue
View file @ 84c72061
<template> <template>
<view class="add-postnatal"> <view class="add-postnatal">
<!-- 产检时间 --> <!-- 产检时间 -->
<view class="add-postnatal-time style1"> <view class="add-postnatal-time style1" v-if="isType">
<view class="time-l"> <view class="time-l">
<image src="/static/chanjianTool/icon7.png" /> <image src="/static/chanjianTool/icon7.png" />
产检时间 产检时间
...@@ -36,19 +36,23 @@ ...@@ -36,19 +36,23 @@
</view> </view>
<!-- 报告单 --> <!-- 报告单 -->
<view class="add-postnatal-bgd"> <view class="add-postnatal-bgd" v-if="isType">
<view class="style1"> <view class="style1">
<view class="time-l"> <view class="time-l">
<image src="/static/chanjianTool/icon9.png" /> <image src="/static/chanjianTool/icon9.png" />
本次报告单 本次报告单
</view> </view>
<view class="time-r"> <view class="time-r" @click="onSeeBtn">
查看全部 查看全部
<image src="/static/chanjianTool/icon13.png" /> <image src="/static/chanjianTool/icon13.png" />
</view> </view>
</view> </view>
<view class="img-list" v-if="bgdImgList.length > 0"> <view class="img-list">
<view class="upload-image" @click="onUpload">
<image src="/static/chanjianTool/icon11.png"></image>
</view>
<view class="img-list-item" v-for="( {url, id}, index) in bgdImgList" :key="index"> <view class="img-list-item" v-for="( {url, id}, index) in bgdImgList" :key="index">
<view class="item-image"> <view class="item-image">
<image class="img1" :src="url" mode="widthFix"></image> <image class="img1" :src="url" mode="widthFix"></image>
</view> </view>
...@@ -57,9 +61,7 @@ ...@@ -57,9 +61,7 @@
</view> </view>
</view> </view>
<!-- 上传报告单 --> <!-- 上传报告单 -->
<view class="upload" @click="onUpload">
<image src="/static/chanjianTool/icon11.png"></image>
</view>
<button class="form-btn" @click="onSave"> <button class="form-btn" @click="onSave">
保存 保存
</button> </button>
...@@ -129,6 +131,7 @@ ...@@ -129,6 +131,7 @@
showLoading, showLoading,
hideLoading hideLoading
} from '@/utils/index.js'; } from '@/utils/index.js';
import { onLoad } from '@dcloudio/uni-app'
import { import {
uploadImage uploadImage
} from "../../api/common.js"; } from "../../api/common.js";
...@@ -136,6 +139,9 @@ ...@@ -136,6 +139,9 @@
// 导入日期选择器组件 // 导入日期选择器组件
import DatePicker from '@/components/DatePicker.vue' import DatePicker from '@/components/DatePicker.vue'
// 控制显示修改字段
const isType = ref(true)
// 默认产检时间 // 默认产检时间
const time = ref(dateFormatter(new Date(), 'yyyy-MM-dd')); const time = ref(dateFormatter(new Date(), 'yyyy-MM-dd'));
...@@ -372,6 +378,29 @@ ...@@ -372,6 +378,29 @@
}); });
} }
}) })
// 查看更多
const onSeeBtn = () => {
// 跳转之前得缓存一下数据
uni.navigateTo({
url: '/pages/myReportCard/myReportCard'
})
}
onLoad((options) => {
console.log(options)
if(Object.keys(options ?? {}).length){
isType.value = false
uni.setNavigationBarTitle({
title: '修改项目'
});
}else{
isType.value = true
uni.setNavigationBarTitle({
title: '新增产检'
});
}
})
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
...@@ -462,24 +491,35 @@ ...@@ -462,24 +491,35 @@
.img-list { .img-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: flex-start;
padding: 0 27rpx; padding: 0 27rpx;
box-sizing: border-box; box-sizing: border-box;
padding-bottom: 180rpx; padding-bottom: 180rpx;
.upload-image{
width: 200rpx;
height: 200rpx;
border-radius: 10rpx;
overflow: hidden;
margin-right: 10rpx;
image {
width: 200rpx;
height: 200rpx;
}
}
.img-list-item { .img-list-item {
margin-right: 15rpx; // margin-right: 10rpx;
margin-bottom: 15rpx; margin-bottom: 15rpx;
position: relative; position: relative;
.item-image { .item-image {
width: 191rpx; width: 200rpx;
height: 191rpx; height: 200rpx;
border-radius: 10rpx; border-radius: 10rpx;
overflow: hidden; overflow: hidden;
.img1 { .img1 {
width: 191rpx; width: 200rpx;
height: 191rpx; height: 200rpx;
} }
} }
...@@ -523,18 +563,6 @@ ...@@ -523,18 +563,6 @@
} }
} }
} }
.upload {
position: fixed;
right: 0;
bottom: 260rpx;
image {
width: 185rpx;
height: 61rpx;
}
}
.form-btn { .form-btn {
width: 686rpx; width: 686rpx;
height: 94rpx; height: 94rpx;
......
pages/myReportCard/myReportCard.vue
View file @ 84c72061
...@@ -449,7 +449,7 @@ ...@@ -449,7 +449,7 @@
height: 169rpx; height: 169rpx;
border-radius: 10rpx; border-radius: 10rpx;
overflow: hidden; overflow: hidden;
margin-right: 14rpx; margin-right: 12rpx;
margin-bottom: 30rpx; margin-bottom: 30rpx;
flex-shrink: 0; flex-shrink: 0;
image { image {
......
pages/postnatalCheckUp/postnatalCheckUp.vue
View file @ 84c72061
...@@ -37,7 +37,11 @@ ...@@ -37,7 +37,11 @@
</view> </view>
<!-- 产检记录 --> <!-- 产检记录 -->
<view class="postnatal-con-record"> <view class="postnatal-con-record">
<view class="record-item" v-for="({id, time, num, week, status, project, isAdd}, index) in recordList" :key="index"> <view class="record-item"
v-for="({id, time, num, week, status, project, isAdd}, index) in recordList"
@click="onDetails(id)"
:key="index"
>
<image class="add-image" v-if="isAdd ===1 " src="/static/chanjianTool/bs.png"></image> <image class="add-image" v-if="isAdd ===1 " src="/static/chanjianTool/bs.png"></image>
<view class="item-t"> <view class="item-t">
<view class="item-t-l"> <view class="item-t-l">
...@@ -322,6 +326,12 @@ ...@@ -322,6 +326,12 @@
] ]
} }
]) ])
// 跳转产检详情页面
const onDetails =(id) =>{
uni.navigateTo({
url:`/pages/productionDetails/productionDetails?id=${id}`
})
}
// 拼接检查项目名称 // 拼接检查项目名称
const getProject = (projects) => { const getProject = (projects) => {
return projects.map(project => project.name).join('、'); return projects.map(project => project.name).join('、');
...@@ -418,6 +428,13 @@ ...@@ -418,6 +428,13 @@
const handleConfirm = () => { const handleConfirm = () => {
close(); close();
selectedValue.value = options[pickerValue.value[0]]; selectedValue.value = options[pickerValue.value[0]];
// 订阅提醒
// uni.requestSubscribeMessage({
// tmplIds: [''],
// success (res) {
// console.log(res)
// }
// })
} }
// 编辑时间 // 编辑时间
const onEdit = (id, time)=>{ const onEdit = (id, time)=>{
......
pages/productionCalendar/productionCalendar.vue
View file @ 84c72061
...@@ -10,7 +10,6 @@ ...@@ -10,7 +10,6 @@
<view class="info-r"> <view class="info-r">
<view class="info-r-t"> <view class="info-r-t">
{{info.name}} {{info.name}}
<image src="/static/chanjianTool/icon22.png"></image>
</view> </view>
<view class="info-r-b"> <view class="info-r-b">
怀孕{{info.week}}周 怀孕{{info.week}}周
...@@ -57,7 +56,12 @@ ...@@ -57,7 +56,12 @@
import { import {
ref ref
} from 'vue'; } from 'vue';
import {
onLoad
} from '@dcloudio/uni-app'
import {
throttleTap
} from '@/utils/index.js';
// 用户信息 // 用户信息
const info = ref({ const info = ref({
name: '好宝宝的妈妈', name: '好宝宝的妈妈',
......
pages/productionDetails/productionDetails.vue 0 → 100644
View file @ 84c72061
<template>
<view class="production-details">
<!-- tab 切换 -->
<view class="production-details-tabs" :class="{ 'fixed-tabs': isFixedTabs }" v-show="showTabs">
<view class="custom-tabs">
<view v-for="(tab, index) in tabInfo" :key="index" class="tab-item" :class="{ active: activeIndex === index }"
@click="scrollToSection(index)">
<view class="tab-line1">{{ tab?.line1 }}</view>
<view class="tab-line2" v-if="activeIndex === index"></view>
</view>
</view>
</view>
<!-- 内容区域 -->
<scroll-view class="content-scroll" scroll-y :scroll-top="scrollTop" @scroll="handleScroll" scroll-with-animation>
<view class="production-details-container">
<view class="container-1 pad">
第一次检查
</view>
<view class="container-2 pad">
<view class="container-2-l">
孕期5-6周
</view>
<view class="container-2-r" @click="onComplete">
<image v-if="!isCompleted" src="/static/chanjianTool/icon24.png"></image>
<image v-else src="/static/chanjianTool/icon25.png"></image>
完成检查
</view>
</view>
<view class="container-line pad">
</view>
<view class="container-3 pad">
<view class="container-3-l">
产检时间
</view>
<view class="container-3-r" @click="onChangeTime">
{{time ? time : '选择时间'}}
<image src="/static/chanjianTool/edit.png"></image>
</view>
</view>
<view class="container-4 pad">
建议时间：2025-07-05至2025-08-15
</view>
<!-- 产检须知 -->
<view class="project-box" id="section-0">
<view class="project-info">
<view class="time-l">
<image src="/static/chanjianTool/icon19.png" />
产检须知
</view>
</view>
<view class="project-content">
<view class="">
一、产检目的
</view>
<view class="">
这期间需要进行胎儿NT（胎儿颈项透明层厚度）的超声检查，初步筛查胎儿是否存在染色体异常、先天性心脏病、某些遗传综合征等。如果胎
</view>
<view class="">
一、产检目的
</view>
<view class="">
这期间需要进行胎儿NT（胎儿颈项透明层厚度）的超声检查，初步筛查胎儿是否存在染色体异常、先天性心脏病、某些遗传综合征等。如果胎
</view>
<view class="">
一、产检目的
</view>
<view class="">
这期间需要进行胎儿NT（胎儿颈项透明层厚度）的超声检查，初步筛查胎儿是否存在染色体异常、先天性心脏病、某些遗传综合征等。如果胎
</view>
</view>
</view>
<!-- 产检项目 -->
<view class="project-box" id="section-1">
<view class="project-info">
<view class="time-l">
<image src="/static/chanjianTool/icon19.png" />
产检项目
</view>
<view class="style1" @click="onModify">
修改项目
</view>
</view>
<view class="project-content">
<view class="">
一、产检目的
</view>
<view class="">
这期间需要进行胎儿NT（胎儿颈项透明层厚度）的超声检查，初步筛查胎儿是否存在染色体异常、先天性心脏病、某些遗传综合征等。如果胎
</view>
<view class="">
一、产检目的
</view>
<view class="">
这期间需要进行胎儿NT（胎儿颈项透明层厚度）的超声检查，初步筛查胎儿是否存在染色体异常、先天性心脏病、某些遗传综合征等。如果胎
</view>
<view class="">
一、产检目的
</view>
<view class="">
这期间需要进行胎儿NT（胎儿颈项透明层厚度）的超声检查，初步筛查胎儿是否存在染色体异常、先天性心脏病、某些遗传综合征等。如果胎
</view>
<view class="">
一、产检目的
</view>
<view class="">
这期间需要进行胎儿NT（胎儿颈项透明层厚度）的超声检查，初步筛查胎儿是否存在染色体异常、先天性心脏病、某些遗传综合征等。如果胎
</view>
</view>
</view>
<!-- 本次报告单 -->
<view class="project-box" id="section-2">
<view class="project-info">
<view class="time-l">
<image src="/static/chanjianTool/icon19.png" />
本次报告单
</view>
<view class="time-r style2" @click="onSeeBtn">
查看全部
<image src="/static/chanjianTool/icon13.png" />
</view>
</view>
<view class="img-list">
<view class="upload-image" @click="onUpload">
<image src="/static/chanjianTool/icon11.png"></image>
</view>
<view class="img-list-item" v-for="( {url, id}, index) in bgdImgList" :key="index">
<view class="item-image">
<image class="img1" :src="url" mode="widthFix"></image>
</view>
<image @click="onImageDel(id)" class="img" src="/static/chanjianTool/icon14.png"></image>
</view>
</view>
</view>
</view>
</scroll-view>
<!-- 产检选择时间 -->
<!-- 使用封装后的日期选择器组件 -->
<DatePicker v-model:visible="visible" :default-date="time" @confirm="handleDateConfirm" />
</view>
</template>
<script setup>
import {
ref,
onMounted
} from 'vue'
import {
onLoad
} from '@dcloudio/uni-app'
import {
throttleTap
} from '@/utils/index.js';
import DatePicker from '@/components/DatePicker.vue'
const tabInfo = [{
"line1": "产检须知",
},
{
"line1": "产检项目",
},
{
"line1": "本次报告单",
}
]
// 本次报告单
const bgdImgList = ref([{
url: 'https://momclub-picture-1253290912.cos.ap-beijing.myqcloud.com/xmh-mini-program/user/image/2025/07/17/xmh-mini-program_1752739702325_167279.jpeg',
id: Date.now() + Math.floor(Math.random() * 1000)
},
{
url: 'https://momclub-picture-1253290912.cos.ap-beijing.myqcloud.com/xmh-mini-program/user/image/2025/07/17/xmh-mini-program_1752739702325_167279.jpeg',
id: Date.now() + Math.floor(Math.random() * 1000)
},
{
url: 'https://momclub-picture-1253290912.cos.ap-beijing.myqcloud.com/xmh-mini-program/user/image/2025/07/17/xmh-mini-program_1752739702325_167279.jpeg',
id: Date.now() + Math.floor(Math.random() * 1000)
},
{
url: 'https://momclub-picture-1253290912.cos.ap-beijing.myqcloud.com/xmh-mini-program/user/image/2025/07/17/xmh-mini-program_1752739702325_167279.jpeg',
id: Date.now() + Math.floor(Math.random() * 1000)
},
{
url: 'https://momclub-picture-1253290912.cos.ap-beijing.myqcloud.com/xmh-mini-program/user/image/2025/07/17/xmh-mini-program_1752739702325_167279.jpeg',
id: Date.now() + Math.floor(Math.random() * 1000)
}
])
const time = ref('2025-07-21')
const onModify = () =>{
uni.navigateTo({
url:`/pages/addPostnatal/addPostnatal?time=${time.value}&type=1`
})
}
// 新增完成状态
const isCompleted = ref(false)
// 日期选择器
const visible = ref(false)
// 修改时间
const onChangeTime = throttleTap(() => {
visible.value = true
})
// 选择时间
const handleDateConfirm = (date) => {
visible.value = false
time.value = date
}
// 完成检查
const onComplete = () => {
// 切换状态
isCompleted.value = !isCompleted.value
console.log(isCompleted.value)
}
// 滚动相关状态
const scrollTop = ref(0)
const isFixedTabs = ref(false)
const showTabs = ref(false)
const activeIndex = ref(0)
const lastScrollTop = ref(0)
const scrolling = ref(false)
// 滚动处理函数
const handleScroll = (e) => {
const scrollTop = e.detail.scrollTop;
const scrollDirection = scrollTop > lastScrollTop.value ? 'down' : 'up';
// 优化：更灵敏的 tabs 显示/隐藏逻辑
if (scrollTop <= 0) {
// 滚动到顶部时立即隐藏 tabs
showTabs.value = false;
isFixedTabs.value = false;
} else if (scrollDirection === 'down' && scrollTop > 50) {
// 向下滚动超过阈值时显示固定 tabs
showTabs.value = true;
isFixedTabs.value = true;
} else if (scrollDirection === 'up') {
// 向上滚动时保持显示 tabs
showTabs.value = true;
isFixedTabs.value = true;
}
lastScrollTop.value = scrollTop;
// 优化：只在滚动停止时更新 activeIndex
if (scrolling.value) return;
updateActiveTab(scrollTop);
}
// 更新当前激活的tab
const updateActiveTab = (scrollTop) => {
const query = uni.createSelectorQuery()
query.select('#section-0').boundingClientRect()
query.select('#section-1').boundingClientRect()
query.select('#section-2').boundingClientRect()
query.exec((res) => {
const [section0, section1, section2] = res
// 优化：使用更精确的阈值计算
const threshold = 50 // 距离顶部的阈值
if (scrollTop >= section2.top - threshold) {
activeIndex.value = 2
} else if (scrollTop >= section1.top - threshold) {
activeIndex.value = 1
} else {
activeIndex.value = 0
}
})
}
// 点击tab滚动到对应区域
const scrollToSection = (index) => {
activeIndex.value = index;
scrolling.value = true;
const query = uni.createSelectorQuery();
query.select(`#section-${index}`).boundingClientRect();
query.select('.content-scroll').scrollOffset(); // 获取 scroll-view 当前的滚动位置
query.exec((res) => {
if (res[0] && res[1]) {
const sectionTop = res[0].top; // 目标区域距离视口顶部的距离
const currentScrollTop = res[1].scrollTop; // scroll-view 当前的滚动位置
const fixedTabsHeight = 120; // 固定 tabs 的高度（根据实际样式调整）
// 计算新的滚动位置
scrollTop.value = currentScrollTop + sectionTop - fixedTabsHeight;
}
setTimeout(() => {
scrolling.value = false;
}, 300);
});
};
// 删除上传图片
const onImageDel = (id) => {
bgdImgList.value.filter((item, index) => {
if (item.id === id) {
bgdImgList.value.splice(index, 1)
}
})
}
// 上传图片
const onUpload = throttleTap(() => {
// 唤起图片选择器
uni.chooseImage({
count: 15,
sizeType: ["original", "compressed"],
sourceType: ["album", "camera"],
success: async (res) => {
showLoading();
const tempFilePath = res.tempFilePaths[0];
console.log(tempFilePath)
const fs = uni.getFileSystemManager();
console.log(fs)
const base64 =
"data:image/jpeg;base64," + fs.readFileSync(tempFilePath, "base64");
const uploadRes = await uploadImage(base64);
hideLoading();
if (uploadRes.success) {
console.log(uploadRes)
bgdImgList.value.push({
url: uploadRes.data.url,
id: Date.now() + Math.floor(Math.random() * 1000)
})
} else {
uni.showToast({
title: uploadRes.message,
icon: "none",
});
}
},
});
})
// 查看更多
const onSeeBtn = () => {
uni.navigateTo({
url: '/pages/myReportCard/myReportCard'
})
}
// 获取传过来的参数
onLoad((options) => {
console.log(options)
})
</script>
<style lang="less" scoped>
.production-details {
position: relative;
height: 100vh;
overflow: hidden;
background: #fef7f2;
&-tabs {
width: 100%;
height: auto;
margin-top: 22rpx;
background: #ffffff;
transition: all 0.3s;
z-index: 100;
&.fixed-tabs {
position: fixed;
top: 0;
left: 0;
right: 0;
margin-top: 0;
background: #fff;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
height: 120rpx;
}
.custom-tabs {
display: flex;
justify-content: space-between;
padding: 55rpx 42rpx 32rpx 48rpx;
box-sizing: border-box;
.tab-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
position: relative;
&.active {
.tab-line1 {
color: #000000;
}
}
.tab-line1 {
font-size: 28rpx;
font-weight: bold;
color: #6f6d67;
line-height: 35rpx;
}
.tab-line2 {
position: absolute;
bottom: -8rpx;
left: 50%;
transform: translateX(-50%);
width: 28rpx;
height: 4rpx;
background: #d3a358;
border-radius: 6rpx;
}
}
}
}
.content-scroll {
height: 100vh;
box-sizing: border-box;
/* 给固定tabs留出空间 */
// padding-top: 120rpx;
}
&-container {
padding: 50rpx 35rpx;
box-sizing: border-box;
color: #000000;
.pad {
padding-left: 13rpx;
box-sizing: border-box;
}
.container-1 {
font-size: 24rpx;
font-weight: bold;
}
.container-2 {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 20rpx;
.container-2-l {
font-size: 38rpx;
color: #b27c1e;
font-weight: bold;
}
.container-2-r {
font-size: 24rpx;
color: #a68dbb;
display: flex;
align-items: center;
image {
width: 21rpx;
height: 22rpx;
margin-right: 7rpx;
}
}
}
.container-line {
width: 100%;
height: 1rpx;
background: #f7e4cd;
margin: 30rpx 0;
}
.container-3 {
display: flex;
align-items: center;
justify-content: space-between;
.container-3-l {
font-size: 28rpx;
color: #000000;
font-weight: bold;
}
.container-3-r {
display: flex;
align-items: center;
image {
width: 21rpx;
height: 21rpx;
margin-left: 15rpx;
}
}
}
.container-4 {
font-size: 24rpx;
color: #6f6d67;
margin: 20rpx 0 45rpx 0;
}
.project-box {
background: #ffffff;
border-radius: 24rpx;
padding: 0 27rpx 35rpx 27rpx;
box-sizing: border-box;
// width: 682rpx;
box-shadow: 0 4rpx 12rpx rgba(253, 240, 223, 0.8);
margin-bottom: 35rpx;
}
.project-info {
// width: 682rpx;
height: 105rpx;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 32rpx;
border-bottom: 1rpx solid #f7e4cd;
margin-bottom: 25rpx;
.time-l,
.time-r {
display: flex;
align-items: center;
}
.time-l {
color: #000000;
font-weight: 600;
image {
width: 32rpx;
height: 32rpx;
margin-right: 10rpx;
}
}
.style1 {
width: 121rpx;
height: 35rpx;
text-align: center;
line-height: 35rpx;
border-radius: 17.5rpx;
border: 1px solid #b27c1e;
font-size: 24rpx;
color: #b27c1e;
}
.style2 {
font-size: 24rpx;
color: #1d1e26;
image {
width: 8rpx;
height: 16rpx;
margin-left: 12rpx;
}
}
}
.img-list {
display: flex;
flex-wrap: wrap;
box-sizing: border-box;
justify-content: flex-start;
.upload-image {
width: 200rpx;
height: 200rpx;
border-radius: 10rpx;
overflow: hidden;
margin-right: 10rpx;
image {
width: 200rpx;
height: 200rpx;
}
}
.img-list-item {
// margin-right: 10rpx;
margin-bottom: 15rpx;
position: relative;
.item-image {
width: 200rpx;
height: 200rpx;
border-radius: 10rpx;
overflow: hidden;
.img1 {
width: 200rpx;
height: 200rpx;
}
}
.img {
position: absolute;
right: -12rpx;
top: -12rpx;
width: 25rpx;
height: 25rpx;
}
}
}
}
}
</style>
\ No newline at end of file
static/chanjianTool/icon11.png
View replaced file @ cf40d44c View file @ 84c72061
static/chanjianTool/icon11.png

3.66 KB | W: | H:

static/chanjianTool/icon11.png

4.19 KB | W: | H:

static/chanjianTool/icon11.png
static/chanjianTool/icon11.png
static/chanjianTool/icon11.png
static/chanjianTool/icon11.png
  • 2-up
  • Swipe
  • Onion skin
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment