admin/ys-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

增加搜索模板

Browse Source
This commit is contained in:
xuli3099
2025-08-18 16:11:49 +08:00
parent 1a66f1f3a6
commit 5e36cbb244
4 changed files with 178 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/customSearch.vue
View File

@@ -68,7 +68,7 @@ const props = defineProps({
searchKeywords:{//搜索文本 searchKeywords:{//搜索文本
type:String type:String
}, },
searchType:{//哪种类型显示对象 searchType:{//哪种类型显示对象 typeId:1-首页，2-业务首页，3-消息 之后可以自动添加
type:Object type:Object
}, },
searchTypeList:{//类型列表 searchTypeList:{//类型列表
@@ -111,7 +111,7 @@ const emit = defineEmits(['confirm']);
// 加载历史记录 // 加载历史记录
const loadHistory = () => { const loadHistory = () => {
let typeId = props.searchType.typeId let typeId = props.searchType?props.searchType.typeId:undefined
const history = uni.getStorageSync('searchHistory'+typeId) || [] const history = uni.getStorageSync('searchHistory'+typeId) || []
historyList.value = history historyList.value = history
} }

56
src/pages/business/business.vue
View File

@@ -3,23 +3,33 @@
<view class="con-bg"> <view class="con-bg">
<!-- 头部 --> <!-- 头部 -->
<customHeader ref="customHeaderRef" :title="'业务中心'" <customHeader ref="customHeaderRef" :title="'业务中心'"
:leftFlag="false" :rightFlag="false" :leftFlag="false" :rightFlag="false" v-if="!searchShow"
></customHeader>
<customHeader v-else ref="customHeaderRef" :title="'搜索'"
:leftFlag="true" :rightFlag="false"
@back="handleBack" :searchType="1"
></customHeader> ></customHeader>
<!-- 高度来避免头部遮挡 --> <!-- 高度来避免头部遮挡 -->
<view class="top-height"></view> <view class="top-height"></view>
<!-- 搜索 @confirm="handleSearch" --> <!-- 搜索 @confirm="handleSearch" -->
<view class="search"> <customSearch v-if="searchShow"
:searchKeywords="searchText"
:searchType="searchTypeObj"
@confirm="handleSearchConfirm"
></customSearch>
<view class="search" v-else>
<uni-search-bar class="custom-search" radius="28" <uni-search-bar class="custom-search" radius="28"
placeholder="请输入您想查询的内容或服务" placeholder="请输入您想查询的内容或服务"
clearButton="auto" cancelButton="none" clearButton="auto" cancelButton="none"
bgColor="#6FA2F8" textColor="#ffffff" bgColor="#6FA2F8" textColor="#ffffff"
@focus="handleFocus" @focus="handleSearchFocus"
v-model="searchText"
/> />
</view> </view>
<!-- 下拉刷新 --> <!-- 下拉刷新 -->
<mescroll-uni ref="mescrollRef" @init="mescrollInit" <mescroll-uni v-if="!searchShow" ref="mescrollRef" @init="mescrollInit"
:down="downOption" @down="downCallback" :down="downOption" @down="downCallback"
:fixed="false" class="scroll-h" :fixed="false" class="scroll-h"
> >
@@ -59,7 +69,8 @@
<script setup> <script setup>
import { ref,onMounted } from 'vue' import { ref,onMounted } from 'vue'
import { onLoad,onShow } from '@dcloudio/uni-app'; import { onLoad,onShow } from '@dcloudio/uni-app';
import customHeader from '@/components/customHeader.vue' import customHeader from '@/components/customHeader.vue';
import customSearch from '@/components/customSearch.vue'
import MescrollUni from 'mescroll-uni/mescroll-uni.vue'; import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
import { getNavBarPaddingTop} from '@/utils/system.js' import { getNavBarPaddingTop} from '@/utils/system.js'
import { businessList } from '@/api/business.js'; import { businessList } from '@/api/business.js';
@@ -83,11 +94,32 @@ onMounted(() => {
navBarPaddingTop.value = getNavBarPaddingTop()*2; navBarPaddingTop.value = getNavBarPaddingTop()*2;
}) })
// 搜索处理
let searchShow = ref(false);
let searchText = ref(undefined);
let searchTypeObj = ref({typeId:2});
// 搜索返回操作
const handleBack=()=>{
searchShow.value=false;
}
// 获取input 焦点跳转
const handleSearchFocus=()=>{
searchShow.value = true;
}
// 搜索完返回处理
const handleSearchConfirm = (param1,param2)=>{
// console.log(param1,param2)
searchText.value=param2.value;;
searchShow.value=false;
}
// 查询列表 // 查询列表
let list = ref([]); let list = ref([]);
let getList = async()=>{ let getList = async()=>{
let searchValue = searchText.value?searchText.value:undefined;
let res = await businessList({});//查询所有业务 let res = await businessList({searchValue});//查询所有业务
let arr = res || []; let arr = res || [];
let bizList = initTree(arr,0,'bizId');//递归获取数组处理 let bizList = initTree(arr,0,'bizId');//递归获取数组处理
bizList.forEach(item => { bizList.forEach(item => {
@@ -101,16 +133,6 @@ let handleExpand = (item)=>{
item.expandFlag = !item.expandFlag; item.expandFlag = !item.expandFlag;
} }
// 获取input 焦点跳转
let handleFocus=()=>{
uni.navigateTo({url:'/pages/search/search?type=2'})
}
// 查询搜索跳转
let handleSearch = ()=>{
}
// 下拉刷新 // 下拉刷新
const mescrollRef = ref(null); const mescrollRef = ref(null);
const mescrollInit = (mescroll) => { const mescrollInit = (mescroll) => {

243
src/pages/home/home.vue
View File

@@ -17,132 +17,140 @@
<!-- #endif --> <!-- #endif -->
<!-- 搜索 @confirm="handleSearch" --> <!-- 搜索 @confirm="handleSearch" -->
<view class="search search-sao" > <customSearch v-if="searchShow"
:searchKeywords="searchText"
:searchType="searchTypeObj"
@confirm="handleSearchConfirm"
></customSearch>
<view class="search search-sao" v-else>
<uni-search-bar class="custom-search" radius="28" <uni-search-bar class="custom-search" radius="28"
placeholder="请输入您想查询的内容或服务" placeholder="请输入您想查询的内容或服务"
clearButton="auto" cancelButton="none" clearButton="auto" cancelButton="none"
bgColor="#6FA2F8" textColor="#ffffff" bgColor="#6FA2F8" textColor="#ffffff"
@focus="handleFocus" @focus="handleSearchFocus"
v-model="searchText"
/> />
<uni-icons custom-prefix="iconfont" color="#ffffff" type="icon-phonesaoyisao" size="20"></uni-icons> <uni-icons custom-prefix="iconfont" color="#ffffff" type="icon-phonesaoyisao" size="20"></uni-icons>
</view> </view>
<!-- 待办内容 --> <block v-if="!searchShow">
<view class="backlog-bg"> <!-- 待办内容 -->
<view class="backlog-b-item"> <view class="backlog-bg">
<view class="font-number">{{ backBlogObj.count1 }}</view> <view class="backlog-b-item">
<view class="font-title">待办</view> <view class="font-number">{{ backBlogObj.count1 }}</view>
<view class="font-title">待办</view>
</view>
<view class="backlog-b-item">
<view class="font-number">{{ backBlogObj.count2 }}</view>
<view class="font-title">待审查</view>
</view>
<view class="backlog-b-item">
<view class="font-number">{{ backBlogObj.count3 }}</view>
<view class="font-title">待巡检</view>
</view>
<view class="backlog-b-item">
<view class="font-number">{{ backBlogObj.count4 }}</view>
<view class="font-title">待发货</view>
</view>
</view> </view>
<view class="backlog-b-item">
<view class="font-number">{{ backBlogObj.count2 }}</view>
<view class="font-title">待审查</view>
</view>
<view class="backlog-b-item">
<view class="font-number">{{ backBlogObj.count3 }}</view>
<view class="font-title">待巡检</view>
</view>
<view class="backlog-b-item">
<view class="font-number">{{ backBlogObj.count4 }}</view>
<view class="font-title">待发货</view>
</view>
</view>
<!-- 跑马灯滚动 --> <!-- 跑马灯滚动 -->
<view class="notice-bg"> <view class="notice-bg">
<img :src="'static/images/icon-notice@2x.png'" class="notice-icon" /> <img :src="'static/images/icon-notice@2x.png'" class="notice-icon" />
<view class="notice-list"> <view class="notice-list">
<!-- :interval="4000" --> <!-- :interval="4000" -->
<swiper class="swiper-con" <swiper class="swiper-con"
:vertical="true" :vertical="true"
:autoplay="true" :autoplay="true"
:duration="500" :duration="500"
:circular="true" :circular="true"
:disable-touch="true" :disable-touch="true"
:display-multiple-items="1" :display-multiple-items="1"
> >
<swiper-item v-for="(item, index) in extendedList" :key="index" > <swiper-item v-for="(item, index) in extendedList" :key="index" >
<view class="swiper-item"> <view class="swiper-item">
{{ item }} {{ item }}
</view> </view>
</swiper-item> </swiper-item>
</swiper> </swiper>
</view>
</view>
<!-- 日程提醒 -->
<view class="white-bg mar-top" v-if="stepList.length>0">
<view class="w-b-title">日程提醒
<view class="yellow-bg">
<i :class="{iconfont:true,'icon-phoneshizhong':true}"></i>
<view class="text-black">{{ weekStr }}</view>
</view>
</view>
<view class="section-line">
<customSteps :steps="stepList" :modelValue="stepList"></customSteps>
</view>
</view>
<!-- 销售任务完成情况 -->
<view class="white-bg mar-top">
<view class="w-b-title">销售任务完成情况
<view class="yellow-bg">
<picker @change="bindPickerChange" :value="activeIndex" :range="salesList" @click="clickPicker" @cancel="bindPickerCancel">
<view class="uni-input">{{salesList[activeIndex]}}</view>
</picker>
<i :class="{iconfont:true,'icon-down':salesFlag,'icon-up':!salesFlag}" class="picker-icon"></i>
</view> </view>
</view> </view>
<view class="progress-bg">
<progress :percent="percentNum" stroke-width="10" activeColor="#41E1B1" backgroundColor="#F0F0F0" /> <!-- 日程提醒 -->
<view class="percent" :style="{left:percentNum+'%'}"> <view class="white-bg mar-top" v-if="stepList.length>0">
<view class="percent-num">{{ percentNum }}%</view> <view class="w-b-title">日程提醒
<i class="iconfont icon-down"></i> <view class="yellow-bg">
</view> <i :class="{iconfont:true,'icon-phoneshizhong':true}"></i>
<view class="percent-con"> <view class="text-black">{{ weekStr }}</view>
<view class="p-first"> </view>
<view>实际销售额</view>
<view class="font-money">{{totalSales}}</view>
</view> </view>
<view class="p-last"> <view class="section-line">
<view>目标销售额</view> <customSteps :steps="stepList" :modelValue="stepList"></customSteps>
<view class="font-money">{{ targetSales }}</view> </view>
</view>
<!-- 销售任务完成情况 -->
<view class="white-bg mar-top">
<view class="w-b-title">销售任务完成情况
<view class="yellow-bg">
<picker @change="bindPickerChange" :value="activeIndex" :range="salesList" @click="clickPicker" @cancel="bindPickerCancel">
<view class="uni-input">{{salesList[activeIndex]}}</view>
</picker>
<i :class="{iconfont:true,'icon-down':salesFlag,'icon-up':!salesFlag}" class="picker-icon"></i>
</view>
</view>
<view class="progress-bg">
<progress :percent="percentNum" stroke-width="10" activeColor="#41E1B1" backgroundColor="#F0F0F0" />
<view class="percent" :style="{left:percentNum+'%'}">
<view class="percent-num">{{ percentNum }}%</view>
<i class="iconfont icon-down"></i>
</view>
<view class="percent-con">
<view class="p-first">
<view>实际销售额</view>
<view class="font-money">{{totalSales}}</view>
</view>
<view class="p-last">
<view>目标销售额</view>
<view class="font-money">{{ targetSales }}</view>
</view>
</view> </view>
</view> </view>
</view> </view>
</view>
<!-- 常用服务 --> <!-- 常用服务 -->
<view class="white-bg" v-if="commonServiceList.length>0"> <view class="white-bg" v-if="commonServiceList.length>0">
<view class="w-b-title">常用服务</view> <view class="w-b-title">常用服务</view>
<view class="logo-list"> <view class="logo-list">
<view v-for="(item,index) in commonServiceList" class="l-l-item" :key="index" @click="handleJump(item.bizUrl)"> <view v-for="(item,index) in commonServiceList" class="l-l-item" :key="index" @click="handleJump(item.bizUrl)">
<img :src="'static/images/business/'+item.icon+'.png'" /> <img :src="'static/images/business/'+item.icon+'.png'" />
<text class="font-gray">{{ item.bizName }}</text> <text class="font-gray">{{ item.bizName }}</text>
</view> </view>
<!-- <view class="l-l-item" @click="handleAddCommonSercice"> <!-- <view class="l-l-item" @click="handleAddCommonSercice">
<img :src="'static/images/business/icon-add.png'"> <img :src="'static/images/business/icon-add.png'">
<text class="font-gray">添加</text> <text class="font-gray">添加</text>
</view> --> </view> -->
</view> </view>
</view> </view>
<!-- 新闻公告 --> <!-- 新闻公告 -->
<view class="white-bg"> <view class="white-bg">
<view class="w-b-title">新闻公告 <view class="w-b-title">新闻公告
<text>更多新闻</text> <text>更多新闻</text>
</view> </view>
<view class="news-list"> <view class="news-list">
<view v-for="(item,index) in newsList" class="news-item" :key="index"> <view v-for="(item,index) in newsList" class="news-item" :key="index">
<view class="n-i-title">{{ item.name }} <view class="n-i-title">{{ item.name }}
<view class="n-i-date">{{ formatDateStr(item.date) }}</view> <view class="n-i-date">{{ formatDateStr(item.date) }}</view>
</view> </view>
<img :src="item.imgSrc" v-if="item.imgSrc" /> <img :src="item.imgSrc" v-if="item.imgSrc" />
</view> </view>
</view> </view>
</view> </view>
<!-- 底部加高度来避免tabbar遮挡 --> <!-- 底部加高度来避免tabbar遮挡 -->
<view class="bottom-height"></view> <view class="bottom-height"></view>
</block>
</mescroll-uni> </mescroll-uni>
</view> </view>
</view> </view>
@@ -153,6 +161,7 @@ import { ref,onMounted,computed } from 'vue';
import { onLoad } from '@dcloudio/uni-app'; import { onLoad } from '@dcloudio/uni-app';
import MescrollUni from 'mescroll-uni/mescroll-uni.vue'; import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
import customSteps from '@/components/customSteps.vue' import customSteps from '@/components/customSteps.vue'
import customSearch from '@/components/customSearch.vue'
import { getNavBarPaddingTop} from '@/utils/system.js' import { getNavBarPaddingTop} from '@/utils/system.js'
// ,swiperList,stepData,salesTask,commonServices,newsQueryList // ,swiperList,stepData,salesTask,commonServices,newsQueryList
import { messageNotifyCount,messageFlowCount,getUserFavorite} from '@/api/home.js'; import { messageNotifyCount,messageFlowCount,getUserFavorite} from '@/api/home.js';
@@ -242,13 +251,21 @@ onMounted(() => {
navBarPaddingTop.value = getNavBarPaddingTop()*2; navBarPaddingTop.value = getNavBarPaddingTop()*2;
}) })
// 获取input 焦点跳转 // 搜索处理
let handleFocus=()=>{ let searchShow = ref(false);
uni.navigateTo({url:'/pages/search/search?type=1'}) let searchTypeObj = ref({typeId:1});
} let searchText = ref(undefined);
// 查询搜索跳转
let handleSearch = ()=>{
// 获取input 焦点跳转
const handleSearchFocus=()=>{
searchShow.value = true;
}
// 搜索完返回处理
const handleSearchConfirm = (param1,param2)=>{
// console.log(param1,param2)
searchText.value=param2.value;;
searchShow.value=false;
} }

22
src/pages/notice/notice.vue
View File

@@ -31,15 +31,6 @@
<input class="uni-input" v-model="searchText" placeholder="请输入您想查询的内容或服务" placeholder-class="search-color" /> <input class="uni-input" v-model="searchText" placeholder="请输入您想查询的内容或服务" placeholder-class="search-color" />
</view> </view>
</view> </view>
<!-- <uni-search-bar class="custom-search" radius="28"
placeholder="请输入您想查询的内容或服务"
clearButton="auto"
cancelButton="none"
bgColor="#6FA2F8"
textColor="#ffffff"
@focus="handleSearchFocus"
v-model="searchText"
/> -->
</view> </view>
<!-- 消息列表 --> <!-- 消息列表 -->
@@ -65,11 +56,15 @@
import { ref, onMounted,computed } from 'vue' import { ref, onMounted,computed } from 'vue'
import { onLoad } from '@dcloudio/uni-app'; import { onLoad } from '@dcloudio/uni-app';
import customHeader from '@/components/customHeader.vue' import customHeader from '@/components/customHeader.vue'
import customSearch from '@/components/customSearch.vue'
import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
import { getNavBarPaddingTop } from '@/utils/system.js' import { getNavBarPaddingTop } from '@/utils/system.js'
import { noticeList } from '@/api/notice.js' import { noticeList } from '@/api/notice.js'
import { formatTimestamp } from '@/utils/datetime.js' import { formatTimestamp } from '@/utils/datetime.js'
import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
import customSearch from '@/components/customSearch.vue' onLoad(async(opt) => {
uni.setStorageSync('page_cache',true);
})
// 获取导航栏高度用于内容区域padding // 获取导航栏高度用于内容区域padding
const navBarPaddingTop = ref(0); const navBarPaddingTop = ref(0);
@@ -80,7 +75,7 @@ onMounted(() => {
// 搜索处理 // 搜索处理
let searchShow = ref(false); let searchShow = ref(false);
let searchText = ref(undefined); let searchText = ref(undefined);
let searchTypeObj = ref({typeId:1,typeName:'消息类型'}); let searchTypeObj = ref({typeId:3,typeName:'消息类型'});
let noticeTypeList=ref([ let noticeTypeList=ref([
{id:1,name:'日程消息一二'}, {id:1,name:'日程消息一二'},
{id:2,name:'提醒消息'}, {id:2,name:'提醒消息'},
@@ -90,9 +85,6 @@ let noticeTypeList=ref([
]); ]);
let notictTypeCheck = ref({});//选中类型 let notictTypeCheck = ref({});//选中类型
onLoad(async(opt) => {
uni.setStorageSync('page_cache',true);
})
// 搜索返回操作 // 搜索返回操作
const handleBack=()=>{ const handleBack=()=>{