样式调整

GuLiMmo

2024-01-19 ac1391e1605f4a03cee03f3be2913b8e1997aa2e

 src/views/assessment/components/addAssessor.vue

@@ -1,9 +1,10 @@
<template>
    <el-dialog v-model="props.dialogParams.visible" :title="curType ? '添加被考核部门': '添加被考核人' " @close="dialogClose">
    <el-dialog v-model="props.dialogParams.visible" :title="curType ? '添加被考核部门' : '添加被考核人'" @close="dialogClose">
        <div style="margin-bottom: 20px;" v-if="!form.deptId">
            <el-alert title="请先选择部门信息" type="warning" />
        </div>
        <el-form :model="form" ref="formRef" :rules="rules" label-width="70px">
        <el-form :model="form" ref="formRef" :rules="rules" label-width="80px" v-loading="isLoading"
            element-loading-text="数据加载中，请稍后。。。">
            <el-row>
                <el-col :span="!curType ? 12 : 24">
                    <el-form-item label="部门" prop="deptId">
@@ -12,13 +13,15 @@
                    </el-form-item>
                </el-col>
                <el-col :span="12" v-if="!curType">
                    <el-form-item label="候选人" prop="userId">
                        <el-select v-model="form.userId" placeholder="请选择候选人"
                            :disabled="userSelectOption.length > 0 ? false : true" @change="userSelectChange"
                    <el-form-item label="被候选人" prop="userId">
                        <el-select v-model="form.userId" placeholder="请选择被候选人"
                            :disabled="isLoading || userSelectOption.length > 0 ? false : true" @change="userSelectChange"
                            style="width: 100%;">
                            <el-option v-for="item in userSelectOption" :label="item.name" :key="item.id"
                                :value="item.id" />
                            <div class="loading-more" @click="loadMore">{{ loadingMoreText }}</div>
                            <div v-loading="isLoading" element-loading-text="数据加载中，请稍后。。。">
                                <el-option v-for="item in userSelectOption" :label="item.name" :key="item.id"
                                    :value="item.id" />
                                <div class="loading-more" @click="loadMore">{{ loadingMoreText }}</div>
                            </div>
                        </el-select>
                    </el-form-item>
                </el-col>
@@ -31,7 +34,7 @@
        </el-form>
        <template #footer>
            <el-button @click="() => props.dialogParams.visible = false">取消</el-button>
            <el-button type="primary" @click="submit">确定</el-button>
            <el-button type="primary" @click="submit" :loading="isLoading">确定</el-button>
        </template>
    </el-dialog>
</template>
@@ -51,6 +54,8 @@
})

const emits = defineEmits(['refresh'])

const isLoading = ref(true)

const curType = ref()

@@ -130,6 +135,7 @@
})

const loadMore = async () => {
    if (userSelectOption.value.length >= page.total) return ElMessage.warning('数据已全部加载完毕，请勿重复点击！！')
    isOptionsLoading.value = true
    page.current += 1
    const res = await initUserList(currentDeptId.value)
@@ -140,11 +146,13 @@
// 初始化部门数据
const initDept = async (parentId) => {
    const deptResult = await getDeptLazyTree(parentId)
    isLoading.value = false
    return deptResult.data.data
}

// 初始化用户列表
const initUserList = (deptId) => {
    isLoading.value = true
    return getList(
        page.current,
        page.size,
@@ -154,6 +162,7 @@
        deptId,
    ).then(res => {
        page.total = res.data.data.total
        isLoading.value = false
        return res.data.data.records
    })
}
@@ -163,9 +172,12 @@
const deptChange = async (value) => {
    const id = value[value.length - 1]
    currentDeptId.value = id
    form.userId = ''
    page.current = 1
    if (!curType.value) {
        const userList = await initUserList(id)
        userSelectOption.value = userList
        if (userList.length <= 0) ElMessage.warning('当前部门人员为空，请选择其他部门！！')
    } else {
        const dept = deptList.value.find(item => item.id == id)
        requestSectionParams.deptId = dept.value || ''