Browse Source

fix:时间筛选组件类型调整&保存筛选行业显示问题

yangfeng 1 year ago
parent
commit
e6cec16847

+ 6 - 0
apps/bigmember_pc/src/assets/style/reset-ele.scss

@@ -326,3 +326,9 @@
     }
   }
 }
+.el-date-table td.in-range div,
+.el-date-table td.in-range div:hover,
+.el-date-table.is-week-mode .el-date-table__row.current div,
+.el-date-table.is-week-mode .el-date-table__row:hover div{
+  background-color:#EAF8FA;
+}

+ 8 - 2
apps/bigmember_pc/src/components/selector/SearchTimeScopeSelector.vue

@@ -11,6 +11,7 @@
       :showConfirmButton="showConfirmButton"
       :startPlaceholder="startPlaceholder"
       :endPlaceholder="endPlaceholder"
+      :isDateRange="isDateRange"
       @onChange="onChange"
     />
   </div>
@@ -60,11 +61,16 @@ export default {
     },
     startPlaceholder: {
       type: String,
-      default: ''
+      default: '开始日期'
     },
     endPlaceholder: {
       type: String,
-      default: ''
+      default: '结束日期'
+    },
+    // 显示类型是否为日期范围(一个弹框内选择开始日期结束日期)
+    isDateRange: {
+      type: Boolean,
+      default: false
     }
   },
   data() {

+ 2 - 2
apps/bigmember_pc/src/components/selector/TimeSelector.vue

@@ -46,11 +46,11 @@ export default {
     },
     startPlaceholder: {
       type: String,
-      default: ''
+      default: '开始日期'
     },
     endPlaceholder: {
       type: String,
-      default: ''
+      default: '结束日期'
     },
     value: {
       type: [Object, String],

+ 97 - 32
apps/bigmember_pc/src/components/selector/TimeSelectorContent.vue

@@ -25,36 +25,54 @@
       class="date-time-container"
       :class="{ active: showActive}"
     >
-      <el-date-picker
-        v-model="dateTimePickerState.start"
-        class="date-time-item left"
-        :type="dateTimePickerConf.type"
-        :editable="dateTimePickerConf.editable"
-        :align="dateTimePickerConf.align"
-        :prefix-icon="dateTimePickerConf.prefixIcon"
-        :format="dateTimePickerConf.format"
-        :placeholder="dateTimePickerState.startPlaceHolder"
-        :picker-options="startPickerOptions"
-        :append-to-body="false"
-        @change="startDatePickerChange"
-        @focus="showConfirmHandle"
-      >
-      </el-date-picker>
-      <el-date-picker
-        v-model="dateTimePickerState.end"
-        class="date-time-item right"
-        :type="dateTimePickerConf.type"
-        :editable="dateTimePickerConf.editable"
-        :align="dateTimePickerConf.align"
-        :prefix-icon="dateTimePickerConf.prefixIcon"
-        :format="dateTimePickerConf.format"
-        :placeholder="dateTimePickerState.endPlaceHolder"
-        :picker-options="endPickerOptions"
-        :append-to-body="false"
-        @change="endDatePickerChange"
-        @focus="showConfirmHandle"
-      >
-      </el-date-picker>
+      <div v-if="isDateRange">
+        <el-date-picker
+          v-model="dateTimeRangeState"
+          class="date-picker-range"
+          type="daterange"
+          prefix-icon="none"
+          :editable="false"
+          align="left"
+          range-separator="—"
+          :start-placeholder="dateTimePickerState.startPlaceHolder"
+          :end-placeholder="dateTimePickerState.endPlaceHolder"
+          :append-to-body="false"
+          @change="onDateRangeChange"
+        >
+        </el-date-picker>
+      </div>
+      <div v-else>
+        <el-date-picker
+          v-model="dateTimePickerState.start"
+          class="date-time-item left"
+          :type="dateTimePickerConf.type"
+          :editable="dateTimePickerConf.editable"
+          :align="dateTimePickerConf.align"
+          :prefix-icon="dateTimePickerConf.prefixIcon"
+          :format="dateTimePickerConf.format"
+          :placeholder="dateTimePickerState.startPlaceHolder"
+          :picker-options="startPickerOptions"
+          :append-to-body="false"
+          @change="startDatePickerChange"
+          @focus="showConfirmHandle"
+        >
+        </el-date-picker>
+        <el-date-picker
+          v-model="dateTimePickerState.end"
+          class="date-time-item right"
+          :type="dateTimePickerConf.type"
+          :editable="dateTimePickerConf.editable"
+          :align="dateTimePickerConf.align"
+          :prefix-icon="dateTimePickerConf.prefixIcon"
+          :format="dateTimePickerConf.format"
+          :placeholder="dateTimePickerState.endPlaceHolder"
+          :picker-options="endPickerOptions"
+          :append-to-body="false"
+          @change="endDatePickerChange"
+          @focus="showConfirmHandle"
+        >
+        </el-date-picker>
+      </div>
       <el-button class="confirm-btn" v-if="showConfirmButton && showConBtn" @click="confirmHandle" >确定</el-button>
     </div>
   </div>
@@ -371,6 +389,11 @@ export default {
     endPlaceholder: {
       type: String,
       default: ''
+    },
+    // 显示类型是否为日期范围(一个弹框内选择开始日期结束日期)
+    isDateRange: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -406,7 +429,8 @@ export default {
           }
         }
       },
-      showConBtn: false
+      showConBtn: false,
+      dateTimeRangeState: [],
     }
   },
   computed: {
@@ -437,6 +461,16 @@ export default {
   },
   methods: {
     dateFormatter,
+    onDateRangeChange(value) {
+      this.dateTimeRangeState = value
+      this.dateTimePickerState.start = value[0]
+      this.dateTimePickerState.end = value[1]
+      this.setTimeSelectListState()
+      this.onChange()
+      // if(this.showConfirmButton) {
+      //   this.showConBtn = true
+      // }
+    },
     calcTimeSelectList() {
       let timeSelectList = []
       const propTimeSelectList = timeSelectMap[this.selectorTime]
@@ -509,6 +543,8 @@ export default {
             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
+            // 
+            this.dateTimeRangeState = [data.start, data.end]
             break
           }
           default: {
@@ -682,7 +718,9 @@ export default {
       if (item.selected) return
       this.timeSelectList.forEach((v) => (v.selected = false))
       item.selected = true
-
+      this.dateTimeRangeState = []
+      this.dateTimePickerState.start = ''
+      this.dateTimePickerState.end = ''
       this.onChange()
     },
     startDatePickerChange(start) {
@@ -808,4 +846,31 @@ export default {
   margin-left: 8px;
   border: none;
 }
+::v-deep{
+  .date-picker-range{
+    width: 268px;
+    height: 24px;
+    padding: 0;
+    line-height: 24px;
+    border: 0;
+    .el-input__icon{
+      display: none;
+    }
+    .el-range-separator{
+      width: 8px;
+      height: 1px;
+      margin: 0 5px;
+      font-size: 0;
+      line-height: 24px;
+      background: #E0E0E0;
+    }
+    .el-range-input{
+      width: 126px!important;
+      padding: 0 12px;
+      text-align: left;
+      border: 1px solid #E0E0E0;
+      border-radius: 4px;
+    }
+  }
+}
 </style>

+ 4 - 1
apps/bigmember_pc/src/utils/format/search-bid-filter.js

@@ -196,7 +196,8 @@ export class FilterHistoryAjaxModel2ViewModel {
       if (Array.isArray(industryChildren)) {
         industryChildren.push(vSplit[1])
       } else {
-        industry[vSplit[0]] = [vSplit[1]]
+        // []为兼容 "其他:[]""的情况
+        industry[vSplit[0]] = vSplit[1] ? [vSplit[1]] : []
       }
     })
     if (Object.keys(industry).length) {
@@ -227,6 +228,8 @@ export class FilterHistoryAjaxModel2ViewModel {
     }
     if (industryText.length) {
       result.industryText = industryText ? industryText.toString().replace(/,/g, ",") : ''
+    } else {
+      
     }
     return result
   }

+ 2 - 4
apps/bigmember_pc/src/views/collection/constant/search-filters.js

@@ -92,8 +92,7 @@ function createSearchBidBaseSchema(conf = {}) {
           type: 'collectTime',
           exactCanHalf: true,
           showConfirmButton: true,
-          startPlaceholder: '开始日期',
-          endPlaceholder: '结束日期'
+          isDateRange: true,
         },
         hooks: {}
       }
@@ -127,8 +126,7 @@ function createSearchBidBaseSchema(conf = {}) {
           type: 'bidPushTime',
           exactCanHalf: true,
           showConfirmButton: true,
-          startPlaceholder: '开始日期',
-          endPlaceholder: '结束日期'
+          isDateRange: true,
         },
         hooks: {}
       }

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

@@ -47,7 +47,8 @@ function createBiSearchBidBaseSchema(propertyListData = {}) {
         props: {
           type: 'expire',
           showConfirmButton: true,
-          exactCanHalf: true
+          exactCanHalf: true,
+          isDateRang: true
         },
         hooks: {}
       }

+ 3 - 4
apps/bigmember_pc/src/views/search/bidding/constant/search-filters.js

@@ -134,15 +134,13 @@ function createSearchBidBaseSchema(conf = {}) {
           return beforeChangeHandle($event, 'publishTime', isLogin)
         },
         options: ['lately7', 'lately30', 'sinceLastYear'],
-        startPlaceholder: '开始日期',
-        endPlaceholder: '结束日期'
+        isDateRange: true
       },
       vipConf: {
         exactCanHalf: true,
         showConfirmButton: true,
         options: ['sinceLastThreeYear', 'sinceLastFiveYear', 'exact'],
-        startPlaceholder: '开始日期',
-        endPlaceholder: '结束日期'
+        isDateRange: true
       }
     },
     hooks: {
@@ -154,6 +152,7 @@ function createSearchBidBaseSchema(conf = {}) {
     props: {
       exactCanHalf: true,
       showConfirmButton: true,
+      isDateRange: true
     },
     hooks: {}
   }

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

@@ -91,8 +91,8 @@ export default function () {
 
   // 是否在工作台内
   // 本地调试,可改为工作台内isInApp = ref(true),  isInWeb = ref(false)   提交记得改回!
-  const isInApp = ref(InContainer.inApp)
-  const isInWeb = ref(InContainer.inWeb)
+  const isInApp = ref(true)
+  const isInWeb = ref(false)
 
   // 是否是渠道商
   const cooperateCode = ref(false)

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

@@ -89,8 +89,6 @@ export function useSearchFilterModel(conf) {
   // 格式化招标采购基础筛选条件
   function getFormatApiBaseParams (expendObj = {}) {
     const { publishTime, regionMap, industry, notkey, buyerclass, subtype, _expand } = filterState.value
-    console.log(66666666)
-    console.log(filterState.value)
     const { area, city, district } = FilterHistoryViewModel2AjaxModel.formatAreaCity(regionMap)
     const rPublishTime = publishTime?.indexOf('_') > -1 ? FilterHistoryViewModel2AjaxModel.formatExactTime(publishTime, '-') :  FilterHistoryViewModel2AjaxModel.formatTime(publishTime, true, '-')
     const rIndustry = FilterHistoryViewModel2AjaxModel.formatIndustry(industry)