Prechádzať zdrojové kódy

授权界面 组织架构输入精确查找

like 5 mesiacov pred
rodič
commit
ce0f60f887

+ 5 - 0
snowy-admin-web/src/api/coldchain/alarmUserApi.js

@@ -33,5 +33,10 @@ export default {
 	// 点击确定获取微信用户信息
 	getwxUserInfo(data) {
 		return request('getUserInfo', data, 'get')
+	},
+
+	// 全值匹配组织名
+	getOrgByName(data) {
+		return request('getOrgByName', data, 'get')
 	}
 }

+ 34 - 16
snowy-admin-web/src/views/wx/index.vue

@@ -7,17 +7,21 @@
 
 		<a-form ref="formRef" :model="formData" :rules="formRules" layout="vertical">
 			<a-form-item label="请输入您的真实姓名" name="name">
-				<a-input v-model:value="formData.name" placeholder="请输入真实姓名" allow-clear />
+				<a-input v-model:value.trim="formData.name" placeholder="请输入真实姓名" allow-clear />
 			</a-form-item>
 
 			<a-form-item label="请选择您要绑定的组织" name="orgId">
 				<a-select
-					ref="select"
-					v-model:value="formData.orgId"
-					:options="options"
-					allowClear
-					style="width: 100%"
+					v-model:value.trim="formData.orgId"
+					show-search
 					placeholder="请选择您要绑定的组织"
+					style="width: 100%"
+					:default-active-first-option="false"
+					:show-arrow="false"
+					:filter-option="false"
+					:not-found-content="null"
+					:options="options"
+					@search="handleSearch"
 					:field-names="{ label: 'name', value: 'id' }"
 				/>
 			</a-form-item>
@@ -36,7 +40,7 @@
 	import router from '@/router'
 	import { message } from 'ant-design-vue'
 	import { required } from '@/utils/formRules'
-	import orgApi from '@/api/sys/orgApi.js'
+	import { debounce } from 'lodash-es'
 	import alarmUserApi from '@/api/coldchain/alarmUserApi'
 
 	const formData = ref({}) // 表单数据
@@ -46,25 +50,39 @@
 	// 默认要校验的
 	const formRules = {
 		name: [required('请输入您的真实姓名')],
-		orgId: [required('请选择您要绑定的组织')]
+		orgId: [required('请输入您要绑定的组织')]
 	}
 
-	const options = ref([]) //机构数据
 	const loading = ref(false) //按钮加载
+
+	const options = ref([]) //所有的组织数据
+
 	const queryObj = ref({}) //携带的参数
 
 	onMounted(() => {
-		getOrg()
 		if (Route.query.code) {
 			queryObj.value = Route.query
 		}
 	})
 
-	// 获取机构信息
-	const getOrg = () => {
-		orgApi.orgList().then((res) => {
-			options.value = res || []
-		})
+	const handleSearch = (val) => {
+		if (val) {
+			alarmUserApi
+				.getOrgByName({ orgName: val })
+				.then((res) => {
+					if (res) {
+						const data = [{ ...res }]
+						options.value = data
+					} else {
+						options.value = []
+						message.error('暂无您需要绑定的组织')
+					}
+				})
+				.catch((err) => {
+					options.value = []
+					message.error('暂无您需要绑定的组织')
+				})
+		}
 	}
 	// 确定
 	const onSubmit = () => {
@@ -97,7 +115,7 @@
 	.wx {
 		height: 100vh;
 		padding: 0 30px;
-		background-image: url('/src/assets/images/login/logo_background.png'); /* 背景图 */
+		background-image: url('/src/assets/images/login/logo_background.png');
 		background-size: cover;
 		background-position: center;