| | |
| | | <template> |
| | | <div> |
| | | <div class="search"> |
| | | <div class="search_thing"> |
| | | <div class="search_label">样品编号:</div> |
| | | <el-input v-model="search.sampleCode" clearable placeholder="请输入" size="small" style="width: 60%;" |
| | | @keyup.enter.native="getTableList(clickNodeVal.value)"></el-input> |
| | | <div class="search_label">管理编号:</div> |
| | | <el-input v-model="search.managementNumber" clearable placeholder="请输入" size="small" style="width: 60%;" |
| | | @keyup.enter.native="getTableList(clickNodeVal.value)"></el-input> |
| | | </div> |
| | | <div class="search_thing" style="padding-left: 30px;"> |
| | | <el-button size="small" @click="resetSearch">重 置</el-button> |
| | | <el-button size="small" type="primary" @click="getTableList(clickNodeVal.value)">查 询</el-button> |
| | | </div> |
| | | <div class="btns" v-if="isMenuList != 1"> |
| | | <el-form :model="search" ref="search" size="small" :inline="true"> |
| | | <el-form-item label="样品编号"> |
| | | <el-input v-model="search.sampleCode" clearable placeholder="请输入" size="small" |
| | | @keyup.enter.native="getTableList(clickNodeVal.value)"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="管理编号"> |
| | | <el-input v-model="search.managementNumber" clearable placeholder="请输入" size="small" |
| | | @keyup.enter.native="getTableList(clickNodeVal.value)"></el-input> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button size="mini" type="primary" @click="getTableList(clickNodeVal.value)">查询</el-button> |
| | | <el-button size="mini" @click="resetSearch">重置</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div> |
| | | <el-button size="small" type="primary" @click="dialogVisible = true, openAdd()">新 建</el-button> |
| | | <el-button :loading="outLoading" size="small" type="primary" @click="openHandleOut">导 出</el-button> |
| | | </div> |
| | | </div> |
| | | <div class="tables" style="margin-top: 10px;"> |
| | | <div> |
| | | <el-table ref="Recordtable" :data="formParamList" height="calc(100vh - 20em)" |
| | | v-loading="tableLoading" |
| | | :header-cell-style="{ background: '#f8f8f9', color: '#515a6e' }" border> |
| | | <!-- 表格列 --> |
| | | <el-table-column label="序号" type="index" width="120"> |
| | | <el-table-column label="序号" type="index" width="70" align="center"> |
| | | <template v-slot="scope"> |
| | | <span>{{ (search.current - 1) * search.size + scope.$index + 1 }}</span> |
| | | </template> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <!-- <el-table-column label="异常情况" min-width="120" prop="abnormal" />--> |
| | | <el-table-column label="使用开始日期" min-width="150" prop="useStartDate" /> |
| | | <el-table-column label="使用结束日期" min-width="150" prop="useEndDate" /> |
| | | <el-table-column label="使用开始日期" min-width="170" prop="useStartDate" /> |
| | | <el-table-column label="使用结束日期" min-width="170" prop="useEndDate" /> |
| | | <el-table-column label="使用人" min-width="120" prop="usePerson" /> |
| | | <el-table-column label="备注" min-width="120" prop="remark" /> |
| | | <!-- 操作按钮 --> |
| | |
| | | </el-table> |
| | | <el-pagination :current-page="1" :page-size="search.size" :page-sizes="[10, 20, 30, 50, 100]" |
| | | :total="search.total" layout="->,total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange"> |
| | | @current-change="handleCurrentChange" background> |
| | | </el-pagination> |
| | | </div> |
| | | <el-dialog :visible.sync="dialogVisible" title="仪器设备使用记录表" top="5vh" width="55%"> |
| | |
| | | dialogVisible: false, |
| | | operationType: '', |
| | | formParamList: [], |
| | | tableLoading: false |
| | | } |
| | | }, |
| | | mounted() { |
| | |
| | | if (deviceId === undefined) { |
| | | deviceId = '' |
| | | } |
| | | this.tableLoading = true |
| | | await deviceRecordPage({ |
| | | deviceId: deviceId, |
| | | ...this.search |
| | | }).then(res => { |
| | | this.tableLoading = false |
| | | if (res.code == 200) { |
| | | this.formParamList = res.data.records |
| | | this.search.total = res.data.total |
| | | } |
| | | }).catch(err => { |
| | | this.tableLoading = false |
| | | }) |
| | | }, |
| | | // 打开导出弹框选择编制人、批准人 |
| | |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .tables { |
| | | width: 100%; |
| | | height: calc(100vh - 15em); |
| | | } |
| | | |
| | | .el-from { |
| | | max-width: 400px; |
| | | margin: 0 auto; |
| | | } |
| | | |
| | | .form-row { |
| | | .search { |
| | | height: 46px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | } |
| | | |
| | | .el-input { |
| | | width: calc(100% - 120px); |
| | | /* 确保输入框宽度一致 */ |
| | | } |
| | | |
| | | .form-row .el-form-item { |
| | | flex: 1; |
| | | /* 每个表单项占据相同比例的空间 */ |
| | | margin-right: 100px; |
| | | /* 可选:为右侧元素添加间距 */ |
| | | } |
| | | |
| | | /* 移除最后一个元素的右边距 */ |
| | | .form-row .el-form-item:last-child { |
| | | margin-right: 0; |
| | | |
| | | } |
| | | |
| | | .search { |
| | | background-color: #fff; |
| | | margin-top: 10px; |
| | | display: flex; |
| | | align-items: center; |
| | | position: relative; |
| | | } |
| | | |
| | | .search_thing { |
| | | display: flex; |
| | | align-items: center; |
| | | height: 40px; |
| | | |
| | | } |
| | | |
| | | .search_label { |
| | | width: 140px; |
| | | font-size: 14px; |
| | | text-align: right; |
| | | margin-right: 10px; |
| | | } |
| | | |
| | | .btns { |
| | | position: absolute; |
| | | right: 0px; |
| | | top: 50%; |
| | | transform: translate(0, -50%); |
| | | } |
| | | </style> |