Commit 06d9984f authored by weishengfei's avatar weishengfei

feat(obstetric): 自定义头部以及接口字段对接

parent 3f4b6508
......@@ -2,6 +2,13 @@
import requestModule from './request.js';
const { api } = requestModule;
/**
* 获取banner
* @returns
*/
export const postnatalJSON = () => api.get('/c/front/content',{type:'postnatal'});
/**
* 获取产检信息
* @returns
......
<template>
<view class="customize">
<view class="navbar">
<view class="navbar-t" :style="{height:statusBarHeight+'px'}">
</view>
<view class="navbar-b" :style="{height:navBarHeight+'px',marginLeft:leftIconWidth+'px'}">
<slot name="navbar-content"></slot>
</view>
</view>
<view class="fill" :style="{height:fillHeight+'px'}">
</view>
</view>
</template>
<script setup>
import {
ref
} from 'vue'
// const props = defineProps({
// title: {
// type: String,
// default: '首页'
// }
// })
const leftIconWidth = ref(0)
const navBarHeight = ref(0)
// 获取系统信息
const {statusBarHeight} = uni.getSystemInfoSync()
// 获取胶囊按钮信息
// #ifndef MP-ALIPAY || H5
const {top, height} = uni.getMenuButtonBoundingClientRect()
// 计算导航栏高度
navBarHeight.value = (top - statusBarHeight) *2 + height
// #endif
// 计算填充高度
const fillHeight = statusBarHeight + navBarHeight.value
</script>
<style lang="scss" scoped>
.customize {
.navbar{
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 100;
.navbar-t{
}
.navbar-b{
display: flex;
align-items: center;
padding: 0 35rpx;
}
}
}
</style>
\ No newline at end of file
......@@ -7,7 +7,7 @@
产检时间
</view>
<view class="time-r" @click="onChangeTime">
{{time}}
{{ time }}
<image src="/static/chanjianTool/icon13.png" />
</view>
</view>
......@@ -26,9 +26,9 @@
<!-- 添加的产品项目 -->
<view class="project-list" v-if="listData.length > 0">
<view class="list-item" v-for="({itemName, id}, index) in listData" :key="index">
<view class="list-item" v-for="({ itemName, id }, index) in listData" :key="index">
<view class="item-name">
{{itemName}}
{{ itemName }}
</view>
<image @click="onDetele(id)" class="item-img" src="/static/chanjianTool/delete.png"></image>
</view>
......@@ -48,11 +48,11 @@
</view>
</view>
<view class="img-list">
<view class="upload-image" @click="onUpload">
<view class="upload-image" @click="onUpload">
<image src="/static/chanjianTool/icon11.png"></image>
</view>
<view class="img-list-item" v-for="( item, index) in bgdImgList" :key="index">
<view class="img-list-item" v-for="(item, index) in bgdImgList" :key="index">
<view class="item-image">
<image class="img1" :src="item" mode="widthFix"></image>
</view>
......@@ -61,704 +61,722 @@
</view>
</view>
<!-- 上传报告单 -->
<button class="form-btn" @click="onSave">
保存
</button>
<!-- 产检选择时间 -->
<!-- 使用封装后的日期选择器组件 -->
<DatePicker
v-model:visible="visible"
:default-date="time"
@confirm="handleDateConfirm"
/>
<DatePicker v-model:visible="visible" :default-date="time" @confirm="handleDateConfirm" />
<!-- 产检项目底部弹窗 -->
<uni-popup ref="popup" type="bottom" :mask-click="false" background-color="#f6f8fa" border-radius="32rpx 32rpx 0 0">
<uni-popup ref="popup" type="bottom" :mask-click="false" background-color="#f6f8fa"
border-radius="32rpx 32rpx 0 0">
<view class="popup container">
<view class="popup-close" @click="onPopupClose">
<image src="/static/chanjianTool/icon15.png"></image>
</view>
<!-- 项目列表 -->
<scroll-view scroll-y @touchmove.stop.prevent=""
class="airport-list">
<scroll-view scroll-y @touchmove.stop.prevent="" class="airport-list">
<view v-for="group in examinationList" :key="group.groupName" class="letter-group">
<view class="letter-title">{{ group.groupName }}</view>
<view class="box">
<view v-for="item in group.list" :key="item.id" class="airport-item">
<view class="airport-item-radio" @click="toggleSelect(item)">
<image class="image-1" v-if="isSelected(item.id)" src="/static/chanjianTool/icon17.png" mode=""></image>
<view class="airport-item-radio" @click="toggleSelect(item)">
<image class="image-1" v-if="isSelected(item.id)"
src="/static/chanjianTool/icon17.png" mode=""></image>
<image class="image-2" v-else src="/static/chanjianTool/icon18.png"></image>
{{ item.itemName }}
</view>
{{ item.itemName }}
</view>
<view class="airport-item-image" @click.stop="onView(item)">
<image src="/static/chanjianTool/icon16.png"></image>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
<!-- 底部操作栏 -->
<button class="action-bar" @click="saveSelection">确认</button>
</view>
</uni-popup>
<!-- 项目介绍 -->
<uni-popup ref="popupText" type="bottom" :mask-click="true" background-color="#FFFFFF" border-radius="32rpx 32rpx 0 0">
<view class="container2">
<view class="text-t">
<uni-popup ref="popupText" type="bottom" :mask-click="true" background-color="#FFFFFF"
border-radius="32rpx 32rpx 0 0">
<view class="container2">
<view class="text-t">
<view class="t-1">
{{popupTextObj.itemName}}
{{ popupTextObj.itemName }}
</view>
<image @click="onPopupClose2" src="/static/chanjianTool/icon15.png" mode=""></image>
</view>
<image @click="onPopupClose2" src="/static/chanjianTool/icon15.png" mode=""></image>
</view>
<view class="text-c">
{{popupTextObj.introduction}}
{{ popupTextObj.introduction }}
</view>
</view>
</view>
</uni-popup>
</view>
</template>
<script setup>
import {
ref
} from 'vue'
import {
dateFormatter,
throttleTap,
showLoading,
hideLoading
} from '@/utils/index.js';
import { onLoad } from '@dcloudio/uni-app'
import {
uploadImage
} from "../../api/common.js";
import {
getAdd,
getExaminationItems
} from '../../api/obstetric.js';
// 导入日期选择器组件
import DatePicker from '@/components/DatePicker.vue'
// 默认产检时间
const time = ref('');
// 控制选择时间显示
const visible = ref(false)
// 产品项目底部弹窗
const popup = ref(null)
// 产品项目介绍底部弹窗
const popupText = ref(null)
// 存储查看项目介绍内容
const popupTextObj = ref({})
// 模拟项目列表
const examinationList = ref([])
// 已选项目(存储ID和name)
const selectedAirports = ref([]);
// 添加的产品列表
const listData = ref([]);
// 报告单图片
const bgdImgList = ref([])
// 查看项目介绍
const onView = (item) =>{
console.log(item)
popupTextObj.value = item
popupText.value.open()
}
// 关闭项目介绍弹窗
const onPopupClose2 = () => {
popupText.value.close()
}
// 修改时间
const onChangeTime = () => {
visible.value = true;
}
// 选择日期回调确认
const handleDateConfirm = (date) => {
console.log('选择的日期是:', date);
time.value = date;
import {
ref
} from 'vue'
import {
dateFormatter,
throttleTap,
showLoading,
hideLoading
} from '@/utils/index.js';
import { onLoad } from '@dcloudio/uni-app'
import {
uploadImage
} from "../../api/common.js";
import {
getAdd,
getExaminationItems
} from '../../api/obstetric.js';
// 导入日期选择器组件
import DatePicker from '@/components/DatePicker.vue'
// 默认产检时间
const time = ref('');
// 控制选择时间显示
const visible = ref(false)
// 产品项目底部弹窗
const popup = ref(null)
// 产品项目介绍底部弹窗
const popupText = ref(null)
// 存储查看项目介绍内容
const popupTextObj = ref({})
// 模拟项目列表
const examinationList = ref([])
// 已选项目(存储ID和name)
const selectedAirports = ref([]);
// 添加的产品列表
const listData = ref([]);
// 报告单图片
const bgdImgList = ref([])
// 查看项目介绍
const onView = (item) => {
console.log(item)
popupTextObj.value = item
popupText.value.open()
}
// 关闭项目介绍弹窗
const onPopupClose2 = () => {
popupText.value.close()
}
// 修改时间
const onChangeTime = () => {
visible.value = true;
}
// 选择日期回调确认
const handleDateConfirm = (date) => {
console.log('选择的日期是:', date);
time.value = date;
}
// 添加项目
const onAdd = () => {
wx.setPageStyle({
style: {
overflow: 'hidden'
}
})
popup.value.open()
// 回显数据
if (listData.value.length > 0) {
// 回显数据 - 将 listData 中的数据同步到 selectedAirports
selectedAirports.value = [...listData.value]
}
// 添加项目
const onAdd = () => {
wx.setPageStyle({
style: {
overflow: 'hidden'
}
})
popup.value.open()
// 回显数据
if(listData.value.length > 0){
// 回显数据 - 将 listData 中的数据同步到 selectedAirports
selectedAirports.value = [...listData.value]
}
// 关闭项目弹窗
const onPopupClose = () => {
wx.setPageStyle({
style: {
overflow: 'auto'
}
})
selectedAirports.value = []
popup.value.close()
}
// 检查是否已选中
const isSelected = (id) => {
return selectedAirports.value.some(item => item.id == id);
};
// 切换选择状态
const toggleSelect = (airport) => {
const index = selectedAirports.value.findIndex(item => item.id == airport.id);
if (index === -1) {
selectedAirports.value.push({
id: airport.id,
itemName: airport.itemName
});
} else {
selectedAirports.value.splice(index, 1);
}
// 关闭项目弹窗
const onPopupClose = () => {
wx.setPageStyle({
style: {
overflow: 'auto'
}
})
selectedAirports.value = []
popup.value.close()
};
// 保存选择
const saveSelection = () => {
console.log('已选项目ID:', selectedAirports.value);
// 合并 selectedAirports.value 到 listData.value,并去重
const combined = [...listData.value, ...selectedAirports.value];
const uniqueMap = new Map();
combined.forEach(item => uniqueMap.set(item.id, item));
listData.value = Array.from(uniqueMap.values());
onPopupClose();
};
// 移除已选项目
const removeSelected = (airport) => {
const index = selectedAirports.value.findIndex(item => item.id === airport.id);
if (index !== -1) {
selectedAirports.value.splice(index, 1);
}
// 检查是否已选中
const isSelected = (id) => {
return selectedAirports.value.some(item => item.id == id);
};
// 切换选择状态
const toggleSelect = (airport) => {
const index = selectedAirports.value.findIndex(item => item.id == airport.id);
if (index === -1) {
selectedAirports.value.push({
id: airport.id,
itemName: airport.itemName
});
} else {
selectedAirports.value.splice(index, 1);
};
// 删除所选产品项目
const onDetele = (id) => {
listData.value.filter((item, index) => {
if (item.id == id) {
listData.value.splice(index, 1)
}
};
// 保存选择
const saveSelection = () => {
console.log('已选项目ID:', selectedAirports.value);
// 合并 selectedAirports.value 到 listData.value,并去重
const combined = [...listData.value, ...selectedAirports.value];
const uniqueMap = new Map();
combined.forEach(item => uniqueMap.set(item.id, item));
listData.value = Array.from(uniqueMap.values());
onPopupClose();
};
// 移除已选项目
const removeSelected = (airport) => {
const index = selectedAirports.value.findIndex(item => item.id === airport.id);
if (index !== -1) {
selectedAirports.value.splice(index, 1);
})
}
// 删除上传图片
const onImageDel = (e) => {
bgdImgList.value.filter((item, index) => {
if (item === e) {
bgdImgList.value.splice(index, 1)
}
};
// 删除所选产品项目
const onDetele = (id) => {
listData.value.filter((item, index) => {
if (item.id == id) {
listData.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(uploadRes.data.url)
} else {
uni.showToast({
title: uploadRes.message,
icon: "none",
});
}
},
});
})
// 保存
const onSave = throttleTap(() => {
if (listData.value.length == 0) {
uni.showToast({
title: '还没有添加产检项哦',
icon: 'none'
})
return
}
// 删除上传图片
const onImageDel = (e) => {
bgdImgList.value.filter((item, index) => {
if (item === e) {
bgdImgList.value.splice(index, 1)
}
})
const ids = listData.value.map(item => item.id).join(',');
const param = {
checkupDate: time.value,
checkupItems: ids,
reportImages: bgdImgList.value
}
// 上传图片
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(uploadRes.data.url)
} else {
uni.showToast({
title: uploadRes.message,
icon: "none",
});
}
},
console.log(param, '参数')
showLoading();
// const {success, data} = await getAdd(data);
const { success, data, message } = {
success: true,
message: '',
data: {}
}
hideLoading();
if (success) {
uni.showToast({
title: "保存成功",
icon: "success",
});
uni.navigateBack()
} else {
uni.showToast({
title: message,
icon: "none",
});
})
// 保存
const onSave = throttleTap(() => {
if(listData.value.length == 0){
uni.showToast({
title: '还没有添加产检项哦',
icon: 'none'
})
return
}
const ids = listData.value.map(item => item.id).join(',');
const param = {
checkupDate: time.value,
checkupItems: ids,
reportImages: bgdImgList.value
}
console.log(param, '参数')
showLoading();
// const {success, data} = await getAdd(data);
const { success, data, message } = {
success: true,
message: '',
data:{}
}
hideLoading();
if(success){
uni.showToast({
title: "保存成功",
icon: "success",
});
uni.navigateBack()
} else {
uni.showToast({
title: message,
icon: "none",
});
}
})
// 查看更多
const onSeeBtn = () => {
// 跳转之前得缓存一下数据
uni.navigateTo({
url: '/pages/myReportCard/myReportCard'
})
}
// 获取产检项目列表
const getList = async () =>{
// const {success, data, message} = await getExaminationItems()
const {success, message, data} = {
success: true,
message: '',
data: {
items:[
})
// 查看更多
const onSeeBtn = () => {
// 跳转之前得缓存一下数据
uni.navigateTo({
url: '/pages/myReportCard/myReportCard'
})
}
// 获取产检项目列表
const getList = async () => {
// const {success, data, message} = await getExaminationItems()
const { success, message, data } = {
success: true,
message: '',
data:
[
{
"groupName": "A",
"list": [{
id: 'A001',
itemName: "阿克苏机场",
introduction: 'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
},
{
"groupName": "A",
"list": [{
id: 'A001',
itemName: "阿克苏机场",
introduction:'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
},
{
id: 'A002',
itemName: "阿拉山口机场阿拉山口机场阿拉山口机场",
introduction:'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
}
]
}, {
"groupName": "B",
"list": [{
id: 'B001',
itemName: "保山机场",
introduction:'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
},
{
id: 'B002',
itemName: "包头机场",
introduction:'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
}
]
id: 'A002',
itemName: "阿拉山口机场阿拉山口机场阿拉山口机场",
introduction: 'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
}
]
}
}
if(success){
examinationList.value = data.items
}
]
}, {
"groupName": "B",
"list": [{
id: 'B001',
itemName: "保山机场",
introduction: 'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
},
{
id: 'B002',
itemName: "包头机场",
introduction: 'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
}
]
}
]
}
onLoad((options) => {
if(Object.keys(options).length > 0 && options.time){
time.value = options.time
}else{
time.value = dateFormatter(new Date(), 'yyyy-MM-dd')
}
console.log(options, '新增页面')
getList()
})
if (success) {
examinationList.value = data
}
}
onLoad((options) => {
if (Object.keys(options).length > 0 && options.time) {
time.value = options.time
} else {
time.value = dateFormatter(new Date(), 'yyyy-MM-dd')
}
console.log(options, '新增页面')
getList()
})
</script>
<style lang="less" scoped>
.add-postnatal {
height: 100vh;
background-color: #f7f8fa;
padding: 25rpx 35rpx;
.style1 {
width: 680rpx;
height: 115rpx;
background: #ffffff;
.add-postnatal {
height: 100vh;
background-color: #f7f8fa;
padding: 25rpx 35rpx;
.style1 {
width: 680rpx;
height: 115rpx;
background: #ffffff;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 30rpx;
padding: 0 27rpx;
box-sizing: border-box;
.time-l,
.time-r,
.project-r {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 30rpx;
padding: 0 27rpx;
box-sizing: border-box;
}
.time-l,
.time-r,
.project-r {
display: flex;
align-items: center;
.time-l {
color: #000000;
font-weight: 600;
image {
width: 30rpx;
height: 30rpx;
margin-right: 10rpx;
}
}
}
.time-l {
color: #000000;
font-weight: 600;
&-time {
margin-top: 22rpx;
border-radius: 16rpx;
image {
width: 30rpx;
height: 30rpx;
margin-right: 10rpx;
}
.time-r {
color: #1d1e26;
image {
width: 8rpx;
height: 16rpx;
margin-left: 12rpx;
}
}
}
&-time {
margin-top: 22rpx;
border-radius: 16rpx;
&-project {
width: 680rpx;
border-radius: 16rpx;
overflow: hidden;
margin-top: 22rpx;
background: #ffffff;
.time-r {
color: #1d1e26;
.project-r {
color: #b27c1e;
image {
width: 8rpx;
height: 16rpx;
margin-left: 12rpx;
}
image {
width: 27rpx;
height: 27rpx;
margin-right: 5rpx;
}
}
}
&-project {
width: 680rpx;
border-radius: 16rpx;
overflow: hidden;
margin-top: 22rpx;
background: #ffffff;
&-bgd {
width: 680rpx;
border-radius: 16rpx;
margin-top: 22rpx;
background: #ffffff;
.project-r {
color: #b27c1e;
.time-r {
color: #1d1e26;
image {
width: 27rpx;
height: 27rpx;
margin-right: 5rpx;
}
image {
width: 8rpx;
height: 16rpx;
margin-left: 12rpx;
}
}
&-bgd {
width: 680rpx;
border-radius: 16rpx;
margin-top: 22rpx;
background: #ffffff;
.img-list {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
padding: 0 27rpx;
box-sizing: border-box;
padding-bottom: 180rpx;
.time-r {
color: #1d1e26;
.upload-image {
width: 200rpx;
height: 200rpx;
border-radius: 10rpx;
overflow: hidden;
margin-right: 10rpx;
image {
width: 8rpx;
height: 16rpx;
margin-left: 12rpx;
width: 200rpx;
height: 200rpx;
}
}
.img-list {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
padding: 0 27rpx;
box-sizing: border-box;
padding-bottom: 180rpx;
.upload-image{
.img-list-item {
// margin-right: 10rpx;
margin-bottom: 15rpx;
position: relative;
.item-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 {
.img1 {
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;
}
}
}
}
.project-list {
.list-item {
width: 680rpx;
height: 115rpx;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 30rpx;
padding: 0 27rpx;
border-top: 1rpx solid #e9e9e9;
box-sizing: border-box;
.item-name {
width: 500rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 30rpx;
color: #000000;
font-weight: 500;
}
.item-img {
width: 31rpx;
height: 31rpx;
.img {
position: absolute;
right: -12rpx;
top: -12rpx;
width: 25rpx;
height: 25rpx;
}
}
}
.form-btn {
width: 686rpx;
height: 94rpx;
border-radius: 46rpx;
background-color: #d3a358;
color: #ffffff;
font-size: 32rpx;
}
.project-list {
.list-item {
width: 680rpx;
height: 115rpx;
display: flex;
align-items: center;
justify-content: center;
justify-content: space-between;
font-size: 30rpx;
padding: 0 27rpx;
border-top: 1rpx solid #e9e9e9;
box-sizing: border-box;
position: fixed;
bottom: 60rpx;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
.item-name {
width: 500rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 30rpx;
color: #000000;
font-weight: 500;
}
// 索引栏
.container {
display: flex;
flex-direction: column;
height: 1200rpx;
padding: 20rpx 35rpx 30rpx 35rpx;
overflow: hidden;
background: #f6f8fa;
position: relative;
border-radius: 32rpx 32rpx 0 0;
}
.popup-close{
position: absolute;
right: 34rpx;
top: 45rpx;
z-index: 10;
image{
width: 28rpx;
height: 29rpx;
}
}
.airport-list {
flex: 1;
overflow: auto;
-webkit-overflow-scrolling: touch;
.item-img {
width: 31rpx;
height: 31rpx;
}
}
}
.form-btn {
width: 686rpx;
height: 94rpx;
border-radius: 46rpx;
background-color: #d3a358;
color: #ffffff;
font-size: 32rpx;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
bottom: 60rpx;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
// 索引栏
.container {
display: flex;
flex-direction: column;
height: 1200rpx;
padding: 20rpx 35rpx 30rpx 35rpx;
overflow: hidden;
background: #f6f8fa;
position: relative;
border-radius: 32rpx 32rpx 0 0;
}
.letter-group {
margin-top: 30rpx;
margin-bottom: 30rpx;
.popup-close {
position: absolute;
right: 34rpx;
top: 45rpx;
z-index: 10;
image {
width: 28rpx;
height: 29rpx;
}
}
.letter-title {
padding: 0 38rpx;
font-weight: bold;
// position: sticky;
// top: 0;
z-index: 10;
color: #000000;
font-weight: 600;
font-size: 34rpx;
margin-bottom: 30rpx;
.airport-list {
flex: 1;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.letter-group {
margin-top: 30rpx;
margin-bottom: 30rpx;
}
.letter-title {
padding: 0 38rpx;
font-weight: bold;
// position: sticky;
// top: 0;
z-index: 10;
color: #000000;
font-weight: 600;
font-size: 34rpx;
margin-bottom: 30rpx;
}
.box {
width: 100%;
overflow: hidden;
border-radius: 16rpx;
padding: 0 0 0 36rpx;
box-sizing: border-box;
background: #fff;
}
.airport-item {
width: 100%;
height: 115rpx;
box-sizing: border-box;
background-color: #ffffff;
touch-action: none;
font-size: 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1rpx solid #e2e2e2;
&:last-child {
border: none;
}
.box{
width: 100%;
overflow: hidden;
border-radius: 16rpx;
padding: 0 0 0 36rpx;
box-sizing: border-box;
background: #fff;
}
.airport-item {
width: 100%;
.airport-item-image {
width: 72rpx;
text-align: center;
height: 115rpx;
box-sizing: border-box;
background-color: #ffffff;
touch-action: none;
font-size: 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1rpx solid #e2e2e2;
&:last-child{
border:none;
}
.airport-item-image{
width: 72rpx;
text-align: center;
height: 115rpx;
line-height: 115rpx;
image{
width: 11rpx;
height: 21rpx;
}
line-height: 115rpx;
image {
width: 11rpx;
height: 21rpx;
}
}
.airport-item-radio{
flex: 1;
display: flex;
align-items: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
image{
margin-right: 8rpx;
margin-top: 5rpx;
}
.image-1{
width: 29rpx;
height: 29rpx;
}
.image-2{
width: 29rpx;
height: 29rpx;
}
}
.action-bar {
width: 686rpx;
height: 94rpx;
border-radius: 46rpx;
background-color: #d3a358;
color: #ffffff;
font-size: 32rpx;
display: flex;
align-items: center;
justify-content: center;
position: sticky;
bottom: 0;
z-index: 10;
}
}
.selected-list {
margin-top: 20rpx;
padding: 20rpx;
background-color: #f9f9f9;
border-radius: 10rpx;
max-height: 200rpx;
overflow: auto;
-webkit-overflow-scrolling: touch;
.airport-item-radio {
flex: 1;
display: flex;
align-items: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
image {
margin-right: 8rpx;
margin-top: 5rpx;
}
.title {
font-weight: bold;
margin-bottom: 15rpx;
position: sticky;
top: 0;
background-color: #f9f9f9;
z-index: 10;
.image-1 {
width: 29rpx;
height: 29rpx;
}
.selected-items {
display: flex;
flex-wrap: wrap;
.image-2 {
width: 29rpx;
height: 29rpx;
}
}
.action-bar {
width: 686rpx;
height: 94rpx;
border-radius: 46rpx;
background-color: #d3a358;
color: #ffffff;
font-size: 32rpx;
display: flex;
align-items: center;
justify-content: center;
position: sticky;
bottom: 0;
z-index: 10;
}
.selected-list {
margin-top: 20rpx;
padding: 20rpx;
background-color: #f9f9f9;
border-radius: 10rpx;
max-height: 200rpx;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.title {
font-weight: bold;
margin-bottom: 15rpx;
position: sticky;
top: 0;
background-color: #f9f9f9;
z-index: 10;
}
.selected-items {
display: flex;
flex-wrap: wrap;
}
.selected-item {
.selected-item {
position: relative;
background-color: #e6f7ff;
color: #1890ff;
padding: 10rpx 20rpx;
margin: 0 15rpx 15rpx 0;
border-radius: 30rpx;
touch-action: none;
}
.remove {
margin-left: 10rpx;
color: #ff4d4f;
cursor: pointer;
}
.container2 {
height: 595rpx;
padding: 50rpx 35rpx 30rpx 35rpx;
overflow: hidden;
background: #ffffff;
border-radius: 32rpx 32rpx 0 0;
color: #000000;
display: flex;
flex-direction: column;
.text-t {
flex-shrink: 0;
position: relative;
background-color: #e6f7ff;
color: #1890ff;
padding: 10rpx 20rpx;
margin: 0 15rpx 15rpx 0;
border-radius: 30rpx;
touch-action: none;
}
.remove {
margin-left: 10rpx;
color: #ff4d4f;
cursor: pointer;
}
.container2 {
height:595rpx;
padding: 50rpx 35rpx 30rpx 35rpx;
overflow: hidden;
background: #ffffff;
border-radius: 32rpx 32rpx 0 0;
color: #000000;
display: flex;
flex-direction: column;
.text-t{
flex-shrink: 0;
position: relative;
.t-1{
flex: 1;
font-size: 34rpx;
font-weight: 700;
}
image{
position: absolute;
top: 10.5rpx;
right: 0rpx;
width: 28rpx;
height: 29rpx;
}
}
.text-c{
.t-1 {
flex: 1;
overflow: auto;
margin-top: 22rpx;
font-weight: 500;
font-size: 34rpx;
font-weight: 700;
}
image {
position: absolute;
top: 10.5rpx;
right: 0rpx;
width: 28rpx;
height: 29rpx;
}
}
.text-c {
flex: 1;
overflow: auto;
margin-top: 22rpx;
font-weight: 500;
}
}
}
</style>
\ No newline at end of file
......@@ -15,644 +15,666 @@
<!-- 添加的产品项目 -->
<view class="project-list" v-if="listData.length > 0">
<view class="list-item" v-for="({itemName, id}, index) in listData" :key="index">
<view class="list-item" v-for="({ itemName, id }, index) in listData" :key="index">
<view class="item-name">
{{itemName}}
{{ itemName }}
</view>
<image @click="onDetele(id)" class="item-img" src="/static/chanjianTool/delete.png"></image>
</view>
</view>
</view>
<!-- 上传报告单 -->
<button class="form-btn" @click="onSave">
保存
</button>
<!-- 产检项目底部弹窗 -->
<uni-popup ref="popup" type="bottom" :mask-click="false" background-color="#f6f8fa" border-radius="32rpx 32rpx 0 0">
<uni-popup ref="popup" type="bottom" :mask-click="false" background-color="#f6f8fa"
border-radius="32rpx 32rpx 0 0">
<view class="popup container">
<view class="popup-close" @click="onPopupClose">
<image src="/static/chanjianTool/icon15.png"></image>
</view>
<!-- 项目列表 -->
<scroll-view scroll-y @touchmove.stop.prevent=""
class="airport-list">
<scroll-view scroll-y @touchmove.stop.prevent="" class="airport-list">
<view v-for="group in examinationList" :key="group.groupName" class="letter-group">
<view class="letter-title">{{ group.groupName }}</view>
<view class="box">
<view v-for="item in group.list" :key="item.id" class="airport-item">
<view class="airport-item-radio" @click="toggleSelect(item)">
<image class="image-1" v-if="isSelected(item.id)" src="/static/chanjianTool/icon17.png" mode=""></image>
<view class="airport-item-radio" @click="toggleSelect(item)">
<image class="image-1" v-if="isSelected(item.id)"
src="/static/chanjianTool/icon17.png" mode=""></image>
<image class="image-2" v-else src="/static/chanjianTool/icon18.png"></image>
{{ item.itemName }}
</view>
{{ item.itemName }}
</view>
<view class="airport-item-image" @click.stop="onView(item)">
<image src="/static/chanjianTool/icon16.png"></image>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
<!-- 底部操作栏 -->
<button class="action-bar" @click="saveSelection">确认</button>
</view>
</uni-popup>
<!-- 项目介绍 -->
<uni-popup ref="popupText" type="bottom" :mask-click="true" background-color="#FFFFFF" border-radius="32rpx 32rpx 0 0">
<view class="container2">
<view class="text-t">
<uni-popup ref="popupText" type="bottom" :mask-click="true" background-color="#FFFFFF"
border-radius="32rpx 32rpx 0 0">
<view class="container2">
<view class="text-t">
<view class="t-1">
{{popupTextObj.itemName}}
{{ popupTextObj.itemName }}
</view>
<image @click="onPopupClose2" src="/static/chanjianTool/icon15.png" mode=""></image>
</view>
<image @click="onPopupClose2" src="/static/chanjianTool/icon15.png" mode=""></image>
</view>
<view class="text-c">
{{popupTextObj.introduction}}
{{ popupTextObj.introduction }}
</view>
</view>
</view>
</uni-popup>
</view>
</template>
<script setup>
import {
ref
} from 'vue'
import {
throttleTap,
showLoading,
hideLoading
} from '@/utils/index.js';
import { onLoad } from '@dcloudio/uni-app'
import {
getUpdate,
getExaminationItems
} from '../../api/obstetric.js';
// 产检id
const editId = ref('')
// 产品项目底部弹窗
const popup = ref(null)
// 产品项目介绍底部弹窗
const popupText = ref(null)
// 存储查看项目介绍内容
const popupTextObj = ref({})
// 项目列表数据
const examinationList = ref([])
// 已选项目(存储ID和name)
const selectedAirports = ref([]);
// 添加的产品列表
const listData = ref([]);
// 查看项目介绍
const onView = (item) =>{
console.log(item)
popupTextObj.value = item
popupText.value.open()
}
// 关闭项目介绍弹窗
const onPopupClose2 = () => {
popupText.value.close()
import {
ref
} from 'vue'
import {
throttleTap,
showLoading,
hideLoading
} from '@/utils/index.js';
import { onLoad } from '@dcloudio/uni-app'
import {
getUpdate,
getExaminationItems
} from '../../api/obstetric.js';
// 产检id
const editId = ref('')
// 产品项目底部弹窗
const popup = ref(null)
// 产品项目介绍底部弹窗
const popupText = ref(null)
// 存储查看项目介绍内容
const popupTextObj = ref({})
// 项目列表数据
const examinationList = ref([])
// 已选项目(存储ID和name)
const selectedAirports = ref([]);
// 添加的产品列表
const listData = ref([]);
// 查看项目介绍
const onView = (item) => {
console.log(item)
popupTextObj.value = item
popupText.value.open()
}
// 关闭项目介绍弹窗
const onPopupClose2 = () => {
popupText.value.close()
}
// 添加项目
const onAdd = () => {
wx.setPageStyle({
style: {
overflow: 'hidden'
}
})
popup.value.open()
// 回显数据
if (listData.value.length > 0) {
// 回显数据 - 将 listData 中的数据同步到 selectedAirports
selectedAirports.value = [...listData.value]
}
// 添加项目
const onAdd = () => {
wx.setPageStyle({
style: {
overflow: 'hidden'
}
})
popup.value.open()
// 回显数据
if(listData.value.length > 0){
// 回显数据 - 将 listData 中的数据同步到 selectedAirports
selectedAirports.value = [...listData.value]
}
// 关闭项目弹窗
const onPopupClose = () => {
wx.setPageStyle({
style: {
overflow: 'auto'
}
})
selectedAirports.value = []
popup.value.close()
}
// 检查是否已选中
const isSelected = (id) => {
return selectedAirports.value.some(item => item.id == id);
};
// 切换选择状态
const toggleSelect = (airport) => {
const index = selectedAirports.value.findIndex(item => item.id == airport.id);
if (index === -1) {
selectedAirports.value.push({
id: airport.id,
itemName: airport.itemName
});
} else {
selectedAirports.value.splice(index, 1);
}
// 关闭项目弹窗
const onPopupClose = () => {
wx.setPageStyle({
style: {
overflow: 'auto'
}
})
selectedAirports.value = []
popup.value.close()
};
// 保存选择
const saveSelection = () => {
console.log('已选项目ID:', selectedAirports.value);
// 合并 selectedAirports.value 到 listData.value,并去重
const combined = [...listData.value, ...selectedAirports.value];
const uniqueMap = new Map();
combined.forEach(item => uniqueMap.set(item.id, item));
listData.value = Array.from(uniqueMap.values());
onPopupClose();
};
// 移除已选项目
const removeSelected = (airport) => {
const index = selectedAirports.value.findIndex(item => item.id == airport.id);
if (index !== -1) {
selectedAirports.value.splice(index, 1);
}
// 检查是否已选中
const isSelected = (id) => {
return selectedAirports.value.some(item => item.id == id);
};
// 切换选择状态
const toggleSelect = (airport) => {
const index = selectedAirports.value.findIndex(item => item.id == airport.id);
if (index === -1) {
selectedAirports.value.push({
id: airport.id,
itemName: airport.itemName
});
} else {
selectedAirports.value.splice(index, 1);
};
// 删除所选产品项目
const onDetele = (id) => {
listData.value.filter((item, index) => {
if (item.id == id) {
listData.value.splice(index, 1)
}
};
// 保存选择
const saveSelection = () => {
console.log('已选项目ID:', selectedAirports.value);
// 合并 selectedAirports.value 到 listData.value,并去重
const combined = [...listData.value, ...selectedAirports.value];
const uniqueMap = new Map();
combined.forEach(item => uniqueMap.set(item.id, item));
listData.value = Array.from(uniqueMap.values());
onPopupClose();
};
// 移除已选项目
const removeSelected = (airport) => {
const index = selectedAirports.value.findIndex(item => item.id == airport.id);
if (index !== -1) {
selectedAirports.value.splice(index, 1);
}
};
// 删除所选产品项目
const onDetele = (id) => {
listData.value.filter((item, index) => {
if (item.id == id) {
listData.value.splice(index, 1)
}
})
}
// 保存
const onSave = throttleTap(() => {
if (listData.value.length == 0) {
uni.showToast({
title: '还没有添加产检项哦',
icon: 'none'
})
return
}
// 保存
const onSave = throttleTap(() => {
if(listData.value.length == 0){
uni.showToast({
title: '还没有添加产检项哦',
icon: 'none'
})
return
}
const ids = listData.value.map(item => item.id).join(',');
const param = {
id: editId.value,
checkupItems: ids
}
console.log(param, '参数')
showLoading();
// const {success, data} = await getUpdate(data);
const { success, data, message } = {
success: true,
message: '',
data:{}
}
hideLoading();
if(success){
uni.showToast({
title: "保存成功",
icon: "success",
});
// 返回B页面并刷新数据
const pages = getCurrentPages();
const prevPage = pages[pages.length - 2]; // 获取上一页(详情页面)实例
if (prevPage) {
prevPage.onLoad({id:editId.value}); // 调用页面的刷新方法
};
uni.navigateBack({
delta: 1 // 返回上一页
});
} else {
uni.showToast({
title: message,
icon: "none",
});
}
})
// 获取产检项目列表
const getList = async () =>{
// const {success, data, message} = await getExaminationItems()
const {success, message, data} = {
success: true,
message: '',
data: {
items:[
{
"groupName": "A",
"list": [{
id: 'A001',
itemName: "阿克苏机场",
introduction:'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
},
{
id: 'A002',
itemName: "阿拉山口机场阿拉山口机场阿拉山口机场",
introduction:'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
}
]
}, {
"groupName": "B",
"list": [{
itemName: '测量胎儿颈部透明层厚度(NT)',
id: '1',
introduction:'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
},
{
itemName: '无创产前基因检测(NIPT)(非必查)',
id: '2',
introduction:'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
}
]
}
const ids = listData.value.map(item => item.id).join(',');
const param = {
id: editId.value,
checkupItems: ids
}
console.log(param, '参数')
showLoading();
// const {success, data} = await getUpdate(data);
const { success, data, message } = {
success: true,
message: '',
data: {}
}
hideLoading();
if (success) {
uni.showToast({
title: "保存成功",
icon: "success",
});
// 返回B页面并刷新数据
const pages = getCurrentPages();
const prevPage = pages[pages.length - 2]; // 获取上一页(详情页面)实例
if (prevPage) {
prevPage.onLoad({ id: editId.value }); // 调用页面的刷新方法
};
uni.navigateBack({
delta: 1 // 返回上一页
});
} else {
uni.showToast({
title: message,
icon: "none",
});
}
})
// 获取产检项目列表
const getList = async () => {
// const {success, data, message} = await getExaminationItems()
const { success, message, data } = {
success: true,
message: '',
data: [
{
"groupName": "A",
"list": [{
id: 'A001',
itemName: "阿克苏机场",
introduction: 'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
},
{
id: 'A002',
itemName: "阿拉山口机场阿拉山口机场阿拉山口机场",
introduction: 'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
}
]
}, {
"groupName": "B",
"list": [{
itemName: '测量胎儿颈部透明层厚度(NT)',
id: '1',
introduction: 'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
},
{
itemName: '无创产前基因检测(NIPT)(非必查)',
id: '2',
introduction: 'NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1NT可以帮助判断胎宝宝是否患有唐氏综合征等染色体异常,或存在畸形的风险,有助于早期发现胎儿异常风险问题。 NT检查通常在孕 1'
}
]
}
}
if(success){
examinationList.value = data.items
}
]
}
onLoad((options) => {
const {id, examinationItems} = JSON.parse(options.item)
console.log( id, examinationItems)
editId.value = id
listData.value = examinationItems
getList()
})
if (success) {
examinationList.value = data
}
}
onLoad((options) => {
const { id, examinationItems } = JSON.parse(options.item)
console.log(id, examinationItems)
editId.value = id
listData.value = examinationItems
getList()
})
</script>
<style lang="less" scoped>
.add-postnatal {
height: 100vh;
background-color: #f7f8fa;
padding: 25rpx 35rpx;
.style1 {
width: 680rpx;
height: 115rpx;
background: #ffffff;
.add-postnatal {
height: 100vh;
background-color: #f7f8fa;
padding: 25rpx 35rpx;
.style1 {
width: 680rpx;
height: 115rpx;
background: #ffffff;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 30rpx;
padding: 0 27rpx;
box-sizing: border-box;
.time-l,
.time-r,
.project-r {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 30rpx;
padding: 0 27rpx;
box-sizing: border-box;
}
.time-l {
color: #000000;
font-weight: 600;
.time-l,
.time-r,
.project-r {
display: flex;
align-items: center;
image {
width: 30rpx;
height: 30rpx;
margin-right: 10rpx;
}
}
}
.time-l {
color: #000000;
font-weight: 600;
&-time {
margin-top: 22rpx;
border-radius: 16rpx;
image {
width: 30rpx;
height: 30rpx;
margin-right: 10rpx;
}
.time-r {
color: #1d1e26;
image {
width: 8rpx;
height: 16rpx;
margin-left: 12rpx;
}
}
}
&-time {
margin-top: 22rpx;
border-radius: 16rpx;
&-project {
width: 680rpx;
border-radius: 16rpx;
overflow: hidden;
margin-top: 22rpx;
background: #ffffff;
.time-r {
color: #1d1e26;
.project-r {
color: #b27c1e;
image {
width: 8rpx;
height: 16rpx;
margin-left: 12rpx;
}
image {
width: 27rpx;
height: 27rpx;
margin-right: 5rpx;
}
}
}
&-project {
width: 680rpx;
border-radius: 16rpx;
overflow: hidden;
margin-top: 22rpx;
background: #ffffff;
&-bgd {
width: 680rpx;
border-radius: 16rpx;
margin-top: 22rpx;
background: #ffffff;
.project-r {
color: #b27c1e;
.time-r {
color: #1d1e26;
image {
width: 27rpx;
height: 27rpx;
margin-right: 5rpx;
}
image {
width: 8rpx;
height: 16rpx;
margin-left: 12rpx;
}
}
&-bgd {
width: 680rpx;
border-radius: 16rpx;
margin-top: 22rpx;
background: #ffffff;
.img-list {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
padding: 0 27rpx;
box-sizing: border-box;
padding-bottom: 180rpx;
.time-r {
color: #1d1e26;
.upload-image {
width: 200rpx;
height: 200rpx;
border-radius: 10rpx;
overflow: hidden;
margin-right: 10rpx;
image {
width: 8rpx;
height: 16rpx;
margin-left: 12rpx;
width: 200rpx;
height: 200rpx;
}
}
.img-list {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
padding: 0 27rpx;
box-sizing: border-box;
padding-bottom: 180rpx;
.upload-image{
.img-list-item {
// margin-right: 10rpx;
margin-bottom: 15rpx;
position: relative;
.item-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 {
.img1 {
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;
}
}
}
}
.project-list {
.list-item {
width: 680rpx;
height: 115rpx;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 30rpx;
padding: 0 27rpx;
border-top: 1rpx solid #e9e9e9;
box-sizing: border-box;
.item-name {
width: 500rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 30rpx;
color: #000000;
font-weight: 500;
}
.item-img {
width: 31rpx;
height: 31rpx;
.img {
position: absolute;
right: -12rpx;
top: -12rpx;
width: 25rpx;
height: 25rpx;
}
}
}
.form-btn {
width: 686rpx;
height: 94rpx;
border-radius: 46rpx;
background-color: #d3a358;
color: #ffffff;
font-size: 32rpx;
}
.project-list {
.list-item {
width: 680rpx;
height: 115rpx;
display: flex;
align-items: center;
justify-content: center;
justify-content: space-between;
font-size: 30rpx;
padding: 0 27rpx;
border-top: 1rpx solid #e9e9e9;
box-sizing: border-box;
position: fixed;
bottom: 60rpx;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
.item-name {
width: 500rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 30rpx;
color: #000000;
font-weight: 500;
}
// 索引栏
.container {
display: flex;
flex-direction: column;
height: 1200rpx;
padding: 20rpx 35rpx 30rpx 35rpx;
overflow: hidden;
background: #f6f8fa;
position: relative;
border-radius: 32rpx 32rpx 0 0;
}
.popup-close{
position: absolute;
right: 34rpx;
top: 45rpx;
z-index: 10;
image{
width: 28rpx;
height: 29rpx;
}
}
.airport-list {
flex: 1;
overflow: auto;
-webkit-overflow-scrolling: touch;
.item-img {
width: 31rpx;
height: 31rpx;
}
}
}
.letter-group {
margin-top: 30rpx;
margin-bottom: 30rpx;
.form-btn {
width: 686rpx;
height: 94rpx;
border-radius: 46rpx;
background-color: #d3a358;
color: #ffffff;
font-size: 32rpx;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
bottom: 60rpx;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
// 索引栏
.container {
display: flex;
flex-direction: column;
height: 1200rpx;
padding: 20rpx 35rpx 30rpx 35rpx;
overflow: hidden;
background: #f6f8fa;
position: relative;
border-radius: 32rpx 32rpx 0 0;
}
.popup-close {
position: absolute;
right: 34rpx;
top: 45rpx;
z-index: 10;
image {
width: 28rpx;
height: 29rpx;
}
}
.letter-title {
padding: 0 38rpx;
font-weight: bold;
// position: sticky;
// top: 0;
z-index: 10;
color: #000000;
font-weight: 600;
font-size: 34rpx;
margin-bottom: 30rpx;
.airport-list {
flex: 1;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.letter-group {
margin-top: 30rpx;
margin-bottom: 30rpx;
}
.letter-title {
padding: 0 38rpx;
font-weight: bold;
// position: sticky;
// top: 0;
z-index: 10;
color: #000000;
font-weight: 600;
font-size: 34rpx;
margin-bottom: 30rpx;
}
.box {
width: 100%;
overflow: hidden;
border-radius: 16rpx;
padding: 0 0 0 36rpx;
box-sizing: border-box;
background: #fff;
}
.airport-item {
width: 100%;
height: 115rpx;
box-sizing: border-box;
background-color: #ffffff;
touch-action: none;
font-size: 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1rpx solid #e2e2e2;
&:last-child {
border: none;
}
.box{
width: 100%;
overflow: hidden;
border-radius: 16rpx;
padding: 0 0 0 36rpx;
box-sizing: border-box;
background: #fff;
}
.airport-item {
width: 100%;
.airport-item-image {
width: 72rpx;
text-align: center;
height: 115rpx;
box-sizing: border-box;
background-color: #ffffff;
touch-action: none;
font-size: 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1rpx solid #e2e2e2;
&:last-child{
border:none;
}
.airport-item-image{
width: 72rpx;
text-align: center;
height: 115rpx;
line-height: 115rpx;
image{
width: 11rpx;
height: 21rpx;
}
line-height: 115rpx;
image {
width: 11rpx;
height: 21rpx;
}
}
.airport-item-radio{
flex: 1;
display: flex;
align-items: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
image{
margin-right: 8rpx;
margin-top: 5rpx;
}
.image-1{
width: 29rpx;
height: 29rpx;
}
.image-2{
width: 29rpx;
height: 29rpx;
}
}
.action-bar {
width: 686rpx;
height: 94rpx;
border-radius: 46rpx;
background-color: #d3a358;
color: #ffffff;
font-size: 32rpx;
display: flex;
align-items: center;
justify-content: center;
position: sticky;
bottom: 0;
z-index: 10;
}
}
.selected-list {
margin-top: 20rpx;
padding: 20rpx;
background-color: #f9f9f9;
border-radius: 10rpx;
max-height: 200rpx;
overflow: auto;
-webkit-overflow-scrolling: touch;
.airport-item-radio {
flex: 1;
display: flex;
align-items: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
image {
margin-right: 8rpx;
margin-top: 5rpx;
}
.title {
font-weight: bold;
margin-bottom: 15rpx;
position: sticky;
top: 0;
background-color: #f9f9f9;
z-index: 10;
.image-1 {
width: 29rpx;
height: 29rpx;
}
.selected-items {
display: flex;
flex-wrap: wrap;
.image-2 {
width: 29rpx;
height: 29rpx;
}
}
.action-bar {
width: 686rpx;
height: 94rpx;
border-radius: 46rpx;
background-color: #d3a358;
color: #ffffff;
font-size: 32rpx;
display: flex;
align-items: center;
justify-content: center;
position: sticky;
bottom: 0;
z-index: 10;
}
.selected-list {
margin-top: 20rpx;
padding: 20rpx;
background-color: #f9f9f9;
border-radius: 10rpx;
max-height: 200rpx;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.title {
font-weight: bold;
margin-bottom: 15rpx;
position: sticky;
top: 0;
background-color: #f9f9f9;
z-index: 10;
}
.selected-items {
display: flex;
flex-wrap: wrap;
}
.selected-item {
position: relative;
background-color: #e6f7ff;
color: #1890ff;
padding: 10rpx 20rpx;
margin: 0 15rpx 15rpx 0;
border-radius: 30rpx;
touch-action: none;
}
.remove {
margin-left: 10rpx;
color: #ff4d4f;
cursor: pointer;
}
.selected-item {
.container2 {
height: 595rpx;
padding: 50rpx 35rpx 30rpx 35rpx;
overflow: hidden;
background: #ffffff;
border-radius: 32rpx 32rpx 0 0;
color: #000000;
display: flex;
flex-direction: column;
.text-t {
flex-shrink: 0;
position: relative;
background-color: #e6f7ff;
color: #1890ff;
padding: 10rpx 20rpx;
margin: 0 15rpx 15rpx 0;
border-radius: 30rpx;
touch-action: none;
}
.remove {
margin-left: 10rpx;
color: #ff4d4f;
cursor: pointer;
}
.container2 {
height:595rpx;
padding: 50rpx 35rpx 30rpx 35rpx;
overflow: hidden;
background: #ffffff;
border-radius: 32rpx 32rpx 0 0;
color: #000000;
display: flex;
flex-direction: column;
.text-t{
flex-shrink: 0;
position: relative;
.t-1{
flex: 1;
font-size: 34rpx;
font-weight: 700;
}
image{
position: absolute;
top: 10.5rpx;
right: 0rpx;
width: 28rpx;
height: 29rpx;
}
}
.text-c{
.t-1 {
flex: 1;
overflow: auto;
margin-top: 22rpx;
font-weight: 500;
font-size: 34rpx;
font-weight: 700;
}
image {
position: absolute;
top: 10.5rpx;
right: 0rpx;
width: 28rpx;
height: 29rpx;
}
}
.text-c {
flex: 1;
overflow: auto;
margin-top: 22rpx;
font-weight: 500;
}
}
}
</style>
\ No newline at end of file
<template>
<view class="report-card" style="background-image: url( '//yun.duiba.com.cn/aurora/assets/c1e4ce971b7ffb55ed23ec8a9480b857a6328e98.png');">
<view class="page-top">
<!-- <view class="page-top">
<image @tap="backHandler" class="btnback" src="/static/chanjianTool/back.png"></image>
<view class="page_title">我的报告单</view>
</view>
</view> -->
<customize-navigation>
<template v-slot:navbar-content>
<view class="page-top">
<image @tap="backHandler" class="btnback" src="/static/chanjianTool/back.png"></image>
<view class="page_title">我的报告单</view>
</view>
</template>
</customize-navigation>
<view class="report-card-con">
<view class="con-box">
<view class="list-item" v-for="(item, index) in listData" :key="index">
......@@ -319,29 +327,6 @@
}
}
}
// 自定义头部
.page-top {
width: 100%;
}
.btnback {
width: 16rpx;
height: 29rpx;
margin-top: 110rpx;
margin-left: 35rpx;
}
.page_title {
width: 100%;
font-size: 34rpx;
font-weight: 500;
text-align: center;
color: #1d1e25;
margin-top: -46rpx;
margin-left: 0rpx;
}
.more-popup {
position: fixed;
left: 0;
......@@ -416,5 +401,29 @@
height: 70rpx;
}
}
// 自定义头部
.page-top {
width: 100%;
display: flex;
align-items: center;
}
.btnback {
width: 16rpx;
height: 29rpx;
// margin-top: 110rpx;
// margin-left: 35rpx;
}
.page_title {
width: 100%;
font-size: 34rpx;
font-weight: 500;
text-align: center;
color: #1d1e25;
line-height: 36rpx;
// margin-top: -46rpx;
// margin-left: 0rpx;
}
}
</style>
\ No newline at end of file
<template>
<view>
<view class="postnatal">
<view class="page-top">
<!-- <view class="page-top">
<image @tap="backHandler" class="btnback" src="/static/chanjianTool/back.png"></image>
<view class="page_title">产检提醒</view>
</view>
</view> -->
<!-- 自定义导航 -->
<customize-navigation>
<template v-slot:navbar-content>
<view class="page-top">
<image @tap="backHandler" class="btnback" src="/static/chanjianTool/back.png"></image>
<view class="page_title">产检提醒</view>
</view>
</template>
</customize-navigation>
<view class="postnatal-con">
<!-- 轮播图 -->
<swiper class="banner-swiper" :autoplay="true" :circular="true">
<swiper-item v-for="(item, index) in homeInfo.bannerList" :key="index">
<image class="banner-img" :src="`${item.imageUrl}`" mode="aspectFill"
<swiper-item v-for="(item, index) in bannerList" :key="index">
<image class="banner-img" :src="`${item.img}`" mode="aspectFill"
@click="handleBannerClick(item, index)" />
</swiper-item>
</swiper>
......@@ -99,10 +107,12 @@
import md from '../../md';
import {
getInfo,
getUpdate
getUpdate,
postnatalJSON
} from '../../api/obstetric.js';
// 导入日期选择器组件
import DatePicker from '@/components/DatePicker.vue'
import { type } from 'os';
const {
proxy
} = getCurrentInstance();
......@@ -111,12 +121,16 @@
// 时间弹窗控制
const visible = ref(false)
// 时间
const time = ref('')
// 保存要修改的id
const editId = ref(null)
// 轮播图
const bannerList = ref([])
// 首页信息
const homeInfo = ref({})
......@@ -169,8 +183,8 @@
console.log(item)
// 跳转
jump({
type: item.jumpType,
url: item.jumpUrl
type: item.type,
url: item.url
})
// let buttonName = '';
// switch(index){
......@@ -269,20 +283,6 @@
data: {
gestationalWeeks: '8', // 几周
dueDate: '2025-10-20', // 预产期
// 轮播数据
bannerList: [{
imageUrl: 'https://course.feihe.com/momclub-picture/contentLibrary/1003/banner-cl0.png',
jumpUrl: `https://www.baidu.com`
},
{
imageUrl: 'https://course.feihe.com/momclub-picture/contentLibrary/1003/banner-cl1.png',
jumpUrl: `https://www.baidu.com`
},
{
imageUrl: 'https://course.feihe.com/momclub-picture/contentLibrary/1003/banner-cl2.png',
jumpUrl: `https://www.baidu.com`
}
],
// 产检记录
checkupList: [{
type: 0, // 1 是 0 否
......@@ -495,7 +495,47 @@
});
}
}
// 获取banner图
const postnatalJSONFn = async ()=>{
// const { success, data, message } = await postnatalJSON()
const { success, data, message } = {
success: true,
message:'成功',
data: {
// 轮播数据
bannerList: [{
img: 'https://course.feihe.com/momclub-picture/contentLibrary/1003/banner-cl0.png',
url: `https://mp.weixin.qq.com/s/Xn5dh96OaQ9CcsVMZ5jnvg`,
type: 3
},
{
img: 'https://course.feihe.com/momclub-picture/contentLibrary/1003/banner-cl1.png',
url: `https://mp.weixin.qq.com/s/Xn5dh96OaQ9CcsVMZ5jnvg`,
type: 3
},
{
img: 'https://course.feihe.com/momclub-picture/contentLibrary/1003/banner-cl2.png',
url: `https://www.baidu.com`,
type: 3
}
]
}
}
if (success) {
bannerList.value = data.bannerList
} else{
uni.showToast({
title: message,
icon: "none",
});
}
}
onShow(() => {
// 获取banner图
postnatalJSONFn()
// 获取信息
getInfoFn()
})
......@@ -678,13 +718,15 @@
.page-top {
width: 100%;
display: flex;
align-items: center;
}
.btnback {
width: 16rpx;
height: 29rpx;
margin-top: 110rpx;
margin-left: 35rpx;
// margin-top: 110rpx;
// margin-left: 35rpx;
}
.page_title {
......@@ -693,7 +735,8 @@
font-weight: 500;
text-align: center;
color: #1d1e25;
margin-top: -46rpx;
margin-left: 0rpx;
line-height: 36rpx;
// margin-top: -46rpx;
// margin-left: 0rpx;
}
</style>
\ No newline at end of file
<template>
<view class="production-calendar">
<view class="page-top">
<!-- <view class="page-top">
<view class="header-content">
<image @tap="backHandler" class="btnback" src="/static/chanjianTool/back.png"></image>
<view class="page_title">
......@@ -17,7 +17,27 @@
</view>
</view>
</view>
</view>
</view> -->
<customize-navigation>
<template v-slot:navbar-content>
<view class="page-top">
<image @tap="backHandler" class="btnback" src="/static/chanjianTool/back.png"></image>
<view class="page_title">
<view class="info-l">
<image :src="$baseUrl + 'common/default_avatar.png'"></image>
</view>
<view class="info-r">
<view class="info-r-t">
孕期
</view>
<view class="info-r-b">
怀孕{{ info.gestationalWeeks }}
</view>
</view>
</view>
</view>
</template>
</customize-navigation>
<!-- 显示区域 -->
<view class="production-calendar-con">
<view class="calendar-box">
......@@ -472,6 +492,96 @@ const getInfoFn = async () => {
}
]
},
{
type: 0, // 1 是 0 否
id: 1,
checkupDate: '2025-07-23',
index: '一', // 产检次数
pregnancyWeek: '5-6', // 周数
status: '待产检', //待产检、已过期、已产检,
// 产检项目
examinationItems: [{
itemName: '测量胎儿颈部透明层厚度(NT)',
id: 1
},
{
itemName: '无创产前基因检测(NIPT)(非必查)',
id: 2
}
]
},
{
type: 0, // 1 是 0 否
id: 1,
checkupDate: '2025-07-23',
index: '一', // 产检次数
pregnancyWeek: '5-6', // 周数
status: '待产检', //待产检、已过期、已产检,
// 产检项目
examinationItems: [{
itemName: '测量胎儿颈部透明层厚度(NT)',
id: 1
},
{
itemName: '无创产前基因检测(NIPT)(非必查)',
id: 2
}
]
},
{
type: 0, // 1 是 0 否
id: 1,
checkupDate: '2025-07-23',
index: '一', // 产检次数
pregnancyWeek: '5-6', // 周数
status: '待产检', //待产检、已过期、已产检,
// 产检项目
examinationItems: [{
itemName: '测量胎儿颈部透明层厚度(NT)',
id: 1
},
{
itemName: '无创产前基因检测(NIPT)(非必查)',
id: 2
}
]
},
{
type: 0, // 1 是 0 否
id: 1,
checkupDate: '2025-07-23',
index: '一', // 产检次数
pregnancyWeek: '5-6', // 周数
status: '待产检', //待产检、已过期、已产检,
// 产检项目
examinationItems: [{
itemName: '测量胎儿颈部透明层厚度(NT)',
id: 1
},
{
itemName: '无创产前基因检测(NIPT)(非必查)',
id: 2
}
]
},
{
type: 0, // 1 是 0 否
id: 1,
checkupDate: '2025-07-23',
index: '一', // 产检次数
pregnancyWeek: '5-6', // 周数
status: '待产检', //待产检、已过期、已产检,
// 产检项目
examinationItems: [{
itemName: '测量胎儿颈部透明层厚度(NT)',
id: 1
},
{
itemName: '无创产前基因检测(NIPT)(非必查)',
id: 2
}
]
},
{
type: 0, // 1 是 0 否
id: 1,
......@@ -529,11 +639,10 @@ onShow(() => {
.production-calendar {
width: 100%;
height: 100vh;
background-size: 100% 100%;
// background-color: #fdf6eb;
background-color: #fdf6eb;
&-con {
position: absolute;
top: 176rpx;
// position: absolute;
// top: 176rpx;
// left: 31rpx;
width: 100%;
box-sizing: border-box;
......@@ -549,14 +658,15 @@ onShow(() => {
.con-list {
position: absolute;
left: 0;
top: 656rpx;
height: calc(100vh - 1021rpx);
top: 820rpx;
height: calc(100vh - 820rpx);
background: #fff;
border-radius: 24rpx;
padding: 30rpx;
overflow-y: auto;
width: 100%;
box-sizing: border-box;
padding-bottom: 100px;
.con-list-item {
width: 689rpx;
// height: 221rpx;
......@@ -603,8 +713,9 @@ onShow(() => {
// 自定义头部
.page-top {
width: 100%;
display: flex;
align-items: center;
background-color: #fdf6eb;
padding: 90rpx 0 0 10rpx;
}
.header-content {
......@@ -615,7 +726,6 @@ onShow(() => {
.btnback {
width: 16rpx;
height: 29rpx;
margin-left: 35rpx;
}
.page_title {
......
......@@ -395,12 +395,12 @@ const handleConfirm = () => {
close();
selectedValue.value = options[pickerValue.value[0]];
// 订阅提醒
// uni.requestSubscribeMessage({
// tmplIds: [''],
// success (res) {
// console.log(res)
// }
// })
uni.requestSubscribeMessage({
tmplIds: [infoData.wxTemplateId],
success (res) {
console.log(res)
}
})
}
// 完成检查
......
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