cy-dialog 优化

src/components/cy/combo-grid/src/CyComboGrid.vue

@@ -231,6 +231,7 @@ defineExpose({
                        show-overflow
                        :row-class-name="rowClass"
                        max-height="250px"
+                       :columnConfig="{ resizable: true}"
                        :row-config="{ height: rowHeight,isCurrent: true,isHover:true, useKey: true,keyField: 'value' }"
                        :scroll-y="{enabled: true}"
             >
@@ -257,6 +258,7 @@ defineExpose({
                 :row-class-name="nsSelect.is('row-move' , sortable)"
                 :class="nsSelect.e('table')"
                 :data="XEUtils.clone(states.selected , true)"
+                :columnConfig="{ resizable: true}"
                 max-height="250px"
                 show-overflow-tooltip
                 show-overflow

src/components/cy/dialog/src/CyDialog.vue

@@ -13,7 +13,6 @@ import './cy-dialog.scss'
 
 const COMPONENT_NAME = 'CyDialog'
 
-
 export default defineComponent({
   name: COMPONENT_NAME,
   componentName: COMPONENT_NAME,
@@ -92,12 +91,12 @@ export default defineComponent({
           >
             <el-button
                 @click="handleCancel"
-                type="danger"
                 size="default"
             >
               {{ cancelText ?? '取消' }}
             </el-button>
             <el-button
+                color="hsl(240 5.9% 10%)"
                 style="margin-right: 15px"
                 @click="handleConfirm"
                 size="default"

src/components/cy/dialog/src/cy-dialog.scss

@@ -2,7 +2,6 @@
   box-sizing: border-box;
 }
 
-
 .cy-dialog-container {
   position: fixed;
   top: 0;
@@ -10,7 +9,7 @@
   bottom: 0;
   right: 0;
   height: 100%;
-  background-color: rgba(0, 0, 0, .5);
+  background-color: rgba(0, 0, 0, .8);
   overflow: auto;
 
   .cy-dialog__dialog {
@@ -29,7 +28,7 @@
     height: max-content;
     width: 500px;
     margin: 15vh auto 50px;
-    border-radius: 2px;
+    border-radius: .5rem;
     box-shadow: 0 12px 32px 4px rgba(0, 0, 0, .04), 0 8px 20px rgba(0, 0, 0, .08);
     overflow-wrap: break-word;
   }
@@ -46,12 +45,14 @@
   }
 
   .cy-dialog__header {
-    line-height: 20px;
-    text-align: center;
-    padding: 10px;
+    text-align: start;
+    padding: 15px;
     user-select: none;
     cursor: all-scroll;
-    border-bottom: 1px solid rgba(120, 116, 116, 0.68);
+    font-weight: 600;
+    font-size: 1.125rem;
+    letter-spacing: -.025em;
+    line-height: 1;
 
     span {
       line-height: 24px;

src/components/cy/dialog/src/useCyDialog.ts

@@ -63,7 +63,7 @@ export function UseCyDialog(props: IsCyDialog) {
     })
 
     const draggable = computed(() => {
-        return true;
+        return !props.fullScreen;
     })
 
     const bodyHeightStyle = computed(() => {
@@ -78,6 +78,13 @@ export function UseCyDialog(props: IsCyDialog) {
         }
     })
 
+
+    const boxStyle = computed(() => {
+        return {
+            width: props.fullScreen ? "" : props.bodyWidth,
+        }
+    })
+
     useResizeObserver(headerRef, (entries) => {
         state.headerHeight = entries[0].target.offsetHeight
     })
@@ -124,12 +131,6 @@ export function UseCyDialog(props: IsCyDialog) {
     }
 
 
-    const boxStyle = computed(() => {
-        return {
-            width: props.bodyWidth,
-        }
-    })
-
     async function handleCancel() {
         state.cancelLoading = true;
 

src/views/hospitalization/zhu-yuan-yi-sheng/shou-shu-shen-qing/src/ShouShu.vue

@@ -90,7 +90,9 @@ onMounted(async () => {
         </CyTabPane>
 
         <CyTabPane label="汇总" name="ss-all">
-          <AllSurgeries/>
+          <template #default="{height}">
+            <AllSurgeries :height="height"/>
+          </template>
         </CyTabPane>
 
       </CyTabs>

src/views/hospitalization/zhu-yuan-yi-sheng/shou-shu-shen-qing/src/components/AddShouShuTable.vue

@@ -1,116 +0,0 @@
-<script setup lang="ts">
-import {useVModel} from "@vueuse/core";
-import XEUtils from "xe-utils";
-import {nextTick, onMounted, Ref, ref} from 'vue'
-import XcComboGridV2 from "@/components/xiao-chan/combo-grid/XcComboGridV2.vue";
-import {windowSizeStore} from "@/utils/store-public";
-import {useCompRef} from "@/utils/useCompRef";
-import {ElTable} from "element-plus";
-// @ts-ignore
-import Sortable from 'sortablejs';
-import CyComboGrid from "@/components/cy/combo-grid/src/CyComboGrid.vue";
-
-const props = defineProps({
-  data: Array,
-  title: String,
-  queryFunction: Function,
-  queryData: Array
-})
-const emits = defineEmits(['update:data', 'update:queryData', 'changeList'])
-const modelData = useVModel(props, 'data', emits) as Ref<any[]>
-const queryDayaModel = useVModel(props, 'queryData', emits) as Ref<any[]>
-const temp = ref({})
-
-const findIndex = (arr: any[], name: string, value: string) => {
-  return XEUtils.findIndexOf(arr, item => {
-    return item[name] === value;
-  })
-}
-
-const delClock = (index) => {
-  modelData.value.splice(index, 1)
-  emits('changeList')
-}
-
-const rowClick = (row) => {
-  const index = findIndex(modelData.value, 'code', row.code)
-  if (index > -1) {
-    delClock(index);
-  } else {
-    modelData.value.push({
-      code: row.code,
-      name: row.name,
-      opScale: row.opScale
-    })
-  }
-  emits('changeList')
-}
-
-const tableRef = useCompRef(ElTable)
-
-const initSortable = () => {
-  const el = tableRef.value.$el.querySelector('tbody')
-  const opt = {
-    animation: 200,
-    handle: '.el-table__row',
-    onEnd({newIndex, oldIndex}) {
-      const currRow = modelData.value.splice(oldIndex, 1)[0]
-      modelData.value.splice(newIndex, 0, currRow)
-      emits('changeList')
-    }
-  }
-  Sortable.create(el, opt)
-}
-
-onMounted(async () => {
-  await nextTick()
-  initSortable();
-})
-</script>
-
-<template>
-  {{ props.title }}
-  <br/>
-  <el-table :data="props.data"
-            row-key="code"
-            ref="tableRef"
-            :max-height="windowSizeStore.h  / 1.2 - 20">
-    <el-table-column :label="`${props.title}名称`" prop="name">
-      <template #default="{row,$index}">
-        <span class="ss_text" :class="$index ===0? 'main' : 'secondary'">
-          {{ $index === 0 ? '主' : '次' }}
-        </span>
-        {{ row.name }}
-      </template>
-    </el-table-column>
-    <el-table-column width="32">
-      <template #default="{$index}">
-        <el-button type="danger" @click="delClock($index)" circle icon="Delete"/>
-      </template>
-    </el-table-column>
-  </el-table>
-  <XcComboGridV2 v-model="temp"
-                 code-name="aa"
-                 :row-click-hide="false"
-                 @rowClick="rowClick"
-                 v-model:data="queryDayaModel"
-                 :query-data-func="props.queryFunction"/>
-</template>
-
-<style lang="scss">
-
-.ss_text {
-  padding: 3px;
-  border-radius: 5px;
-  margin-right: 5px;
-
-  &.main {
-    background: red;
-  }
-
-  &.secondary {
-    background: #8f8787;
-  }
-}
-
-</style>

src/views/hospitalization/zhu-yuan-yi-sheng/shou-shu-shen-qing/src/components/AllSurgeries.vue

@@ -1,36 +1,34 @@
 <template>
-  <cy-auto-size>
-    <template #default="{width, height}">
-      <el-table :height="height" :data="surgeryList">
-        <el-table-column prop="patientName" fixed>
-          <template #header>
-            <el-button icon="Search" type="primary" @click="executeQuery">查询</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column prop="recordId" label="手术单号"></el-table-column>
-        <el-table-column prop="inpatientNo" label="住院号"></el-table-column>
-        <el-table-column prop="applyDocName" label="申请医生"></el-table-column>
-        <el-table-column prop="applyDate" label="申请时间"></el-table-column>
-        <el-table-column prop="opDatetime" label="手术时间"></el-table-column>
-        <el-table-column prop="opCode" label="手术编码"></el-table-column>
-        <el-table-column prop="opName" label="手术名称"></el-table-column>
-        <el-table-column prop="opScaleName" label="手术级别"></el-table-column>
-        <el-table-column prop="statusName" label="手术状态"></el-table-column>
-        <el-table-column prop="doctorZdName" label="主刀医生"></el-table-column>
-        <el-table-column prop="doctorMzName" label="麻醉医生"></el-table-column>
-        <el-table-column prop="hocusName" label="麻醉方式"></el-table-column>
-        <el-table-column prop="nurseXhName" label="巡回护士"></el-table-column>
-        <el-table-column prop="nurseQxName" label="器械护士"></el-table-column>
-      </el-table>
-    </template>
-  </cy-auto-size>
+  <el-table :height="height" :data="surgeryList">
+    <el-table-column prop="patientName" fixed>
+      <template #header>
+        <el-button icon="Search" type="primary" @click="executeQuery">查询</el-button>
+      </template>
+    </el-table-column>
+    <el-table-column prop="recordId" label="手术单号"></el-table-column>
+    <el-table-column prop="inpatientNo" label="住院号"></el-table-column>
+    <el-table-column prop="applyDocName" label="申请医生"></el-table-column>
+    <el-table-column prop="applyDate" label="申请时间"></el-table-column>
+    <el-table-column prop="opDatetime" label="手术时间"></el-table-column>
+    <el-table-column prop="opCode" label="手术编码"></el-table-column>
+    <el-table-column prop="opName" label="手术名称"></el-table-column>
+    <el-table-column prop="opScaleName" label="手术级别"></el-table-column>
+    <el-table-column prop="statusName" label="手术状态"></el-table-column>
+    <el-table-column prop="doctorZdName" label="主刀医生"></el-table-column>
+    <el-table-column prop="doctorMzName" label="麻醉医生"></el-table-column>
+    <el-table-column prop="hocusName" label="麻醉方式"></el-table-column>
+    <el-table-column prop="nurseXhName" label="巡回护士"></el-table-column>
+    <el-table-column prop="nurseQxName" label="器械护士"></el-table-column>
+  </el-table>
 </template>
 
-<script setup>
-import CyAutoSize from "@/components/cy/auto-size/cy-auto-size.vue";
+<script setup lang="ts">
 import {yzMitt} from "@/views/hospitalization/zhu-yuan-yi-sheng/public-js/zhu-yuan-yi-sheng";
 import {reportQueryCenterApiByGet} from "@/api/base-data/report-center";
 
+const props = defineProps<{
+  height: any
+}>()
 const surgeryList = ref([])
 
 function executeQuery() {

src/views/hospitalization/zhu-yuan-yi-sheng/shou-shu-shen-qing/src/components/ShouShuDetails.vue

@@ -148,12 +148,9 @@ const props = defineProps<{
                           type="textarea"/>
               </el-form-item>
             </el-col>
-
           </el-row>
-
         </el-form>
       </div>
-
     </div>
   </CyDialog>
 </template>
@@ -162,4 +159,19 @@ const props = defineProps<{
 .details_body {
   display: flex;
 }
+
+.ss_text {
+  padding: 3px;
+  border-radius: 5px;
+  margin-right: 5px;
+
+  &.main {
+    background: red;
+  }
+
+  &.secondary {
+    background: #8f8787;
+  }
+}
+
 </style>