医嘱大部分优化完成

src/components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/SouSuoYiZhu.vue

@@ -1,13 +1,17 @@
 <template>
   <el-dialog v-model="dialog" title="搜索医嘱" width="95%" @close="emit('close')">
     <el-input ref="searchInput" v-model="orderName" autofocus clearable
-              style="width: 220px" @keyup.enter="dianJiChaXunYiZhu"></el-input>
+              style="width: 220px" @keyup.enter="dianJiChaXunYiZhu" @blur="searchInput.focus()"></el-input>
     <el-button icon="el-icon-search" type="primary" @click="dianJiChaXunYiZhu">搜索</el-button>
+    <xc-code code="Alt+↓/↑" description="上下选择"></xc-code>
+    <xc-code code="Alt+←/→" description="左右翻页"></xc-code>
+    <xc-code code="Alt+Enter" description="选中"></xc-code>
+    <xc-code code="Alt+Q" description="查看药品用法"></xc-code>
     <el-table
-        :data="orderData.data.slice((orderData.currentPage - 1) * orderData.pageSize, orderData.currentPage * orderData.pageSize)"
+        :data="tempOrderData"
         :height="windowSize.h / 1.6"
-        highlight-current-row
-        stripe>
+        ref="elTableRef"
+        :row-class-name="tableRowClassName">
       <el-table-column label="编码" prop="code">
         <template #default="scope">
           <el-button @click="emit('xuanZhongFeiYong', scope.row)">{{ scope.row.orderCode }}</el-button>
@@ -29,6 +33,7 @@
       <el-table-column label="药品详情">
         <template #default="scope">
           <el-button
+              v-if="scope.row.serial !=='00'"
               @click="yaoPinXiangQing.dialog = true;yaoPinXiangQing.code = scope.row.orderCode.trim() + '_' + scope.row.serial.trim()">
             药品详情
           </el-button>
@@ -41,6 +46,7 @@
         :total="orderData.data.length"
         layout="total,prev,pager,next,jumper"
         @current-change="orderDataCurrent"
+        ref="pageRef"
     >
     </el-pagination>
     <yao-ping-xiang-qing v-if="yaoPinXiangQing.dialog" :code="yaoPinXiangQing.code"
@@ -55,6 +61,7 @@ import store from "@/store";
 import YaoPingXiangQing from "@/components/zhu-yuan-yi-sheng/he-li-yong-yao/YaoPingXiangQing.vue";
 import Sleep from "element-plus/packages/test-utils/sleep";
 import {xcHotKey} from "@/utils/xckeydown";
+import {ElMessage} from "element-plus";
 
 const emit = defineEmits(['xuanZhongFeiYong', 'close'])
 
@@ -64,38 +71,99 @@ const windowSize = computed(() => {
 let dialog = $ref(true)
 const orderName = ref('')  // 01672
 let searchInput = $ref(null)
+let dataIndex = $ref(-1)
+let elTableRef = $ref(null)
+let count = computed(() => {
+  return Math.ceil(orderData.value.data.length / orderData.value.pageSize)
+})
+
 const orderData = ref({
   currentPage: 1,
   pageSize: 10,
   data: [],
 })
 
+const tempOrderData = computed(() => {
+  return orderData.value.data.slice((orderData.value.currentPage - 1) * orderData.value.pageSize, orderData.value.currentPage * orderData.value.pageSize)
+})
+
 
 const dianJiChaXunYiZhu = () => {
-  huoQuXiangMu(orderName.value).then((res) => {
+  huoQuXiangMu(orderName.value).then(async (res) => {
     orderData.value.data = res
     orderData.value.currentPage = 1
+    dataIndex = -1
   })
 }
 
 const orderDataCurrent = (val) => {
+  dataIndex = 0
   orderData.value.currentPage = val
 }
 
+const tableRowClassName = ({row, rowIndex}) => {
+  if (dataIndex === rowIndex) {
+    return 'input_and_table_to_be_selected'
+  }
+}
+
 let yaoPinXiangQing = $ref({
   dialog: false,
   code: '',
 })
 
 const direction = (val) => {
-  console.log(val)
+  let pageDataLength = tempOrderData.value.length
+  if (pageDataLength > 0) {
+    removeHoverStyle();
+    switch (val) {
+      case 'ArrowUp':
+        dataIndex <= 0 ? dataIndex = pageDataLength - 1 : dataIndex--
+        break;
+      case 'ArrowDown':
+        dataIndex === pageDataLength - 1 ? dataIndex = 0 : dataIndex++
+        break;
+      case 'ArrowRight':
+        orderDataCurrent(orderData.value.currentPage + 1 > count.value ? 1 : orderData.value.currentPage + 1)
+        break;
+      case 'ArrowLeft':
+        orderDataCurrent(orderData.value.currentPage - 1 < 1 ? count.value : orderData.value.currentPage - 1)
+        break;
+    }
+    try {
+      const targetTop = elTableRef.$el.querySelectorAll('.el-table__body tr')[dataIndex].getBoundingClientRect().top //该行的位置
+      const containerTop = elTableRef.$el.querySelector('.el-table__body').getBoundingClientRect().top //body的位置
+      elTableRef.$refs.bodyWrapper.scrollTop = targetTop - containerTop
+    } catch (e) {
+      console.error(e)
+    }
+  }
 }
+
 const enter = () => {
-  console.log(123)
+  if (dataIndex > -1) {
+    emit('xuanZhongFeiYong', tempOrderData.value[dataIndex])
+  } else {
+    ElMessage.error('请先选择数据')
+  }
+}
+
+const viewDrugUsage = () => {
+  if (dataIndex > -1) {
+    let data = tempOrderData.value[dataIndex]
+    if (data.serial !== '00') {
+      yaoPinXiangQing.dialog = true;
+      yaoPinXiangQing.code = data.orderCode.trim() + '_' + data.serial.trim()
+    } else {
+      ElMessage.error('这个是项目')
+    }
+  } else {
+    ElMessage.error('请先选择数据')
+  }
 }
 
 let registerShortcuts = {
-  alt: {'direction': direction, 'enter': enter}
+  alt: {'direction': direction, 'Enter': enter, 'q': viewDrugUsage}
 }
 
 const hotKey = () => {
@@ -110,9 +178,17 @@ onMounted(async () => {
   hotKey()
 })
 
-onUnmounted(() => {
-  window.onkeydown = null
-})
+const removeHoverStyle = () => {
+  let oldItem = elTableRef.$el.classList
+  let newItem = []
+  for (let i = 0; i < oldItem.length; i++) {
+    if (oldItem[i] !== 'el-table--enable-row-hover') {
+      newItem.push(oldItem[i])
+    }
+  }
+  elTableRef.$el.classList = newItem
+  elTableRef.$el.className = newItem.join(' ')
+}
 
 </script>
 

src/views/hospitalization/zhu-yuan-yi-sheng/yi-zhu-lu-ru/TianJiaYiZhu.vue

@@ -130,7 +130,7 @@
       </el-col>
       <el-col :span="span">
         <el-form-item label="医生嘱托:">
-          <el-input v-model="yiZhuData.instruction" clearable maxlength="50" show-word-limit style="width: 130px"
+          <el-input v-model="yiZhuData.instruction" clearable maxlength="50" show-word-limit
                     type="textarea"></el-input>
         </el-form-item>
       </el-col>
@@ -275,7 +275,7 @@
     </el-table-column>
   </el-table>
   <!-- 这里是搜索医嘱的 -->
-  <sou-suo-yi-zhu v-if="yiZhuMingDialog" @close="yiZhuMingDialog = false"
+  <sou-suo-yi-zhu v-if="yiZhuMingDialog" @close="closeTheDoctorSOrderSearchBox()"
                   @xuanZhongFeiYong="xuanZhongFeiYong"></sou-suo-yi-zhu>
   <AllergenEntry v-if="allergenDialog" :pat-no="huanZheXinXi.inpatientNo"
                  @close="allergenDialog = false"></AllergenEntry>
@@ -398,7 +398,7 @@ let yiZhuMingDialog = $ref(false)
 const xuanZhongFeiYong = async (row) => {
   qingKong()
   await Sleep(600)
-  yiZhuMingDialog = false
+  closeTheDoctorSOrderSearchBox()
   yiZhuData.value = row
   if (row.serial !== '00') {
     huoQuFeiYongXinXi(row.orderCode, row.serial)
@@ -492,6 +492,11 @@ const xuanZhongFeiYong = async (row) => {
   pingLv.focus()
 }
 
+const closeTheDoctorSOrderSearchBox = () => {
+  yiZhuMingDialog = false
+  xcHotKey(shortcutKeyRegistration)
+}
+
 /* 频率 */
 let pingLv = $ref(null)
 const yaoPinPingLvData = ref([])

src/views/hospitalization/zhu-yuan-yi-sheng/yi-zhu-lu-ru/YiZhuLuRu.vue

@@ -393,9 +393,9 @@ const dianJiFuZhuXuanZhongYiZhu = () => {
 }
 
 onMounted(async () => {
-  setTimeout(() => {
-    addYiZhuClick()
-  }, 300)
+  // setTimeout(() => {
+  //   addYiZhuClick()
+  // }, 300)
   zkList.value = await getTheTransferList()
 })