97 lines
2.3 KiB
Vue
97 lines
2.3 KiB
Vue
|
<template>
|
||
|
|
<div class="detail-container">
|
||
|
|
<el-form
|
||
|
|
ref="formRef"
|
||
|
|
label-position="right"
|
||
|
|
label-width="150px"
|
||
|
|
style="max-height: 60vh; overflow-y: auto; padding-right: 50px"
|
||
|
|
>
|
||
|
|
<el-form-item label="人员:">
|
||
|
|
<el-select
|
||
|
|
v-model="ryxx"
|
||
|
|
filterable
|
||
|
|
remote
|
||
|
|
reserve-keyword
|
||
|
|
placeholder="输入人员名称 / 联系方式 查询"
|
||
|
|
:remote-method="remoteMethod"
|
||
|
|
:loading="loading"
|
||
|
|
@change="handleSelect"
|
||
|
|
value-key="userId"
|
||
|
|
>
|
||
|
|
<el-option
|
||
|
|
v-for="item in selectOptions"
|
||
|
|
:key="item.userId"
|
||
|
|
:label="item.realName"
|
||
|
|
:value="item"
|
||
|
|
/>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="岗位:">
|
||
|
|
<el-input v-model="form.gw" />
|
||
|
|
</el-form-item>
|
||
|
|
|
||
|
|
<el-form-item label="养护站:">
|
||
|
|
<el-input disabled v-model="yhzdata.mc" />
|
||
|
|
</el-form-item>
|
||
|
|
|
||
|
|
<el-form-item label="人员角色:">
|
||
|
|
<el-select v-model="form.ryjs" placeholder="请选择人员角色">
|
||
|
|
<el-option label="负责人" value="1"></el-option>
|
||
|
|
<el-option label="普通工作人员" value="2"></el-option>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import { ref, onMounted, watch } from "vue";
|
||
|
|
const formRef = ref(null);
|
||
|
|
defineExpose({ formRef });
|
||
|
|
|
||
|
|
const props = defineProps({
|
||
|
|
form: {
|
||
|
|
type: Object,
|
||
|
|
default: () => ({}),
|
||
|
|
},
|
||
|
|
getUserList: {
|
||
|
|
type: Function,
|
||
|
|
default: () => () => {},
|
||
|
|
},
|
||
|
|
yhzdata: {
|
||
|
|
type: Object,
|
||
|
|
default: () => ({}),
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
const ryxx = ref("");
|
||
|
|
const loading = ref(false);
|
||
|
|
const selectOptions = ref([]);
|
||
|
|
// 选择人员筛选
|
||
|
|
const remoteMethod = async (query) => {
|
||
|
|
loading.value = true;
|
||
|
|
const res = await props.getUserList(query);
|
||
|
|
if (res) {
|
||
|
|
selectOptions.value = res;
|
||
|
|
}
|
||
|
|
loading.value = false;
|
||
|
|
};
|
||
|
|
|
||
|
|
// 选择人员
|
||
|
|
const handleSelect = (value) => {
|
||
|
|
props.form.xm = value.realName;
|
||
|
|
props.form.sjhm = value.phone;
|
||
|
|
props.form.userId = value.userId;
|
||
|
|
};
|
||
|
|
|
||
|
|
onMounted(async () => {
|
||
|
|
const res = await props.getUserList();
|
||
|
|
if (res) {
|
||
|
|
selectOptions.value = res;
|
||
|
|
}
|
||
|
|
props.form.yhzid = props.yhzdata.id
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
</style>
|