前端代码整合，报告单对应

src/api/liswork/xtwh/ReportSetting.ts

@@ -10,3 +10,30 @@ export function addReportService(LabReportInstr: Object){
       data: LabReportInstr
     })
 }
+
+//查询数据
+export function queryReportService(LabReportInstr: Object){
+   return request({
+      url: '/labReportinstr/query',
+      method: 'get',
+      params: LabReportInstr
+    })
+}
+
+//修改数据
+export function updateReportService(LabReportInstr: Object){
+   return request({
+      url: '/labReportinstr/update',
+      method: 'post',
+      data: LabReportInstr
+    })
+}
+
+//删除数据
+export function deleteReportService(LabReportInstr: Object){
+   return request({
+      url: '/labReportinstr/del',
+      method: 'get',
+      params: LabReportInstr
+    })
+}

src/components/SelectTable/YQSelectTable/index.vue

@@ -1,31 +1,33 @@
-<!--
+<!--仪器组件的封装-->
-仪器组件的封装
--->
 <template>
-<SelectTable v-model:data="queryParams.yq" :fields="yqFields" :tableData="instrOptions" label="yqmc" size="small"
+<SelectTable v-model:data="modelValue" :fields="yqFields" :tableData="instrOptions" label="yqmc" size="small"
-                    value="yq" objKey="yq" :border="true" width="9rem" placeholder="请选择仪器" :clearable="false" />
+                    value="yq" objKey="yq" :border="true" :width="props.width" placeholder="请选择仪器" :clearable="false" @getDataValue="getDataValue" />
 </template>
 
 <script setup lang="ts">
 import SelectTable from '@/components/SelectTable/index.vue';
 import { getGroupInstrdList } from '@/api/liswork/work/LisWork';
+import { Emits, Props } from '@/types';
 
-const props = defineProps({
+const props = withDefaults(defineProps<Props>(), {
-  data: {
+  placeholder: "请选择",
-    type: String,
+  size: "default",
-    required: true
+  isHighlight: true,
-  }
+  value: undefined,
+  label: undefined,
+  border: false,
+  width: "100%",
+  dictType: '',
+  clearable: true
 });
 
-const queryParams = ref({
+const modelValue = ref('');
-  yq: props.data
-});
 const yqFields = ref([
   { prop: 'yq', label: '代号', width: 80, enablePinyinSearch: true },
   { prop: 'yqmc', label: '名称', width: 150, enablePinyinSearch: true },
 ]);
 const instrOptions = ref<{ yq: string; yqmc: string }[]>([])
-
+const emits = defineEmits<Emits>();
 
 const getYqConfig = () => {
   getGroupInstrdList()
@@ -39,8 +41,44 @@ const getYqConfig = () => {
     })
 }
 
+const getDataValue = (val: any) => {
+  emits('getDataValue', val);
+};
+
+const handleDataEcho = () => {
+  // if (modelValue.value === null || modelValue.value === undefined) {
+  //   modelValue.value = '';
+  //   emits('update:data', null);
+  //   return;
+  // }
+  // const matchedInstr = instrOptions.value.find(item => item.yq === modelValue.value);
+  // if (matchedInstr) {
+  //   emits('update:data', matchedInstr.yq);
+  // } else {
+  //   emits('update:data', '');
+  // }
+  emits('update:data', modelValue.value);
+  
+};
+
+// 监听表格数据和字典类型变化
+watch(() => instrOptions, (newVal) => {
+  if (newVal) {
+    handleDataEcho();
+  }
+}, { deep: true });
+
+// 监听绑定值数据变化，重新处理
+watch(() => modelValue, (newVal) => {
+  // 数据回显
+  handleDataEcho();
+}, { deep: true });
+
+
 onMounted(() => {
   getYqConfig();
 });
 
+
+
 </script>

src/components/SelectTable/index.vue

@@ -49,29 +49,8 @@ import { getFirstLetter } from '@/api/pinyin.js';
 import { ElEmpty } from 'element-plus';
 // @ts-ignore
 import { comDict } from '@/utils/dict'
-interface Field {
+import { Emits, Props } from '@/types';
-  prop: string;
-  label: string;
-  width?: number;
-  enablePinyinSearch?: boolean; //是否参与拼音搜索
-}
 
-interface Props {
-  data: any;
-  fields: Field[];
-  tableData?: object[];
-  label?: string;
-  value?: string;
-  objKey?: string;
-  isHighlight?: boolean;
-  size?: string;
-  placeholder?: string;
-  border?: boolean;
-  width?: string | number;
-  disabled?: boolean;
-  dictType?: string;
-  clearable?: boolean;
-}
 const props = withDefaults(defineProps<Props>(), {
   placeholder: "请选择",
   size: "default",
@@ -84,10 +63,7 @@ const props = withDefaults(defineProps<Props>(), {
   clearable: true
 });
 
-interface Emits {
+
-  (e: "update:data", val: any): void;
-  (e: "getDataValue", val: any): void;
-}
 const emits = defineEmits<Emits>();
 const searchKey = ref('');
 const tableRef = ref();

src/hooks/lisData/dictData.ts

@@ -0,0 +1,40 @@
+//仪器，字典数据自动格式化类
+import { DictData } from '@/types/index';
+import { getGroupInstrdList } from '@/api/liswork/work/LisWork';
+//@ts-ignore
+import { comDict } from '@/utils/dict'
+
+const dictData = ref<DictData>({});
+const instrOptions = ref<{ yq: string; yqmc: string }[]>([])
+
+export const getYqData = () => {
+  getGroupInstrdList()
+    .then((res: any) => {
+      if (res.code == 0) {
+        instrOptions.value = res.data.map((item: any) => ({
+          yq: item.yq.trim(),
+          yqmc: item.yqmc
+        }))
+      }
+    })
+}
+//'XMGL','ITEMCLASS', 'YQDL'
+export const getDictData = async (...args: string[]) => {
+  const dictRefs = await comDict(...args);
+    // 从 ref 中获取实际数据
+  dictData.value = {
+    XMGL: toRaw(dictRefs.XMGL.value) || [],
+    ITEMCLASS: toRaw(dictRefs.ITEMCLASS.value) || [],
+    YQDL: toRaw(dictRefs.YQDL.value) || []
+  };
+}
+
+// 格式化字典数据方法
+export const  formatDict = async (v: string, dictType: string) => {
+   return dictData.value[dictType]?.find((item: any) => item.value == v.trim())?.label;
+}
+
+//仪器格式化方法
+export const formatInstr = (v: string) => {
+  return instrOptions.value.find((item: any) => item.yq == v.trim())?.yqmc;
+}

src/hooks/lisData/index.ts

@@ -0,0 +1 @@
+export * from './dictData';

src/types/Object.d.ts

@@ -1,4 +1,5 @@
 export interface LabReportInstr {
+    index?: number; //序号
     yq: string; //仪器
     xh: number; //序号
     bgdh: string; //报告单号
@@ -7,3 +8,12 @@ export interface LabReportInstr {
     condition: string; //使用条件
     status?: string; //状态
 }
+
+export interface DictData {
+  XMGL?: Array<any>;
+  ITEMCLASS?: Array<any>;
+  YQDL?: Array<any>;
+  xmlbList?: Array<any>;
+  YQ?: Array<any>;
+  [key: string]: any[] | undefined; // 添加索引签名以支持动态访问
+}

src/types/SelectTable.d.ts

@@ -0,0 +1,29 @@
+export interface Emits {
+  (e: "update:data", val: any): void;
+  (e: "getDataValue", val: any): void;
+}
+
+export interface Props {
+  data: any;
+  fields: Field[];
+  tableData?: object[];
+  label?: string;
+  value?: string;
+  objKey?: string;
+  isHighlight?: boolean;
+  size?: string;
+  placeholder?: string;
+  border?: boolean;
+  width?: string | number;
+  disabled?: boolean;
+  dictType?: string;
+  clearable?: boolean;
+}
+
+
+export interface Field {
+  prop: string;
+  label: string;
+  width?: number;
+  enablePinyinSearch?: boolean; //是否参与拼音搜索
+}

src/types/index.d.ts

@@ -2,3 +2,5 @@
 
 //对象文件
 export * from './Object';
+
+export * from './SelectTable';

src/views/liswork/xtwh/reportsetting/index.vue

@@ -2,21 +2,25 @@
   <!--报告单设定-->
   <el-form ref="form" :model="formData" label-width="80px" size="small">
     <el-form-item label="仪器" prop="yq">
-      <YQSelectTable :data="formData.yq"/>
+      <YQSelectTable v-model:data="formData.yq" width="200px" @getDataValue="getList"/>
     </el-form-item>
     <el-form-item>
-      <el-button type="primary" @click="handAdd">新增</el-button>
+      <el-button type="primary" @click="handAdd" size="default">新增</el-button>
-      <el-button type="primary" @click="handDelete">删除</el-button>
+      <el-button type="primary" @click="handDelete" size="default">删除</el-button>
-      <el-button type="primary" @click="handSave">保存</el-button>
+      <el-button type="primary" @click="handSave" size="default">保存</el-button>
     </el-form-item>
 
   </el-form>
-  <el-table :data="tableData" border width="100%" height="700px" @current-change="currentChange">
+  <el-table :data="tableData" border width="100%" height="700px" @selection-change="handSelectionChange">
-    <el-table-column label="仪器" prop="yq" align="center"></el-table-column>
+    <el-table-column label="仪器" prop="yq" align="center">
+      <template #default="scope">
+        {{ formatInstr(scope.row.yq) }}
+      </template>
+    </el-table-column>
     <el-table-column label="序号" prop="xh" align="center"></el-table-column>
     <el-table-column label="报告单号" prop="bgdh" align="center"  >
-      <template #default="{ row }">
+      <template #default="scope">
-        <el-input v-model="row.bgdh" placeholder="请输入报告单号" class="full-width-input"></el-input>
+        <el-input v-model="scope.row.bgdh" placeholder="请输入报告单号" class="full-width-input" @change="handleRowChange(scope.row, scope.$index)"></el-input>
       </template>
     </el-table-column>
     <el-table-column label="医疗机构" prop="yljg" align="center"></el-table-column>
@@ -38,11 +42,11 @@
 </template>
 
 <script setup lang="ts">
-import { ref} from 'vue';
+import {addReportService,queryReportService,updateReportService,deleteReportService} from '@/api/liswork/xtwh/ReportSetting';
-import {addReportService} from '@/api/liswork/xtwh/ReportSetting';
 import { LabReportInstr } from '@/types/index';
 import YQSelectTable from '@/components/SelectTable/YQSelectTable/index.vue';
-
+import { ElMessage } from 'element-plus';
+import { formatInstr,getYqData } from '@/hooks/lisData/index';
 
 
 const formData = ref({
@@ -50,8 +54,15 @@ const formData = ref({
 });
 const tableData = ref<LabReportInstr[]>([]);
 
+//选中行的数据
+const selectedRows = ref<LabReportInstr>();
 
+//新增数据
 const handAdd = () => {
+  if(formData.value.yq === ''){
+    ElMessage.warning('请先选择仪器');
+    return;
+  }
   const newReport: LabReportInstr = {
     yq: formData.value.yq,
     xh: tableData.value.length + 1,
@@ -64,24 +75,50 @@ const handAdd = () => {
   tableData.value.push(newReport);
 };
 
-const handDelete = () => {
+//删除数据
-  console.log('删除');
+const handDelete = async () => {
+  const res = await deleteReportService([selectedRows.value?.xh || '']);
+  ElMessage.success('删除成功');
 };
 
-const handSave = () => {
+//保存数据
+const handSave = async () => {
   //过滤数据，只需要新增的数据
-  const newReports = tableData.value.filter(item => item.status === 'new');
+  let newReports = tableData.value.filter(item => item.status === 'new');
-  addReportService(newReports);
+  let res = await addReportService(newReports);
+  console.log('res',res);
+  if(res.code !== '0'){
+    ElMessage.error('保存失败：' + res.message);
+    return;
+  }
+  newReports = tableData.value.filter(item => item.status === 'update');
+  res = await updateReportService(newReports);
+  if(res.code !== '0'){
+    ElMessage.error('修改保存失败：' + res.message);
+    return;
+  }
+}
+
+//刷新数据
+const getList = async () => {
+  const res = await queryReportService({ yq: formData.value.yq });
+  tableData.value = res.data;
+};
+
+//监听数据是否发生改变
+const handleRowChange = (row: LabReportInstr, index: number) => {
+  if(row.status !== 'new') {
+     tableData.value[index].status = 'update';
+  }
+};
+
+const handSelectionChange = (selection: LabReportInstr[]) => {
+  selectedRows.value = selection[0];
 };
 
 
-const currentChange = (currentRow: LabReportInstr, oldCurrentRow: LabReportInstr) => {
+onMounted(() => {
-  console.log('旧的行数据:', oldCurrentRow);
+  getYqData();
-  console.log('当前行数据:', currentRow);
+});
-};
-
-const yqHandleChange = (val: string) => {
-  formData.value.yq = val;
-};
 
 </script>