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/add.vue | 372 +++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 372 insertions(+), 0 deletions(-)
diff --git a/culture/src/views/strain-library/validation/primitive-cell/add.vue b/culture/src/views/strain-library/validation/primitive-cell/add.vue
new file mode 100644
index 0000000..b7c6d94
--- /dev/null
+++ b/culture/src/views/strain-library/validation/primitive-cell/add.vue
@@ -0,0 +1,372 @@
+<template>
+ <Card>
+ <!-- <div class="header-title">
+ <div class="header-title-left">
+ <img src="@/assets/public/headercard.png" />
+ <div>新增原始细胞</div>
+ </div>
+ </div> -->
+ <el-form
+ :model="form"
+ :rules="rules"
+ ref="strainForm"
+ label-position="top"
+ class="strain-form"
+ >
+
+ <div class="form-row">
+ <el-form-item label="菌种来源" prop="identificationMethod" required>
+ <el-input v-model="form.identificationMethod" placeholder="请输入"></el-input>
+ </el-form-item>
+ </div>
+ <div class="form-row three-columns">
+ <el-form-item label="鉴别菌株编号" prop="storageLocation" required>
+ <el-input v-model="form.storageLocation" placeholder="请输入"></el-input>
+ </el-form-item>
+ <el-form-item label="鉴别菌株名称" prop="preservationMethod" required>
+ <el-input v-model="form.preservationMethod" placeholder="请输入"></el-input>
+ </el-form-item>
+ <div class="form-item-placeholder"></div>
+ </div>
+ <div class="form-row three-columns">
+ <el-form-item label="验证实验编号" prop="storageLocation" required>
+ <el-input v-model="form.storageLocation" placeholder="请输入"></el-input>
+ </el-form-item>
+ <el-form-item label="实验时间" prop="preservationMethod" required>
+ <el-input v-model="form.preservationMethod" placeholder="请输入"></el-input>
+ </el-form-item>
+ <div class="form-item-placeholder"></div>
+ </div>
+ <div class="end-btn" style="margin-top: 400px">
+ <el-button type="primary" @click="handleSubmit">提交</el-button>
+ <el-button @click="handleDraft">存草稿</el-button>
+ </div>
+ </el-form>
+
+ <!-- 批量新增弹窗 -->
+ <el-dialog
+ title="批量新增"
+ :visible.sync="batchAddDialogVisible"
+ width="520px"
+ :close-on-click-modal="false"
+ :close-on-press-escape="false"
+ custom-class="batch-add-dialog"
+ >
+ <div class="dialog-content">
+ <el-form :model="batchForm" ref="batchFormRef" label-position="top" class="batch-form">
+ <el-form-item
+ label="批量新增数量"
+ prop="count"
+ required
+ :rules="[{ required: true, message: '请输入批量新增数量', trigger: 'blur' }]"
+ >
+ <el-input v-model.number="batchForm.count" placeholder="请输入" />
+ </el-form-item>
+ </el-form>
+ <div class="dialog-notice">
+ <p>注意：操作批量新增后，系统会自动生成对应数量的菌种数据，</p>
+ <p>这些菌种的基础信息内容都是一致的，唯独菌种编号内容系统</p>
+ <p>不会自动生成，需要操作员自行编辑</p>
+ </div>
+ </div>
+ <template #footer>
+ <div class="end-btn">
+ <el-button type="primary" @click="handleConfirmBatchAdd">确认新增</el-button>
+ </div>
+ </template>
+ </el-dialog>
+
+ <!-- 签字确认组件 -->
+ <ConfirmStorageDialog
+ :visible.sync="signatureVisible"
+ @confirm="handleSignatureConfirm"
+ name="操作人签字"
+ text="是否确认提交该项原始细胞库资料信息？"
+ />
+ </Card>
+</template>
+
+<script>
+import ConfirmStorageDialog from '@/components/confirm-storage-dialog/index.vue'
+
+export default {
+ name: 'AddprimitiveCell',
+ components: {
+ ConfirmStorageDialog
+ },
+ data() {
+ return {
+ batchAddDialogVisible: false,
+ signatureVisible: false,
+ currentAction: '', // 'submit' or 'batchAdd'
+ batchForm: {
+ count: ''
+ },
+ form: {
+ strainNo: '',
+ strainName: '',
+ source: '',
+ identificationMethod: '',
+ characteristics: '',
+ storageLocation: '',
+ preservationMethod: '',
+ remarks: ''
+ },
+ rules: {
+ strainNo: [{ required: true, message: '请输入菌种编号', trigger: 'blur' }],
+ strainName: [{ required: true, message: '请输入菌种名称', trigger: 'blur' }],
+ source: [{ required: true, message: '请输入菌种来源', trigger: 'blur' }],
+ identificationMethod: [{ required: true, message: '请输入鉴定方法', trigger: 'blur' }],
+ characteristics: [{ required: true, message: '请输入特征描述', trigger: 'blur' }],
+ storageLocation: [{ required: true, message: '请输入保存位置', trigger: 'blur' }],
+ preservationMethod: [{ required: true, message: '请输入菌种保存方法', trigger: 'blur' }]
+ }
+ }
+ },
+ methods: {
+ handleSubmit() {
+ this.$refs.strainForm.validate((valid) => {
+ if (valid) {
+ this.currentAction = 'submit'
+ this.signatureVisible = true
+ }
+ })
+ },
+ handleBatchAdd() {
+ this.batchAddDialogVisible = true
+ },
+ handleConfirmBatchAdd() {
+ this.$refs.batchFormRef.validate((valid) => {
+ if (valid) {
+ this.currentAction = 'batchAdd'
+ this.batchAddDialogVisible = false
+ this.signatureVisible = true
+ }
+ })
+ },
+ handleDraft() {
+ // 实现存草稿逻辑
+ console.log('save draft', this.form)
+ },
+ handleSignatureConfirm(signatureImage) {
+ this.signatureVisible = false
+ this.$router.back()
+ if (this.currentAction === 'submit') {
+ // 处理提交逻辑
+ console.log('submit form with signature:', this.form, signatureImage)
+ } else if (this.currentAction === 'batchAdd') {
+ // 处理批量新增逻辑
+ console.log('batch add with signature:', this.batchForm.count, signatureImage)
+ }
+ }
+ }
+}
+</script>
+
+<style scoped lang="less">
+.add-strain {
+ height: 100%;
+ background: #F5F7FA;
+
+ .form-card {
+ background: #fff;
+ border-radius: 8px;
+ }
+}
+
+.header-title {
+ margin-bottom: 24px;
+
+ &-left {
+ display: flex;
+ align-items: center;
+
+ img {
+ width: 20px;
+ height: 20px;
+ margin-right: 8px;
+ }
+
+ div {
+ font-size: 18px;
+ font-weight: bold;
+ color: #303133;
+ }
+ }
+}
+.end-btn{
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 10px;
+
+ button{
+ width: 180px;
+ height: 36px;
+ // background: #409EFF;
+ }
+}
+.strain-form {
+ padding: 0 40px;
+
+ .form-row {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 24px;
+ margin-bottom: 24px;
+
+ &.three-columns {
+ .el-form-item, .form-item-placeholder {
+ flex: 1;
+ min-width: 280px;
+
+ @media screen and (max-width: 1200px) {
+ min-width: calc(50% - 12px);
+ }
+
+ @media screen and (max-width: 768px) {
+ min-width: 100%;
+ }
+ }
+
+ .form-item-placeholder {
+ @media screen and (max-width: 1200px) {
+ display: none;
+ }
+ }
+ }
+
+ .el-form-item {
+ margin-bottom: 0;
+
+ &.full-width {
+ width: 100%;
+ }
+ }
+ }
+
+ :deep(.el-form-item__label) {
+ font-weight: normal;
+ color: #606266;
+ padding-bottom: 8px;
+ line-height: 20px;
+ }
+
+ :deep(.el-form-item__content) {
+ line-height: unset;
+ }
+
+ :deep(.el-input__inner) {
+ border-radius: 4px;
+ height: 36px;
+ line-height: 36px;
+ }
+
+ :deep(.el-textarea__inner) {
+ border-radius: 4px;
+ padding: 8px 12px;
+ min-height: 120px;
+ }
+}
+
+.batch-add-dialog {
+ :deep(.el-dialog__header) {
+ margin: 0;
+ padding: 20px;
+ text-align: center;
+ border-bottom: 1px solid #EBEEF5;
+
+ .el-dialog__title {
+ font-size: 16px;
+ font-weight: 600;
+ color: #303133;
+ }
+ }
+
+ :deep(.el-dialog__body) {
+ padding: 20px;
+ }
+
+ .dialog-content {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ }
+
+ .batch-form {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+
+ :deep(.el-form-item) {
+ width: 320px;
+ margin-bottom: 0;
+ }
+
+ :deep(.el-form-item__label) {
+ width: 100%;
+ color: #606266;
+ font-weight: normal;
+ padding-bottom: 8px;
+ &::before {
+ color: #F56C6C;
+ }
+ }
+
+ :deep(.el-input) {
+ width: 100%;
+ input {
+ width: 100%;
+ }
+ }
+ }
+
+ .dialog-notice {
+ margin-top: 16px;
+ text-align: center;
+ p {
+ margin: 0;
+ line-height: 22px;
+ color: #606266;
+ font-size: 14px;
+ }
+ }
+
+ :deep(.el-dialog__footer) {
+ padding: 0 20px 20px;
+ text-align: center;
+
+ .el-button {
+ width: 180px;
+ height: 36px;
+ padding: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 14px;
+ border-radius: 4px;
+ margin: 0;
+ }
+ }
+}
+
+.end-btn {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 10px;
+
+ :deep(.el-button) {
+ width: 180px;
+ height: 36px;
+ padding: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 14px;
+ border-radius: 4px;
+ margin: 0;
+ }
+}
+</style>
--
Gitblit v1.7.1