修改收费室页面,体检页面,和病案邮寄页面
This commit is contained in:
@@ -277,6 +277,8 @@ export const apiGetDrugPrice = p => post('/userorder/getDrugPrice', p);
|
||||
export const apiBayj = p => postFile('/bingan/apiBayj', p);
|
||||
// 病案邮寄列表
|
||||
export const apiGetBAList = p => post('/bingan/apiGetBAList', p);
|
||||
// 病案邮寄列表
|
||||
export const apiGetBAList2 = p => post('/bingan/apiGetBAList2', p);
|
||||
// 病案邮寄取消申请
|
||||
export const apiDeleteApplication = p => post('/bingan/apiDeleteApplication', p);
|
||||
//病案缴费
|
||||
@@ -326,6 +328,8 @@ export const refundOrderOnline = p => post4('/Yb/refundOrderOnline', p);
|
||||
export const selectOrderList = p => post('/sfs/selectOrderList', p);
|
||||
//更新病案邮寄信息
|
||||
export const apiUpdateBA = p => post('/bingan/apiUpdateBA', p);
|
||||
//退费接口
|
||||
export const WxRefundOrder = p => post('/pay/wxpay/refundOrder', p);
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
|
||||
<!-- 搜索框 -->
|
||||
<div class="zstj_tc">
|
||||
<div class="container">
|
||||
<div>
|
||||
<div class="search">
|
||||
<div class="searchBox">
|
||||
<input
|
||||
@@ -53,14 +53,82 @@
|
||||
<!-- 项目列表 -->
|
||||
<div class="container-wrapper">
|
||||
<div class="container">
|
||||
<div class="zstj_tc1">
|
||||
<!-- 套餐模板容器 -->
|
||||
<div v-if="typeSelection === '1'" class="zstj_tc1">
|
||||
<van-list v-model="loading" :finished="finished" finished-text="没有更多了">
|
||||
<ul>
|
||||
<li
|
||||
v-for="item in filteredList"
|
||||
:key="item.id"
|
||||
class="package-item"
|
||||
>
|
||||
<div
|
||||
class="package-header"
|
||||
@click="togglePackageExpand(item.id)"
|
||||
>
|
||||
<div class="checkbox-container" @click.stop="toggleSelection(item.id)">
|
||||
<div class="checkbox" :class="{ checked: selectedItems.includes(item.id) }">
|
||||
<span v-if="selectedItems.includes(item.id)">✓</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<h2>
|
||||
<p>{{ item.explain }}</p>
|
||||
</h2>
|
||||
<div class="price-arrow">
|
||||
<h3>¥{{ item.price }}</h3>
|
||||
<div class="arrow" :class="{ rotated: expandedPackageId === item.id }">▼</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 手风琴展开部分 -->
|
||||
<div
|
||||
v-if="expandedPackageId === item.id"
|
||||
class="package-details"
|
||||
>
|
||||
<div class="details-header">
|
||||
<span>项目</span>
|
||||
<span>价格</span>
|
||||
</div>
|
||||
<div class="details-content">
|
||||
<div
|
||||
v-for="(detail, index) in packageDetails[item.id] || []"
|
||||
:key="index"
|
||||
class="detail-item"
|
||||
>
|
||||
<span>{{ detail.name }}</span>
|
||||
<span>¥{{ detail.price }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</van-list>
|
||||
</div>
|
||||
|
||||
<!-- 单项模板容器 -->
|
||||
<div v-else class="single-item-wrapper">
|
||||
<div class="single-item-container">
|
||||
<!-- 左侧分类列表 -->
|
||||
<div class="category-list">
|
||||
<div
|
||||
v-for="category in singleItemCategories"
|
||||
:key="category"
|
||||
class="category-item"
|
||||
:class="{ active: selectedCategory === category }"
|
||||
@click="selectCategory(category)"
|
||||
>
|
||||
{{ category }}
|
||||
</div>
|
||||
</div>
|
||||
<!-- 右侧项目列表 -->
|
||||
<div class="single-item-list">
|
||||
<div
|
||||
v-for="item in filteredSingleItems"
|
||||
:key="item.id"
|
||||
:class="{ selected: selectedItems.includes(item.id) }"
|
||||
@click="toggleSelection(item.id)"
|
||||
class="single-item-card"
|
||||
>
|
||||
<div class="checkbox-container">
|
||||
<div class="checkbox" :class="{ checked: selectedItems.includes(item.id) }">
|
||||
@@ -69,37 +137,29 @@
|
||||
</div>
|
||||
<div class="content">
|
||||
<h2>
|
||||
{{ item.name }}
|
||||
{{ item.category }}
|
||||
<p>{{ item.explain }}</p>
|
||||
<p>{{ item.description }}</p>
|
||||
</h2>
|
||||
<h3>¥{{ item.price }}</h3>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</van-list>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 底部预约列表按钮 -->
|
||||
<div class="cart-button-container">
|
||||
<div
|
||||
class="cart-button"
|
||||
@click="openCartPopup"
|
||||
v-if="selectedItems.length > 0"
|
||||
>
|
||||
<van-icon name="records" class="cart-icon" />
|
||||
<div class="cart-text">预约列表</div>
|
||||
<div class="cart-count">{{ selectedItems.length }}</div>
|
||||
<div class="total-price">
|
||||
<!-- <span>总价:</span> -->
|
||||
<span class="price">¥{{ totalPrice }}</span>
|
||||
</div>
|
||||
<div
|
||||
class="cart-button empty"
|
||||
@click="openCartPopup"
|
||||
v-else
|
||||
class="reserve-button"
|
||||
@click="directAppointment"
|
||||
>
|
||||
<van-icon name="records" class="cart-icon" />
|
||||
<div class="cart-text">预约列表</div>
|
||||
立即预约
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -210,7 +270,26 @@ export default {
|
||||
typeSelection: "1", // 1: 套餐, 2: 单项
|
||||
showCartPopup: false, // 控制预约列表弹窗显示
|
||||
checkedItems: [], // 控制弹窗中选择的项目
|
||||
};
|
||||
|
||||
// 手风琴展开状态管理
|
||||
expandedPackageId: null, // 当前展开的套餐ID
|
||||
packageDetails: {}, // 存储套餐详情数据
|
||||
singleItemMap: {}, // 单项ID到单项数据的映射
|
||||
|
||||
// 单项分类数据处理
|
||||
singleItemCategories: [], // 单项分类数据
|
||||
selectedCategory: '', // 当前选中的分类
|
||||
filteredSingleItems: [], // 根据分类筛选后的单项数据
|
||||
}
|
||||
|
||||
},
|
||||
computed: {
|
||||
// 计算总价格
|
||||
totalPrice() {
|
||||
return this.selectedItemsDetails.reduce((total, item) => {
|
||||
return total + parseFloat(item.price) || 0;
|
||||
}, 0).toFixed(2);
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initDateList();
|
||||
@@ -240,6 +319,51 @@ export default {
|
||||
this.checkedItems = [...this.selectedItems];
|
||||
},
|
||||
|
||||
// 切换套餐展开/收起状态
|
||||
togglePackageExpand(itemId) {
|
||||
if (this.expandedPackageId === itemId) {
|
||||
this.expandedPackageId = null;
|
||||
} else {
|
||||
this.expandedPackageId = itemId;
|
||||
// 获取套餐详情
|
||||
this.getPackageDetails(itemId);
|
||||
}
|
||||
},
|
||||
|
||||
// 选择单项分类
|
||||
selectCategory(category) {
|
||||
this.selectedCategory = category;
|
||||
// 筛选单项数据
|
||||
if (category) {
|
||||
this.filteredSingleItems = this.list.filter(item => item.description === category);
|
||||
} else {
|
||||
this.filteredSingleItems = [...this.list];
|
||||
}
|
||||
},
|
||||
|
||||
// 获取套餐详情
|
||||
getPackageDetails(packageId) {
|
||||
const packageItem = this.list.find(item => item.id === packageId);
|
||||
if (!packageItem) return;
|
||||
|
||||
// 从单项数据中获取套餐项目详情
|
||||
const details = [];
|
||||
// 假设packageItem.programList存储了套餐包含的单项ID列表
|
||||
if (packageItem.programList) {
|
||||
packageItem.programList.forEach(singleItemId => {
|
||||
const singleItem = this.singleItemMap[singleItemId];
|
||||
if (singleItem) {
|
||||
details.push({
|
||||
name: singleItem.explain,
|
||||
price: singleItem.price
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
this.$set(this.packageDetails, packageId, details);
|
||||
},
|
||||
|
||||
// 打开预约列表弹窗
|
||||
openCartPopup() {
|
||||
if (this.selectedItems.length === 0) {
|
||||
@@ -324,6 +448,26 @@ export default {
|
||||
Toast.success(`已选择 ${selectedForAppointment.length} 个项目进行预约`);
|
||||
},
|
||||
|
||||
// 直接预约(无弹窗)
|
||||
directAppointment() {
|
||||
if (this.selectedItems.length === 0) {
|
||||
Toast('请先选择项目');
|
||||
return;
|
||||
}
|
||||
|
||||
// 提交所有选中的项目
|
||||
const selectedForAppointment = this.selectedItemsDetails;
|
||||
|
||||
this.$router.push({
|
||||
path: 'Zstj_detail',
|
||||
query: {
|
||||
items: JSON.stringify(selectedForAppointment),
|
||||
seldate: this.same_day
|
||||
}
|
||||
});
|
||||
Toast.success(`已选择 ${selectedForAppointment.length} 个项目进行预约`);
|
||||
},
|
||||
|
||||
handleSearch() {
|
||||
const keyword = this.searchKeyword.trim().toLowerCase();
|
||||
if (!keyword) {
|
||||
@@ -380,6 +524,9 @@ export default {
|
||||
this.searchKeyword = "";
|
||||
this.list = [];
|
||||
this.filteredList = [];
|
||||
this.expandedPackageId = null; // 重置手风琴展开状态
|
||||
this.selectedCategory = ''; // 重置分类选择
|
||||
this.filteredSingleItems = []; // 重置单项筛选数据
|
||||
|
||||
const apiDate = this.formatDateForAPI(this.same_day);
|
||||
const cacheKey = apiDate + '_' + this.typeSelection;
|
||||
@@ -425,20 +572,119 @@ export default {
|
||||
name: item.category,
|
||||
price: item.price,
|
||||
explain: item.program_name,
|
||||
description:item.description,
|
||||
type: this.typeSelection// 添加类型标识
|
||||
description: item.description,
|
||||
type: this.typeSelection,
|
||||
programList: item.program_list ? this.parseProgramList(item.program_list) : []
|
||||
}));
|
||||
|
||||
this.filteredList = [...this.list];
|
||||
|
||||
// 套餐类型按program_id排序
|
||||
if (this.typeSelection === '1') {
|
||||
this.filteredList.sort((a, b) => a.id.localeCompare(b.id));
|
||||
}
|
||||
|
||||
// 处理单项数据
|
||||
if (this.typeSelection === '2') {
|
||||
// 构建单项ID到单项数据的映射
|
||||
this.singleItemMap = {};
|
||||
rawData.forEach(item => {
|
||||
this.singleItemMap[item.program_id] = {
|
||||
id: item.program_id,
|
||||
name: item.description, // 使用description作为分类
|
||||
price: item.price,
|
||||
explain: item.program_name,
|
||||
description: item.description
|
||||
};
|
||||
});
|
||||
|
||||
// 提取单项分类(按description)
|
||||
const categories = [...new Set(rawData.map(item => item.description))];
|
||||
this.singleItemCategories = categories;
|
||||
|
||||
// 默认选择第一个分类
|
||||
if (categories.length > 0 && !this.selectedCategory) {
|
||||
this.selectCategory(categories[0]);
|
||||
}
|
||||
} else {
|
||||
// 处理套餐数据时,主动加载单项数据以构建映射
|
||||
this.loadSingleItemData();
|
||||
}
|
||||
|
||||
this.finished = true; // 一次性加载完成
|
||||
},
|
||||
|
||||
// 加载单项数据
|
||||
loadSingleItemData() {
|
||||
const apiDate = this.formatDateForAPI(this.same_day);
|
||||
const singleItemCacheKey = apiDate + '_2';
|
||||
|
||||
// 检查是否已有缓存
|
||||
if (this.allDataCache[singleItemCacheKey]) {
|
||||
const singleItemData = this.allDataCache[singleItemCacheKey];
|
||||
this.buildSingleItemMap(singleItemData);
|
||||
} else {
|
||||
// 如果没有缓存,主动请求单项数据
|
||||
this.fetchSingleItemData();
|
||||
}
|
||||
},
|
||||
|
||||
// 构建单项数据映射
|
||||
buildSingleItemMap(singleItemData) {
|
||||
this.singleItemMap = {};
|
||||
singleItemData.forEach(item => {
|
||||
this.singleItemMap[item.program_id] = {
|
||||
id: item.program_id,
|
||||
name: item.description, // 使用description作为分类
|
||||
price: item.price,
|
||||
explain: item.program_name,
|
||||
description: item.description
|
||||
};
|
||||
});
|
||||
},
|
||||
|
||||
// 请求单项数据
|
||||
async fetchSingleItemData() {
|
||||
const apiDate = this.formatDateForAPI(this.same_day);
|
||||
const singleItemCacheKey = apiDate + '_2';
|
||||
|
||||
try {
|
||||
const res = await apiOpTiQuery({
|
||||
startDate: apiDate,
|
||||
endDate: apiDate,
|
||||
HospitalZone: "",
|
||||
Type: '2' // 单项类型
|
||||
});
|
||||
|
||||
const data = res.data?.data || [];
|
||||
this.allDataCache[singleItemCacheKey] = data;
|
||||
this.buildSingleItemMap(data);
|
||||
} catch (err) {
|
||||
console.error("请求单项数据失败:", err);
|
||||
}
|
||||
},
|
||||
|
||||
// 解析program_list,处理以0开头的数字
|
||||
parseProgramList(programListStr) {
|
||||
try {
|
||||
// 替换所有以0开头的数字为字符串
|
||||
const processedStr = programListStr.replace(/\b0(\d+)\b/g, '"0$1"');
|
||||
return JSON.parse(processedStr);
|
||||
} catch (error) {
|
||||
console.error('解析program_list失败:', error);
|
||||
return [];
|
||||
}
|
||||
},
|
||||
|
||||
handleTypeChange() {
|
||||
// 切换类型时重新加载数据
|
||||
this.list = [];
|
||||
this.filteredList = [];
|
||||
this.finished = false;
|
||||
this.loading = false;
|
||||
this.expandedPackageId = null; // 重置手风琴展开状态
|
||||
this.selectedCategory = ''; // 重置分类选择
|
||||
this.filteredSingleItems = []; // 重置单项筛选数据
|
||||
|
||||
const apiDate = this.formatDateForAPI(this.same_day);
|
||||
if (this.allDataCache[apiDate + '_' + this.typeSelection]) {
|
||||
@@ -580,21 +826,19 @@ ul.timeSlelct {
|
||||
padding-bottom: 100px;
|
||||
}
|
||||
|
||||
.zstj_tc1 ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.zstj_tc1 ul li {
|
||||
margin-bottom: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 1px;
|
||||
background: #fff;
|
||||
border-radius: 24px;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
cursor: pointer;
|
||||
// padding: 20px;
|
||||
transition: all 0.3s;
|
||||
|
||||
&.selected {
|
||||
border: 2px solid #46c3b0;
|
||||
background-color: #f0f9f8;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox-container {
|
||||
@@ -655,7 +899,7 @@ ul.timeSlelct {
|
||||
|
||||
.container-wrapper {
|
||||
position: fixed;
|
||||
top: 4.6rem;
|
||||
top: 5.3rem;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 1.5rem;
|
||||
@@ -666,73 +910,59 @@ ul.timeSlelct {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
background: #f5f5f5;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
/* 预约列表按钮样式 */
|
||||
.cart-button-container {
|
||||
position: fixed;
|
||||
bottom: 0.6rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 15px 20px;
|
||||
background: white;
|
||||
box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.cart-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.total-price {
|
||||
font-size: .6rem;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.total-price .price {
|
||||
color: #d62e25;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.reserve-button {
|
||||
background: linear-gradient(135deg, #46c3b0 0%, #3aa897 100%);
|
||||
color: white;
|
||||
padding: 15px 30px;
|
||||
border-radius: 50px;
|
||||
box-shadow: 0 5px 20px rgba(70, 195, 176, 0.3);
|
||||
padding: 12px 30px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 3px 15px rgba(70, 195, 176, 0.3);
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
font-weight: bold;
|
||||
font-size: 24px;
|
||||
position: relative;
|
||||
// font-size: 20px;
|
||||
white-space: nowrap;
|
||||
margin-right: .76rem;
|
||||
}
|
||||
|
||||
.cart-button:hover {
|
||||
.reserve-button:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 8px 25px rgba(70, 195, 176, 0.4);
|
||||
box-shadow: 0 6px 20px rgba(70, 195, 176, 0.4);
|
||||
}
|
||||
|
||||
.cart-button:active {
|
||||
.reserve-button:active {
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.cart-button.empty {
|
||||
background: #f5f5f5;
|
||||
color: #666;
|
||||
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.cart-button.empty:hover {
|
||||
background: #e8e8e8;
|
||||
}
|
||||
|
||||
.cart-icon {
|
||||
font-size: 32px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.cart-count {
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
background: #ff4d4f;
|
||||
color: white;
|
||||
border-radius: 50%;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 预约列表弹窗样式 */
|
||||
.cart-popup {
|
||||
height: 100%;
|
||||
@@ -801,4 +1031,241 @@ ul.timeSlelct {
|
||||
padding-bottom: env(safe-area-inset-bottom) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* 套餐手风琴样式 */
|
||||
.package-item {
|
||||
//margin-bottom: 40px;
|
||||
border-radius: 24px;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||
transition: all 0.3s;
|
||||
|
||||
&.selected {
|
||||
border: 2px solid #46c3b0;
|
||||
background-color: #f0f9f8;
|
||||
}
|
||||
}
|
||||
|
||||
.package-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
width: auto;
|
||||
|
||||
&:hover {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
}
|
||||
|
||||
.price-arrow {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
font-size: 16px;
|
||||
color: #999;
|
||||
transition: transform 0.3s;
|
||||
|
||||
&.rotated {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
|
||||
/* 套餐详情部分 */
|
||||
.package-details {
|
||||
background-color: #f9f9f9;
|
||||
border-top: 1px solid #eee;
|
||||
animation: slideDown 0.3s ease;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.details-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 25px 20px;
|
||||
background-color: #f0f0f0;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.details-content {
|
||||
padding: 15px 20px 25px;
|
||||
}
|
||||
|
||||
.detail-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #eee;
|
||||
font-size: 36px;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* 单项分类容器样式 - 确保父容器高度固定,子元素可占满 */
|
||||
.single-item-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 600px; /* 固定父容器高度,子元素100%高度生效 */
|
||||
background: #fff;
|
||||
border-radius: 24px;
|
||||
overflow: hidden;
|
||||
margin-bottom: 40px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||
width: 100%;
|
||||
list-style: none;
|
||||
flex-wrap: nowrap;
|
||||
/* 移除内边距,避免子元素高度占满后出现空隙 */
|
||||
padding: 0;
|
||||
margin: 0 0 40px 0;
|
||||
}
|
||||
|
||||
/* 左侧分类列表样式 - 核心修改:占满高度,隐藏滚动条 */
|
||||
.category-list {
|
||||
width: 200px;
|
||||
flex-shrink: 0;
|
||||
background-color: #f5f5f5;
|
||||
border-right: 1px solid #eee;
|
||||
overflow-y: auto; /* 保留滚动功能 */
|
||||
height: 100%; /* 占满父容器高度 */
|
||||
box-sizing: border-box; /* 确保内边距不超出高度 */
|
||||
padding: 0; /* 移除内边距,避免高度不足 */
|
||||
margin: 0; /* 移除外边距,避免高度不足 */
|
||||
|
||||
/* 隐藏滚动条 - 兼容所有主流浏览器 */
|
||||
::-webkit-scrollbar {
|
||||
display: none; /* Chrome、Safari、Edge */
|
||||
}
|
||||
-ms-overflow-style: none; /* IE/Edge 旧版本 */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
}
|
||||
|
||||
.category-item {
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
border-bottom: 1px solid #eee;
|
||||
font-size: 30px;
|
||||
margin: 0; /* 移除外边距 */
|
||||
|
||||
&:hover {
|
||||
background-color: #e8e8e8;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: #46c3b0;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
/* 右侧单项列表样式 - 核心修改:占满高度 */
|
||||
.single-item-list {
|
||||
flex: 1;
|
||||
padding: 20px;
|
||||
overflow-y: auto;
|
||||
height: 100%; /* 占满父容器高度 */
|
||||
box-sizing: border-box; /* 确保内边距不超出高度 */
|
||||
margin: 0; /* 移除外边距 */
|
||||
}
|
||||
|
||||
/* 单项模板容器样式 */
|
||||
.single-item-wrapper {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* 修改单项分类容器样式 */
|
||||
.single-item-container {
|
||||
height: 100% !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
/* 修改左侧分类列表样式 */
|
||||
.category-list {
|
||||
overflow-y: auto !important;
|
||||
}
|
||||
|
||||
/* 修改右侧单项列表样式 */
|
||||
.single-item-list {
|
||||
overflow-y: auto !important;
|
||||
}
|
||||
|
||||
/* 单项卡片样式 */
|
||||
.single-item-card {
|
||||
margin-bottom: 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #f9f9f9;
|
||||
border-radius: 12px;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
|
||||
&.selected {
|
||||
border: 2px solid #46c3b0;
|
||||
background-color: #f0f9f8;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
/* 动画效果 */
|
||||
@keyframes slideDown {
|
||||
from {
|
||||
max-height: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
max-height: 1200px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* 响应式设计 */
|
||||
@media (max-width: 768px) {
|
||||
.category-list {
|
||||
width: 150px; /* 小屏缩小左侧宽度,保持占满高度 */
|
||||
}
|
||||
|
||||
.category-item {
|
||||
padding: 15px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.single-item-list {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.single-item-card {
|
||||
padding: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.details-header {
|
||||
font-size: 32px;
|
||||
padding: 20px 15px;
|
||||
}
|
||||
|
||||
.detail-item {
|
||||
font-size: 28px;
|
||||
padding: 12px 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -29,6 +29,8 @@
|
||||
<van-button type="primary" round @click="showRefundTicketDialog" class="action-button">线上退号退费</van-button>
|
||||
<van-button type="primary" round @click="showRefundOutpatientDialog" class="action-button">线上门诊医保退费</van-button>
|
||||
<van-button type="primary" round @click="showRefundSelfDialog" class="action-button">线上门诊自费退费</van-button>
|
||||
<van-button type="primary" round @click="showRefundNoHisDialog" class="action-button">线上退钱不退his</van-button>
|
||||
<van-button type="primary" round @click="showRefundBaDialog" class="action-button">线上病案退费</van-button>
|
||||
</div>
|
||||
|
||||
<!-- 退号退费弹窗 - 输入就诊人ID -->
|
||||
@@ -180,6 +182,99 @@
|
||||
</div>
|
||||
</van-popup>
|
||||
|
||||
<!-- 线上退钱不退his弹窗 - 输入订单号和金额 -->
|
||||
<van-popup v-model="showRefundNoHis" position="center" :style="{ width: '80%', borderRadius: '10px' }">
|
||||
<div class="popup-content">
|
||||
<h3 class="popup-title">线上退钱不退his</h3>
|
||||
<div class="input-container">
|
||||
<van-field
|
||||
v-model="refundNoHisOrderNo"
|
||||
placeholder="请输入订单号"
|
||||
class="patient-id-input"
|
||||
maxlength="60"
|
||||
:rules="[{ required: true, message: '请输入订单号' }]"
|
||||
/>
|
||||
<van-field
|
||||
v-model="refundNoHisAmount"
|
||||
placeholder="请输入金额"
|
||||
class="patient-id-input"
|
||||
maxlength="10"
|
||||
inputType="number"
|
||||
:rules="[{ required: true, message: '请输入金额' }]"
|
||||
/>
|
||||
</div>
|
||||
<div class="popup-buttons">
|
||||
<van-button @click="showRefundNoHis = false" class="popup-button cancel">取消</van-button>
|
||||
<van-button type="primary" @click="confirmRefundNoHis" class="popup-button confirm" :disabled="!refundNoHisOrderNo || !refundNoHisAmount">确认</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-popup>
|
||||
|
||||
<!-- 线上病案退费弹窗 - 输入患者ID或住院号 -->
|
||||
<van-popup v-model="showRefundBa" position="center" :style="{ width: '80%', borderRadius: '10px' }">
|
||||
<div class="popup-content">
|
||||
<h3 class="popup-title">线上病案退费</h3>
|
||||
<p class="popup-description">请输入患者ID或住院号(二选一)</p>
|
||||
<div class="input-container">
|
||||
<van-field
|
||||
v-model="refundBaPatientId"
|
||||
placeholder="请输入患者ID"
|
||||
class="patient-id-input"
|
||||
maxlength="20"
|
||||
/>
|
||||
<van-field
|
||||
v-model="refundBaHosNum"
|
||||
placeholder="请输入住院号"
|
||||
class="patient-id-input"
|
||||
maxlength="20"
|
||||
/>
|
||||
</div>
|
||||
<div class="popup-buttons">
|
||||
<van-button @click="showRefundBa = false" class="popup-button cancel">取消</van-button>
|
||||
<van-button type="primary" @click="searchBaInfo" class="popup-button confirm" :disabled="!refundBaPatientId && !refundBaHosNum">确认</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-popup>
|
||||
|
||||
<!-- 线上病案退费记录表格弹窗 -->
|
||||
<van-popup v-model="showBaList" position="bottom" :style="{ height: '80%', borderRadius: '10px 10px 0 0' }" :close-on-click-overlay="false">
|
||||
<div class="registration-popup">
|
||||
<div class="popup-header">
|
||||
<h3 class="popup-title">病案记录</h3>
|
||||
<van-button icon="cross" type="default" size="small" @click="showBaList = false" />
|
||||
</div>
|
||||
|
||||
<div class="registration-list-scroll">
|
||||
<table class="registration-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>微信ID</th>
|
||||
<th>患者ID</th>
|
||||
<th>患者名字</th>
|
||||
<th>代取人名字</th>
|
||||
<th>订单号</th>
|
||||
<th>金额</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(item, index) in baList" :key="index">
|
||||
<td>{{ item.userId }}</td>
|
||||
<td>{{ item.patientId }}</td>
|
||||
<td>{{ item.patientName }}</td>
|
||||
<td>{{ item.reName }}</td>
|
||||
<td>{{ item.orderno }}</td>
|
||||
<td>{{ item.amount }}</td>
|
||||
<td>
|
||||
<van-button type="danger" size="small" @click.stop="confirmBaRefund(index)">退费</van-button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</van-popup>
|
||||
|
||||
<!-- 门诊自费退费记录表格弹窗 -->
|
||||
<van-popup v-model="showSelfPaymentList" position="bottom" :style="{ height: '80%', borderRadius: '10px 10px 0 0' }" :close-on-click-overlay="false">
|
||||
<div class="registration-popup">
|
||||
@@ -229,7 +324,9 @@ selectGuaHaoList,
|
||||
apiopBillsPayedRefund,
|
||||
selectYbByPatientId,
|
||||
refundOrderOnline,
|
||||
selectOrderList
|
||||
selectOrderList,
|
||||
WxRefundOrder,
|
||||
apiGetBAList2
|
||||
} from "@/request/api.js";
|
||||
import {Dialog, Toast, Popup, Field, Button} from "vant";
|
||||
export default {
|
||||
@@ -245,8 +342,16 @@ export default {
|
||||
showRegistrationList: false,
|
||||
showYbPaymentList: false,
|
||||
showSelfPaymentList: false, // 门诊自费退费记录弹窗控制
|
||||
showRefundNoHis: false, // 线上退钱不退his弹窗控制
|
||||
showRefundBa: false, // 线上病案退费弹窗控制
|
||||
showBaList: false, // 线上病案退费记录弹窗控制
|
||||
patientId: '',
|
||||
orderNumber: '',
|
||||
refundNoHisOrderNo: '', // 退钱不退his订单号
|
||||
refundNoHisAmount: '', // 退钱不退his金额
|
||||
refundBaPatientId: '', // 线上病案退费患者ID
|
||||
refundBaHosNum: '', // 线上病案退费住院号
|
||||
baList: [], // 线上病案退费记录数据
|
||||
selectedIndex: -1,
|
||||
registrationList: [],
|
||||
ybPaymentList: [],
|
||||
@@ -258,7 +363,7 @@ export default {
|
||||
showPasswordModal: false,
|
||||
password: '',
|
||||
passwordVerified: false,
|
||||
passwordError: false
|
||||
passwordError: false,
|
||||
}
|
||||
|
||||
},
|
||||
@@ -311,6 +416,133 @@ export default {
|
||||
this.showRefundSelf = true;
|
||||
},
|
||||
|
||||
// 显示线上退钱不退his弹窗
|
||||
showRefundNoHisDialog() {
|
||||
this.refundNoHisOrderNo = '';
|
||||
this.refundNoHisAmount = '';
|
||||
this.showRefundNoHis = true;
|
||||
},
|
||||
|
||||
// 确认线上退钱不退his
|
||||
confirmRefundNoHis() {
|
||||
if (!this.refundNoHisOrderNo) {
|
||||
Toast.fail('请输入订单号');
|
||||
return;
|
||||
}
|
||||
if (!this.refundNoHisAmount) {
|
||||
Toast.fail('请输入金额');
|
||||
return;
|
||||
}
|
||||
|
||||
this.showLoading('退费处理中...');
|
||||
|
||||
WxRefundOrder({
|
||||
powertranid: this.refundNoHisOrderNo,
|
||||
money: this.refundNoHisAmount,
|
||||
type: "微信"
|
||||
}).then(res => {
|
||||
this.hideLoading();
|
||||
if (res.code === 200) {
|
||||
Toast.success('退费成功');
|
||||
this.showRefundNoHis = false;
|
||||
} else {
|
||||
Toast.fail('退费失败:' + res.message);
|
||||
}
|
||||
}).catch(error => {
|
||||
this.hideLoading();
|
||||
Toast.fail('退费失败,请稍后重试');
|
||||
console.error('线上退钱不退his失败:', error);
|
||||
});
|
||||
},
|
||||
|
||||
// 显示线上病案退费弹窗
|
||||
showRefundBaDialog() {
|
||||
this.refundBaPatientId = '';
|
||||
this.refundBaHosNum = '';
|
||||
this.showRefundBa = true;
|
||||
},
|
||||
|
||||
// 查询病案信息
|
||||
searchBaInfo() {
|
||||
if (!this.refundBaPatientId && !this.refundBaHosNum) {
|
||||
Toast.fail('请输入患者ID或住院号');
|
||||
return;
|
||||
}
|
||||
|
||||
this.showLoading('查询中...');
|
||||
|
||||
apiGetBAList2({
|
||||
patientId: this.refundBaPatientId,
|
||||
hosNum: this.refundBaHosNum,
|
||||
method:"sfs"
|
||||
}).then(res => {
|
||||
this.hideLoading();
|
||||
if (res.code === 200) {
|
||||
console.log("病案记录为:", res.data);
|
||||
|
||||
// 处理res.data可能是数组或单个对象的情况
|
||||
const rawData = res.data;
|
||||
const dataArray = Array.isArray(rawData) ? rawData : [rawData];
|
||||
|
||||
// 提取需要的字段
|
||||
this.baList = dataArray.map(item => ({
|
||||
userId: item.userId || '',
|
||||
patientId: item.patientId || '',
|
||||
patientName: item.patientName || '',
|
||||
reName: item.reName || '',
|
||||
orderno: item.orderno || '',
|
||||
amount: item.amount || '',
|
||||
// 保留原始数据中的所有必要字段用于后续退费操作
|
||||
...item
|
||||
}));
|
||||
|
||||
// 显示病案记录列表
|
||||
this.showBaList = true;
|
||||
} else {
|
||||
Toast.fail('查询失败:' + res.message);
|
||||
}
|
||||
}).catch(error => {
|
||||
this.hideLoading();
|
||||
Toast.fail('查询失败,请稍后重试');
|
||||
console.error('查询病案信息失败:', error);
|
||||
});
|
||||
},
|
||||
|
||||
// 确认病案退费
|
||||
confirmBaRefund(index) {
|
||||
if (index < 0 || index >= this.baList.length) {
|
||||
Toast.fail('请选择要退费的病案记录');
|
||||
return;
|
||||
}
|
||||
|
||||
const selectedItem = this.baList[index];
|
||||
|
||||
this.showLoading('退费处理中...');
|
||||
|
||||
// 这里需要调用病案退费接口,假设也是使用WxRefundOrder
|
||||
WxRefundOrder({
|
||||
powertranid: selectedItem.orderno,
|
||||
money: selectedItem.amount,
|
||||
type: "全部"
|
||||
}).then(res => {
|
||||
this.hideLoading();
|
||||
if (res.code === 200) {
|
||||
Toast.success('退费成功');
|
||||
// 可以从列表中移除已退费的记录
|
||||
this.baList.splice(index, 1);
|
||||
if (this.baList.length === 0) {
|
||||
this.showBaList = false;
|
||||
}
|
||||
} else {
|
||||
Toast.fail('退费失败:' + res.message);
|
||||
}
|
||||
}).catch(error => {
|
||||
this.hideLoading();
|
||||
Toast.fail('退费失败,请稍后重试');
|
||||
console.error('病案退费失败:', error);
|
||||
});
|
||||
},
|
||||
|
||||
// 显示加载提示
|
||||
showLoading(message = '加载中...') {
|
||||
this.loadingInstance = Toast.loading({
|
||||
@@ -338,7 +570,7 @@ export default {
|
||||
// 显示加载提示
|
||||
this.showLoading('查询中...');
|
||||
|
||||
selectGuaHaoList({patientId: this.patientId}).then(res => {
|
||||
selectGuaHaoList({patientId: this.patientId,method:"sfs"}).then(res => {
|
||||
// 关闭加载提示
|
||||
this.hideLoading();
|
||||
|
||||
@@ -421,7 +653,7 @@ export default {
|
||||
return;
|
||||
}
|
||||
this.showLoading('查询医保信息中...');
|
||||
selectYbByPatientId({patientId: this.patientId}).then(res => {
|
||||
selectYbByPatientId({patientId: this.patientId,method:"sfs"}).then(res => {
|
||||
this.hideLoading();
|
||||
if (res.code === 200) {
|
||||
console.log("此人的医保缴费信息为:", res.data);
|
||||
@@ -486,7 +718,7 @@ export default {
|
||||
}
|
||||
// 显示加载提示
|
||||
this.showLoading('查询中...');
|
||||
selectOrderList({patientId: this.patientId}).then(res=>{
|
||||
selectOrderList({patientId: this.patientId,method:"sfs"}).then(res=>{
|
||||
this.hideLoading();
|
||||
if (res.code === 200) {
|
||||
// 处理查询结果,显示缴费记录列表
|
||||
@@ -575,12 +807,22 @@ export default {
|
||||
this.showLoading('退费处理中...');
|
||||
|
||||
// TODO: 这里添加实际的退费API调用
|
||||
|
||||
setTimeout(() => {
|
||||
this.hideLoading();
|
||||
WxRefundOrder({
|
||||
powertranid: selectedItem.orderNo,
|
||||
money: selectedItem.amount,
|
||||
type: "全部"
|
||||
}).then(res => {
|
||||
if (res.code === 200) {
|
||||
Toast.success('退费成功');
|
||||
this.showSelfPaymentList = false;
|
||||
}, 1000);
|
||||
} else {
|
||||
Toast.fail('退费失败:' + res.message);
|
||||
}
|
||||
}).catch(error => {
|
||||
Toast.fail('退费失败,请稍后重试');
|
||||
console.error('门诊自费退费失败:', error);
|
||||
});
|
||||
|
||||
}).catch(() => {
|
||||
// 用户点击取消后的操作
|
||||
Toast.info('已取消退费');
|
||||
|
||||
Reference in New Issue
Block a user