From c45e8a838c23dbe5ac995cc37b87e4ab1f47b8fd Mon Sep 17 00:00:00 2001
From: wangyang <test@qq.com>
Date: Fri, 29 Aug 2025 13:32:45 +0800
Subject: [PATCH] =?UTF-8?q?CRM-=E8=B5=B0=E8=AE=BF=E6=9F=A5=E7=9C=8B?=
 =?UTF-8?q?=EF=BC=8C=E4=BC=98=E5=8C=96=E6=9F=A5=E8=AF=A2=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../CRM/marketActivity/visitReportView.vue    | 420 +++++++++++-------
 1 file changed, 271 insertions(+), 149 deletions(-)

diff --git a/src/pages/business/CRM/marketActivity/visitReportView.vue b/src/pages/business/CRM/marketActivity/visitReportView.vue
index f2d9774..0d1c5e6 100644
--- a/src/pages/business/CRM/marketActivity/visitReportView.vue
+++ b/src/pages/business/CRM/marketActivity/visitReportView.vue
@@ -1,226 +1,348 @@
 <template>
-    <view class="con-body">
-        <view class="con-bg">
-            <!-- 头部 -->
-            <customHeader ref="customHeaderRef" :title="'走访查看'" :leftFlag="true" :rightFlag="false"></customHeader>
-            <!-- 高度来避免头部遮挡 -->
-            <view class="top-height" :style="{ paddingTop: navBarPaddingTop + 'px' }"></view>
+  <view class="con-body">
+    <view class="con-bg">
+      <!-- 头部 -->
+      <customHeader
+          ref="customHeaderRef"
+          :title="!searchShow?'走访查看':'走访搜索'"
+          :leftFlag="true"
+          :rightFlag="false"
+          @back="handleBack" :searchType="searchShow?1:undefined"
+      ></customHeader>
+      <!-- 高度来避免头部遮挡 -->
+      <view class="top-height" :style="{ paddingTop: navBarPaddingTop + 'px' }"></view>
 
-            <!-- 正文内容 -->
-            <view class="all-body">
-                <!-- 搜索  @blur="blur" @focus="focus" @input="input" @cancel="cancel" @clear="clear"-->
-                <view class="search">
-                    <uni-search-bar class="custom-search" radius="28" placeholder="请输入客户名称" clearButton="auto"
-                        cancelButton="none" bgColor="#6FA2F8" textColor="#ffffff" v-model="searchValue" />
-                    <button type="default" @click="handleSearch" size="mini" class="btn-search">查询</button>
+      <!-- 正文内容 -->
+      <view class="all-body">
+        <!-- 搜索处理 -->
+        <customSearch v-if="searchShow" :searchKeywords="searchText" :searchType="searchTypeObj"
+                      :checkTypeObj="notictTypeCheck" :searchTypeList="noticeTypeList" @confirm="handleSearchConfirm">
+        </customSearch>
+        <view class="search" v-else @click="handleSearchFocus">
+          <view class="search-bg">
+            <view class="search-left">{{ notictTypeCheck.name ? notictTypeCheck.name : '全部' }}</view>
+            <view class="search-right">
+              <input class="uni-input" v-model="inputval" placeholder="请输入您想查询的内容"
+                     placeholder-class="search-color"/>
+            </view>
+          </view>
+        </view>
+
+        <!-- 分页部分  -->
+        <mescroll-uni ref="mescrollRef" v-if="!searchShow" @init="mescrollInit" @down="downCallback" @up="upCallback"
+                      :up="upOption" :down="downOption" :fixed="false" textColor="#ffffff" bgColor="#ffffff"
+                      class="scroll-h" :class="{ 'loading-scroll': cssFlag }">
+          <view class="white-bg margin-bottom20" v-for="(item, index) in list" :key="index"
+                @click="showDetail(item)">
+            <view>
+              <view class="report-list">
+                <view class="title">客户：{{ item.cusName }}</view>
+                <view class="r-list">
+                  <view class="r-name">{{ item.visistCode }}</view>
+                  <view>
+
+                    <view
+                        :class="item.myselfBrowsing == 0 ? 'r-right btn-orange' : 'r-right btn-blue'"
+                        size="mini">
+                      {{ item.myselfBrowsing == 0 ? '未读' : '已读' }}
+                    </view>
+                  </view>
+
+                </view>
+                <view class="border-bottom"></view>
+                <view class="r-list">
+                  <view class="r-left">报告类型</view>
+                  <view class="r-right">{{ item.visistType === "业务招待" ? "Ⅱ类活动" : "走访报告" }}</view>
+                </view>
+                <view class="r-list" v-if="item.joinUser != null">
+                  <view class="r-left">我方领导</view>
+                  <view class="r-right">{{ item.joinUser }}</view>
+                </view>
+                <view class="border-bottom"></view>
+                <view class="r-list">
+                  <view class="r-left">报告人</view>
+                  <view class="r-right">{{ item.staffName }}</view>
+                </view>
+                <view class="border-bottom"></view>
+                <view class="r-list">
+                  <view class="r-left">报告日期</view>
+                  <view class="r-right">{{ item.visistDate }}</view>
                 </view>
 
-                <!-- 分页部分  -->
-                <mescroll-uni ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback"
-                    :up="upOption" :down="downOption" :fixed="false" textColor="#ffffff" bgColor="#ffffff"
-                    class="scroll-h" :class="{ 'loading-scroll': cssFlag }">
-                    <view class="white-bg margin-bottom20" v-for="(item, index) in list" :key="index"
-                        @click="showDetail(item)">
-                        <view>
-                            <view class="report-list">
-                                <view class="title">客户：{{ item.cusName }}</view>
-                                <view class="r-list">
-                                    <view class="r-name">{{ item.visistCode }}</view>
-                                    <view>
-
-                                        <view
-                                            :class="item.myselfBrowsing == 0 ? 'r-right btn-orange' : 'r-right btn-blue'"
-                                            size="mini">
-                                            {{ item.myselfBrowsing == 0 ? '未读' : '已读' }}
-                                        </view>
-                                    </view>
-
-                                </view>
-                                <view class="border-bottom"></view>
-                                <view class="r-list">
-                                    <view class="r-left">报告类型</view>
-                                    <view class="r-right">{{ item.visistType === "业务招待" ? "Ⅱ类活动" : "走访报告" }}</view>
-                                </view>
-                                <view class="r-list" v-if="item.joinUser != null">
-                                    <view class="r-left">我方领导</view>
-                                    <view class="r-right">{{ item.joinUser }}</view>
-                                </view>
-                                <view class="border-bottom"></view>
-                                <view class="r-list">
-                                    <view class="r-left">报告人</view>
-                                    <view class="r-right">{{ item.staffName }}</view>
-                                </view>
-                                <view class="border-bottom"></view>
-                                <view class="r-list">
-                                    <view class="r-left">报告日期</view>
-                                    <view class="r-right">{{ item.visistDate }}</view>
-                                </view>
-
-                            </view>
-                        </view>
-                    </view>
-                </mescroll-uni>
+              </view>
             </view>
-        </view>
+          </view>
+        </mescroll-uni>
+      </view>
     </view>
+  </view>
 </template>
 
 <script setup>
-import customHeader from '@/components/customHeader.vue'
-import { ref, reactive, onMounted } from 'vue'
+import {ref, reactive, onMounted, watch} from 'vue'
 import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
-import { getNavBarPaddingTop } from '@/utils/system.js'
-import { getQueryVisistList } from '../../../../api/crm/activity/activity';
-import {onShow} from "@dcloudio/uni-app";
+import {getNavBarPaddingTop} from '@/utils/system.js'
+import {getQueryVisistList} from '../../../../api/crm/activity/activity';
+import {onHide, onShow} from "@dcloudio/uni-app";
+import customHeader from '@/components/customHeader.vue'
+import customSearch from '@/components/customSearch.vue'
+// 搜索处理
+let searchShow = ref(false);
+let searchText = ref(undefined);
+let notictTypeCheck = ref({}); //选中类型
+// 新增状态变量存储搜索条件
+const selValue = ref(''); // 搜索类型名称
+const inputval = ref(''); // 搜索内容
+//点击查询方法，搜索当前报告信息
+let searchValue = ref(null)
+let noticeTypeList = ref([{
+  id: 1,
+  name: '客户全称'
+},
+  {
+    id: 2,
+    name: '客户简称'
+  },
+  {
+    id: 3,
+    name: '业务员名称'
+  },
+  {
+    id: 4,
+    name: '活动单号'
+  },
+  {
+    id: 5,
+    name: '活动内容'
+  },
+  {
+    id: 6,
+    name: '模糊搜索'
+  },
+  {
+    id: 7,
+    name: '未读内容'
+  }
+]);
+// 搜索返回操作
+const handleBack=()=>{
+  searchShow.value=false;
+}
+// 获取input 焦点跳转
+const handleSearchFocus = () => {
+  searchShow.value = true;
+}
+let searchTypeObj = ref({
+  typeId: 3,
+  typeName: '消息类型'
+});
+// 搜索完返回处理
+const handleSearchConfirm = (param1, param2) => {
+  notictTypeCheck.value = param1.value;
+  inputval.value = param2.value || '';
+  selValue.value = param1.value.name || '';
+  searchValue.value = param2.value;
+  console.log("selValue" + selValue.value)
+  console.log("inputval" + inputval.value)
+  // 重置mescroll触发刷新
+  if (mescrollRef.value) {
+    mescrollRef.value.resetUpScroll();
+  }
+  searchShow.value = false;
+}
 
-onShow(()=>{
-  downCallback(mescrollRef.value.mescroll)
+//监视查询的内容的变化
+// watch(searchValue, (newValue, oldValue) => {
+//   //变化了之后，重新查询内容
+//   var data = {
+//     pageNum: 1,
+//     pageSize: 10,
+//   };
+//   getQueryVisistList(data).then(res => {
+//     if (res.code == 200) {
+//       //设置列表数据
+//       list.value = res.rows;
+//     }
+//   })
+// })
+onHide(()=>{
+  searchShow.value=false;
 })
 
+//====================
+
+// onShow(() => {
+//   getList();
+// })
+
 let list = ref([])
 let queryParams = reactive({
-    selValue: ''
+  selValue: ''
 })
 // 获取导航栏高度用于内容区域padding
 const navBarPaddingTop = ref(0);
 onMounted(() => {
-    navBarPaddingTop.value = getNavBarPaddingTop() * 2;
+  navBarPaddingTop.value = getNavBarPaddingTop() * 2;
 })
 
 let cssFlag = ref(false);//控制样式
 let mescrollRef = ref(null);
 
 const mescrollInit = (mescroll) => {
-    cssFlag.value = true;
-    mescrollRef.value = mescroll;
+  cssFlag.value = true;
+  mescrollRef.value = mescroll;
 };
 
 
 // 下拉刷新
 const downCallback = async (mescroll) => {
-    try {
-        setTimeout(async () => {
-            queryParams.pageNum = 1;
-            queryParams.pageSize = upOption.value.page.size;
-            //获取当前页的信息
-            const res = await getQueryVisistList(queryParams)
-            cssFlag.value = false;
-            list.value = res.rows;
-            mescroll.resetUpScroll();
-        }, 500);
-    } catch (error) {
-        mescroll.endErr();
-    } finally {
-        setTimeout(async () => {
-            mescroll.endSuccess();
-        }, 500);
-    }
+  try {
+    setTimeout(async () => {
+      queryParams.pageNum = 1;
+      queryParams.pageSize = upOption.value.page.size;
+      //获取当前页的信息
+      const res = await getViewReportList(1, upOption.value.page.size)
+      cssFlag.value = false;
+      list.value = res.rows;
+    }, 500);
+  } catch (error) {
+    mescroll.endErr();
+  } finally {
+    setTimeout(async () => {
+      mescroll.endSuccess();
+    }, 500);
+  }
 }
 
 
 // 上拉加载更多
 const upCallback = async (mescroll) => {
-    try {
-        setTimeout(async () => {
-          queryParams.pageNum = 1;
-          queryParams.pageSize = upOption.value.page.size;
-            const res = await getQueryVisistList(queryParams);
-            if (mescroll.num === 1) {
-                list.value = res.rows;
-            } else {
-                list.value.push(...res.rows);
-            }
-            mescroll.endBySize(res.rows.length, res.total);
-        }, 500);
-    } catch (error) {
-        mescroll.endErr();
+  try {
+    setTimeout(async () => {
+      const res = await getViewReportList(mescroll.num, mescroll.size, selValue.value,
+          inputval.value);
+      if (mescroll.num === 1) {
+        list.value = res.list;
+      } else {
+        list.value.push(...res.list);
+      }
+      mescroll.endBySize(list.value.length, res.total);
+    }, 500);
+  } catch (error) {
+    mescroll.endErr();
+  }
+}
+
+function getList() {
+  queryParams.pageNum = 1;
+  queryParams.pageSize = upOption.value.page.size;
+  getQueryVisistList(queryParams).then(res => {
+    list.value = res.rows;
+  })
+}
+
+// 获取数据列表
+const getViewReportList = (pageNum, pageSize) => {
+  return new Promise(async (resolve) => {
+    let param = {
+      pageNum,
+      pageSize,
+      // 添加搜索条件参数
+      selValue: selValue.value,
+      inputval: inputval.value
     }
+    let res = await getQueryVisistList(param);
+    resolve({
+      list: res.rows,
+      total: res.total
+    });
+  });
 }
 
 const upOption = ref({
-    page: { num: 0, size: 10 },
-    noMoreSize: 5,
-    empty: { 
-        tip: '~ 空空如也 ~',
-        icon: "../../static/images/mescroll-empty.png"
-    },
-    textLoading: '加载中...',
-    textNoMore: '已经到底了'
+  page: {num: 0, size: 10},
+  noMoreSize: 5,
+  empty: {
+    tip: '~ 空空如也 ~',
+    icon: "../../static/images/mescroll-empty.png"
+  },
+  textLoading: '加载中...',
+  textNoMore: '已经到底了'
 });
 
 const downOption = ref({
-    auto: true,
-    textInOffset: '下拉刷新',
-    textOutOffset: '释放更新',
-    textLoading: '刷新中...'
+  auto: true,
+  textInOffset: '下拉刷新',
+  textOutOffset: '释放更新',
+  textLoading: '刷新中...'
 });
 
 //点击某一个进入查看明细信息
 function showDetail(item) {
-    uni.navigateTo({
-        url: './visitReportDetail?visistId=' + item.visistId
-    })
+  uni.navigateTo({
+    url: './visitReportDetail?visistId=' + item.visistId
+  })
 }
 
-//点击查询方法，搜索当前报告信息
-let searchValue = ref()
-function handleSearch() {
-    queryParams.inputval = searchValue.value
-    downCallback(mescrollRef.value.mescroll);
-}
+
+
+// function handleSearch() {
+//   queryParams.inputval = searchValue.value
+//   downCallback(mescrollRef.value.mescroll);
+// }
 
 </script>
 
 <style scoped>
 .all-body {
-    /* #ifdef APP-PLUS */
-    top: 150rpx;
-    height: calc(100vh - 75px);
-    /* #endif */
-    /* #ifndef APP-PLUS */
-    top: 120rpx;
-    height: calc(100vh);
-    /* #endif */
+  /* #ifdef APP-PLUS */
+  top: 150rpx;
+  height: calc(100vh - 75px);
+  /* #endif */
+  /* #ifndef APP-PLUS */
+  top: 120rpx;
+  height: calc(100vh);
+  /* #endif */
 }
 
 .search {
-    display: flex;
+  display: flex;
 }
 
 .search .btn-search {
-    border: none;
-    background: none;
-    line-height: normal;
-    color: #fff;
-    line-height: 56rpx !important;
-    padding: 10rpx 0 0;
-    text-align: left;
-    cursor: pointer;
+  border: none;
+  background: none;
+  line-height: normal;
+  color: #fff;
+  line-height: 56rpx !important;
+  padding: 10rpx 0 0;
+  text-align: left;
+  cursor: pointer;
 }
 
 .search .btn-search::after {
-    display: none;
+  display: none;
 }
 
 .search .custom-search {
-    width: 80%;
+  width: 80%;
 
 }
 
 .search .custom-search.uni-searchbar {
-    padding-right: 0 !important;
+  padding-right: 0 !important;
 }
 
 .scroll-h {
-    /* #ifdef APP-PLUS */
-    height: calc(100vh - 120px);
-    /* #endif */
-    /* #ifndef APP-PLUS */
-    height: calc(100vh - 110px);
-    /* #endif */
+  /* #ifdef APP-PLUS */
+  height: calc(100vh - 120px);
+  /* #endif */
+  /* #ifndef APP-PLUS */
+  height: calc(100vh - 110px);
+  /* #endif */
 }
 
 .white-bg {
-    padding-bottom: 10rpx;
+  padding-bottom: 10rpx;
 }
 </style>