|  | @@ -1,102 +1,110 @@
 | 
	
		
			
				|  |  |  <template>
 | 
	
		
			
				|  |  | -  <el-select v-model="selectValue" :remote-method="methodStaff"
 | 
	
		
			
				|  |  | -             :style="{width: props.width}" :clearable="props.clearable" filterable
 | 
	
		
			
				|  |  | -             remote @change="changeStaff" @clear="clear"
 | 
	
		
			
				|  |  | -             ref="selectRef">
 | 
	
		
			
				|  |  | -    <el-option v-for="item in staffList" :key="item.code" :label="item.name"
 | 
	
		
			
				|  |  | -               :value="item.code ">
 | 
	
		
			
				|  |  | +  <el-select
 | 
	
		
			
				|  |  | +    v-model="selectValue"
 | 
	
		
			
				|  |  | +    :remote-method="methodStaff"
 | 
	
		
			
				|  |  | +    :style="{ width: props.width }"
 | 
	
		
			
				|  |  | +    :clearable="props.clearable"
 | 
	
		
			
				|  |  | +    filterable
 | 
	
		
			
				|  |  | +    remote
 | 
	
		
			
				|  |  | +    @change="changeStaff"
 | 
	
		
			
				|  |  | +    @clear="clear"
 | 
	
		
			
				|  |  | +    ref="selectRef"
 | 
	
		
			
				|  |  | +  >
 | 
	
		
			
				|  |  | +    <el-option
 | 
	
		
			
				|  |  | +      v-for="item in staffList"
 | 
	
		
			
				|  |  | +      :key="item.code"
 | 
	
		
			
				|  |  | +      :label="item.name"
 | 
	
		
			
				|  |  | +      :value="item.code"
 | 
	
		
			
				|  |  | +    >
 | 
	
		
			
				|  |  |        <span style="color: #8492a6; font-size: 12px">{{ item.code }}</span>
 | 
	
		
			
				|  |  |        <el-divider direction="vertical"></el-divider>
 | 
	
		
			
				|  |  | -      <span style="color:#67C23A">{{ item.name }}</span>
 | 
	
		
			
				|  |  | +      <span style="color: #67c23a">{{ item.name }}</span>
 | 
	
		
			
				|  |  |        <el-divider direction="vertical"></el-divider>
 | 
	
		
			
				|  |  | -      <span style="color:#E6A23C">{{ item.deptName }}</span>
 | 
	
		
			
				|  |  | +      <span style="color: #e6a23c">{{ item.deptName }}</span>
 | 
	
		
			
				|  |  |        <el-divider direction="vertical"></el-divider>
 | 
	
		
			
				|  |  | -      <span style="color:#a5673f">{{ item.empTitName }}</span>
 | 
	
		
			
				|  |  | +      <span style="color: #a5673f">{{ item.empTitName }}</span>
 | 
	
		
			
				|  |  |        <el-divider direction="vertical"></el-divider>
 | 
	
		
			
				|  |  | -      <span style="color:#a5673f">{{ item.ybCode }}</span>
 | 
	
		
			
				|  |  | +      <span style="color: #a5673f">{{ item.ybCode }}</span>
 | 
	
		
			
				|  |  |      </el-option>
 | 
	
		
			
				|  |  |    </el-select>
 | 
	
		
			
				|  |  |  </template>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  <script setup>
 | 
	
		
			
				|  |  | -import {getRenYuan} from "@/api/public-api";
 | 
	
		
			
				|  |  | -import {stringNotBlank} from "@/utils/blank-utils";
 | 
	
		
			
				|  |  | -import {useUserStore} from "@/pinia/user-store";
 | 
	
		
			
				|  |  | +import { getRenYuan } from "@/api/public-api";
 | 
	
		
			
				|  |  | +import { stringNotBlank } from "@/utils/blank-utils";
 | 
	
		
			
				|  |  | +import { useUserStore } from "@/pinia/user-store";
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  const props = defineProps({
 | 
	
		
			
				|  |  |    modelValue: {
 | 
	
		
			
				|  |  |      type: Object,
 | 
	
		
			
				|  |  | -    default: ''
 | 
	
		
			
				|  |  | +    default: "",
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    name: {
 | 
	
		
			
				|  |  |      type: Array,
 | 
	
		
			
				|  |  | -    default: ['code', 'name']
 | 
	
		
			
				|  |  | +    default: ["code", "name"],
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    width: {
 | 
	
		
			
				|  |  |      type: String,
 | 
	
		
			
				|  |  | -    default: '220px'
 | 
	
		
			
				|  |  | +    default: "220px",
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    clearable: {
 | 
	
		
			
				|  |  |      type: Boolean,
 | 
	
		
			
				|  |  | -    default: true
 | 
	
		
			
				|  |  | +    default: true,
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    deptCode: {
 | 
	
		
			
				|  |  |      type: Boolean,
 | 
	
		
			
				|  |  | -    default: false
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -})
 | 
	
		
			
				|  |  | +    default: false,
 | 
	
		
			
				|  |  | +  },
 | 
	
		
			
				|  |  | +});
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -const staffList = ref([])
 | 
	
		
			
				|  |  | -const selectValue = ref()
 | 
	
		
			
				|  |  | +const staffList = ref([]);
 | 
	
		
			
				|  |  | +const selectValue = ref();
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  const modelChange = () => {
 | 
	
		
			
				|  |  | -  selectValue.value = props.modelValue[props.name[0]]
 | 
	
		
			
				|  |  | +  selectValue.value = props.modelValue[props.name[0]];
 | 
	
		
			
				|  |  |    if (stringNotBlank(selectValue.value)) {
 | 
	
		
			
				|  |  |      for (let i = 0, len = staffList.value.length; i < len; i++) {
 | 
	
		
			
				|  |  |        if (selectValue.value === staffList.value[i].code) {
 | 
	
		
			
				|  |  | -        return
 | 
	
		
			
				|  |  | +        return;
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  |      getRenYuan(selectValue.value).then(res => {
 | 
	
		
			
				|  |  | -      staffList.value = res
 | 
	
		
			
				|  |  | -    })
 | 
	
		
			
				|  |  | +      staffList.value = res;
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | +};
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  onMounted(() => {
 | 
	
		
			
				|  |  | -  modelChange()
 | 
	
		
			
				|  |  | -})
 | 
	
		
			
				|  |  | +  modelChange();
 | 
	
		
			
				|  |  | +});
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | +watch(
 | 
	
		
			
				|  |  | +  () => props.modelValue[props.name[0]],
 | 
	
		
			
				|  |  | +  () => {
 | 
	
		
			
				|  |  | +    modelChange();
 | 
	
		
			
				|  |  | +  }
 | 
	
		
			
				|  |  | +);
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -watch(() => props.modelValue[props.name[0]], () => {
 | 
	
		
			
				|  |  | -  modelChange()
 | 
	
		
			
				|  |  | -})
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -let deptCode = props.deptCode ? useUserStore().userInfo.deptCode : ''
 | 
	
		
			
				|  |  | -const methodStaff = (val) => {
 | 
	
		
			
				|  |  | +let deptCode = props.deptCode ? useUserStore().userInfo.deptCode : "";
 | 
	
		
			
				|  |  | +const methodStaff = val => {
 | 
	
		
			
				|  |  |    if (val.length === 0) {
 | 
	
		
			
				|  |  | -    return
 | 
	
		
			
				|  |  | +    return;
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |    getRenYuan(val, deptCode).then(res => {
 | 
	
		
			
				|  |  | -    staffList.value = res
 | 
	
		
			
				|  |  | +    staffList.value = res;
 | 
	
		
			
				|  |  |    });
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | +};
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -const selectRef = ref()
 | 
	
		
			
				|  |  | +const selectRef = ref();
 | 
	
		
			
				|  |  |  const changeStaff = async () => {
 | 
	
		
			
				|  |  | -  await nextTick()
 | 
	
		
			
				|  |  | -  props.modelValue[props.name[0]] = selectRef.value?.selected?.value
 | 
	
		
			
				|  |  | -  props.modelValue[props.name[1]] = selectRef.value?.selected?.currentLabel
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | +  await nextTick();
 | 
	
		
			
				|  |  | +  props.modelValue[props.name[0]] = selectRef.value?.selected?.value;
 | 
	
		
			
				|  |  | +  props.modelValue[props.name[1]] = selectRef.value?.selected?.currentLabel;
 | 
	
		
			
				|  |  | +};
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  const clear = () => {
 | 
	
		
			
				|  |  | -  selectValue.value = ''
 | 
	
		
			
				|  |  | -  props.modelValue[props.name[0]] = ''
 | 
	
		
			
				|  |  | -  props.modelValue[props.name[1]] = ''
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | +  selectValue.value = "";
 | 
	
		
			
				|  |  | +  props.modelValue[props.name[0]] = "";
 | 
	
		
			
				|  |  | +  props.modelValue[props.name[1]] = "";
 | 
	
		
			
				|  |  | +};
 | 
	
		
			
				|  |  |  </script>
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -<style lang="scss" scoped>
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -</style>
 |