| | |
| | | <template> |
| | | <div> |
| | | <TableCard :showTitle="false"> |
| | | <template slot="form"> |
| | | <div class="action-box"> |
| | | <div></div> |
| | | <div class="flex"> |
| | | <el-button icon="el-icon-plus" size="small" type="primary" @click="showDialog(undefined)"> |
| | | 新建 |
| | | </el-button> |
| | | <el-button icon="el-icon-upload2" size="small" @click="exportExcel"> |
| | | 导出Excel |
| | | </el-button> |
| | | </div> |
| | | </div> |
| | | <div class="flex"> |
| | | <el-button icon="el-icon-plus" size="small" type="primary" @click="showDialog(undefined)"> |
| | | 新建 |
| | | </el-button> |
| | | <el-button icon="el-icon-upload2" size="small" @click="exportExcel"> |
| | | 导出Excel |
| | | </el-button> |
| | | </div> |
| | | <limsTable :column="columns" :currentChange="rowClick" :height="'25vh'" :highlightCurrentRow="true" |
| | | :isSelection="false" :rowStyle="tableRowStyle" :table-data="tableData" rowKey="id" |
| | | style="margin-top: 18px;"> |
| | | <template v-slot:consumablesTypeSlot="{ row }"> |
| | | {{ findType(row.consumablesType) }} |
| | | </template> |
| | | <template v-slot:table> |
| | | <limsTable :column="columns" :currentChange="rowClick" :height="'25vh'" :highlightCurrentRow="true" |
| | | :isSelection="false" :rowStyle="tableRowStyle" :table-data="tableData" rowKey="id" |
| | | style="margin-top: 18px; padding: 0 15px;"> |
| | | <template v-slot:consumablesTypeSlot="{ row }"> |
| | | {{ findType(row.consumablesType) }} |
| | | </template> |
| | | <template v-slot:operation="scope"> |
| | | <el-button size="small" type="text" @click="showDialog(scope.row)">编辑</el-button> |
| | | <el-button size="small" style="color: #f56c6c" type="text" @click="handleDelete(scope.row)">删除</el-button> |
| | | </template> |
| | | </limsTable> |
| | | <div class="pagination"> |
| | | <div></div> |
| | | <el-pagination :page-size="pagination.pageSize" :page-sizes="[10, 20, 30, 40]" :total="pagination.total" |
| | | layout="total, sizes, prev, pager, next, jumper" @current-change="handleCurrent" @size-change="handleSize"> |
| | | </el-pagination> |
| | | </div> |
| | | <template v-slot:operation="scope"> |
| | | <el-button size="small" type="text" @click="showDialog(scope.row)">编辑</el-button> |
| | | <el-button size="small" style="color: #f56c6c" type="text" @click="handleDelete(scope.row)">删除</el-button> |
| | | </template> |
| | | </TableCard> |
| | | </limsTable> |
| | | <div class="pagination"> |
| | | <div></div> |
| | | <el-pagination :page-size="pagination.pageSize" :page-sizes="[10, 20, 30, 40]" :total="pagination.total" |
| | | background |
| | | layout="total, sizes, prev, pager, next, jumper" @current-change="handleCurrent" @size-change="handleSize"> |
| | | </el-pagination> |
| | | </div> |
| | | <el-divider></el-divider> |
| | | <div> |
| | | <ConsumableProject ref="consumableProject"></ConsumableProject> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import TableCard from './index.vue'; |
| | | import Edit from "./Edit.vue" |
| | | import limsTable from '@/components/Table/lims-table.vue' |
| | | import { |
| | |
| | | |
| | | export default { |
| | | dicts: ["consumables_type"], |
| | | components: { |
| | | TableCard, limsTable, Edit, ConsumableProject |
| | | }, |
| | | components: {limsTable, Edit, ConsumableProject}, |
| | | props: { |
| | | contentsId: { |
| | | type: Number, |
| | |
| | | this.$refs.consumableProject.fetchListId(row) |
| | | }, |
| | | tableRowStyle({ row }) { |
| | | if (row.currentAmount <= row.lowerLimit) { |
| | | if(row.currentAmount <= row.lowerLimit) { |
| | | return { background: '#ffcaca' } |
| | | } else { |
| | | return {} |
| | | return { background: '#fff' } |
| | | } |
| | | } |
| | | } |
| | |
| | | |
| | | <style scoped> |
| | | .flex { |
| | | display: flex; |
| | | } |
| | | |
| | | .action-box { |
| | | width: 100%; |
| | | padding-top: 10px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | text-align: right; |
| | | } |
| | | |
| | | .pagination { |