From 19a63d940855330bf6a166be64c163ce40d467dd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BE=99=E8=BF=90=E6=A8=A1?= <1724894114@qq.com>
Date: Thu, 19 Dec 2024 14:22:39 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E8=A1=A8=E5=A4=B4=E6=A3=80?=
 =?UTF-8?q?=E7=B4=A2=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/scTable/columnSetting.vue      |  23 +++-
 .../scTable/components/headerSearch.vue       |  15 ++-
 .../scTable/components/typePopover.vue        | 117 ++++++++++--------
 src/utils/tool.js                             |  12 +-
 src/views/order/orderList/index.vue           |  32 +++--
 5 files changed, 120 insertions(+), 79 deletions(-)

diff --git a/src/components/scTable/columnSetting.vue b/src/components/scTable/columnSetting.vue
index dfa323e..eb86f64 100644
--- a/src/components/scTable/columnSetting.vue
+++ b/src/components/scTable/columnSetting.vue
@@ -28,11 +28,8 @@
 						<el-input v-model="item.width" placeholder="auto" size="small"></el-input>
 					</span>
 					<span class="type_b">
-						<el-select v-model="item.condition" size="small">
-							<el-option value="link"></el-option>
-							<el-option value="in"></el-option>
-							<el-option value="between"></el-option>
-							<el-option value="="></el-option>
+						<el-select v-model="item.condition" size="small" disabled>
+							<el-option :value="item.value" :label="item.label" v-for="(item,index) in conditionList" :key="index"></el-option>
 						</el-select>
 					</span>
 					<span class="sortable_b">
@@ -65,6 +62,22 @@
 		},
 		data() {
 			return {
+				conditionList:[
+					{label:'包含',value:'like'},
+					{label:'在列表',value:'in'},
+					{label:'不在列表',value:'not in'},
+					{label:'区间',value:'between'},
+					{label:'不在区间',value:'not between'},
+					{label:'空值',value:'is null'},
+					{label:'非空值',value:'is not null'},
+					{label:'等于',value:'='},
+					{label:'小于',value:'<'},
+					{label:'小于等于',value:'<='},
+					{label:'大于',value:'>'},
+					{label:'大于等于',value:'>='},
+					{label:'范围',value:'<>'},
+					{label:'不等于',value:'!='},
+				],
 				isSave: false,
 				usercolumn: JSON.parse(JSON.stringify(this.column||[]))
 			}
diff --git a/src/components/scTable/components/headerSearch.vue b/src/components/scTable/components/headerSearch.vue
index 5a5224b..66e0c59 100644
--- a/src/components/scTable/components/headerSearch.vue
+++ b/src/components/scTable/components/headerSearch.vue
@@ -1,22 +1,22 @@
 <template>
-	<div class="headerSearch" v-for="(item,index) in columnList" :key="item">
-		<div class="searchItem" v-if="item.search_type == 'date_range' && (searchShow || (!searchShow && index<4)) && !item.hide">
+	<div class="headerSearch" v-for="(item,index) in columnList" :key="item" @click="hidePopover">
+		<div class="searchItem" v-if="item.search_type == 'date_range' && (searchShow || (!searchShow && index<4)) && !item.hide && item.is_search">
 			<label class="name">{{item.label}}</label>
 			<scDatePicker :size="size" v-model:activation_date="params[item.prop]" @change="changeData" @visible-change="getSelect(item,$event)" start-placeholder="开始日期" end-placeholder="结束日期"></scDatePicker>
 		</div>
-		<div class="searchItem" v-if="item.search_type =='checkbox' && (searchShow || (!searchShow && index<4)) && !item.hide">
+		<div class="searchItem" v-if="item.search_type =='checkbox' && (searchShow || (!searchShow && index<4)) && !item.hide && item.is_search">
 			<label class="name">{{item.label}}</label>
 			<scMultipleSelect :size="size" v-model:activation_select="params[item.prop]" @changeSelectData="changeData" @fetchData="getSelect(item,$event)" :placeholder="'请选择'+item.label" multiple collapse-tags filterable clearable>
 				<el-option v-for="em in item.data" :key="em" :label="em.label" :value="em.value || em.id"></el-option>
 			</scMultipleSelect>
 		</div>
-		<div class="searchItem" v-if="item.search_type == 'select' && (searchShow || (!searchShow && index<4)) && !item.hide">
+		<div class="searchItem" v-if="item.search_type == 'select' && (searchShow || (!searchShow && index<4)) && !item.hide && item.is_search">
 			<label class="name">{{item.label}}</label>
 			<el-select class="input" :size="size" v-model="params[item.prop]" @change="changeData" @visible-change="getSelect(item,$event)" :placeholder="'请选择'+item.label" filterable clearable>
 				<el-option v-for="em in item.data" :key="em" :label="em.label " :value="em[item.code[0]] || em.active_status"></el-option>
 			</el-select>
 		</div>
-		<div class="searchItem" v-if="item.search_type == 'text' && (searchShow || (!searchShow && index<4)) && !item.hide">
+		<div class="searchItem" v-if="item.search_type == 'text' && (searchShow || (!searchShow && index<4)) && !item.hide && item.is_search">
 			<label class="name">{{item.label}}</label>
 			<div>
 				<scVgInput class="input" v-model:activation_text="params[item.prop]" @fetchData="getText(item,$event)" :placeholder="'请输入'+item.label" :size="size"></scVgInput>
@@ -40,7 +40,8 @@ export default {
 		searchList:{
 			handler(val){
 				if(val && val.length>0){
-					this.columnList = val.filter(em=> !em.hide);
+					this.columnList = val.filter(em=> !em.hide && em.is_search);
+					// console.log(this.columnList,233)
 					this.params = this.groupByType(val);
 				}
 			},
@@ -92,6 +93,8 @@ export default {
 		},
 		getText(item){
 			this.$emit('fetchSelectData',{data:item,params:this.params});
+		},
+		hidePopover(){
 			eventBus.$emit('close-all-popovers');
 		},
 		reload(){
diff --git a/src/components/scTable/components/typePopover.vue b/src/components/scTable/components/typePopover.vue
index 3468a3c..a8b83c8 100644
--- a/src/components/scTable/components/typePopover.vue
+++ b/src/components/scTable/components/typePopover.vue
@@ -1,51 +1,54 @@
 <template>
 	<div class="popoverBox">
-		<el-popover :visible="visible" placement="bottom-end" :ref="`popover-${columnIndex}`" popper-class="customPopper">
-			<template #reference>
-				<span v-if="column.is_search && !column.hide" class="label" :class="filterModelParams.data[column.prop] && filterModelParams.data[column.prop].value!=''?'labelColor':''" style=" cursor: pointer;" @click.stop="clickShow(column)">
-					<span class="name">{{ column.label }}</span>
-					<el-icon class="sc-trend-icon"><sc-icon-Filter /></el-icon>
-				</span>
-				<span v-else class="label name" @click.stop>
-					{{ column.label }}
-				</span>
-			</template>
-			<!-- text 文本 -->
-			<div v-if="column.search_type == 'text'" @click.stop>
-				<el-input type="textarea" :autosize="{ minRows: 1, maxRows: 6 }" :size="size" clearable v-model="filterValue" placeholder="请输入查询内容" @clear="filterClear"></el-input>
-			</div>
-			<!-- date 单个日期-->
-			<div v-else-if="column.search_type == 'date'" @click.stop>
-				<el-date-picker v-model="filterValue" type="date" placeholder="选择日期" :size="size" format="YYYY-MM-DD" @clear="filterClear" />
-			</div>
-			<!-- datetime 日期时间-->
-			<div v-else-if="column.search_type == 'datetime'" @click.stop>
-				<el-date-picker v-model="filterValue" type="datetime" :size="size" placeholder="选择日期时间" format="YYYY-MM-DD HH:mm:ss" @clear="filterClear" />
-			</div>
-			<!-- date_range 日期范围-->
-			<div v-else-if="column.search_type == 'date_range'" @click.stop>
-				<el-date-picker v-model="filterValue" type="daterange" :size="size" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD" @change="dateChange"></el-date-picker>
-			</div>
+		<div class="handlerView" ref="buttonRef">
+			<span v-if="column.is_search && !column.hide" class="label" :class="filterModelParams.data[column.prop] && filterModelParams.data[column.prop].value!=''?'labelColor':''" style=" cursor: pointer;" @click.stop="clickShow(column)">
+				<span class="name">{{ column.label }}</span>
+				<el-icon class="sc-trend-icon"><sc-icon-Filter /></el-icon>
+			</span>
+			<span v-else class="label name" @click.stop>
+				{{ column.label }}
+			</span>
+		</div>
 
-			<!-- select 下拉选择-->
-			<div v-else-if="column.search_type == 'select'" @click.stop>
-				<el-select v-model="filterValue" placeholder="请选择" style="width: 100%" :size="size" clearable filterable filter @clear="filterClear" @visible-change="visibleChange(column,$event)">
-					<el-option v-for="(item, index) in column && column.data" :key="index" :label="item.label" :value="item.id"></el-option>
-				</el-select>
-			</div>
+		<div class="customPopperView" v-if="visible">
+			<el-popover :visible="visible" placement="bottom-end" :virtual-ref="buttonRef" virtual-triggering :ref="`popover-${columnIndex}`" popper-class="customPopper">
+				<!-- text 文本 -->
+				<div v-if="column.search_type == 'text'" @click.stop>
+					<el-input type="textarea" :autosize="{ minRows: 1, maxRows: 6 }" :size="size" clearable v-model="filterValue" placeholder="请输入查询内容" @clear="filterClear"></el-input>
+				</div>
+				<!-- date 单个日期-->
+				<div v-else-if="column.search_type == 'date'" @click.stop>
+					<el-date-picker v-model="filterValue" type="date" placeholder="选择日期" :size="size" format="YYYY-MM-DD" @clear="filterClear" />
+				</div>
+				<!-- datetime 日期时间-->
+				<div v-else-if="column.search_type == 'datetime'" @click.stop>
+					<el-date-picker v-model="filterValue" type="datetime" :size="size" placeholder="选择日期时间" format="YYYY-MM-DD HH:mm:ss" @clear="filterClear" />
+				</div>
+				<!-- date_range 日期范围-->
+				<div v-else-if="column.search_type == 'date_range'" @click.stop>
+					<el-date-picker v-model="filterValue" type="daterange" :size="size" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD" @change="dateChange"></el-date-picker>
+				</div>
 
-			<!-- select 多选下拉选择-->
-			<div v-else-if="column.search_type == 'checkbox'" @click.stop>
-				<el-select v-model="filterValue" placeholder="请选择" style="width: 100%" :size="size" clearable filterable filter multiple collapse-tags @clear="filterClear" @visible-change="visibleChange(column,$event)">
-					<el-option v-for="(item, index) in column && column.data" :key="index" :label="item.label" :value="item.value || item.id"></el-option>
-				</el-select>
-			</div>
+				<!-- select 下拉选择-->
+				<div v-else-if="column.search_type == 'select'" @click.stop>
+					<el-select v-model="filterValue" placeholder="请选择" style="width: 100%" :size="size" clearable filterable filter @clear="filterClear" @visible-change="visibleChange(column,$event)">
+						<el-option v-for="(item, index) in column && column.data" :key="index" :label="item.label" :value="item.id"></el-option>
+					</el-select>
+				</div>
 
-			<div style="text-align: right;display: flex;justify-content: flex-end;">
-				<el-button class="confirm" :size="size" @click="closeVisible">取消</el-button>
-				<el-button @click="confirm()" type="primary" :size="size" class="confirm">确定</el-button>
-			</div>
-		</el-popover>
+				<!-- select 多选下拉选择-->
+				<div v-else-if="column.search_type == 'checkbox'" @click.stop>
+					<el-select v-model="filterValue" placeholder="请选择" style="width: 100%" :size="size" clearable filterable filter multiple collapse-tags @clear="filterClear" @visible-change="visibleChange(column,$event)">
+						<el-option v-for="(item, index) in column && column.data" :key="index" :label="item.label" :value="item.value || item.id"></el-option>
+					</el-select>
+				</div>
+
+				<div style="text-align: right;display: flex;justify-content: flex-end;">
+					<el-button class="confirm" :size="size" @click="closeVisible">取消</el-button>
+					<el-button @click="confirm()" type="primary" :size="size" class="confirm">确定</el-button>
+				</div>
+			</el-popover>
+		</div>
 	</div>
 </template>
 <script>
@@ -56,8 +59,12 @@ import { inject } from "vue";
 import {eventBus} from "@/utils/eventBus"
 export default {
 	name: 'typePopover',
+	directives: {
+
+	},
 	data() {
 		return {
+			buttonRef:{},
 			visible: false,
 			size: 'small',
 			checkedColumn: {},
@@ -101,6 +108,7 @@ export default {
 			eventBus.$emit('close-all-popovers');
 			this.visible = !wasVisible;
 			if (this.visible) {
+				this.buttonRef = this.$refs.buttonRef;
 				this.checkedColumn = column;
 				if (this.filterModelParams && this.filterModelParams.data && this.filterModelParams.data[column.prop]) {
 					switch (column.search_type){
@@ -155,15 +163,9 @@ export default {
 		},
 		closeVisible(){
 			this.visible = false;
-			// this.$nextTick(()=>{
-			// 	this.$refs['popover-'+this.columnIndex].hide();
-			// })
 		},
 		closePopover() {
 			this.visible = false;
-			// this.$nextTick(()=>{
-			// 	this.$refs['popover-'+this.columnIndex].hide();
-			// })
 		},
 		/** 日期清空的处理 */
 		dateChange(val) {
@@ -179,20 +181,25 @@ export default {
 			}
 			switch (this.checkedColumn.search_type){
 				case 'text':
-					params.value = this.filterValue?this.checkedColumn.condition==="="?this.filterValue:'%'+this.filterValue+'%':""
+					params.value = ""
 					break;
 				case 'date_range':
-					params.value = this.filterValue.length>0? this.filterValue.map((date,index) => index===0? this.$TOOL.formatStartTime(date):this.$TOOL.formatEndTime(date)):[];
+					params.value = [];
+					break;
+				case 'checkbox':
+					params.value = [];
 					break;
 				default:
-					params.value = this.filterValue;
+					params.value = "";
 					break
 			}
-			this.filterTagClose(params);
+			this.filterValue = "";
+			this.filterTagClose({[this.checkedColumn.prop]:params});
 		},
 		/** 重置输入框值 */
 		resetFilter(){
 			this.filterValue = "";
+			this.visible = false;
 		}
 	},
 }
@@ -202,6 +209,10 @@ export default {
 	display: flex;
 	align-items: center;
 	width: 100%;
+	position: relative;
+	.handlerView{
+		width: 100%;
+	}
 	.label{
 		width: 100%;
 		.el-icon{
diff --git a/src/utils/tool.js b/src/utils/tool.js
index 57556bc..a38b9a9 100644
--- a/src/utils/tool.js
+++ b/src/utils/tool.js
@@ -172,29 +172,25 @@ tool.dateFormat = function (date, fmt='yyyy-MM-dd hh:mm:ss') {
 /* 转时间戳 开始时间 */
 tool.formatStartTime = function(time){
 	let date = new Date(time);
-	date.setHours(0);
+	date.setHours(0,0,0);
 	return Math.floor(date.getTime() / 1000)
 }
 /* 转时间戳 结束时间 */
 tool.formatEndTime = function(time){
 	let date = new Date(time);
-	date.setHours(23);
+	date.setHours(23,59,59);
 	return Math.floor(date.getTime() / 1000)
 }
 /* 时间戳转日期 开始 */
 tool.getStartTime = function (time){
 	let date = new Date(time * 1000);
-	date.setHours(0);
-	tool.dateFormat(date,'yyyy-MM-dd');
-	// return date.toISOString();
+	date.setHours(0,0,0);
 	return tool.dateFormat(date,'yyyy-MM-dd');
 }
 /* 时间戳转日期 结束 */
 tool.getEndTime = function(time){
 	let date = new Date(time * 1000);
-	date.setHours(23);
-	tool.dateFormat(date,'yyyy-MM-dd');
-	// return date.toISOString()
+	date.setHours(23,59,59);
 	return tool.dateFormat(date,'yyyy-MM-dd');
 }
 
diff --git a/src/views/order/orderList/index.vue b/src/views/order/orderList/index.vue
index 13d01be..6805af8 100644
--- a/src/views/order/orderList/index.vue
+++ b/src/views/order/orderList/index.vue
@@ -24,14 +24,11 @@
 		<el-main class="nopadding">
 			<div class="flowPath">
 				<flow :list="flowList"/>
-<!--				<video src="blob:https://y.qq.com/e5c50681-05f0-42a0-b70a-47c651a881d7">-->
-<!--					-->
-<!--				</video>-->
 			</div>
 			<div class="searchMain searchMainNoTop">
 				<scTableSearch ref="scSearch" :searchList="list.column" :paramsData="params" :searchShow="searchShow" @fetchSelectData="getSelectData" @changeHeaderData="getHeaderData"></scTableSearch>
 
-				<div class="searchItem searchBtn">
+				<div class="searchItem searchBtn" v-if="searchHeaderShow">
 					<el-button :size="size" :icon="searchShow?'el-icon-ArrowUpBold':'el-icon-ArrowDownBold'" @click="searchShowClick">{{searchShow?'收起':'更多'}}</el-button>
 					<el-button :size="size" type="primary" icon="el-icon-search" @click="upSearch">查询</el-button>
 					<el-button :size="size" type="info" icon="el-icon-RefreshRight" @click="reset">重置</el-button>
@@ -120,6 +117,7 @@ export default {
 			selection: [],
 			exportShow:false,
 			searchShow:false,
+			searchHeaderShow:false,
 			filterMap:{
 				data:{}
 			},
@@ -136,12 +134,23 @@ export default {
 			filterModelParams:this.filterModelParams,
 		}
 	},
+	watch:{
+		'list.column':{
+			handler(val){
+				this.searchHeaderShow = val.length>0 && val.some(em=>em.is_search);
+			},
+			immediate:false,
+			deep:true
+		}
+	},
 	computed:{
 		filterModelParams(){
 			return this.filterMap
-		}
+		},
 	},
 	mounted() {
+		this.buttonRef = this.$refs.buttonRef;
+
 		// 获取新消息
 		eventBus.$on('sockBack', this.getWsResult);
 		this.getStatusList();
@@ -160,6 +169,11 @@ export default {
 		 * 表格检索开始
 		 * */
 		columnBack(val){
+			val.forEach(item=>{
+				if(item.prop === "business_status"){
+					item.data = this.setMap.statusList;
+				}
+			})
 			this.list.column = val;
 		},
 		async filterClick(item) {
@@ -180,12 +194,15 @@ export default {
 		filterParams(params){
 			let filterParams = Object.assign(this.params,params);
 			this.filterMap.data = filterParams;
+			this.upSearch();
 		},
-		tagClose(){
-
+		tagClose(params){
+			let filterParams = Object.assign(this.params,params);
+			this.filterMap.data = filterParams;
 		},
 		searchShowClick(){
 			this.searchShow = !this.searchShow;
+			eventBus.$emit('close-all-popovers');
 		},
 		getHeaderData(params){
 			this.params = params;
@@ -382,6 +399,7 @@ export default {
 			this.params = {};
 			this.filterMap.data = {};
 			this.$refs.scSearch.reload();
+			eventBus.$emit('reset-popovers');
 			this.$refs.table.reload();
 		},
 		handleSaveSuccess(){