修改样式

src/views/outpatientDetails.vue

@@ -195,7 +195,7 @@
             </li>
           </ul> -->
        
-         <el-table
+         <!-- <el-table
 						:data="tableData1"
 						style="width: 100%; margin-bottom: 20px"
 						header-row-style="height:100px"
@@ -210,10 +210,44 @@
 						<el-table-column prop="iteM_TYPE" label="项目名称" width="100" header-align="center" align="center"> </el-table-column>
 						<el-table-column prop="name" label="总金额(小计)" width="80" header-align="center" align="center"> </el-table-column>
 						<el-table-column prop="address" label="占总费用(比例)" width="80" header-align="center" align="center"> </el-table-column>
-						<el-table-column prop="cc" label="预计DRG设定费用(参考)"  header-align="center" align="center"> </el-table-column>
+						<el-table-column prop="coreTotalFee" label="预计DRG设定费用(参考)"  header-align="center" align="center"> </el-table-column>
 						<el-table-column prop="dd" label="设定费用比例(参考)"  header-align="center" align="center"> </el-table-column>
-					</el-table>
+					</el-table> -->
          
+				    	<el-table
+              ref="monthlyPlanTable"
+						:data="tableData1"
+						style="width: 100%; margin-bottom: 20px"
+						header-row-style="height:100px"
+						row-key="id"
+						:default-expand-all="false"
+						:highlight-current-row="true"
+						:tree-props="{ children: 'inpat_FeeDatas', hasChildren: 'hasChildren' }"
+						@row-click="eowclick"
+						@expand-change="changeRowClick"
+					>
+						<el-table-column prop="iteM_TYPE" label="项目名称" width="100" header-align="center" align="center"> </el-table-column>
+						<el-table-column prop="totalFee" label="总金额(小计)" width="80" header-align="center" align="center">
+							<template slot-scope="scope">
+								{{ decimal(scope.row.totalFee) }}
+							</template>
+						</el-table-column>
+						<el-table-column prop="proportion" label="占总费用(比例)" width="80" header-align="center" align="center"> 
+							<template slot-scope="scope" >
+								{{scope.row.proportion !=undefined?decimal(scope.row.proportion)+'%':''}}
+							</template>
+						</el-table-column>
+						<el-table-column prop="coreTotalFee" label="预计DRG设定费用(参考)"  width="100" header-align="center" align="center"> 
+							<template slot-scope="scope" >
+								{{ decimal(scope.row.coreTotalFee)}}
+							</template>
+						</el-table-column>
+						<el-table-column prop="coreProportion" label="设定费用比例(参考)" header-align="center" align="center"> 
+							<template slot-scope="scope" >
+								{{ scope.row.coreProportion !=undefined? decimal(scope.row.coreProportion)+'%':''}}
+							</template>
+						</el-table-column>
+					</el-table>
         </div>
         <!-- 中间有数据样式 表格-->
         <div
@@ -358,6 +392,7 @@ import {
   onMounted,
   nextTick,
   computed,
+  ref
 } from "@vue/composition-api";
 import { decimal } from "../utils/decimal";
 
@@ -367,6 +402,7 @@ import { setItem, getItem } from "../utils/auth";
 export default {
   name: "outpatientDetails",
   setup() {
+    const monthlyPlanTable=ref();
     //表格颜色
     const tableRowClassName = ({ row }) => {
       if (row.rowIndex % 2 == 0) {
@@ -378,10 +414,28 @@ export default {
 
     //当某一个行被点击时
 		const eowclick=(row)=>{
-		console.log('row',row);
+		getInpatFeesByREGCODE(row)
 			
 			
 		};
+    //获取左侧表格数据
+		const getlefttable = () => {
+			http
+				.post(`/medical/Post/getHisStaChargeType?code=${route.value.query.id}`, {})
+				.then((data) => {
+					state.tableData1 = data;
+					if (state.tableData1 != []) {
+						eowclick(state.tableData1[0]);
+            //默认高亮第一行
+						nextTick(() => {
+							monthlyPlanTable.value.setCurrentRow(state.tableData1[0]);
+							
+						});
+					}
+					//中间的表格默认展示第一条数据
+				})
+				.catch((error) => {});
+		};
 		//当行展开和关闭是触发
 		const changeRowClick=(row)=>{
 			console.log('row-chang',row);
@@ -545,69 +599,7 @@ export default {
       // state.checkindex = index;
     };
     let state = reactive({
-      	tableData1: [
-				{
-					id: 1,
-					iteM_TYPE: '检查费',
-					name: '300',
-					address: '高 30%',
-					cc: '3000',
-					dd: '低 30%',
-				},
-				
-				{
-					id: 3,
-					iteM_TYPE: '检查费',
-					name: '300',
-					address: '高 30%',
-					cc: '3000',
-					dd: '高 30%',
-					children: [
-						{
-							id: 31,
-							iteM_TYPE: '检查费',
-							name: '300',
-							address: '高 30%',
-							cc: '3000',
-							dd: '低 30%',
-						},
-						{
-							id: 32,
-							iteM_TYPE: '检查费',
-							name: '300',
-							address: '高 30%',
-							cc: '3000',
-							dd: '低 30%',
-						},
-					],
-				},
-				{
-					id: 4,
-					iteM_TYPE: '检查费',
-					name: '300',
-					address: '高 30%',
-					cc: '3000',
-					dd: '低 30%',
-					children: [
-						{
-							id: 31,
-							iteM_TYPE: '检查费',
-							name: '300',
-							address: '高 30%',
-							cc: '3000',
-							dd: '低 30%',
-						},
-						{
-							id: 32,
-							iteM_TYPE: '检查费',
-							name: '300',
-							address: '高 30%',
-							cc: '3000',
-							dd: '低 30%',
-						},
-					],
-				},
-			],
+      	tableData1: [],
       HistoryInfo: {
         name: "",
         healthyID: "",
@@ -673,6 +665,7 @@ export default {
     onMounted(() => {
       GetProjectRulesData();
       getHistoryInfo();
+      getlefttable();
     });
 
     return {
@@ -689,7 +682,9 @@ export default {
       gettype,
       getruleId,
       eowclick,
-			changeRowClick
+			changeRowClick,
+      getlefttable,
+      monthlyPlanTable
     };
   },
 };