From e950c38ba82e5e6bc8b0c50c35e5dbb6a180165a Mon Sep 17 00:00:00 2001
From: 13404089107 <puwei@sinata.cn>
Date: 星期二, 20 五月 2025 16:43:06 +0800
Subject: [PATCH] Merge branch 'main' of http://120.76.84.145:10101/gitblit/r/H5/leshan-laboratory
---
culture/src/views/strain-library/validation/primitive-cell/index.vue | 464 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 464 insertions(+), 0 deletions(-)
diff --git a/culture/src/views/strain-library/validation/primitive-cell/index.vue b/culture/src/views/strain-library/validation/primitive-cell/index.vue
new file mode 100644
index 0000000..69f9baf
--- /dev/null
+++ b/culture/src/views/strain-library/validation/primitive-cell/index.vue
@@ -0,0 +1,464 @@
+<template>
+ <div class="list">
+ <!-- Table -->
+ <TableCustom
+ :queryForm="queryForm"
+ :tableData="tableData"
+ :total="total"
+ @currentChange="handleCurrentChange"
+ @sizeChange="handleSizeChange"
+ >
+ <template #search>
+ <el-form :model="form" label-width="auto" inline>
+ <el-form-item label="鉴别菌株编号：">
+ <el-input v-model="form.strainNo" placeholder="请输入"></el-input>
+ </el-form-item>
+ <el-form-item label="鉴别菌株名称：">
+ <el-input v-model="form.strainName" placeholder="请输入"></el-input>
+ </el-form-item>
+ <el-form-item label="验证实验编号：">
+ <el-input v-model="form.strainName" placeholder="请输入"></el-input>
+ </el-form-item>
+ <el-form-item class="search-btn-box">
+ <el-button type="default" @click="resetForm">重置</el-button>
+ <el-button type="primary" @click="searchData">查询</el-button>
+ </el-form-item>
+ </el-form>
+ </template>
+
+ <template #setting>
+ <div class="tableTitle">
+ <div class="flex a-center">
+ <div
+ class="title"
+ :class="{ active: currentType === 'list' }"
+ @click="handleTypeChange('list')"
+ >
+ 原始细胞库验证资料
+ </div>
+ <div
+ class="drafts"
+ :class="{ active: currentType === 'draft' }"
+ @click="handleTypeChange('draft')"
+ >
+ 草稿箱
+ </div>
+ </div>
+ <div class="flex a-center">
+ <el-button
+ @click="handleNewStrain"
+ class="el-icon-plus"
+ type="primary"
+ style="margin-right: 12px"
+ >新增原始细胞库资料</el-button
+ >
+ </div>
+ </div>
+ </template>
+
+ <template #table>
+ <el-table-column prop="source" label="菌种来源" />
+ <el-table-column prop="method" label="鉴别菌株编号" />
+ <el-table-column prop="certificate" label="鉴别菌株名称" />
+ <el-table-column prop="storage" label="验证实验编号" />
+ <el-table-column prop="amount" label="创建人" />
+ <el-table-column prop="inventory" label="创建时间" />
+ <el-table-column prop="status" label="状态">
+ <template #default="{ row }">
+ <el-tag :type="getStatusType(row.status)">{{
+ getStatusText(row.status)
+ }}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="操作" width="200">
+ <template #default="{ row }">
+ <el-button
+ type="text"
+ @click="$router.push('/strain/validation/confirm-detail')"
+ >确认</el-button
+ >
+ <el-button type="text" @click="handleDetail(row)">详情1</el-button>
+ <el-button type="text" @click="handleDetail2(row)">详情2</el-button>
+ <el-button type="text" @click="handleEdit(row)">编辑</el-button>
+ <el-button type="text" @click="handleRecord(row)">删除</el-button>
+ </template>
+ </el-table-column>
+ </template>
+ </TableCustom>
+ <PrimitiveCellDetailDialog
+ :visible.sync="detailVisible"
+ :detail="currentDetail"
+ />
+ <DetailConditionDialog
+ :visible.sync="detailDialogVisible"
+ :value="detailDialogValue"
+/>
+ </div>
+</template>
+
+<script>
+import PrimitiveCellDetailDialog from "./primitive-cell-detail-dialog.vue";
+import DetailConditionDialog from "./DetailConditionDialog.vue";
+export default {
+ name: "PrimitiveCell",
+ components: {
+ PrimitiveCellDetailDialog,
+ DetailConditionDialog,
+ },
+ data() {
+ return {
+ detailDialogVisible: false,
+ detailDialogValue: {},
+ dialogVisible: false,
+ currentType: "list",
+ detailVisible: false,
+ currentDetail: {},
+ form: {
+ strainNo: "",
+ strainName: "",
+ status: "",
+ },
+ queryForm: {
+ pageSize: 10,
+ pageNum: 1,
+ },
+ total: 800,
+ tableData: [
+ {
+ strainNo: "YX-2024001",
+ strainName: "大肠杆菌",
+ source: "实验室分离",
+ method: "形态学鉴定、生理生化试验",
+ certificate: "革兰氏阴性杆菌，可发酵葡萄糖产酸产气，IMViC试验++--",
+ storage: "斜面培养",
+ amount: "A区-01-001",
+ inventory: "50",
+ notes: "用于质粒转化",
+ status: "1",
+ },
+ {
+ strainNo: "YX-2024002",
+ strainName: "枯草芽孢杆菌",
+ source: "菌种保藏中心",
+ method: "16S rDNA测序",
+ certificate: "革兰氏阳性芽孢杆菌，可水解淀粉，产生溶菌素",
+ storage: "冷冻保存",
+ amount: "B区-02-005",
+ inventory: "30",
+ notes: "工业发酵菌种",
+ status: "1",
+ },
+ {
+ strainNo: "YX-2024003",
+ strainName: "酿酒酵母",
+ source: "发酵工厂",
+ method: "显微镜观察、生理特性",
+ certificate: "椭圆形单细胞真菌，可发酵葡萄糖产生乙醇",
+ storage: "甘油管保存",
+ amount: "A区-03-002",
+ inventory: "40",
+ notes: "发酵工艺优化",
+ status: "2",
+ },
+ {
+ strainNo: "YX-2024004",
+ strainName: "乳酸菌",
+ source: "乳制品分离",
+ method: "生化鉴定、API条",
+ certificate: "革兰氏阳性球菌，产生乳酸，耐酸性强",
+ storage: "冷冻干燥",
+ amount: "C区-01-003",
+ inventory: "25",
+ notes: "益生菌研究",
+ status: "3",
+ },
+ {
+ strainNo: "YX-2024005",
+ strainName: "青霉菌",
+ source: "环境样本",
+ method: "形态学特征、ITS测序",
+ certificate: "丝状真菌，产生蓝绿色分生孢子，可产青霉素",
+ storage: "斜面培养",
+ amount: "B区-04-001",
+ inventory: "35",
+ notes: "次级代谢产物研究",
+ status: "1",
+ },
+ ],
+ };
+ },
+ methods: {
+ handleDetail(row) {
+ this.currentDetail = row;
+ this.detailVisible = true;
+ },
+ handleDetail2(row) {
+ this.detailDialogValue = row;
+ this.detailDialogVisible = true;
+ },
+ handleViewMore() {
+ this.dialogVisible = true;
+ },
+ resetForm() {
+ this.form = {
+ strainNo: "",
+ strainName: "",
+ status: "",
+ };
+ this.searchData();
+ },
+ searchData() {
+ // 模拟搜索逻辑
+ const { strainNo, strainName, status } = this.form;
+ let filteredData = [...this.tableData];
+
+ if (strainNo) {
+ filteredData = filteredData.filter((item) =>
+ item.strainNo.toLowerCase().includes(strainNo.toLowerCase())
+ );
+ }
+ if (strainName) {
+ filteredData = filteredData.filter((item) =>
+ item.strainName.toLowerCase().includes(strainName.toLowerCase())
+ );
+ }
+ if (status) {
+ filteredData = filteredData.filter((item) => item.status === status);
+ }
+
+ this.total = filteredData.length;
+ // 实际项目中这里应该调用API
+ console.log("搜索条件:", this.form);
+ console.log("分页信息:", this.queryForm);
+ },
+ handleNewStrain() {
+ this.$router.push("/strain/validation/add-primitive-cell");
+ // Implement new strain logic
+ },
+ handleBatchAdd() {
+ // Implement batch add logic
+ },
+ handleEdit(row) {
+ // Implement edit logic
+ },
+ handleRecord(row) {
+ this.$router.push({
+ path: "/strain-library/strain-library-manage/record",
+ query: {
+ id: row.strainNo,
+ },
+ });
+ },
+ handleCurrentChange(page) {
+ this.queryForm.pageNum = page;
+ // Implement page change logic
+ },
+ handleSizeChange(size) {
+ this.queryForm.pageSize = size;
+ // Implement size change logic
+ },
+ handleTypeChange(type) {
+ this.currentType = type;
+ // Implement type change logic
+ },
+ getStatusType(status) {
+ const types = {
+ 1: "success",
+ 2: "info",
+ 3: "warning",
+ };
+ return types[status] || "info";
+ },
+ getStatusText(status) {
+ const texts = {
+ 1: "已入库",
+ 2: "已出库",
+ 3: "入库待确认",
+ };
+ return texts[status] || "未知状态";
+ },
+ },
+};
+</script>
+
+<style scoped lang="less">
+.list {
+ padding: 20px;
+}
+
+.header-box {
+ margin-bottom: 20px;
+ border-radius: 16px;
+ background: rgba(255, 255, 255, 0.8);
+
+ .box-title {
+ display: flex;
+ align-items: center;
+ font-size: 18px;
+ font-weight: bold;
+ margin-bottom: 15px;
+ position: relative;
+
+ .header-icon {
+ width: 20px;
+ height: 20px;
+ margin-right: 10px;
+ }
+
+ .view-more {
+ position: absolute;
+ right: 0;
+ color: #049c9a;
+ }
+ }
+
+ .header-content {
+ color: rgba(0, 0, 0, 0.88);
+ font-size: 14px;
+ line-height: 1.8;
+ margin-left: 30px;
+ transition: max-height 0.3s ease-in-out;
+ overflow: hidden;
+
+ &.collapsed {
+ max-height: 48px;
+ overflow: hidden;
+ }
+
+ p {
+ margin: 5px 0;
+ }
+ }
+}
+
+.search-form {
+ margin-bottom: 20px;
+ background: #f5f7fa;
+ padding: 24px;
+ border-radius: 8px;
+
+ .el-form-item {
+ margin-right: 20px;
+ margin-bottom: 0;
+ }
+
+ .el-button {
+ margin-left: 10px;
+ }
+}
+
+.action-buttons {
+ margin-bottom: 20px;
+
+ .el-button {
+ margin-right: 10px;
+ }
+}
+
+.tab-container {
+ display: flex;
+ margin-bottom: 20px;
+
+ .tab {
+ padding: 10px 30px;
+ border: 1px solid #dcdfe6;
+ border-bottom: none;
+ border-radius: 8px 8px 0 0;
+ cursor: pointer;
+ margin-right: 10px;
+ background: #f5f7fa;
+
+ &.active {
+ background: #fff;
+ border-color: #049c9a;
+ color: #049c9a;
+ font-weight: bold;
+ }
+ }
+}
+
+.flex {
+ display: flex;
+ align-items: center;
+}
+
+.tableTitle {
+ display: flex;
+ padding-bottom: 20px;
+ justify-content: space-between;
+ align-items: center;
+
+ .title {
+ background: #fafafc;
+ border-radius: 8px 8px 0px 0px;
+ border: 1px solid #dcdfe6;
+ font-weight: bold;
+ font-size: 18px;
+ color: #606266;
+ width: unset;
+ cursor: pointer;
+ height: 50px;
+ line-height: 50px;
+ width: 166px;
+ text-align: center;
+ }
+
+ .drafts {
+ background: #fafafc;
+ border-radius: 8px 8px 0px 0px;
+ border: 1px solid #dcdfe6;
+ font-weight: 400;
+ font-size: 18px;
+ color: #606266;
+ margin-left: 16px;
+ cursor: pointer;
+ height: 50px;
+ line-height: 50px;
+ width: 166px;
+ text-align: center;
+ }
+
+ .active {
+ color: #049c9a;
+ background: #ffffff;
+ border-radius: 8px 8px 0px 0px;
+ border: 1px solid #049c9a;
+ }
+}
+
+.view-all-dialog {
+ :deep(.el-dialog__header) {
+ padding: 20px;
+ border-bottom: 1px solid #ebeef5;
+ margin-right: 0;
+
+ .el-dialog__title {
+ font-size: 18px;
+ font-weight: bold;
+ color: #303133;
+ }
+ }
+
+ :deep(.el-dialog__body) {
+ padding: 20px;
+
+ .dialog-content {
+ font-size: 14px;
+ line-height: 1.8;
+ color: #606266;
+
+ p {
+ margin: 12px 0;
+
+ &:first-child {
+ margin-top: 0;
+ }
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+ }
+ }
+}
+</style>
--
Gitblit v1.7.1