| | |
| | | <template> |
| | | <div class="list"> |
| | | <TableCustom :queryForm="form" :tableData="tableData" :total="total"> |
| | | <TableCustom :queryForm="form" :tableData="tableData" :height="null" :total="total" @handleSizeChange="handleSizeChange" |
| | | @handleCurrentChange="handleCurrentChange"> |
| | | <template #search> |
| | | <el-form :model="form" labelWidth="auto" inline> |
| | | <el-form-item label="选择项目组:"> |
| | | <el-select |
| | | v-model="form.projectIds" |
| | | placeholder="请选择项目组" |
| | | filterable |
| | | clearable |
| | | :loading="teamLoading" |
| | | :key="teamList.length" |
| | | @focus="fetchTeamList" |
| | | multiple > |
| | | <el-option |
| | | v-for="item in teamList" |
| | | :key="item.id" |
| | | :label="item.teamName" |
| | | :value="item.id" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="菌种编号:"> |
| | | <el-input v-model="form.strainCode" 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-form-item v-if="roleType == 4" label="起传类型"> |
| | | <el-select v-model="form.generationType" placeholder="请选择"> |
| | | <el-option label="母代" :value="1"></el-option> |
| | | <el-option label="祖代" :value="2"></el-option> |
| | |
| | | <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 class="drafts" :class="{ active: currentType === 'draft' }" @click="handleTypeChange('draft')"> |
| | | 草稿箱 |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | <div class="flex a-center"> |
| | | <div class="flex a-center" v-if="roleType == 3"> |
| | | <el-button @click="handleNewStrain" class="el-icon-plus" type="primary" |
| | | style="margin-right: 12px">新增祖代起传</el-button> |
| | | <el-button @click="handleBatchAdd" class="el-icon-plus" type="primary">新增母代起传</el-button> |
| | |
| | | </div> |
| | | </template> |
| | | <template #table> |
| | | <el-table-column prop="planCode" label="项目课题方案编号"></el-table-column> |
| | | <el-table-column prop="planName" label="项目课题方案名称"></el-table-column> |
| | | <el-table-column prop="stage" label="起传类型"></el-table-column> |
| | | <el-table-column prop="creator" label="菌种源"></el-table-column> |
| | | <el-table-column prop="createTime" label="菌种编号"></el-table-column> |
| | | <el-table-column prop="approver" label="菌种名称"></el-table-column> |
| | | <el-table-column prop="approveTime" label="创建时间"></el-table-column> |
| | | <el-table-column prop="approver" label="创建人"></el-table-column> |
| | | <el-table-column prop="projectName" label="项目组名称"/> |
| | | <el-table-column prop="generationType" label="起传类型"> |
| | | <template slot-scope="scope"> |
| | | {{ scope.row.generationType === 1 ? '母代起传' : '祖代起传' }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="菌种源"> |
| | | <template slot-scope="scope"> |
| | | {{ scope.row.strainSourceStart }}代—{{ scope.row.strainSourceEnd }}细胞库 |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="strainCode" label="菌种编号"></el-table-column> |
| | | <el-table-column prop="strainName" label="菌种名称"></el-table-column> |
| | | <el-table-column prop="createTime" label="创建时间"></el-table-column> |
| | | <el-table-column prop="createBy" label="创建人"></el-table-column> |
| | | <el-table-column prop="status" label="状态"> |
| | | <template slot-scope="scope"> |
| | | {{ scope.row.status === 1 ? '已保存/未提交' : '已提交' }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" width="250"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text" @click="handleDetail(scope.row)">详情</el-button> |
| | | <el-button style="margin-right: 10px" type="text" @click="handleDetail(scope.row)">详情</el-button> |
| | | <el-button style="margin-right: 10px" type="text" |
| | | v-if="canEdit(scope.row)" |
| | | @click="handleEdit(scope.row)">编辑</el-button> |
| | | <!-- 菌种超级管理员 --> |
| | | <el-button type="text" @click="handleEdit(scope.row)">编辑</el-button> |
| | | <!-- 菌种超级管理员 --> |
| | | <el-button type="text" @click="handleDelete(scope.row)">删除</el-button> |
| | | <el-button type="text" v-if="Number(roleType) == 1" @click="handleDelete(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </template> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { getList } from "./service"; |
| | | import { getList, deleteProgenitor } from "./service"; |
| | | import {myTeamPageList} from "@/components/chooseProject/servce"; |
| | | export default { |
| | | name: "PedigreeChart", |
| | | components: {}, |
| | |
| | | return { |
| | | currentType: "list", // 当前显示类型:list-列表,draft-草稿箱 |
| | | form: { |
| | | projectIds: [], |
| | | strainCode: "", |
| | | strainName: "", |
| | | generationType: "", |
| | | pageNum: 1, |
| | | pageSize: 10 |
| | | }, |
| | | teamList: [], // 项目组列表 |
| | | teamLoading: false, // 加载状态 |
| | | tableData: [], |
| | | total: 0, |
| | | roleType: JSON.parse(sessionStorage.getItem('userInfo')).roleType || 1, // 1.超级管理员 2.审批人 3.工程师 4.实验员 |
| | | currentUserName: JSON.parse(sessionStorage.getItem('userInfo')).nickName || '', |
| | | // 模拟数据 |
| | | mockListData: [ |
| | | { |
| | | planCode: "PLAN-2024-001", |
| | | planName: "2024年度实验室设备升级方案", |
| | | stage: "规划阶段", |
| | | creator: "张三", |
| | | createTime: "2024-03-15", |
| | | status: "pending", |
| | | approver: "李四", |
| | | approveTime: "2024-03-16", |
| | | }, |
| | | { |
| | | planCode: "PLAN-2024-002", |
| | | planName: "实验室安全管理制度更新方案", |
| | | stage: "实施阶段", |
| | | creator: "王五", |
| | | createTime: "2024-03-14", |
| | | status: "approved", |
| | | approver: "赵六", |
| | | approveTime: "2024-03-15", |
| | | }, |
| | | { |
| | | planCode: "PLAN-2024-003", |
| | | planName: "实验室人员培训计划", |
| | | stage: "准备阶段", |
| | | creator: "孙七", |
| | | createTime: "2024-03-13", |
| | | status: "rejected", |
| | | approver: "周八", |
| | | approveTime: "2024-03-14", |
| | | }, |
| | | ], |
| | | mockDraftData: [ |
| | | { |
| | | planCode: "DRAFT-2024-001", |
| | | planName: "实验室设备采购计划(草稿)", |
| | | stage: "规划阶段", |
| | | creator: "张三", |
| | | createTime: "2024-03-16", |
| | | status: "draft", |
| | | approver: "", |
| | | approveTime: "", |
| | | }, |
| | | { |
| | | planCode: "DRAFT-2024-002", |
| | | planName: "实验室改造方案(草稿)", |
| | | stage: "准备阶段", |
| | | creator: "李四", |
| | | createTime: "2024-03-15", |
| | | status: "draft", |
| | | approver: "", |
| | | approveTime: "", |
| | | }, |
| | | ], |
| | | mockListData: [], |
| | | mockDraftData: [], |
| | | approvalDialogVisible: false, |
| | | approvalDialogType: "approve", |
| | | currentApprovalData: null, |
| | | }; |
| | | }, |
| | | created() { |
| | | activated() { |
| | | this.getTableData(); |
| | | this.fetchTeamList() |
| | | }, |
| | | methods: { |
| | | // 获取项目组列表 |
| | | async fetchTeamList() { |
| | | if (this.teamList.length > 0) return // 已有数据不再重复请求 |
| | | this.teamLoading = true |
| | | try { |
| | | const res = await myTeamPageList() |
| | | console.log('res', res) |
| | | // 根据实际接口返回的数据结构调整 |
| | | this.teamList = res.data || res || [] |
| | | } catch (error) { |
| | | console.error('获取项目组列表失败:', error) |
| | | this.$message.error('获取项目组列表失败') |
| | | } finally { |
| | | this.teamLoading = false |
| | | } |
| | | }, |
| | | handleSizeChange(size) { |
| | | this.form.pageSize = size; |
| | | this.getTableData(); |
| | | }, |
| | | handleCurrentChange(page) { |
| | | this.form.pageNum = page; |
| | | this.getTableData(); |
| | | }, |
| | | handleBatchAdd() { |
| | | this.$router.push({ |
| | | path: "/strain/add-pedigree", |
| | |
| | | pageNum: 1, |
| | | pageSize: 10 |
| | | }; |
| | | this.getTableData(); |
| | | |
| | | }, |
| | | handleNewStrain() { |
| | | this.$router.push({ |
| | |
| | | }, |
| | | handleApproveSubmit(data) { |
| | | // 处理审批通过 |
| | | console.log("审批通过:", data); |
| | | this.approvalDialogVisible = false; |
| | | this.$message.success("审批通过成功"); |
| | | this.getTableData(); |
| | | }, |
| | | handleRejectSubmit(data) { |
| | | // 处理审批驳回 |
| | | console.log("审批驳回:", data); |
| | | this.approvalDialogVisible = false; |
| | | this.$message.success("审批驳回成功"); |
| | | this.getTableData(); |
| | | }, |
| | | handleRevokeApprove(row) { |
| | | // 实现撤销审批逻辑 |
| | | console.log("撤销审批数据:", row); |
| | | }, |
| | | handleEdit(row) { |
| | | // 实现编辑逻辑 |
| | | console.log("编辑数据:", row); |
| | | const path = row.generationType == 1 ? '/strain/add-pedigree' : '/strain/add-progenitor'; |
| | | this.$router.push({ path, query: { id: row.id, mode: 'edit', status: row.status } }); |
| | | }, |
| | | canEdit(row) { |
| | | if (Number(this.roleType) === 1) return true; |
| | | return Number(this.roleType) === 3 |
| | | && Number(row.status) === 1 |
| | | && row.createBy === this.currentUserName; |
| | | }, |
| | | handleDelete(row) { |
| | | // 实现删除逻辑 |
| | | console.log("删除数据:", row); |
| | | this.$confirm("确定删除该数据吗?", "提示", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | }).then(() => { |
| | | deleteProgenitor({ id: row.id }).then((res) => { |
| | | if (res.code == 200) { |
| | | this.$message.success("删除成功"); |
| | | this.resetForm(); |
| | | } |
| | | }); |
| | | }); |
| | | }, |
| | | handleDetail(row) { |
| | | this.currentApprovalData = row; |
| | | this.approvalDialogType = "view"; |
| | | this.approvalDialogVisible = true; |
| | | if (row.generationType == 1) { |
| | | //母代详情 |
| | | this.$router.push('/strain/detail-pedigree?id=' + row.id + '&type=1&status=' + row.status); |
| | | } else { |
| | | //祖代详情 |
| | | this.$router.push('/strain/detail-progenitor?id=' + row.id + '&type=1&status=' + row.status) |
| | | } |
| | | |
| | | }, |
| | | handleTypeChange(type) { |
| | | this.currentType = type; |
| | |
| | | getTableData() { |
| | | getList(this.form).then(res => { |
| | | if (res.code === 200) { |
| | | this.tableData = res.data.list; |
| | | this.tableData = res.data.records; |
| | | this.total = res.data.total; |
| | | } |
| | | }); |