reactor:对接随手拍安全志愿者;

src/views/snapshot/config/safe/components/Safe-add.vue

@@ -2,11 +2,19 @@
 	<el-dialog v-model="state.dialogVisible" draggable title="新增安全志愿者" destroy-on-close append-to-body @close="close">
 		<el-form :model="state.ruleForm" label-width="100px" ref="ruleFormRef">
 			<el-form-item label="志愿者类型" prop="safetyTypeId" :rules="[{ required: true, message: '请选择志愿者类型', trigger: 'change' }]">
-				<el-select v-model="state.ruleForm.safetyTypeId" class="w100" placeholder="请选择志愿者类型">
+				<el-select v-model="state.ruleForm.safetyTypeId" class="w100" placeholder="请选择志愿者类型" @change="queryList" clearable>
 					<el-option v-for="item in statusOptions" :key="item.id" :label="item.name" :value="item.id" />
 				</el-select>
 			</el-form-item>
 			<el-form-item label="关联人员" prop="citizenIds" :rules="[{ required: false, message: '请选择关联人员', trigger: 'change' }]">
+				<template #label>
+					<p class="flex-center-align">
+						关联人员
+						<el-tooltip content="请先选择志愿者类型,再查询关联人员列表" placement="top-start" trigger="hover">
+							<SvgIcon name="ele-QuestionFilled" class="ml3"></SvgIcon>
+						</el-tooltip>
+					</p>
+				</template>
 				<vxe-grid ref="gridRef" v-bind="gridOptions" v-on="gridEvents" class="w100">
 					<template #form>
 						<el-row class="mb20" :gutter="20">
@@ -57,7 +65,6 @@ const state = reactive<any>({
 		// 查询参数
 		PageIndex: 1,
 		PageSize: 20,
-		citizenNPhoneNumberame: null, // 关联人员
 	},
 	total: 0, // 总条数
 	ruleForm: {
@@ -75,9 +82,8 @@ const getStatusOptions = () => {
 };
 // 打开弹窗
 const ruleFormRef = ref<RefType>();
-const openDialog = async () => {
-	await getStatusOptions();
-	await queryList();
+const openDialog = () => {
+	getStatusOptions();
 	state.dialogVisible = true;
 };
 /** 搜索按钮操作 节流操作 */
@@ -87,9 +93,14 @@ const handleQuery = () => {
 };
 // 获取参数列表
 const queryList = () => {
+	if (!state.ruleForm.safetyTypeId) {
+		gridOptions.data = [];
+		state.total = 0;
+		return;
+	}
 	gridOptions.loading = true;
 	// 发送请求获取数据
-	searchSafetyVolunteer(state.queryParams)
+	searchSafetyVolunteer({ ...state.queryParams, safetyTypeId: state.ruleForm.safetyTypeId })
 		.then((res) => {
 			gridOptions.data = res.result.items ?? [];
 			state.total = res.result.total ?? 0;