浏览代码

fix:时间自定义支持半选拓展、保存筛选条件以及筛选进行相关格式化处理;页面无数据提示修改

zhangsiya 1 年之前
父节点
当前提交
dd5b5f9d56

+ 13 - 1
apps/bigmember_pc/src/components/selector/SearchTimeScopeSelector.vue

@@ -7,6 +7,8 @@
       :selectorTime="type"
       selectorType="line"
       :defaultSelectedKey="value"
+      :exactCanHalf="exactCanHalf"
+      :showConfirmButton="showConfirmButton"
       @onChange="onChange"
     />
   </div>
@@ -43,6 +45,16 @@ export default {
     type: {
       type: String,
       default: 'bidSearch'
+    },
+    // 自定义选项是否可以选择一半值
+    exactCanHalf: {
+      type: Boolean,
+      default: false
+    },
+    // 是否展示自定义自动按钮
+    showConfirmButton: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -190,7 +202,7 @@ export default {
     }
 
     .date-time-container .date-time-item {
-      width: 104px;
+      width: 124px;
       height: 24px;
       line-height: 24px;
     }

+ 79 - 23
apps/bigmember_pc/src/components/selector/TimeSelectorContent.vue

@@ -23,7 +23,7 @@
     <div
       v-if="showExactConf"
       class="date-time-container"
-      :class="{ active: state.exact === 'exact' }"
+      :class="{ active: showActive}"
     >
       <el-date-picker
         v-model="dateTimePickerState.start"
@@ -37,6 +37,7 @@
         :picker-options="startPickerOptions"
         :append-to-body="false"
         @change="startDatePickerChange"
+        @focus="showConfirmHandle"
       >
       </el-date-picker>
       <el-date-picker
@@ -51,8 +52,10 @@
         :picker-options="endPickerOptions"
         :append-to-body="false"
         @change="endDatePickerChange"
+        @focus="showConfirmHandle"
       >
       </el-date-picker>
+      <el-button class="confirm-btn" v-if="showConfirmButton && showConBtn" @click="confirmHandle" >确定</el-button>
     </div>
   </div>
 </template>
@@ -285,6 +288,16 @@ export default {
     showExact: {
       type: Boolean,
       default: true
+    },
+    // 自定义组件可以搬选返回
+    exactCanHalf: {
+      type: Boolean,
+      default: false
+    },
+    // 是否展示确认按钮
+    showConfirmButton: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -319,7 +332,8 @@ export default {
             return time.getTime() < +new Date(start)
           }
         }
-      }
+      },
+      showConBtn: false
     }
   },
   computed: {
@@ -333,6 +347,15 @@ export default {
     },
     state() {
       return this.getState()
+    },
+    showActive () {
+      let result = false
+      if(this.showConfirmButton) {
+        result = this.state.exact === 'exact' && (this.dateTimePickerState.start || this.dateTimePickerState.end) && !this.showConBtn
+      } else {
+        let result = this.state.exact === 'exact'
+      }
+      return result
     }
   },
   created() {
@@ -407,12 +430,12 @@ export default {
             break
           }
           case 'exact': {
-            if (!data.start || !data.end) break
-            if (data.start < data.end) {
-              this.timeSelectList.forEach((v) => (v.selected = false))
-              this.dateTimePickerState.start = new Date(data.start)
-              this.dateTimePickerState.end = new Date(data.end)
+            if(!this.exactCanHalf && !this.showConfirmButton) {
+              if (!data.start || !data.end) break
             }
+            this.timeSelectList.forEach((v) => (v.selected = false))
+            this.dateTimePickerState.start = data.start ? new Date(data.start) : null
+            this.dateTimePickerState.end =data.end ?  new Date(data.end) : null
             break
           }
           default: {
@@ -591,27 +614,48 @@ export default {
     },
     startDatePickerChange(start) {
       const { end } = this.dateTimePickerState
-      if (start && end) {
-        // start和end都有值
-        this.setTimeSelectListState()
-        this.onChange()
-      } else if (!start && !end) {
-        // start和end都没值
-        this.setTimeSelectListState(this.defaultSelectedKey)
-        this.onChange()
+      if(!this.exactCanHalf && !this.showConfirmButton) {
+        if (start && end) {
+          // start和end都有值
+          this.setTimeSelectListState()
+          this.onChange()
+        } else if (!start && !end) {
+          // start和end都没值
+          this.setTimeSelectListState(this.defaultSelectedKey)
+          this.onChange()
+        }
+      }
+      if(this.showConfirmButton) {
+        this.showConBtn = true
       }
     },
     endDatePickerChange(end) {
       const { start } = this.dateTimePickerState
-      if (start && end) {
-        // start和end都有值
-        this.setTimeSelectListState()
-        this.onChange()
-      } else if (!start && !end) {
-        // start和end都没值
-        this.setTimeSelectListState(this.defaultSelectedKey)
-        this.onChange()
+      if(!this.exactCanHalf && !this.showConfirmButton) {
+        if (start && end) {
+          // start和end都有值
+          this.setTimeSelectListState()
+          this.onChange()
+        } else if (!start && !end) {
+          // start和end都没值
+          this.setTimeSelectListState(this.defaultSelectedKey)
+          this.onChange()
+        }
+      }
+      if(this.showConfirmButton) {
+        this.showConBtn = true
       }
+    },
+    // 展示确定按钮
+    showConfirmHandle () {
+      this.showConBtn = true
+    },
+
+    // 确定操作
+    confirmHandle () {
+      this.setTimeSelectListState()
+      this.onChange()
+      this.showConBtn = false
     }
   }
 }
@@ -678,4 +722,16 @@ export default {
     }
   }
 }
+.confirm-btn{
+  width:48px;
+  height:24px;
+  border-radius: 2px;
+  font-size: 14px;
+  text-align: center;
+  color: #fff;
+  background: #2ABED1;
+  padding: 0;
+  line-height: 22px;
+  margin-left: 8px;
+}
 </style>

+ 26 - 5
apps/bigmember_pc/src/utils/format/search-bid-filter.js

@@ -326,22 +326,26 @@ export class FilterHistoryAjaxModel2ViewModel {
         t.end = end
         textArr[1] = dateFormatter(end, 'yyyy/MM/dd')
       }
-
+      let publishTime = ''
       let publishTimeText = ''
       if (textArr[0] && textArr[1]) {
         publishTimeText = textArr.join('-')
+        publishTime = val
       } else if (textArr[0] && !textArr[1]) {
         publishTimeText = `${textArr[0]}以后`
+        publishTime = split[0] + '_' + '0'
       } else if (!textArr[0] && textArr[1]) {
         publishTimeText = `${textArr[1]}以前`
+        publishTime = '0' + '_' + split[1]
       }
       // 计算text
       result.publishTimeText = publishTimeText
+      result.publishTime = publishTime
     } else {
       t.exact = val
       result.publishTimeText = map[val] || ''
+      result.publishTime = val
     }
-    result.publishTime = val
     return result
   }
 
@@ -491,7 +495,7 @@ export class FilterHistoryViewModel2AjaxModel {
     // 金额筛选整理
     const { minPrice, maxPrice } = this.formatPrice(map.price)
     // 时间筛选整理
-    // const publishTime = this.formatTime(map.publishTime)
+    const publishTime = map.publishTime?.includes('_') ? this.formatExactTime(map.publishTime) : this.formatTime(map.publishTime)
     // 信息类型
     let subtype = this.formatInfoType(map.subtype)
     if (subtype) {
@@ -503,14 +507,13 @@ export class FilterHistoryViewModel2AjaxModel {
     const { additionalWords, wordsMode } = this.formatSelectMoreKey(map.selectMoreKey, map.additionalWords, map.wordsMode)
     // tab值
     const searchGroup = this.formatSearchGroup(map.searchGroup)
-
     const formatted = {
       searchvalue: map.input,
       selectType,
       industry,
       minprice: minPrice,
       maxprice: maxPrice,
-      publishtime: map.publishTime, // 发布时间
+      publishtime: publishTime, // 发布时间
       subtype,   // 信息类型
       buyerclass: buyerClass, // 采购单位类型
       buyertel: map.buyertel,  // 采购单位联系方式
@@ -652,6 +655,24 @@ export class FilterHistoryViewModel2AjaxModel {
     return sortedTime
   }
 
+  // 格式化自定义时间
+  static formatExactTime (time, split = '_') {
+    if(!time) return ''
+    let result = ''
+    let arr = []
+    if(time.indexOf('_') > -1) {
+      arr = time.split('_')
+    }
+    if(Number(arr[0]) === 0 && Number(arr[1]) > 0) {
+      result = `${split}${arr[1]} `
+    } else if(Number(arr[1]) === 0 && Number(arr[0]) > 0) {
+      result = `${arr[0]}${split} `
+    } else {
+      result = `${arr[0]}${split}${arr[1]} `
+    }
+    return result
+  }
+
   /**
    * 信息类型整理
    * @param String val

+ 8 - 1
apps/bigmember_pc/src/views/search/bidding/constant/search-filters.js

@@ -74,12 +74,16 @@ function createSearchBidBaseSchema(conf = {}) {
       vipMaskShow: true,
       vipModuleShow: showVip,
       freeConf: {
+        exactCanHalf: true,
+        showConfirmButton: true,
         beforeChange ($event) {
           return beforeChangeHandle($event, 'publishTime', isLogin)
         },
         options: ['lately7', 'lately30', 'sinceLastYear'],
       },
       vipConf: {
+        exactCanHalf: true,
+        showConfirmButton: true,
         options: ['sinceLastThreeYear', 'sinceLastFiveYear', 'exact'],
       }
     },
@@ -89,7 +93,10 @@ function createSearchBidBaseSchema(conf = {}) {
   }
   const publishTimeExpandVip = {
     component: SearchTimeScopeSelector,
-    props: {},
+    props: {
+      exactCanHalf: true,
+      showConfirmButton: true,
+    },
     hooks: {}
   }
   // 搜索范围

+ 24 - 1
apps/bigmember_pc/src/views/search/bidding/index.vue

@@ -12,6 +12,7 @@ import CustomDialog from '@/components/dialog/Dialog.vue'
 import ExportTip from '@/views/portrayal/components/DataExportTip.vue'
 import powerPerson from '@/components/subscribe-manager/powerPerson.vue'
 import BidrenewalDialog from '@/views/BidrenewalDialog/index.vue'
+import Empty from '@/components/common/Empty.vue'
 // 导入业务模型
 import { useSearchBidModel, SearchBidModel } from './model/index'
 import { getMsgDistributor } from '@/api/modules/'
@@ -57,7 +58,8 @@ const {
   onAddInfoOfBI,
   onSingleAddInfo,
   vipDialogConf,
-  closeVipDialog
+  closeVipDialog,
+  timeSelectorText
 } = SearchBidModel
 
 const {
@@ -167,6 +169,14 @@ const articleRef = ref({
             </article-item>
           </div>
         </template>
+        <template #empty>
+          <empty :mtb60="false"  images="jy-back.png">
+            <div class="hasNoData_tiptext">
+              <p>对不起,没有找到 <span class="highlight-text">{{ timeSelectorText }}</span> 相关匹配的信息,</p>
+             <p>修改时间范围或换个搜索词试试吧</p>
+            </div>
+          </empty>
+        </template>
 
         <!--      <template-->
         <!--        #list-after-->
@@ -363,10 +373,16 @@ const articleRef = ref({
 <style lang="scss" scoped>
 .in-app {
   .search-bidding-page{
+    margin-top: 0;
     width: 100%;
     padding:24px;
   }
 }
+.in-web{
+  .search-bidding-page{
+    margin-top: 24px;
+  }
+}
 .search-bidding-page {
   width: 1200px;
   margin: 0 auto;
@@ -429,6 +445,13 @@ const articleRef = ref({
     box-sizing: content-box;
     min-width: 42px;
   }
+  .hasNoData_tiptext{
+    font-size: 14px;
+    font-family: Microsoft YaHei, Microsoft YaHei-Regular;
+    text-align: center;
+    color: #999999;
+    line-height: 22px;
+  }
 }
 
 .sub-collection.tags-box {

+ 30 - 13
apps/bigmember_pc/src/views/search/bidding/model/base.js

@@ -4,7 +4,7 @@ import { useStore } from '@/store'
 import { useRoute, useRouter } from 'vue-router/composables'
 import { MessageBox } from 'element-ui'
 import { mixinVisited } from '@/utils/mixins/visited-setup.js'
-import  { FilterHistoryAjaxModelRestore, getParam, openLinkInWorkspace, InContainer} from '@/utils'
+import  { FilterHistoryAjaxModelRestore, FilterHistoryAjaxModel2ViewModel, getParam, openLinkInWorkspace, InContainer} from '@/utils'
 import $bus from '@/utils/bus'
 // 筛选条件动态组件方法
 import { getCreateSearchSchema } from '@/views/search/bidding/constant/index'
@@ -71,8 +71,8 @@ export default function () {
 
   // 是否在工作台内
   // 本地调试,可改为工作台内isInApp = ref(true),  isInWeb = ref(false) 提交记得改回!
-  const isInApp = ref(InContainer.inApp)
-  const isInWeb = ref(InContainer.inWeb)
+  const isInApp = ref(true) || ref(InContainer.inApp)
+  const isInWeb = ref(false) || ref(InContainer.inWeb)
 
   // 是否是渠道商
   const cooperateCode = ref(false)
@@ -135,7 +135,7 @@ export default function () {
     filterState,
     getFormatAPIParams: getFormatOfFilter,
     updateFilterBase
-  } = useSearchFilterModel({ inBIPropertyIframe })
+  } = useSearchFilterModel({ inBIPropertyIframe, isFree })
 
   const {
     onTheWhiteList,
@@ -503,8 +503,11 @@ export default function () {
     return result
   }
 
-  function beforeSearch () {
-    console.log('beforesearch----------')
+  function beforeSearch (searchType) {
+    // 第一次搜索或者tab切换不校验白名单规则
+    if (searchType) {
+      return true
+    }
     // 如果在反爬白名单,则空搜索刷新搜索结果(即允许空搜索)
     // 不在,则不允许空搜索(此处空搜索指的是主搜索框是否为空)
     if (!onTheWhiteList.value) {
@@ -539,12 +542,9 @@ export default function () {
    * @param [params] - 可选值,默认会和 getParams(params) 返回值进行合并
    */
   function doQuery(params = {}, searchType) {
-
-    if(!searchType) {
-      const bSearch = beforeSearch()
-      if(!bSearch) {
-        return
-      }
+    const bSearch = beforeSearch(searchType)
+    if(!bSearch) {
+      return
     }
     return doRunQuery(getParams(params)).then((res) => {
 
@@ -1008,6 +1008,22 @@ export default function () {
   }
   /*****BI添加操作end*********/
 
+  const timeSelectorText = computed(() => {
+    const publishTime =filterState.value.publishTime
+    const { publishTimeText } = FilterHistoryAjaxModel2ViewModel.formatTime(publishTime)
+    let result = ''
+    if(publishTimeText.includes('最')) {
+      result = publishTimeText.replace('最', '')
+    } else if(publishTimeText.includes('以后')){
+      result = publishTimeText.replace('以后', '')
+    }else if(publishTimeText.includes('以前')) {
+      result = publishTimeText.replace('以前', '')
+    } else {
+      result = publishTimeText
+    }
+    return result
+  })
+
   return {
     isLogin,
     isInApp,
@@ -1065,6 +1081,7 @@ export default function () {
     onSingleEmploy,
     onAddInfoOfBI,
     onSingleAddInfo,
-    goWorkSpace
+    goWorkSpace,
+    timeSelectorText
   }
 }

+ 3 - 3
apps/bigmember_pc/src/views/search/bidding/model/modules/filter.js

@@ -6,11 +6,11 @@ import  {
 } from '@/utils'
 
 export function useSearchFilterModel(conf) {
-  const { inBIPropertyIframe } = conf
+  const { inBIPropertyIframe, isFree } = conf
   // 筛选组件状态
   const filterBase = ref({
     // 发布时间
-    publishTime: 'thisyear',
+    publishTime: isFree.value ? 'thisyear' : 'fiveyear',
     // 搜索范围
     selectType: ['content', 'title'],
     // 信息类型
@@ -87,7 +87,7 @@ export function useSearchFilterModel(conf) {
   function getFormatApiBaseParams (expendObj = {}) {
     const { publishTime, regionMap, industry, notkey, buyerclass, subtype } = filterState.value
     const { area, city, district } = FilterHistoryViewModel2AjaxModel.formatAreaCity(regionMap)
-    const rPublishTime = publishTime?.indexOf('_') > -1 ? publishTime.replace(/_/g, '-') :  FilterHistoryViewModel2AjaxModel.formatTime(publishTime, true, '-')
+    const rPublishTime = publishTime?.indexOf('_') > -1 ? FilterHistoryViewModel2AjaxModel.formatExactTime(publishTime) :  FilterHistoryViewModel2AjaxModel.formatTime(publishTime, true, '-')
     const rIndustry = FilterHistoryViewModel2AjaxModel.formatIndustry(industry)
     const rBuyerClass = FilterHistoryViewModel2AjaxModel.formatBuyerClass(buyerclass)
     const rSubtype = FilterHistoryViewModel2AjaxModel.formatInfoType(subtype)