hospital
/
yanan_hospital
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

添加表单中表格

master
邓宏 9 months ago
parent
d5e92ba02f
commit
47e8f22bc9
2 changed files with 122 additions and 18 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      index.html
  2. 138
      src/views/parameter.vue

2
index.html
View File

@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title> <title>细胞功能优选分析系统</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

138
src/views/parameter.vue
View File

@ -42,6 +42,18 @@
} }
} }
} }
.el-table:deep{
margin-bottom:10px;
.input{
.cell{
display: flex;
justify-content: space-evenly;
.el-input{
margin:0 5px;
}
}
}
}
} }
.el-button.submit{ .el-button.submit{
width:120px; width:120px;
@ -95,23 +107,6 @@
</el-row> </el-row>
</el-form> </el-form>
</div> </div>
<div class="card">
<div class="title" data-title="增殖能力评估" />
<el-form label-position="right">
<el-row :gutter="10">
<el-col :span="24">
<el-form-item label="增殖能力评估">
<el-input placeholder="上传细胞计数表，绘制增殖曲线图">
<template #append>
<el-button>上传文件</el-button>
</template>
</el-input>
<span class="example">示例表格</span>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div class="card"> <div class="card">
<div class="title" data-title="细胞表面抗原分析" /> <div class="title" data-title="细胞表面抗原分析" />
<el-form label-width="85px" label-position="right"> <el-form label-width="85px" label-position="right">
@ -139,6 +134,44 @@
</el-row> </el-row>
</el-form> </el-form>
</div> </div>
<div class="card">
<div class="title" data-title="增殖能力评估" />
<el-form label-position="right">
<el-row :gutter="10">
<el-col :span="24">
<el-form-item label="增殖能力评估">
<el-input placeholder="上传细胞计数表，绘制增殖曲线图">
<template #append>
<el-button>上传文件</el-button>
</template>
</el-input>
<span class="example">示例表格</span>
</el-form-item>
</el-col>
<el-col :span="24">
<el-table :data="increment" size="small">
<el-table-column label="增值能力标志物" prop="marker" align="center"/>
<el-table-column label="培养前" class-name="input" prop="before" width="300px" align="center">
<template #default="{row}">
<el-input size="small" placeholder="重复1" v-model="row.before.repeat1"/>
<el-input size="small" placeholder="重复2" v-model="row.before.repeat2"/>
<el-input size="small" placeholder="重复3" v-model="row.before.repeat3"/>
</template>
</el-table-column>
<el-table-column label="培养3天后" class-name="input" prop="after" width="300px" align="center">
<template #default="{row}">
<el-input size="small" placeholder="重复1" v-model="row.after.repeat1"/>
<el-input size="small" placeholder="重复2" v-model="row.after.repeat2"/>
<el-input size="small" placeholder="重复3" v-model="row.after.repeat3"/>
</template>
</el-table-column>
<el-table-column label="LogFC" prop="logFC" align="center"/>
<el-table-column label="P-value" prop="pValue" align="center"/>
</el-table>
</el-col>
</el-row>
</el-form>
</div>
<div class="card"> <div class="card">
<div class="title" data-title="分化能力评估" /> <div class="title" data-title="分化能力评估" />
<el-form> <el-form>
@ -168,6 +201,28 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24">
<el-table :data="differentiation" size="small">
<el-table-column label="分化能力标志物" prop="marker" align="center"/>
<el-table-column label="未分化对照组" class-name="input" prop="before" width="300px" align="center">
<template #default="{row}">
<el-input size="small" placeholder="重复1" v-model="row.before.repeat1"/>
<el-input size="small" placeholder="重复2" v-model="row.before.repeat2"/>
<el-input size="small" placeholder="重复3" v-model="row.before.repeat3"/>
</template>
</el-table-column>
<el-table-column label="诱导软骨分化3天后" class-name="input" prop="after" width="300px" align="center">
<template #default="{row}">
<el-input size="small" placeholder="重复1" v-model="row.after.repeat1"/>
<el-input size="small" placeholder="重复2" v-model="row.after.repeat2"/>
<el-input size="small" placeholder="重复3" v-model="row.after.repeat3"/>
</template>
</el-table-column>
<el-table-column label="LogFC" prop="logFC" align="center"/>
<el-table-column label="P-value" prop="pValue" align="center"/>
</el-table>
</el-col>
<el-col class="title" :span="24">软骨分化能力</el-col> <el-col class="title" :span="24">软骨分化能力</el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="阿辛蓝染色值"> <el-form-item label="阿辛蓝染色值">
@ -245,11 +300,60 @@
<el-input placeholder="请输入"/> <el-input placeholder="请输入"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24">
<el-table :data="immuneReg" size="small">
<el-table-column label="免疫调控能力标志物" prop="marker" align="center"/>
<el-table-column label="对照组" class-name="input" prop="before" width="300px" align="center">
<template #default="{row}">
<el-input size="small" placeholder="重复1" v-model="row.before.repeat1"/>
<el-input size="small" placeholder="重复2" v-model="row.before.repeat2"/>
<el-input size="small" placeholder="重复3" v-model="row.before.repeat3"/>
</template>
</el-table-column>
<el-table-column label="TNF-α/INF-γ刺激24小时后" class-name="input" prop="after" width="300px" align="center">
<template #default="{row}">
<el-input size="small" placeholder="重复1" v-model="row.after.repeat1"/>
<el-input size="small" placeholder="重复2" v-model="row.after.repeat2"/>
<el-input size="small" placeholder="重复3" v-model="row.after.repeat3"/>
</template>
</el-table-column>
<el-table-column label="LogFC" prop="logFC" align="center"/>
<el-table-column label="P-value" prop="pValue" align="center"/>
</el-table>
</el-col>
</el-row> </el-row>
</el-form> </el-form>
</div> </div>
<el-button class="submit">开始分析</el-button> <el-button class="submit">开始分析</el-button>
</template> </template>
<script setup> <script setup>
import { shallowRef } from "vue";
var increment=shallowRef([
{marker:"EGR2",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"TNFRSF1B",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.1,pValue:0.05},
{marker:"CSF3",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.03,pValue:0.043},
{marker:"PTPRN",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.17,pValue:0.053},
])
var differentiation=shallowRef([
{marker:"FKBP5",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"ZBTB16",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"TSC22D3",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"NRCAM",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"PXYLP1",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"FBLN5",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"C1QL1",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
])
var immuneReg=shallowRef([
{marker:"IGF2",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"IRF1",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"IL1β",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"CXCL8",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"CXCL9",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"CXCL10",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
{marker:"BCL2L11",before:{repeat1:"",repeat2:"",repeat3:""},after:{repeat1:"",repeat2:"",repeat3:""},logFC:1.25,pValue:0.03},
])
</script> </script>
Write Preview
Loading…
Cancel
Save