Merge branch 'main' of http://120.76.84.145:10101/gitblit/r/H5/leshan-labor...

13404089107

2025-05-28 a60dc30be50598fe2d1acb42f8171ec69e37b436

 culture/src/views/pedigree-chart/progenitorComponents/AddSublevelForm.vue

@@ -1,167 +1,218 @@
<template>
    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="40%" @close="closeDialog"
        :close-on-click-modal="false">
        <el-form :model="form" :rules="rules" ref="form" label-position="top">
            <el-row :gutter="20">
                <el-col :span="10">
                    <el-form-item label="接种操作人" prop="thisName">
                        <el-input disabled v-model="form.thisName"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="接种操作时间" prop="thisTime">
                        <el-input disabled v-model="form.thisTime"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="传代菌种编号" prop="strainNo">
                        <el-input disabled v-model="form.inoculateNo"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="传代菌种名称" prop="strainName">
                        <el-input disabled v-model="form.inoculateName"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="接种菌种编号" prop="inoculateNo">
                        <el-input :disabled="!dialogTitle.includes('新增')" v-model="form.num"
                            placeholder="请输入"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="接种菌种名称" prop="inoculateName">
                        <el-input :disabled="!dialogTitle.includes('新增')" v-model="form.name"
                            placeholder="请输入"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-form-item label="保存/废弃" required>
                <div class="flex-row">
                    <div @click="handleStatus('save')" :class="form.isDiscarded && 'active'">保存</div>
                    <div @click="handleStatus('discard')" :class="!form.isDiscarded && 'active'">废弃</div>
                </div>
            </el-form-item>
            <el-row :gutter="20">
                <el-col :span="10">
                    <el-form-item v-if="!form.isDiscarded" label="废弃原因说明" required>
                        <el-input :disabled="!dialogTitle.includes('新增')" v-model="form.discardReason"
                            placeholder="请输入"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="20">
                <el-col :span="10">
                    <el-form-item label="菌种入库时间" prop="inTime">
                        <el-input disabled v-model="form.inTime"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row v-if="!dialogTitle.includes('新增')" :gutter="20">
                <el-col :span="10">
                    <el-form-item label="接种操作人签字">
                        <el-image />
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="菌种保藏人签字">
                        <el-image />
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <div v-if="dialogTitle.includes('新增')" class="dialog-footer">
            <el-button type="primary" @click="handleSubmit">提交</el-button>
  <el-dialog
    :title="dialogTitle"
    :visible.sync="dialogVisible"
    width="40%"
    @close="closeDialog"
    :close-on-click-modal="false"
  >
    <el-form :model="form" :rules="rules" ref="form" label-position="top">
      <el-row :gutter="20">
        <el-col :span="10">
          <el-form-item label="接种操作人" prop="thisName">
            <el-input disabled v-model="form.thisName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="接种操作时间" prop="thisTime">
            <el-input disabled v-model="form.thisTime"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="传代菌种编号" prop="strainCode1">
            <el-input disabled v-model="form.strainCode1"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="传代菌种名称" prop="strainName1">
            <el-input disabled v-model="form.strainName1"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="接种菌种编号" prop="strainCode">
            <el-input
              :disabled="!dialogTitle.includes('新增')"
              v-model="form.strainCode"
              placeholder="请输入"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="接种菌种名称" prop="strainName">
            <el-input
              :disabled="!dialogTitle.includes('新增')"
              v-model="form.strainName"
              placeholder="请输入"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="保存/废弃" required>
        <div class="flex-row">
          <div @click="handleStatus(1)" :class="form.status === 1 && 'active'">
            保存
          </div>
          <div @click="handleStatus(2)" :class="form.status === 2 && 'active'">
            废弃
          </div>
        </div>
    </el-dialog>
      </el-form-item>
      <el-row :gutter="20">
        <el-col :span="10">
          <el-form-item
            v-if="form.status === 2"
            label="废弃原因说明"
            prop="remark"
          >
            <el-input
              :disabled="!dialogTitle.includes('新增')"
              v-model="form.remark"
              placeholder="请输入"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="10">
          <el-form-item label="菌种入库时间" prop="confirmTime">
            <el-input disabled v-model="form.confirmTime"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="!dialogTitle.includes('新增')" :gutter="20">
        <el-col v-if="form.vaccinateSignature" :span="10">
          <el-form-item label="接种操作人签字">
            <el-image :src="form.vaccinateSignature" />
          </el-form-item>
        </el-col>
        <el-col v-if="form.preserveSignature" :span="10">
          <el-form-item label="菌种保藏人签字">
            <el-image :src="form.preserveSignature" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div v-if="dialogTitle.includes('新增')" class="dialog-footer">
      <el-button type="primary" @click="handleSubmit">提交</el-button>
    </div>
  </el-dialog>
</template>
<script>
export default {
    data() {
        return {
            dialogVisible: false,
            dialogTitle: '',
            form: {
                isDiscarded: true
            },
            rules: {
                isDiscarded: [
                    { required: true, message: '请选择废弃状态', trigger: 'blur' }
                ],
                inoculateNo: [
                    { required: true, message: '请输入接种菌种编号', trigger: 'blur' }
                ],
                inoculateName: [
                    { required: true, message: '请输入接种菌种名称', trigger: 'blur' }
                ],
            },
        }
  data() {
    return {
      dialogVisible: false,
      dialogTitle: "",
      form: {
        status: 1,
      },
      rules: {
        status: [
          { required: true, message: "请选择废弃状态", trigger: "blur" },
        ],
        strainCode: [
          { required: true, message: "请输入接种菌种编号", trigger: "blur" },
        ],
        strainName: [
          { required: true, message: "请输入接种菌种名称", trigger: "blur" },
        ],
        remark: [
          { required: true, message: "请输入废弃原因", trigger: "blur" },
        ],
      },
    };
  },
  methods: {
    openInitData(value) {
      console.log(value);

      this.dialogTitle = value.title;
      // 获取用户信息
      const userInfo = JSON.parse(sessionStorage.getItem("userInfo") || "{}");
      // 获取当前时间并格式化
      const now = new Date();
      const formatTime = `${now.getFullYear()}-${String(
        now.getMonth() + 1
      ).padStart(2, "0")}-${String(now.getDate()).padStart(2, "0")} ${String(
        now.getHours()
      ).padStart(2, "0")}:${String(now.getMinutes()).padStart(2, "0")}:${String(
        now.getSeconds()
      ).padStart(2, "0")}`;

      this.form = {
        ...this.form,
        ...value.form,
        thisName: userInfo.nickName || "",
        thisTime: value.form.vaccinateTime
          ? value.form.vaccinateTime
          : formatTime,
        type: 1,
      };
      this.dialogVisible = true;
    },
    methods: {
        openInitData(value) {
            this.dialogTitle = value.title
            this.form = value.form
            this.dialogVisible = true
        },
        closeDialog() {
            this.dialogVisible = false
        },
        handleSubmit() {
            this.$emit('addNodeSign', this.form, 3)
        },
        handleStatus(status) {
            if (!this.dialogTitle.includes('新增')) return
            this.form.isDiscarded = status === 'save'
            this.$forceUpdate()
    closeDialog() {
      this.dialogVisible = false;
    },
    handleSubmit() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.$emit("addNodeSign", this.form, 3);
        }
    }
}
      });
    },
    handleStatus(status) {
      if (!this.dialogTitle.includes("新增")) return;
      this.form.status = status;
      this.$forceUpdate();
    },
  },
};
</script>

<style scoped lang="less">
.dialog-footer {
    margin-top: 39px;
    display: flex;
    justify-content: center;
  margin-top: 39px;
  display: flex;
  justify-content: center;

    .el-button--primary {
        width: 150px;
        height: 40px;
        background: #049C9A;
        border-radius: 4px;
    }
  .el-button--primary {
    width: 150px;
    height: 40px;
    background: #049c9a;
    border-radius: 4px;
  }
}

.flex-row {
    width: 370px;
    display: flex;
    align-items: center;
    font-size: 16px;
    color: #333333;
    padding: 4px;
  width: 370px;
  display: flex;
  align-items: center;
  font-size: 16px;
  color: #333333;
  padding: 4px;
  border-radius: 10px;
  border: 2px solid rgba(4, 156, 154, 0.5);
  font-family: "PingFangSCRegular";

  .flex-row-save {
    background: #049c9a;
    color: #fff;
  }

  div {
    width: 183px;
    height: 32px;
    text-align: center;
    flex-shrink: 0;
    cursor: pointer;
  }

  .active {
    font-family: "SourceHanSansCN-Medium";
    color: #049c9a;
    background: #ebfefd;
    box-shadow: 0px 0px 6px 0px rgba(10, 109, 108, 0.25);
    border-radius: 10px;
    border: 2px solid rgba(4, 156, 154, 0.5);
    font-family: 'PingFangSCRegular';

    .flex-row-save {
        background: #049C9A;
        color: #fff;
    }

    div {
        width: 183px;
        height: 32px;
        text-align: center;
        flex-shrink: 0;
        cursor: pointer;
    }

    .active {
        font-family: 'SourceHanSansCN-Medium';
        color: #049C9A;
        background: #EBFEFD;
        box-shadow: 0px 0px 6px 0px rgba(10, 109, 108, 0.25);
        border-radius: 10px;
    }
  }
}
</style>