Merge remote-tracking branch 'origin/20240912_adapter' into 20240912_adapter

20240912_adapter
wangwei 5 months ago
commit 0d21967709

@ -1,7 +1,10 @@
<template>
<div>
<el-form :model="formData" class="order-el-form" ref="formData" label-width="120px" @submit.native.prevent>
<div class="page-container">
<div class="content-wrapper">
<!-- 左侧面板 -->
<div class="content-left">
<el-card>
<el-form :model="formData" class="order-el-form" ref="formData" label-width="120px" @submit.native.prevent>
<!-- <el-alert-->
<!-- style="margin-top: 15px"-->
@ -235,7 +238,7 @@
</div>
<el-descriptions title="单据信息" :column="4" border style="margin-top: 15px">
<el-descriptions title="单据信息" :column="2" border style="margin-top: 15px">
<el-descriptions-item label="业务单号">{{ formData.billNo }}</el-descriptions-item>
<el-descriptions-item label="发货方">{{ formData.shipperName }}</el-descriptions-item>
<el-descriptions-item label="收货方">{{ formData.fromCorpName }}</el-descriptions-item>
@ -244,9 +247,13 @@
<el-descriptions-item label="单据时间">{{ formData.billTime }}</el-descriptions-item>
<el-descriptions-item label="单据备注">{{ formData.remark }}</el-descriptions-item>
</el-descriptions>
</el-form>
</el-card>
</div>
<el-tabs type="border-card" style="margin: 15px" v-model="editableTabsValue">
<!-- 右侧面板 -->
<div class="content-right">
<el-tabs type="border-card" class="right-tabs" v-model="editableTabsValue">
<el-tab-pane label="扫码详情" name="prescribeOriginPanel">
<prescribeOriginPanel
v-if="panelALive"
@ -382,7 +389,8 @@
</el-dialog>
</el-form>
</div>
</div>
</div>
</template>
@ -655,7 +663,6 @@ export default {
}
}
}
return
})
@ -1674,20 +1681,62 @@ export default {
</script>
<style scoped>
.page-container {
height: 100%;
width: 100%;
padding: 15px;
box-sizing: border-box;
}
.content-wrapper {
display: flex;
gap: 15px;
height: 100%;
width: 100%;
}
.content-left {
flex: 0 0 40%;
min-width: 0; /* 防止内容溢出 */
}
.content-right {
flex: 0 0 60%;
min-width: 0; /* 防止内容溢出 */
}
/* 保持卡片内容可滚动 */
.content-left :deep(.el-card__body) {
height: 100%;
overflow-y: auto;
}
/* 保持右侧标签页内容可滚动 */
.content-right :deep(.el-tabs__content) {
height: calc(100% - 40px);
overflow-y: auto;
}
/* 其他现有样式保持不变 */
.el-col {
margin-top: -5px;
margin-bottom: -5px;
margin: 0;
}
.el-alert {
margin-bottom: 16px;
}
.el-dropdown {
vertical-align: top;
.el-alert:last-child {
margin-bottom: 0;
}
.el-dropdown + .el-dropdown {
margin-left: 15px;
.el-tabs--border-card {
height: 100%;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.el-icon-arrow-down {
font-size: 12px;
.query-form-item :deep(.el-form-item__content) {
display: flex;
align-items: center;
}
</style>

@ -1,39 +1,62 @@
<template>
<div>
<el-row>
<el-col v-for="(info, index) in preDetailList" :key="index" :xs="12" :sm="6" :md="6" :lg="8" >
<el-card :body-style="{margin:'20px'}"
style="margin:20px 20px 20px 20px;;background-color: #e1f3fb;border-radius: 12px; position: relative;">
<div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
<p>产品通用名</p> <p style="font-size: 20px;background-color: #e1f3fb;font-weight: bold;">{{ info.cpmctymc }}</p>
<el-row :gutter="20">
<el-col v-for="(info, index) in preDetailList" :key="index" :span="24">
<el-card class="drug-card">
<div class="card-content">
<div class="info-section">
<div class="info-row">
<span class="label">产品通用名</span>
<span class="value product-name">{{ info.cpmctymc }}</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
<p>包装规格</p><p style="font-size: 16px;background-color: #e1f3fb;font-weight: bold;">{{ info.ggxh }}</p>
<div class="info-row">
<span class="label">包装规格</span>
<span class="value">{{ info.ggxh }}</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
<p>制剂规格</p><p style="font-size: 16px;background-color: #e1f3fb;font-weight: bold;">{{ info.prepnSpec }}</p>
<div class="info-row">
<span class="label">制剂规格</span>
<span class="value">{{ info.prepnSpec }}</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
<p>批次号</p><p style="font-size: 16px;background-color: #e1f3fb;font-weight: bold;">{{ info.batchNo }}</p>
<div class="info-row">
<span class="label">批次号</span>
<span class="value">{{ info.batchNo }}</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
<p>摆放位置</p><p style="font-size: 16px;background-color: #e1f3fb;font-weight: bold;">{{ info.queueCode }}</p>
<div class="info-row">
<span class="label">摆放位置</span>
<span class="value">{{ info.queueCode }}</span>
</div>
<div style="display: flex; justify-content: space-between; align-items: center; height: 26px; /* 约为 200px 的 1/3 */" >
<p></p><p style="font-size: 20px;background-color: #e1f3fb;font-weight: bold;margin-top: 80px"><i class="el-icon-s-opportunity"></i>
<span :style="colorStyle(info)">{{ info.colorName}}</span></p>
</div>
<div style="flex: 1; display: flex; flex-direction: column; justify-content: flex-end; padding-top: 10px;" >
<span><h1 :style="{ 'font-size': '45px', 'color': info.getConfirm ? '#67C23A' : '#F56C6C' }">{{ info.count }}</h1></span>
<el-button type="primary" style="position: absolute; bottom: 20px; right: 130px;" icon="el-icon-document" @click="codeHandleClick(info)" :disabled="!info.getConfirm">赋码明细</el-button>
<el-button type="primary" style="position: absolute; bottom: 20px; right: 20px;" icon="el-icon-thumb" @click="handleClick(info)" :disabled="info.getConfirm">确认取药</el-button>
</div>
<div class="action-section">
<div class="count-display">
<h1 class="count" :class="{ 'confirmed': info.getConfirm }">{{ info.count }}</h1>
<div class="light-info">
<i class="el-icon-s-opportunity"></i>
<span :style="colorStyle(info)">{{ info.colorName }}</span>
</div>
</div>
<div class="button-group">
<el-button
type="primary"
icon="el-icon-document"
@click="codeHandleClick(info)"
:disabled="!info.getConfirm">
赋码明细
</el-button>
<el-button
type="primary"
icon="el-icon-thumb"
@click="handleClick(info)"
:disabled="info.getConfirm">
确认取药
</el-button>
</div>
</div>
</div>
</el-card>
</el-col>
</el-row>
<el-dialog
title="扫码明细"
:visible.sync="scanDetailVisible"
@ -345,4 +368,76 @@ export default {
</script>
<style scoped>
.drug-card {
margin: 10px 0;
background-color: #e1f3fb;
border-radius: 12px;
}
.card-content {
display: flex;
justify-content: space-between;
align-items: center;
}
.info-section {
flex: 1;
}
.info-row {
display: flex;
align-items: center;
margin: 8px 0;
}
.label {
color: #606266;
font-size: 14px;
width: 100px;
flex-shrink: 0;
}
.value {
font-weight: bold;
font-size: 14px;
}
.product-name {
font-size: 16px;
}
.action-section {
display: flex;
flex-direction: column;
align-items: center;
margin-left: 40px;
}
.count-display {
text-align: center;
margin-bottom: 20px;
}
.count {
font-size: 45px;
margin: 0 0 10px 0;
}
.count.confirmed {
color: #67C23A;
}
.count:not(.confirmed) {
color: #F56C6C;
}
.light-info {
text-align: center;
}
.button-group {
display: flex;
gap: 10px;
}
</style>

Loading…
Cancel
Save