From cbb23429b8beed72b58cbb57f9b3c56a0fb2b5d2 Mon Sep 17 00:00:00 2001 From: 马宇豪 <978517621@qq.com> Date: 星期五, 09 五月 2025 13:31:26 +0800 Subject: [PATCH] 修改 --- src/views/experiment/project/components/selectPerson.vue | 54 ++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 40 insertions(+), 14 deletions(-) diff --git a/src/views/experiment/project/components/selectPerson.vue b/src/views/experiment/project/components/selectPerson.vue index e0359b8..268b8c7 100644 --- a/src/views/experiment/project/components/selectPerson.vue +++ b/src/views/experiment/project/components/selectPerson.vue @@ -1,7 +1,7 @@ <template> <tr class="m-color b-font" style="text-align: center">实验人员</tr> <tr> - <td class="w-14 m-color">姓名</td> + <td class="w-14 m-color required">姓名</td> <td class="w-14 m-color">年龄</td> <td class="w-14 m-color">性别</td> <td class="w-14 m-color">专业</td> @@ -11,7 +11,7 @@ </tr> <tr v-for="(item,index) in selectPersonState.personList" :key="index"> <td class="w-14"> - <el-select filterable :disabled="selectPersonState.disabled" v-model="item.personId" @change="giveOtherPersonValue($event, index)"> + <el-select filterable :disabled="selectPersonState.disabled" v-model="item.personId" @change="giveOtherPersonValue($event, index)" @focus="checkAllPerson($event, index)"> <el-option v-for="item in selectPersonState.allPersonList" :key="item.id" @@ -22,33 +22,38 @@ </el-select> </td> <td class="w-14"> - <el-input :disabled="selectPersonState.disabled" v-model="item.personAge" /> + <el-input disabled v-model="item.personAge" /> </td> <td class="w-14"> - <el-input :disabled="selectPersonState.disabled" v-model="item.personGender" /> +<!-- <el-input disabled v-model="item.personGender" />--> + <div>{{item.personGender == 1 ? '男' : item.personGender == 2 ? '女' : ''}}</div> </td> <td class="w-14"> - <el-input :disabled="selectPersonState.disabled" v-model="item.personMajor" /> + <el-input disabled v-model="item.personMajor" /> </td> <td class="w-14"> - <el-input :disabled="selectPersonState.disabled" v-model="item.depName" /> + <el-input disabled v-model="item.depName" /> </td> <td class="w-14"> - <el-input :disabled="selectPersonState.disabled" v-model="item.aptitude" /> + <el-input disabled v-model="item.aptitude" /> </td> <td class="w-14"> <el-button type="danger" :disabled="selectPersonState.disabled" @click="deletePersonItem(index)">删除</el-button> </td> </tr> - <tr style="text-align: center"> - <el-button :disabled="selectPersonState.disabled" type="primary" shape="round" @click="addPersonItem()"> - 选择实验人员 + <tr style="text-align: center" v-if="!selectPersonState.disabled"> + <el-button type="primary" shape="round" @click="addPersonItem()"> + 添加现有实验人员 + </el-button> + <el-button shape="round" @click="addNewPerson('新增', {})"> + 新增实验人员配置 </el-button> </tr> + <person-dialog ref="personDialogRef"></person-dialog> </template> <script setup lang="ts"> -import {nextTick, onMounted, reactive, watchEffect} from "vue"; +import {defineAsyncComponent, nextTick, onMounted, reactive, ref, watchEffect} from "vue"; import { personApi } from "/@/api/basic/person"; import {ElMessage} from "element-plus"; @@ -58,12 +63,16 @@ }); +const personDialog = defineAsyncComponent(() => import('/@/views/basic/person/components/personDialog.vue')); + const selectPersonState = reactive<SelectPersonType>({ disabled: false, personList: [], allPersonList: [ ], }); + +const personDialogRef = ref(); watchEffect(() => { selectPersonState.personList = props.data as Array<AllPersonListType> @@ -73,6 +82,14 @@ const addPersonItem = () => { selectPersonState.personList.push({personId: null, personName: null, personAge: null, personGender:'',personMajor:'',depName:'',phone:'',aptitude:'',training:''}); }; + +const addNewPerson = (title: string, value: PersonType) => { + personDialogRef.value.showPersonDialog(title, value); +} + +const checkAllPerson = () => { + getAllPersonList() +} const deletePersonItem = (index: number) => { selectPersonState.personList.splice(index,1); @@ -162,6 +179,18 @@ border-right: none; } + &.required { + &::before { + content: "*"; + display: inline-block; + color: red; + } + } + + :deep(.el-input__wrapper ){ + box-shadow: none; + } + &.w-14 { width: calc((100/7)/100 * 100%); } @@ -211,8 +240,5 @@ .m-color { color: #0c4995; -} -:deep(.el-input__wrapper ){ - box-shadow: none; } </style> -- Gitblit v1.9.2