结果页面搜索项优化

This commit is contained in:
zhuangdashia 2025-09-25 14:42:01 +08:00
parent e7c0c72b4f
commit c70968ecd2
5 changed files with 247 additions and 142 deletions

View File

@ -1,9 +1,13 @@
<script setup lang="ts">
import { onMounted, ref } from 'vue';
import { fetchGetSubcategorySelect } from '@/service/api/business/subcategory';
import { useAuthStore } from '@/store/modules/auth';
import { useNaiveForm } from '@/hooks/common/form';
import { $t } from '@/locales';
import { useDict } from '@/hooks/business/dict';
import {fetchGetSubcategorySelect} from "@/service/api/business/subcategory";
import { $t } from '@/locales';
import {fetchGetDeptTree} from "@/service/api/system";
import {useLoading} from "~/packages/hooks";
defineOptions({
name: 'DetailEntrySearch'
});
@ -17,7 +21,6 @@ const emit = defineEmits<Emits>();
const { formRef, validate, restoreValidation } = useNaiveForm();
const model = defineModel<Api.Mps.DetailEntrySearchParams>('model', { required: true });
const { options: mpsCustTypeOptions } = useDict('mps_cust_type');
@ -50,6 +53,20 @@ async function search() {
await validate();
emit('search');
}
const {loading: deptLoading ,startLoading: startDeptLoading, endLoading: endDeptLoading } = useLoading();
const { userInfo } = useAuthStore();
const deptData = ref<Api.Common.CommonTreeRecord>([]);
async function getDeptData() {
startDeptLoading();
const { data: tree, error } = await fetchGetDeptTree();
if (!error) {
deptData.value = tree;
}
endDeptLoading();
}
if(userInfo.roles.includes('operation')){
getDeptData();
}
</script>
<template>
@ -61,6 +78,7 @@ async function search() {
<!-- <NFormItemGi span="24 s:12 m:6" label="业务类型id" path="subcategoryId" class="pr-24px">-->
<!-- <NInput v-model:value="model.subcategoryId" placeholder="请输入业务类型id" />-->
<!-- </NFormItemGi>-->
<NFormItemGi span="24 s:12 m:6" label="业务名称" path="subcategoryName" class="pr-24px">
<!-- <NInput v-model:value="model.subcategoryName" placeholder="请输入业务类型名称" />-->
<NSelect
@ -71,27 +89,57 @@ async function search() {
clearable
/>
</NFormItemGi>
<NFormItemGi
v-if="userInfo.roles.includes('operation')"
:loading="deptLoading"
span="24 s:12 m:6"
label="部门名称"
path="deptName"
class="pr-24px"
>
<NTreeSelect
v-model:value="model.deptId"
clearable
:options="deptData as []"
label-field="label"
key-field="id"
:default-expanded-keys="deptData?.length ? [deptData[0].id] : []"
placeholder="请选择部门名称"
/>
</NFormItemGi>
<!-- <NFormItemGi span="24 s:12 m:6" label="营销人员名称" path="yxName" class="pr-24px">-->
<!-- <NInput v-model:value="model.yxName" placeholder="请输入营销人员名称" />-->
<!-- </NFormItemGi>-->
<!-- <NFormItemGi span="24 s:12 m:6" label="经办人员名称" path="jbName" class="pr-24px">-->
<!-- <NInput v-model:value="model.jbName" placeholder="请输入经办人员名称" />-->
<!-- </NFormItemGi>-->
<NFormItemGi
v-if="userInfo.roles.includes('operation')"
span="24 s:12 m:6"
label="经办人员"
path="jbName"
class="pr-24px"
>
<NInput v-model:value="model.jbName" placeholder="请输入经办人员名称" />
</NFormItemGi>
<!-- <NFormItemGi span="24 s:12 m:6" label="营销人员营销号" path="yxId" class="pr-24px">-->
<!-- <NInput v-model:value="model.yxId" placeholder="请输入营销人员营销号" />-->
<!-- </NFormItemGi>-->
<NFormItemGi span="24 s:12 m:6" label="营销号" path="jbId" class="pr-24px">
<NFormItemGi
v-if="userInfo.roles.includes('operation')"
span="24 s:12 m:6"
label="营销号"
path="jbId"
class="pr-24px"
>
<NInput v-model:value="model.jbId" placeholder="请输入经办人员营销号" />
</NFormItemGi>
<!-- <NFormItemGi span="24 s:12 m:6" label="数据日期" path="date" class="pr-24px">-->
<!-- <NDatePicker-->
<!-- v-model:formatted-value="model.date"-->
<!-- type="datetime"-->
<!-- value-format="yyyy-MM-dd HH:mm:ss"-->
<!-- clearable-->
<!-- />-->
<!-- </NFormItemGi>-->
<NFormItemGi span="24 s:12 m:6" label="数据日期" path="date" class="pr-24px">
<NDatePicker
v-model:formatted-value="model.date"
type="datetime"
value-format="yyyy-MM-dd"
clearable
/>
</NFormItemGi>
<!-- <NFormItemGi span="24 s:12 m:6" label="部门名称" path="deptName" class="pr-24px">-->
<!-- <NInput v-model:value="model.deptName" placeholder="请输入部门名称" />-->
<!-- </NFormItemGi>-->
@ -150,8 +198,13 @@ async function search() {
<!-- <NFormItemGi span="24 s:12 m:6" label="核对标志0未核对 1核对通过 9核对失败" path="checkFlag" class="pr-24px">-->
<!-- <NInput v-model:value="model.checkFlag" placeholder="请输入核对标志0未核对 1核对通过 9核对失败" />-->
<!-- </NFormItemGi>-->
<NFormItemGi span="24 s:12 m:8" label="核对标志" path="checkFlag" class="pr-24px">
<NSelect v-model:value="model.checkFlag" :options="mpsCheckStatusOptions" placeholder="请选择核对状态" clearable />
<NFormItemGi span="24 s:12 m:6" label="核对标志" path="checkFlag" class="pr-24px">
<NSelect
v-model:value="model.checkFlag"
:options="mpsCheckStatusOptions"
placeholder="请选择核对状态"
clearable
/>
</NFormItemGi>
<!-- <NFormItemGi span="24 s:12 m:6" label="核对时间" path="checkTime" class="pr-24px">-->
<!-- <NDatePicker-->

View File

@ -3,6 +3,7 @@ import {onMounted, ref} from 'vue';
import { useNaiveForm } from '@/hooks/common/form';
import { $t } from '@/locales';
import {fetchGetDeptBranchIdSelect, fetchGetDeptUserList} from "@/service/api/system";
import {useAuthStore} from "@/store/modules/auth";
defineOptions({
name: 'PerformanceMSearch'
@ -32,8 +33,11 @@ async function search() {
emit('search');
}
const { userInfo } = useAuthStore();
onMounted(() => {
if(userInfo.roles.includes('operation')) {
getDeptIdOptions()
}
});
const deptIdOptions = ref<CommonType.Option<CommonType.IdType>[]>([]);
@ -44,7 +48,9 @@ async function getDeptIdOptions(){
const { error, data } = await fetchGetDeptBranchIdSelect();
if (!error) {
deptIdOptions.value = data.map(item => ({
deptIdOptions.value = data
.filter(item => item.deptCategory !== "251000099")
.map(item => ({
label: item.deptName,
value: item.deptCategory
}));
@ -78,7 +84,9 @@ function handleYxNameUpdate(value: string, option: CommonType.Option<CommonType.
<NCollapseItem :title="$t('common.search')" name="user-search">
<NForm ref="formRef" :model="model" label-placement="left" :label-width="80">
<NGrid responsive="screen" item-responsive>
<NFormItemGi span="24 s:12 m:6" label="单位" path="branchName" class="pr-24px">
<NFormItemGi
v-if="userInfo.roles.includes('operation')"
span="24 s:12 m:6" label="单位" path="branchName" class="pr-24px">
<!-- <NInput v-model:value="model.branchName" placeholder="单位" />-->
<NSelect
v-model:value="model.branchName"
@ -93,7 +101,9 @@ function handleYxNameUpdate(value: string, option: CommonType.Option<CommonType.
<!-- <NFormItemGi span="24 s:12 m:6" label="单位id" path="branchId" class="pr-24px">-->
<!-- <NInput v-model:value="model.branchId" placeholder="请输入单位id" />-->
<!-- </NFormItemGi>-->
<NFormItemGi span="24 s:12 m:6" label="姓名" path="marketerName" class="pr-24px">
<NFormItemGi
v-if="userInfo.roles.includes('operation')"
span="24 s:12 m:6" label="姓名" path="marketerName" class="pr-24px">
<NInput v-model:value="model.marketerName" placeholder="请输入经办人员姓名" />
<!-- <NSelect-->
<!-- v-model:value="model.marketerName"-->
@ -107,7 +117,9 @@ function handleYxNameUpdate(value: string, option: CommonType.Option<CommonType.
<!-- <NFormItemGi span="24 s:12 m:6" label="经办人员身份证号" path="marketerIdCard" class="pr-24px">-->
<!-- <NInput v-model:value="model.marketerIdCard" placeholder="请输入经办人员身份证号" />-->
<!-- </NFormItemGi>-->
<NFormItemGi span="24 s:12 m:6" label="营销号" path="marketerCode" class="pr-24px">
<NFormItemGi
v-if="userInfo.roles.includes('operation')"
span="24 s:12 m:6" label="营销号" path="marketerCode" class="pr-24px">
<NInput v-model:value="model.marketerCode" placeholder="请输入经办人员营销号" />
</NFormItemGi>
<NFormItemGi span="24 s:12 m:6" label="报表周期" path="recordDate" class="pr-24px">

View File

@ -44,7 +44,9 @@ async function getDeptIdOptions(){
const { error, data } = await fetchGetDeptBranchIdSelect();
if (!error) {
deptIdOptions.value = data.map(item => ({
deptIdOptions.value = data
.filter(item => item.deptCategory !== "251000099")
.map(item => ({
label: item.deptName,
value: item.deptCategory
}));

View File

@ -2,8 +2,16 @@
import {onMounted, reactive, ref, watch} from 'vue';
import { useNaiveForm } from '@/hooks/common/form';
import { $t } from '@/locales';
import {fetchGetDeptBranchIdSelect, fetchGetDeptSelect, fetchGetDeptUserList} from "@/service/api/system";
import {
fetchGetDeptBranchIdSelect,
fetchGetDeptSelect,
fetchGetDeptTree,
fetchGetDeptUserList
} from "@/service/api/system";
import dayjs from "dayjs";
import {fetchGetSubcategorySelect} from "@/service/api/business/subcategory";
import {useLoading} from "~/packages/hooks";
import {useAuthStore} from "@/store/modules/auth";
defineOptions({
name: 'PerformanceSearch'
@ -33,7 +41,9 @@ async function search() {
emit('search');
}
onMounted(() => {
if(userInfo.roles.includes('operation')) {
getDeptIdOptions()
}
});
const deptIdOptions = ref<CommonType.Option<CommonType.IdType>[]>([]);
@ -44,7 +54,9 @@ async function getDeptIdOptions(){
const { error, data } = await fetchGetDeptBranchIdSelect();
if (!error) {
deptIdOptions.value = data.map(item => ({
deptIdOptions.value = data
.filter(item => item.deptCategory !== "251000099")
.map(item => ({
label: item.deptName,
value: item.deptCategory
}));
@ -70,6 +82,21 @@ function handleYxNameUpdate(value: string, option: CommonType.Option<CommonType.
model.value.marketerCode = value;
model.value.marketerName = option.label;
}
const {loading: deptLoading ,startLoading: startDeptLoading, endLoading: endDeptLoading } = useLoading();
const { userInfo } = useAuthStore();
const deptData = ref<Api.Common.CommonTreeRecord>([]);
async function getDeptData() {
startDeptLoading();
const { data: tree, error } = await fetchGetDeptTree();
if (!error) {
deptData.value = tree;
}
endDeptLoading();
}
if(userInfo.roles.includes('operation')){
getDeptData();
}
</script>
<template>
@ -78,7 +105,7 @@ function handleYxNameUpdate(value: string, option: CommonType.Option<CommonType.
<NCollapseItem :title="$t('common.search')" name="user-search">
<NForm ref="formRef" :model="model" label-placement="left" :label-width="80">
<NGrid responsive="screen" item-responsive>
<NFormItemGi span="24 s:12 m:6" label="单位" path="branchName" class="pr-24px">
<NFormItemGi v-if="userInfo.roles.includes('operation')" span="24 s:12 m:6" label="单位" path="branchName" class="pr-24px">
<!-- <NInput v-model:value="model.branchName" placeholder="单位" />-->
<NSelect
v-model:value="model.branchName"
@ -89,11 +116,22 @@ function handleYxNameUpdate(value: string, option: CommonType.Option<CommonType.
@update:value="handleDeptUpdate"
/>
</NFormItemGi>
<!-- <NFormItemGi v-if="userInfo.roles.includes('operation')" span="24 s:12 m:6" label="部门名称" path="deptName" class="pr-24px">-->
<!-- <NTreeSelect-->
<!-- v-model:value="model.deptId"-->
<!-- :loading="deptLoading"-->
<!-- clearable-->
<!-- :options="deptData as []"-->
<!-- label-field="label"-->
<!-- key-field="id"-->
<!-- :default-expanded-keys="deptData?.length ? [deptData[0].id] : []"-->
<!-- placeholder="请选择部门名称"-->
<!-- />-->
<!-- </NFormItemGi>-->
<!-- <NFormItemGi span="24 s:12 m:6" label="单位id" path="branchId" class="pr-24px">-->
<!-- <NInput v-model:value="model.branchId" placeholder="请输入单位id" />-->
<!-- </NFormItemGi>-->
<NFormItemGi span="24 s:12 m:6" label="姓名" path="marketerName" class="pr-24px">
<NFormItemGi v-if="userInfo.roles.includes('operation')" span="24 s:12 m:6" label="姓名" path="marketerName" class="pr-24px">
<NInput v-model:value="model.marketerName" placeholder="请输入经办人员姓名" />
<!-- <NSelect-->
<!-- v-model:value="model.marketerName"-->
@ -107,11 +145,11 @@ function handleYxNameUpdate(value: string, option: CommonType.Option<CommonType.
<!-- <NFormItemGi span="24 s:12 m:6" label="经办人员身份证号" path="marketerIdCard" class="pr-24px">-->
<!-- <NInput v-model:value="model.marketerIdCard" placeholder="请输入经办人员身份证号" />-->
<!-- </NFormItemGi>-->
<NFormItemGi span="24 s:12 m:6" label="营销号" path="marketerCode" class="pr-24px">
<NFormItemGi v-if="userInfo.roles.includes('operation')" span="24 s:12 m:6" label="营销号" path="marketerCode" class="pr-24px">
<NInput v-model:value="model.marketerCode" placeholder="请输入经办人员营销号" />
</NFormItemGi>
<NFormItemGi span="24 s:12 m:6" label="记录日期" path="recordDate" class="pr-24px">
<NDatePicker v-model:formatted-value="model.recordDate" type="month" value-format="yyyy-MM" clearable />
<NDatePicker v-model:formatted-value="model.recordDate" type="date" value-format="yyyy-MM-dd" clearable />
</NFormItemGi>
<!-- <NFormItemGi span="24 s:12 m:6" label="营销人员岗位" path="marketerPosition" class="pr-24px">-->
<!-- <NInput v-model:value="model.marketerPosition" placeholder="请输入营销人员岗位" />-->