feat(企业检索): 添加企业搜索功能并优化选择器交互

添加企业搜索API接口和防抖工具函数
重构企业检索选择器为远程搜索模式

src/api/api.ts

@@ -214,7 +214,6 @@ export const getNewsInfo = (params: any, headers?: any) => {
 		method: 'get',
 		params,
 		headers,
-
 	});
 };
 
@@ -283,7 +282,6 @@ export const getIndustryHierarchy = (params?: any) => {
 	});
 };
 
-
 export const getTagConcept = (params?: any) => {
 	return request({
 		url: '/tag/concept',
@@ -312,7 +310,8 @@ export const doRecover = (data?: any) => {
 export const doNewSubmit = (data?: any) => {
 	return request({
 		url: '/news/submit',
-		method: 'post', data
+		method: 'post',
+		data,
 	});
 };
 
@@ -329,7 +328,7 @@ export const doNewLog = (params?: any) => {
 	return request({
 		url: '/news/log',
 		method: 'get',
-		params
+		params,
 	});
 };
 
@@ -338,7 +337,7 @@ export const doNewCheck = (params?: any) => {
 	return request({
 		url: '/news/check',
 		method: 'post',
-		params
+		params,
 	});
 };
 
@@ -347,7 +346,7 @@ export const doNewReturn = (params?: any) => {
 	return request({
 		url: '/news/return',
 		method: 'post',
-		params
+		params,
 	});
 };
 
@@ -356,6 +355,14 @@ export const getSignalRules = (params?: any) => {
 	return request({
 		url: '/news/getSignalRulesList',
 		method: 'get',
-		params
+		params,
+	});
+};
+
+export const searchCompany = (params?: any) => {
+	return request({
+		url: '/news/getCompanyNames',
+		method: 'get',
+		params,
 	});
 };

src/utils/Utils.ts

@@ -1,8 +1,18 @@
 // 工具函数：判断是否为移动设备（基于屏幕宽度）
 export const isMobileByWidth = (): boolean => {
-    if (typeof window === 'undefined') {
-        return false; // 非浏览器环境
-    }
-    // 通常以 768px 作为移动设备的宽度阈值
-    return window.innerWidth < 768;
-};
+	if (typeof window === 'undefined') {
+		return false; // 非浏览器环境
+	}
+	// 通常以 768px 作为移动设备的宽度阈值
+	return window.innerWidth < 768;
+};
+/* 防抖 */
+export function debounce(fn, delay) {
+	let timer = null;
+	return function () {
+		clearTimeout(timer);
+		timer = setTimeout(() => {
+			fn.apply(this, arguments);
+		}, delay);
+	};
+}

src/views/pages/richedit/all.vue

@@ -129,17 +129,23 @@
 						/>
 						<span>企业检索：</span>
 						<el-select
+							class="search-input"
+							popper-class="option-box"
 							v-model="form.companyName"
 							clearable
-							placeholder="请选择"
-							multiple
-							size="large"
-							style="width: 180px"
 							filterable
-							@change="handleSearch"
+							remote
+							reserve-keyword
+							remote-show-suffix
+							default-first-option
+							:suffix-icon="Search"
+							placeholder="输入企业名称/企业简称/证券编码进行搜索"
+							:loading="loading"
+							:remote-method="getCompany"
+							@change="getData"
+							style="width: 180px"
 						>
-							<el-option>是</el-option>
-							<el-option>否</el-option>
+							<el-option v-for="item in companyList" :key="item.companyName" :label="item.companyName" :value="item.companyName"> </el-option>
 						</el-select>
 
 						<span>独家资源：</span>
@@ -438,6 +444,7 @@ import {
 	getTagSource,
 	getSignalRules,
 	doRecover,
+	searchCompany,
 } from '/@/api/api';
 import { highlightTitle } from '/@/utils/highlight';
 import clipboard from 'clipboard';
@@ -892,6 +899,28 @@ function signalChange(event, type) {
 	getData();
 }
 
+import { debounce } from '/@/utils/utils';
+
+const companyList = ref([]);
+const getCompany = debounce(async (val: string) => {
+	if (!val) {
+		return;
+	}
+	let { code, data } = await searchCompany({
+		companyName: val,
+	});
+
+	if (code == 200) {
+		companyList.value = data;
+		// data.forEach((item) => {
+		// 	companyList.value.push({
+		// 		label: item.companyName,
+		// 		value: item.companyName,
+		// 	});
+		// });
+	}
+}, 500);
+
 // 页面加载时
 onMounted(async () => {
 	if (isMobileByWidth() && Session.get('userInfoLocal').userType == '01') {

src/views/pages/richedit/index.vue

@@ -240,7 +240,7 @@
 							@change="handleSearch"
 						/>
 						<span>企业检索：</span>
-						<el-select
+						<!-- <el-select
 							v-model="form.companyName"
 							clearable
 							placeholder="请选择"
@@ -252,6 +252,26 @@
 						>
 							<el-option>是</el-option>
 							<el-option>否</el-option>
+						</el-select> -->
+
+						<el-select
+							class="search-input"
+							popper-class="option-box"
+							v-model="form.companyName"
+							clearable
+							filterable
+							remote
+							reserve-keyword
+							remote-show-suffix
+							default-first-option
+							:suffix-icon="Search"
+							placeholder="输入企业名称/企业简称/证券编码进行搜索"
+							:loading="loading"
+							:remote-method="getCompany"
+							@change="getData"
+							style="width: 180px"
+						>
+							<el-option v-for="item in companyList" :key="item.companyName" :label="item.companyName" :value="item.companyName"> </el-option>
 						</el-select>
 
 						<span>独家资源：</span>
@@ -623,6 +643,7 @@ import DetailDrawer from './DetailDrawer/index.vue';
 import {
 	doNewRevoke,
 	doNewSubmit,
+	searchCompany,
 	getNews,
 	doNewsPublish,
 	doDeleteNews,
@@ -1122,6 +1143,28 @@ function signalChange(event, type) {
 	getData();
 }
 
+import { debounce } from '/@/utils/utils';
+
+const companyList = ref([]);
+const getCompany = debounce(async (val: string) => {
+	if (!val) {
+		return;
+	}
+	let { code, data } = await searchCompany({
+		companyName: val,
+	});
+
+	if (code == 200) {
+		companyList.value = data;
+		// data.forEach((item) => {
+		// 	companyList.value.push({
+		// 		label: item.companyName,
+		// 		value: item.companyName,
+		// 	});
+		// });
+	}
+}, 500);
+
 // 页面加载时
 onMounted(async () => {
 	if (isMobileByWidth() && (Session.get('userInfoLocal').userType == '01' || Session.get('userInfoLocal').userType == '02')) {