From b5b89e7fa1c0b2099eff023222943eeb66a1fd98 Mon Sep 17 00:00:00 2001
From: ChenQiuYu <chenqiuyu@jizhiweb.cn>
Date: Wed, 30 Apr 2025 11:55:52 +0800
Subject: [PATCH] dev

---
 src/components/charge/ChargeQueue.vue         |  16 +-
 src/components/charge/GoodsDetail.vue         |  10 +-
 src/components/charge/ServiceDetail.vue       |  46 +++---
 src/components/charge/TotalPrice.vue          |  48 ++++++
 .../outpatient/DiagnosisSearchInput.vue       |   2 +-
 src/views/charge/index.vue                    | 138 ++++++++++--------
 6 files changed, 161 insertions(+), 99 deletions(-)
 create mode 100644 src/components/charge/TotalPrice.vue

diff --git a/src/components/charge/ChargeQueue.vue b/src/components/charge/ChargeQueue.vue
index 9810db5..d43cc61 100644
--- a/src/components/charge/ChargeQueue.vue
+++ b/src/components/charge/ChargeQueue.vue
@@ -6,7 +6,7 @@
     <template #default>
       <div class="container">
         <div class="tabs">
-          <span v-for="(item,index) in statusList " :key="index" :class="status == item.value ? 'tabs-item' : ''"
+          <span v-for="(item,index) in statusList " :key="index" :class="query.status == item.value ? 'tabs-item' : ''"
                 @click="tab(item)">{{ item.label }}&nbsp;{{ item.num }}
           </span>
         </div>
@@ -59,16 +59,15 @@ const curItem = ref<any>({});
 const emit = defineEmits(['clickItem'])
 const clickItem = (item: any) => {
   curItem.value = item
-  emit('clickItem', item);
+  emit('clickItem', item, query.value.status);
 }
 
-const orderList = ref<any>([
-
-]);
+const orderList = ref<any>([]);
 const query = ref({
   pageSize: 20,
   pageNum: 1,
-  keyword: ""
+  keyword: "",
+  status: 0
 })
 const addChargeOrder = () => {
   const newOrder = {
@@ -86,7 +85,7 @@ const clickFirst = () => {
   clickItem(orderList.value[0])
 }
 const getOrderList = () => {
-  post("medical/record/getChargeQueue", {query: query.value,status:status.value}).then(
+  post("medical/record/getChargeQueue", {query: query.value}).then(
       (res: any) => {
         orderList.value = res.list
         clickFirst()
@@ -101,7 +100,6 @@ defineExpose({delDraft, getOrderList})
 onMounted(() => {
   getOrderList()
 })
-const status = ref(0)
 const statusList = ref([
   {
     label: '待收',
@@ -115,7 +113,7 @@ const statusList = ref([
   },
 ])
 const tab = (item: any) => {
-  status.value = item.value
+  query.value.status = item.value
   getOrderList()
 }
 </script>
diff --git a/src/components/charge/GoodsDetail.vue b/src/components/charge/GoodsDetail.vue
index c732264..cf86336 100644
--- a/src/components/charge/GoodsDetail.vue
+++ b/src/components/charge/GoodsDetail.vue
@@ -1,6 +1,6 @@
 <template>
   <el-table :data="data.goodsDetail" max-height="150">
-    <el-table-column prop="name" label="名称"></el-table-column>
+    <el-table-column prop="name" label="名称" show-overflow-tooltip></el-table-column>
     <el-table-column prop="selectedPrice" label="单价"></el-table-column>
     <el-table-column prop="number" label="数量">
       <template #default="scope">
@@ -30,11 +30,17 @@
       </template>
     </el-table-column>
   </el-table>
-  <SearchInput :request-api="goodsSearchApi" :show-config="goodsShowConfig" @selectedCallBack="goodsSelect"></SearchInput>
+  <SearchInput :disabled="data.status == 1" :request-api="goodsSearchApi" :show-config="goodsShowConfig" @selectedCallBack="goodsSelect"></SearchInput>
 </template>
 <script setup lang="ts">
 import SearchInput from "@/components/SearchInput.vue";
 
+const props = defineProps({
+  disabled: {
+    type: Boolean,
+    default: false
+  }
+})
 const data = defineModel<any>();
 const delGoods = (item: any) => {
   data.value.goodsDetail = data.value.filter((i: any) => i.id != item.id)
diff --git a/src/components/charge/ServiceDetail.vue b/src/components/charge/ServiceDetail.vue
index f1795b7..b431d9e 100644
--- a/src/components/charge/ServiceDetail.vue
+++ b/src/components/charge/ServiceDetail.vue
@@ -1,34 +1,30 @@
 <template>
-          <el-table :data="data.itemDetail" max-height="150">
-            <el-table-column prop="itemName" label="名称"></el-table-column>
-            <el-table-column prop="selectedUnit" label="单位"></el-table-column>
-            <el-table-column prop="selectedPrice" label="单价"></el-table-column>
-            <el-table-column  label="数量">
-              <template #default="scope">
-                <div v-if="data.status == 0">
-                  <el-input-number v-model="scope.row.selectedNum" min="0" @change="handleNumChange"></el-input-number>
-                </div>
-                <div v-else>
-                  {{ scope.row.selectedNum }}
-                </div>
-              </template>
-            </el-table-column>
-            <el-table-column label="操作" v-if="data.status ==0">
-              <template #default="scope">
-                <el-button type="danger" link @click="delService(scope.row)">X</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
-          <SearchInput :request-api="serviceSearchApi" :show-config="serviceShowConfig" @selectedCallBack="serviceSelect"></SearchInput>
+  <el-table :data="data.itemDetail" max-height="150">
+    <el-table-column prop="itemName" label="名称" show-overflow-tooltip></el-table-column>
+    <el-table-column prop="selectedUnit" label="单位"></el-table-column>
+    <el-table-column prop="selectedPrice" label="单价"></el-table-column>
+    <el-table-column label="数量">
+      <template #default="scope">
+        <el-input-number v-model="scope.row.selectedNum" min="0"
+                         @change="handleNumChange"></el-input-number>
+      </template>
+    </el-table-column>
+    <el-table-column label="操作" v-if="data.status ==0">
+      <template #default="scope">
+        <el-button type="danger" link @click="delService(scope.row)">X</el-button>
+      </template>
+    </el-table-column>
+  </el-table>
+  <SearchInput :disabled="data.status == 1" :request-api="serviceSearchApi" :show-config="serviceShowConfig"
+               @selectedCallBack="serviceSelect"></SearchInput>
 </template>
 <script setup lang="ts">
 import SearchInput from "@/components/SearchInput.vue";
 
-const data =defineModel<any>();
+const data = defineModel<any>();
 const delService = (item: any) => {
   data.value.itemDetail = data.value.filter((i: any) => i.id != item.id)
 }
-
 const serviceSearchApi = "item/search";
 const serviceShowConfig = [
   {
@@ -50,9 +46,9 @@ const serviceSelect = (row: any) => {
   row.selectedUnit = row.unit
   row.selectedPrice = row.unitPrice
   data.value.itemDetail.push(row)
-  emit('totalPriceChange',row)
+  emit('totalPriceChange', row)
 }
-const handleNumChange = ()=>{
+const handleNumChange = () => {
   emit('totalPriceChange')
 }
 
diff --git a/src/components/charge/TotalPrice.vue b/src/components/charge/TotalPrice.vue
new file mode 100644
index 0000000..ae60814
--- /dev/null
+++ b/src/components/charge/TotalPrice.vue
@@ -0,0 +1,48 @@
+<script setup lang="ts">
+import Panel from '../common/Panel.vue';
+import {defineEmits, defineModel,defineProps} from 'vue'
+const {status}=defineProps(['status'])
+const emit = defineEmits(['save','deleteItem','edit']);
+const save = () => {
+  emit('save');
+};
+const deleteItem = () => {
+  emit('deleteItem');
+};
+const totalAmount = defineModel<any>()
+const editItem= () => {
+  emit('edit');
+};
+</script>
+
+<template>
+  <Panel :showTools="false" :showHeader="false">
+    <div class="footer">
+      <div>总金额：<span class="text icon">￥</span><span class="text">{{ totalAmount || '0' }}</span></div>
+      <div class="btn-group">
+        <el-button type="primary" disabled>追溯码</el-button>
+        <el-button type="primary" @click="editItem">收费</el-button>
+      </div>
+    </div>
+  </Panel>
+</template>
+
+<style scoped lang="scss">
+.footer {
+  height: 86px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  font-weight: 400;
+  font-size: 22px;
+  color: #333333;
+  font-style: normal;
+  padding:0 24px 0 24px;
+  .icon{
+    font-size: 16px;
+  }
+  .text {
+    color: #FF282E
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/components/outpatient/DiagnosisSearchInput.vue b/src/components/outpatient/DiagnosisSearchInput.vue
index 7c33edb..3b3fb55 100644
--- a/src/components/outpatient/DiagnosisSearchInput.vue
+++ b/src/components/outpatient/DiagnosisSearchInput.vue
@@ -1,7 +1,7 @@
 <template>
   <el-popover placement="bottom-start" trigger="click" :width="props.width" ref="popoverRef" @before-enter="beforeShow">
     <template #reference>
-      <el-input v-model="keyword" :style="{'width': props.width+'px'}" @input="changeInput" :disabled="disabled"
+      <el-input v-model="keyword" style="width:100%;height: 100%" @input="changeInput" :disabled="disabled"
                 placeholder="诊断选择"></el-input>
     </template>
     <div class="container" v-if="searchList.length > 0">
diff --git a/src/views/charge/index.vue b/src/views/charge/index.vue
index 4ff6ddc..1188c92 100644
--- a/src/views/charge/index.vue
+++ b/src/views/charge/index.vue
@@ -4,65 +4,70 @@
       <chargeQueue @clickItem="clickItem" ref="chargeQueueRef"></ChargeQueue>
     </div>
     <div class="middle">
-      <Panel title="零售收费">
-        <template #tools>
-          <span>{{ formData.totalPrice }}</span>
-          <div v-if="formData.status == 0 ">
-            <el-button type="primary" @click="delDraft()" v-if="formData.id == -1">删除</el-button>
-            <el-button type="primary" @click="saveAndCharge">收费</el-button>
-            <el-button type="primary">追溯码</el-button>
-            <el-button type="primary">挂单</el-button>
-          </div>
+      <el-scrollbar>
+        <Panel title="零售收费">
+          <el-form :model="formData" inline label-width="0">
+            <el-form-item>
+              <el-input v-model="formData.patientInfo.name" :disabled="statusDisabled==1"
+                        placeholder="请输入姓名"></el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-select v-model="formData.patientInfo.sex" style="width: 80px;" :disabled="statusDisabled==1">
+                <el-option :label="'男'" :value="'1'"></el-option>
+                <el-option :label="'女'" :value="'2'"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-input v-model="formData.patientInfo.age" :disabled="statusDisabled==1">
+                <template #suffix>
+                  岁
+                </template>
+              </el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-input v-model="formData.patientInfo.phone" placeholder="手机号" :disabled="statusDisabled==1">
+              </el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-select v-model="formData.diagnosisMedicalRecord.dockerId" placeholder="医生" style="width: 100px"
+                         :disabled="statusDisabled==1">
+                <el-option v-for="item in dockerList" :key="item.id" :label="item.name" :value="item.id"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-form>
 
-        </template>
-        <el-form :model="formData" inline label-width="0">
-          <el-form-item>
-            <el-input v-model="formData.patientInfo.name" placeholder="请输入姓名"></el-input>
-          </el-form-item>
-          <el-form-item>
-            <el-select v-model="formData.patientInfo.sex" style="width: 80px;">
-              <el-option :label="'男'" :value="'男'"></el-option>
-              <el-option :label="'女'" :value="'女'"></el-option>
-            </el-select>
-          </el-form-item>
-          <el-form-item>
-            <el-input v-model="formData.patientInfo.age">
-              <template #suffix>
-                岁
-              </template>
-            </el-input>
-          </el-form-item>
-          <el-form-item>
-            <el-input v-model="formData.patientInfo.phone" placeholder="手机号">
-            </el-input>
-          </el-form-item>
-          <el-form-item>
-            <el-button>卡</el-button>
-            <el-button>+</el-button>
-          </el-form-item>
-          <el-form-item>
-            <el-select v-model="formData.diagnosisMedicalRecord.dockerId" placeholder="医生" style="width: 100px">
-              <el-option v-for="item in dockerList" :key="item.id" :label="item.name" :value="item.id"></el-option>
-            </el-select>
-          </el-form-item>
-        </el-form>
-        <DiagnosisSearchInput
-            v-model="diagnosisKeyword"
-            :request-api="diagnosisSearchApi"
-            :show-config="diagnosisShowConfig"
-            @selectedCallBack="diagnosisSelect"
-            ref="diagnosisSearchRef"
-            :show-header="false">
-        </DiagnosisSearchInput>
+        </Panel>
+        <div style="margin-top: 24px">
+          <Panel title="医疗诊断">
+            <div style="height:64px;padding:0 24px 24px">
+              <DiagnosisSearchInput
+                  v-model="diagnosisKeyword"
+                  :request-api="diagnosisSearchApi"
+                  :show-config="diagnosisShowConfig"
+                  @selectedCallBack="diagnosisSelect"
+                  ref="diagnosisSearchRef"
+                  :show-header="false"
+                  :disabled="statusDisabled==1"
 
-      </Panel>
-      <Panel title="服务项目">
-        <ServiceDetail v-model="formData" @totalPriceChange="getOrderTotalPrice"></ServiceDetail>
-
-      </Panel>
-      <Panel title="药品耗材">
-        <GoodsDetail v-model="formData" @totalPriceChange="getOrderTotalPrice"></GoodsDetail>
-      </Panel>
+              >
+              </DiagnosisSearchInput>
+            </div>
+          </Panel>
+        </div>
+        <div style="margin-top: 24px">
+          <Panel title="服务项目">
+            <ServiceDetail v-model="formData" @totalPriceChange="getOrderTotalPrice"></ServiceDetail>
+          </Panel>
+        </div>
+        <div style="margin-top: 24px">
+          <Panel title="药品耗材">
+            <GoodsDetail v-model="formData" @totalPriceChange="getOrderTotalPrice"></GoodsDetail>
+          </Panel>
+        </div>
+        <div class="bottom">
+         <TotalPrice v-model="formData.totalPrice" @edit="saveAndCharge"></TotalPrice>
+        </div>
+      </el-scrollbar>
     </div>
     <div class="right">
       <div class="top">
@@ -89,12 +94,14 @@ import ServiceDetail from "@/components/charge/ServiceDetail.vue";
 import GoodsDetail from "@/components/charge/GoodsDetail.vue";
 import DiagnosisSearchInput from "@/components/outpatient/DiagnosisSearchInput.vue";
 import Settlement from "@/components/charge/Settlement.vue";
+import TotalPrice from "@/components/charge/TotalPrice.vue";
 
 const socialCard = ref<any>({payInfo: {}})
 const formData = ref<any>({
   patientInfo: {},
   diagnosisMedicalRecord: {},
 })
+const statusDisabled = ref(0)
 const diagnosisKeyword = ref("")
 const chargeQueueRef = ref()
 const delDraft = () => {
@@ -129,21 +136,23 @@ const diagnosisSelect = (list: any) => {
   formData.value.diagnosisMedicalRecord.diagnosisSummary = diagnosisNames
 }
 
-const clickItem = (item: any) => {
+const clickItem = (item: any, status: any) => {
   formData.value = item
+  statusDisabled.value = status
   getOrderTotalPrice()
   nextTick(() => {
     let list = JSON.parse(formData.value.diagnosisMedicalRecord.diagnosisDetail)
     let nList = formData.value.diagnosisMedicalRecord.diagnosisSummary.split(',')
     diagnosisSearchRef.value?.init(list, nList);
   })
+
 }
 const dockerList = ref<any[]>([])
 const getDockerList = () => {
-  let query={
-    role:1
+  let query = {
+    role: 1
   }
-  post('organization/member/search',{query:query}).then((res: any) => {
+  post('organization/member/search', {query: query}).then((res: any) => {
     dockerList.value = res
   })
 }
@@ -250,5 +259,10 @@ const getOrderTotalPrice = () => {
 
 
 }
-
+.bottom{
+  margin-top: 24px;
+  height: 86px;
+  background: #FFFFFF;
+  border-radius: 8px;
+}
 </style>
\ No newline at end of file