优化

src/components/xiao-chan/xc-table-v2/XcTableV2.vue

@@ -1,21 +1,26 @@
 <template>
-  <div class="xc-table">
-    <div class="header">
-      <div
-          v-for="item in props.columns"
-          class="th"
-          @click="headerClick(item)"
-          :style="{width :item.width +   'px' }">
+  <div class="xc-table"
+       ref="tableRef">
+    <div class="header"
+         ref="headerRef">
+      <div v-for="item in props.columns"
+           class="th"
+           @click="headerClick(item)"
+           :style="{width :item.width + 'px' }">
+        <template v-if="item.type">
+          <component :is="typeEnum[item.type].header()"/>
+        </template>
         {{ item.name }}
       </div>
     </div>
-
     <div v-bind="containerProps"
          class="xc-body"
          :style="{height : props.height + 'px'}">
-      <div v-bind="wrapperProps">
+      <div v-bind="wrapperProps"
+           ref="dataRef">
         <div v-for="item in list"
              :key="item.index"
+             @contextmenu.prevent.stop="contextmenu(item.data,item.index,$event)"
              :style="rowStyle(item.data, item.index)"
              @dblclick.stop="dbRowClick(item.data, $event, item.index)"
              @click="rowClick(item.data, $event, item.index)"
@@ -24,7 +29,10 @@
                :title="item.data[he.code]"
                class="cell"
                :style="{width :he.width + 'px' }">
-            <template v-if="he.cellRenderer">
+            <template v-if="he.type">
+              <component :is="typeEnum[he.type].body(item)"/>
+            </template>
+            <template v-else-if="he.cellRenderer">
               <component :is="he.cellRenderer({data: item.data,index:item.index,cellData: item.data[he.code]})"/>
             </template>
             <template v-else>
@@ -39,6 +47,10 @@
 
 <script setup name='XcTableV2' lang="tsx">
 import {useVirtualList} from "@vueuse/core";
+import {computed, nextTick, onMounted, ref} from 'vue'
+import {Ref} from "vue-demi";
+import {ElCheckbox} from "element-plus";
+import {applyMorphAnimation} from "echarts/types/src/animation/morphTransitionHelper";
 
 const props = defineProps({
   data: Array,
@@ -47,13 +59,20 @@ const props = defineProps({
     type: Number,
     default: 300
   },
+  rowStyle: {
+    type: Function,
+    default: null
+  }
+})
 
+const tempData = computed(() => {
+  return props.data
 })
 
-const emits = defineEmits(['rowClick', 'dbRowClick', 'rowStyle'])
+const emits = defineEmits(['rowClick', 'dbRowClick', 'contextmenu'])
 
 const {list, containerProps, wrapperProps} = useVirtualList(
-    props.data,
+    tempData,
     {
       itemHeight: 24,
     },
@@ -66,10 +85,10 @@ const headerClick = (item) => {
 }
 
 const rowStyle = (data, index) => {
-  emits('rowStyle', data, index)
+  if (props.rowStyle === null) return
+  return props.rowStyle(data, index)
 }
 
-
 let timer = null
 const rowClick = (item, event, index) => {
   if (timer) {
@@ -87,51 +106,142 @@ const dbRowClick = (item, event, index) => {
   emits('dbRowClick', item, index, event)
 }
 
-</script>
+const contextmenu = (data, index, event) => {
+  emits('contextmenu', data, index, event)
+}
 
-<style scoped lang="scss">
+const tableRef: Ref<HTMLElement | null> = ref(null)
+const dataRef: Ref<HTMLElement | null> = ref(null)
+const headerRef: Ref<HTMLElement | null> = ref(null)
 
-.xc-table {
-  overflow-x: auto;
+onMounted(async () => {
+  await nextTick()
+  containerProps.ref.value.addEventListener('scroll', () => {
+    headerRef.value.scrollLeft = containerProps.ref.value.scrollLeft
+  })
+})
+
+const checkAll: Ref<boolean> = ref(false)
+const isIndeterminate = computed(() => {
+  if (selectedData.value.length > 0) {
+    return true
+  } else if (selectedData.value.length === selectedData.value.length) {
+    return false
+  }
+})
+const selectedData: Ref<Array<any>> = ref([])
+
+const typeEnum = {
+  "selected": {
+    header: () => {
+      return (<ElCheckbox modelValue={checkAll.value}
+                          onclick={(e) => {
+                            clickSelectedAll(e)
+                          }}
+                          indeterminate={isIndeterminate.value}/>)
+    },
+    body: ({data, index}) => {
+      return (<ElCheckbox
+          onChange={(e) => clickSelected(data, e)}
+          modelValue={data.tempCheckbox}
+          onclick={(e) => clickSelected(data, e, true)}/>)
+    }
+  },
+  "index": {
+    header: () => (<span>排序</span>),
+    body: ({data, index}) => (
+        <span>{index + 1}</span>
+    )
+  }
 }
 
-.xc-body {
+const clickSelected = (data, e: Event, flag = false) => {
+  console.log(123)
+  e.preventDefault()
+  e.stopImmediatePropagation();
+  if (flag) {
+    data.tempCheckbox = !data.tempCheckbox
+  }
+  if (data.tempCheckbox) {
+    selectedData.value.push(data)
+  } else {
+    let index = selectedData.value.findIndex((item) => {
+      return item === data
+    })
+    selectedData.value.splice(index, 1)
+  }
+}
 
-  .row {
-    height: 22px;
-    display: flex;
-    align-items: center;
+const clickSelectedAll = (e: Event) => {
+  e.preventDefault()
+  checkAll.value = !checkAll.value
+
+  if (checkAll.value) {
+    selectedData.value = []
+    tempData.value.forEach(item => {
+      item.tempCheckbox = true
+    })
+  } else {
+    selectedData.value = tempData.value
+    selectedData.value = []
+    tempData.value.forEach(item => {
+      item.tempCheckbox = false
+    })
   }
+}
+
+
+</script>
+
+<style scoped lang="scss">
+
+.xc-table {
+  overflow-x: hidden;
 
-  .cell {
-    overflow: hidden;
-    border: 1px solid #fff;
+  .header {
+    height: max-content;
     display: flex;
     align-items: center;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    height: 100%;
-    flex-grow: 0;
-    flex-shrink: 0;
+    border-bottom: 1px solid;
+    overflow-x: hidden;
+
+    .th {
+      overflow: hidden;
+      border: 1px solid #fff;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      flex-grow: 0;
+      flex-shrink: 0
+    }
   }
 
+  .xc-body {
 
-}
+    //overflow-x: hidden;
+
+    &::-webkit-scrollbar {
+      height: 6px;
+    }
+
+    .row {
+      height: 22px;
+      display: flex;
+      align-items: center;
+    }
 
+    .cell {
+      overflow: hidden;
+      border: 1px solid #fff;
+      display: flex;
+      align-items: center;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      height: 100%;
+      flex-grow: 0;
+      flex-shrink: 0;
+    }
 
-.header {
-  height: max-content;
-  display: flex;
-  align-items: center;
-  border-bottom: 1px solid;
 
-  .th {
-    overflow: hidden;
-    border: 1px solid #fff;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    flex-grow: 0;
-    flex-shrink: 0
   }
 }
 

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

@@ -1,180 +1,140 @@
 <template>
-  <xc-table-v3 :data="tempYzData"
-               :height="400"
-               :click-to-select="false"
-               :columns="header"
-               :row-class-name="rowClassName"
-               @row-click="rowClick"/>
+  <xc-table-v2 :data="tempYzData"
+               :rowStyle="rowStyle"
+               @rowClick="rowClick"
+               :height="getWindowSize.h / 1.7"
+               @dbRowClick="setDefaultStopTime"
+               :columns="header"/>
 </template>
 
-<script setup name='YzTableV2' lang="tsx">
-import XcTableV3 from "@/components/xiao-chan/xc-table-v3/XcTableV3.vue";
+
+<script setup name='Test' lang="tsx">
+import {ref} from 'vue'
+import XcTableV2 from "@/components/xiao-chan/xc-table-v2/XcTableV2.vue";
+import {stringIsBlank} from "@/utils/blank-utils";
+import {getFormatDatetime} from "@/utils/date";
+import {getServerDateApi} from '@/api/public-api'
+import {getWindowSize} from "@/utils/window-size";
 import {
   selectedData,
   tempYzData,
   yiZhuData,
   associateOrders,
   clearAssociate,
-  drugManual
+  drugManual,
+  yzData
 } from "@/views/hospitalization/zhu-yuan-yi-sheng/public-js/zhu-yuan-yi-sheng";
-import {XcColumn} from "@/components/xiao-chan/xc-table-v3/XcColumn";
-import {stringIsBlank} from '@/utils/blank-utils'
-import {defineEmits, defineProps, h} from 'vue'
-import {getFormatDatetime} from "@/utils/date";
-
-const props = defineProps({
-  voidOrders: Function
-})
 
-const emits = defineEmits(['rowClick', 'clickAssociate'])
+const emits = defineEmits(['rowClick'])
 
-const header: XcColumn<any>[] = [
+const header = [
   {
-    type: 'selection',
-    title: '',
-    width: 20
+    width: 20, name: '#',
+    cellRenderer: ({data}) => (
+        <input type="checkbox"
+               checked={data.tempCheckbox}
+               onClick={(event) => clickSelected(data)}/>
+    ),
+    headerFunc: () => {
+      console.log(123)
+    }
   },
   {
-    type: 'index',
-    title: '序号',
-    width: 40
+    width: 30, name: '排序',
+    cellRenderer: ({index}) => (
+        <span>{index + 1}</span>
+    )
   },
+  {width: 20, code: 'orderGroup', name: '组'},
   {
-    title: '组',
-    key: 'orderGroup',
-    cellRenderer: ({cellData}) => (
-        <span style="color:red">{cellData}</span>
-    ),
-    width: 20
+    width: 20, code: 'statusFlag', cellRenderer: ({cellData}) => {
+      return getYiZhuFlag(cellData)
+    }
   },
   {
-    title: '状态',
-    key: 'statusFlag',
-    cellRenderer: ({row, cellData}) => (
-        getYiZhuFlag(cellData)
-    ),
-    width: 40
+    width: 70, code: 'actOrderNo', name: '医嘱号', cellRenderer: ({data}) => {
+      if (data.error) {
+        return (<span style="color: red" class={data.newOrderFlag > 0 ? 'new_order' : ''}>{nu(data.actOrderNo)}</span>)
+      } else {
+        return (<span class={data.newOrderFlag > 0 ? 'new_order' : ''}>{nu(data.actOrderNo)}</span>)
+      }
+    }
+  },
+  {width: 225, code: 'orderName', name: '医嘱名称'},
+  {
+    code: 'dose', name: '剂量', width: 75, cellRenderer: ({data}) => {
+      return <span>{nu(data.dose) + ' ' + nu(data.doseUnitName)}</span>
+    }
   },
+  {code: 'frequCode', name: '频率', width: 75},
+  {code: 'supplyCodeName', name: '给药方式', width: 60},
   {
-    key: 'actOrderNo',
-    title: '医嘱号',
-    width: 100
+    code: 'startTime', name: '开始时间', width: 95, cellRenderer: ({data}) => {
+      return (<span>{timeFomat(data.startTime)}</span>)
+    }
   },
   {
-    key: 'orderName',
-    title: '医嘱号',
-    width: 250
+    // 出院时间的大小不能改
+    code: 'endTime', name: '结束时间', width: 160, cellRenderer: ({data}) => {
+      if (stringIsBlank(data.endTime) && stringIsBlank(data.parentNo) && data.frequCode !== 'ONCE') {
+        return <input type="datetime-local"
+                      style={endDateStyle(data)}
+                      value={data.endTimeTemp}
+                      oncontextmenu={(event) => {
+                        event.preventDefault();
+                        cancelStopTime(data)
+                      }}
+        />
+      }
+      return <span>{timeFomat(data.endTime)}</span>
+    }
   },
   {
-    key: 'dose',
-    title: '剂量',
-    width: 40,
-    cellRenderer: ({row}) => (
-        <span>{row.dose} {row.doseUnitName}</span>
-    )
+    code: 'emergencyFlag', name: '紧急', cellRenderer: ({cellData}) => {
+      return <span>{cellData === '1' ? '√' : ''}</span>
+    },
+    width: 30
   },
   {
-    key: 'frequCode',
-    title: '频率',
-    width: 120
+    code: 'ybSelfFlag', name: '自费', cellRenderer: ({cellData}) => {
+      return <span>{cellData === '1' ? '√' : ''}</span>
+    },
+    width: 30
   },
+  {code: 'physicianName', name: '医生', width: 65},
+  {code: 'selfBuyName', name: '费用标志', width: 60},
+  {code: 'execUnitName', name: '执行科室', width: 80},
   {
-    key: 'supplyCodeName',
-    title: '给药方式',
-    width: 60
-  }, {
-    key: 'startTime',
-    title: '开始时间',
-    width: 120,
-    cellRenderer: ({cellData}) => (
-        timeFomat(cellData)
-    )
-  }, {
-    key: 'endTime',
-    title: '结束时间',
-    width: 120,
-    cellRenderer: ({cellData}) => (
-        timeFomat(cellData)
-    )
-  }, {
-    key: 'emergencyFlag',
-    title: '紧急',
-    width: 40,
-    cellRenderer: ({cellData}) => (
-        <span>{cellData === '1' ? '√' : ''}</span>
-    )
-  }, {
-    key: 'ybSelfFlag',
-    title: '自费',
-    width: 40,
-    cellRenderer: ({cellData}) => (
-        <span>{cellData === '1' ? '√' : ''}</span>
-    )
-  }, {
-    key: 'physicianName',
-    title: '医生',
-    width: 40,
-  }, {
-    key: 'selfBuyName',
-    title: '标志',
-    width: 60,
-  }, {
-    key: 'execUnitName',
-    title: '执行',
-    width: 60,
-  }, {
-    key: 'drugQuan',
-    title: '领量',
-    width: 40,
-    cellRenderer: ({row}) => (
-        <span>{row.drugQuan} {row.drugQuanName}</span>
+    code: 'drugQuan', name: '领量', cellRenderer: ({data}) => {
+      return <span>{nu(data.drugQuan) + nu(data.drugQuanName)}</span>
+    },
+    width: 30
+  },
+  {code: 'groupNoName', name: '药房', width: 91},
+  {code: 'serial', name: '序号', width: 35},
+  {code: 'instruction', name: '嘱托', width: 150},
+  {
+    name: '操作', width: 53, cellRenderer: ({data}) => (
+        <button onclick={(e) => {
+          e.preventDefault();
+          e.stopImmediatePropagation();
+          console.log(data)
+        }}>作废</button>
     )
-  }, {
-    key: 'groupNoName',
-    title: '药房',
-    width: 90,
-  }, {
-    key: 'serial',
-    title: '序号',
-    width: 20,
-  }, {
-    key: 'instruction',
-    title: '嘱托',
-    width: 120
-  }, {
-    key: 'instruction',
-    title: '操作',
-    width: 70,
-    fixed: 'left',
-    cellRenderer: ({row}) => {
-      return h('button',
-          {
-            onClick: (e: Event) => {
-              e.stopPropagation()
-              props.voidOrders(row)
-            }
-          },
-          '作废')
-    }
   }
-]
+];
 
-const rowClassName = (row) => {
-  if (row.actOrderNo === yiZhuData.value.actOrderNo) {
-    return 'selected_order'
-  }
+const clickSelected = (row) => {
+  row.tempCheckbox = !row.tempCheckbox
 }
 
-const rowClick = (row) => {
-  emits('rowClick', row)
-}
 const timeFomat = (val) => {
-  return <span> {getFormatDatetime(val, 'YY-MM-DD HH:mm')}</span>
+  return getFormatDatetime(val, 'YY-MM-DD HH:mm')
 }
 
 function getYiZhuFlag(val) {
   if (stringIsBlank(val)) {
-    return (<span> </span>)
+    return val
   }
   switch (val) {
     case '1':
@@ -187,17 +147,73 @@ function getYiZhuFlag(val) {
       return (<span style="color:  #ff07f3">Z</span>)
     case '5':
       return (<span style="color: red">T</span>)
-    case '6':
+    case '-1':
       return (<span style="color: #00ffe0">D</span>)
     default:
-      return (<span style="color: #00ffe0">val</span>)
+      return 'warning'
   }
 }
-</script>
 
-<style lang="scss">
-.selected_order {
-  background: rgba(0, 58, 241, 0.68) !important;
-  color: #000;
+const endDateStyle = (item) => {
+  if (item.endTimeTemp && item.tempCheckbox) {
+    return {
+      width: '140px',
+      color: 'white',
+      backgroundColor: 'red',
+      border: 0,
+    }
+  } else {
+    return {
+      width: '140px',
+      border: 0,
+    }
+  }
+}
+
+const rowClick = (data) => {
+  emits('rowClick', data)
+}
+
+const rowStyle = (data) => {
+  if (data.actOrderNo === yiZhuData.value.actOrderNo) {
+    return {
+      background: 'rgba(0, 58, 241, 0.68)',
+      color: '#fff'
+    }
+  }
+
+}
+
+const setDefaultStopTime = async (item) => {
+  if (item.parentNo) return
+  item.endTimeTemp = getFormatDatetime(await getServerDateApi(), 'yyyy-MM-DD HH:mm')
+  if (!item.tempCheckbox) {
+    clickSelected(item)
+  }
+}
+
+const cancelStopTime = (val) => {
+  if (val.parentNo) return
+  val.endTimeTemp = ''
+  if (val.tempCheckbox) {
+    clickSelected(val)
+  }
 }
+
+
+const nu = (val) => {
+  if (val === null) {
+    return ''
+  } else if (typeof val === 'undefined') {
+    return ''
+  } else {
+    return val
+  }
+}
+
+</script>
+
+<style lang="scss" scoped>
+
 </style>
+

src/views/hospitalization/zhu-yuan-yi-sheng/electronic-medical-record/emr-editor/EmrMain.vue

@@ -518,6 +518,8 @@ const emrEvent = {
     doctorLevelFunc()
     // 设置 编辑器的模式
     setEditorModeFun()
+    console.log(editor.getEditorMode())
+
     // 设置病程记录中的跳转锚点
     await courseSegmentLocking()
     // 设置病程记录跳转
@@ -534,10 +536,12 @@ const emrEvent = {
     reQueryPatientInformation()
     // 每一个病历只能一个人编辑
     await editJudgment()
+    console.log(editor.getEditorMode())
+
+
   },
 
   'contentchange': (e, op) => {
-    console.log(op.batch)
     if (op.batch.type === 'persist') return
     if (!readonlyPattern()) {
       // 如果是空的编辑器就不触发了
@@ -941,6 +945,9 @@ const setEditorModeFun = () => {
       if (createId === null) {
         return currentEmr.value.callMethod('setEditorMode', 'free');
       }
+      if (createId == userData.code) {
+        return currentEmr.value.callMethod('setEditorMode', 'free');
+      }
       // 创建人不是自己就只能看
       if (doctorLevel === 1 && createId !== userData.code) {
         currentEmr.value.callMethod('setEditorMode', 'readonly');

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

@@ -41,6 +41,9 @@
                 @rowClick="rowClick"
                 @clickAssociate="clickAssociate"
                 :void-orders="voidOrdersClick"/>
+<!--      <yz-table-v2 :data="tempYzData"-->
+<!--                   ref="tableRef"-->
+<!--                   @rowClick="rowClick"/>-->
     </div>
 
     <doctor-s-order-fee :data="chargeDetails.data"
@@ -120,6 +123,7 @@ import OrderProgress from "@/components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/OrderProg
 import RationalDrugUseWindow from "@/components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/RationalDrugUseWindow.vue";
 import ReportOfInfectiousDiseases
   from "@/components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/report-of-infectious-diseases/ReportOfInfectiousDiseases.vue";
+import YzTableV2 from "@/components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/table/YzTableV2.vue";
 
 const windowSize = computed(() => {
   return store.state.app.windowSize

src/views/settings/Test.vue

@@ -2422,16 +2422,21 @@ for (let i = 0; i < 1000; i++) {
 
 const header = [
   {
-    width: 20, name: '#',
-    cellRenderer: ({data}) => (
-        <input type="checkbox"
-               checked={data.tempCheckbox}
-               onClick={(event) => clickSelected(data)}/>
-    ),
-    headerFunc: () => {
-      console.log(123)
-    }
+    type: 'selected'
   },
+  {width: 30, type: 'index'},
+  {width: 20, code: 'tempCheckbox', name: '组'},
+  // {
+  //   width: 20, name: '#',
+  //   cellRenderer: ({data}) => (
+  //       <input type="checkbox"
+  //              checked={data.tempCheckbox}
+  //              onClick={(event) => clickSelected(data)}/>
+  //   ),
+  //   headerFunc: () => {
+  //     console.log(123)
+  //   }
+  // },
   {
     width: 30, name: '排序',
     cellRenderer: ({index}) => (