agilebuilder-ui 1.1.65-tmp3 → 1.1.65-tmp30

package/packages/super-grid/src/search-form-advancedQuery.vue

@@ -1,836 +0,0 @@
-<template>
-	<div v-if="formFlag">
-		<!-- <el-row style="padding-bottom: 8px">
-						<el-button type="primary" size="default" plain icon="el-icon-circle-plus-outline" @click="add">
-							{{ $t('imatrixUIPublicModel.add') }}
-						</el-button>
-						<el-button type="primary" size="default" plain icon="el-icon-delete" @click="remove">
-							{{ $t('imatrixUIPublicModel.delete') }}
-						</el-button>
-					</el-row> -->
-		<el-table
-				ref="table"
-				:data="searchFormList"
-				:row-class-name="tableRowClassName"
-				border
-				highlight-current-row
-				style="width: 100%"
-				@current-change="handleCurrentChange"
-		>
-			<el-table-column
-					:label="$t('imatrixUIPublicModel.edit')"
-					align="center"
-					fixed="left"
-					width="80"
-			>
-				<template v-slot="scope">
-					<el-icon @click="add">
-						<CirclePlus/>
-					</el-icon>
-					<el-icon @click="remove(scope.$index)">
-						<Remove/>
-					</el-icon>
-				</template>
-			</el-table-column>
-			<el-table-column label="(" prop="leftBracket" width="90">
-				<template v-slot="scope">
-					<el-select
-							v-model="scope.row.leftBracket"
-							clearable
-							size="default"
-							@focus="selectRow(scope.row)"
-					>
-						<el-option label="" value=""/>
-						<el-option label="(" value="("/>
-						<el-option label="((" value="(("/>
-						<el-option label="(((" value="((("/>
-					</el-select>
-				</template>
-			</el-table-column>
-			<el-table-column
-					:label="$t('imatrixUIPublicModel.fieldName')"
-					width="200"
-			>
-				<template v-slot="scope">
-					<el-select
-							v-model="scope.row.prop"
-							clearable
-							filterable
-							size="default"
-							@change="changeFieldName(scope.$index)"
-							@focus="selectRow(scope.row)"
-					>
-						<el-option
-								v-for="item in searchableColumns"
-								:key="item.prop"
-								:label="item.label"
-								:value="item.prop"
-						/>
-					</el-select>
-				</template>
-			</el-table-column>
-			<el-table-column :label="$t('imatrixUIPublicModel.operator')" width="110">
-				<template v-slot="scope">
-					<el-select
-							v-model="scope.row.operator"
-							clearable
-							size="default"
-							@focus="selectRow(scope.row)"
-					>
-						<el-option
-								v-for="option in operationArr[scope.$index]"
-								:key="option.name"
-								:label="option.label"
-								:value="option.name"
-						/>
-					</el-select>
-				</template>
-			</el-table-column>
-			<el-table-column :label="$t('imatrixUIPublicModel.value')">
-				<template v-if="scope.row.prop" v-slot="scope">
-					<el-date-picker
-							v-if="
-              scope.row.dataType === 'DATE' ||
-              scope.row.componentType === 'date'
-            "
-							v-model="scope.row.value"
-							:end-placeholder="$t('imatrixUIMessage.endDate')"
-							:range-separator="$t('imatrixUIPublicModel.to')"
-							:start-placeholder="$t('imatrixUIMessage.startDate')"
-							:style="scope.row.searchControlWidth"
-							size="default"
-							type="daterange"
-							unlink-panels
-							value-format="YYYY-MM-DD"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-					/>
-
-					<el-date-picker
-							v-else-if="scope.row.componentType === 'dateTimePicker'"
-							v-model="scope.row.value"
-							:end-placeholder="$t('imatrixUIMessage.endDate')"
-							:range-separator="$t('imatrixUIPublicModel.to')"
-							:start-placeholder="$t('imatrixUIMessage.startDate')"
-							:style="scope.row.searchControlWidth"
-							size="default"
-							type="datetimerange"
-							unlink-panels
-							value-format="YYYY-MM-DD HH:mm:ss"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-					/>
-
-					<el-date-picker
-							v-else-if="
-              scope.row.dataType === 'TIME' &&
-              scope.row.componentType === 'timepicker'
-            "
-							v-model="scope.row.value"
-							:end-placeholder="$t('imatrixUIMessage.endDate')"
-							:range-separator="$t('imatrixUIPublicModel.to')"
-							:start-placeholder="$t('imatrixUIMessage.startDate')"
-							:style="scope.row.searchControlWidth"
-							size="default"
-							type="datetimerange"
-							unlink-panels
-							value-format="HH:mm:ss"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-					/>
-
-					<el-time-picker
-							v-else-if="
-              scope.row.componentType === 'timepicker' &&
-              scope.row.dataType !== 'TIME' &&
-              scope.row.dataType !== 'DATE'
-            "
-							v-model="scope.row.value"
-							:placeholder="$t('imatrixUIMessage.selectTime')"
-							size="default"
-							style="width: 100%"
-							type="fixed-time"
-							value-format="HH:mm:ss"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-					/>
-
-					<organization-input
-							v-else-if="componentTypeTypeIsTree(scope.row.componentType)"
-							v-model:value="scope.row.value"
-							:fields="getTreeFields(scope.row.orgTreeSet)"
-							:models="searchForm"
-							:multiple="getTreeIsMultiTree(scope.row.componentType)"
-							:size="default"
-							:tree-type="getTreeType(scope.row.componentType)"
-							@clear="clearOrganizationInputEvent"
-							@focus="selectRow(scope.row)"
-							@setValue="organizationInputEvent"
-					/>
-
-					<el-select
-							v-else-if="
-              ((scope.row.componentType &&
-                scope.row.componentType === 'select') ||
-                scope.row.dataType === 'BOOLEAN') &&
-              !isDynamicDataSourceSource(scope.row)
-            "
-							v-model="scope.row.value"
-							:placeholder="$t('imatrixUIMessage.pleaseSelect')"
-							:style="scope.row.searchControlWidth"
-							clearable
-							size="default"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-					>
-						<el-option
-								v-for="item in scope.row.valueSet"
-								:key="item.value"
-								:label="item.label"
-								:value="item.value"
-						/>
-					</el-select>
-					<el-select
-							v-else-if="
-              scope.row.componentType &&
-              scope.row.componentType === 'multiselect' &&
-              !isDynamicDataSourceSource(scope.row)
-            "
-							v-model="scope.row.value"
-							:placeholder="$t('imatrixUIMessage.pleaseSelect')"
-							:style="scope.row.searchControlWidth"
-							clearable
-							collapse-tags
-							multiple
-							size="default"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-					>
-						<el-option
-								v-for="item in scope.row.valueSet"
-								:key="item.value"
-								:label="item.label"
-								:value="item.value"
-						/>
-					</el-select>
-
-					<dynamic-source-select
-							v-else-if="
-              scope.row.componentType &&
-              (scope.row.componentType === 'multiselect' ||
-                scope.row.componentType === 'select') &&
-              isDynamicDataSourceSource(scope.row)
-            "
-							:base-props="{
-              multiple:
-                scope.row.componentType === 'multiselect' ? true : false,
-            }"
-							:entity="scope.row"
-							:is-join-table="isJoinTable"
-							:list-code="code"
-							:options="getDynamicDataSourceOptions(scope.row)"
-							:table-name="tableName"
-							:value="scope.row.value"
-							@input="setValueToModelProp(scope.$index, $event)"
-					/>
-					<search-form-number
-							v-else-if="
-              scope.row.componentType &&
-              scope.row.componentType === 'inputNumber'
-            "
-							:n="n"
-							:r="r"
-							size="default"
-							@focus="selectRow(scope.row)"
-							@setValue="setNumberValue"
-					/>
-
-					<el-switch
-							v-else-if="
-              scope.row.componentType && scope.row.componentType === 'switch'
-            "
-							v-model="scope.row.value"
-							:style="scope.row.searchControlWidth"
-							active-color="#13ce66"
-							inactive-color="#ff4949"
-							size="default"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-					/>
-					<el-slider
-							v-else-if="
-              scope.row.componentType && scope.row.componentType === 'slider'
-            "
-							v-model="scope.row.value"
-							:style="scope.row.searchControlWidth"
-							size="default"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-					/>
-
-					<el-rate
-							v-else-if="
-              scope.row.componentType && scope.row.componentType === 'rate'
-            "
-							v-model="scope.row.value"
-							:style="scope.row.searchControlWidth"
-							size="default"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-					/>
-					<span v-else-if="customComponent(scope.row.prop) === true" style="width: 100%">
-            <component
-		            :is="scope.row.componentName"
-		            :ref="scope.row.componentName"
-		            v-model:value="scope.row.value"
-		            :prop="scope.row.prop"
-		            :row="scope.row"
-					:additional-settings="controlConfig"
-		            class="customComponent"
-		            @focus="selectRow(scope.row)"
-		            @input="
-                setValueToModelProp(
-                  scope.$index,
-                  $event,
-                  scope.row.componentName
-                )
-              "
-            />
-          </span>
-					<el-input
-							v-else
-							v-model="scope.row.value"
-							:style="scope.row.searchControlWidth"
-							size="default"
-							@focus="selectRow(scope.row)"
-							@input="setValueToModelProp(scope.$index, $event)"
-							@keyup.enter="submitForm('searchForm')"
-					/>
-				</template>
-			</el-table-column>
-			<el-table-column label=")" prop="rightBracket" width="90">
-				<template v-slot="scope">
-					<el-select
-							v-model="scope.row.rightBracket"
-							clearable
-							size="default"
-							@focus="selectRow(scope.row)"
-					>
-						<el-option label="" value=""/>
-						<el-option label=")" value=")"/>
-						<el-option label="))" value="))"/>
-						<el-option label=")))" value=")))"/>
-					</el-select>
-				</template>
-			</el-table-column>
-			<el-table-column
-					:label="$t('imatrixUIPublicModel.andOr')"
-					prop="logicOperator"
-					width="110"
-			>
-				<template v-slot="scope">
-					<el-select
-							v-model="scope.row.joinSign"
-							clearable
-							size="default"
-							@focus="selectRow(scope.row)"
-					>
-						<el-option :label="$t('imatrixUIPublicModel.perhaps')" value="or"/>
-						<el-option :label="$t('imatrixUIPublicModel.also')" value="and"/>
-					</el-select>
-				</template>
-			</el-table-column>
-			<el-table-column
-					:label="$t('imatrixUIPublicModel.whenTheVariableIsEmpty')"
-					width="110"
-			>
-				<template v-slot="scope">
-					<el-select
-							v-model="scope.row.variableIsNull"
-							clearable
-							size="default"
-							@focus="selectRow(scope.row)"
-					>
-						<el-option label="Null" value="null"/>
-						<el-option
-								:label="$t('imatrixUIPublicModel.ignore11')"
-								value="1=1"
-						/>
-						<el-option
-								:label="$t('imatrixUIPublicModel.nonConformity')"
-								value="1<>1"
-						/>
-					</el-select>
-				</template>
-			</el-table-column>
-		</el-table>
-	</div>
-</template>
-
-<script>
-import {$on, $off, $once, $emit} from '../../utils/gogocodeTransfer'
-import searchMethods from './search-methods'
-import searchFormNumber from './search-form-number.vue'
-// import { isOptionFunction, getSearchObject } from './utils'
-import store from './store'
-import SearchConditionInput from './search-condition-input.vue'
-import SearchConditionList from './search-condition-list.vue'
-import {getDynamicDataSourceOptions, isDynamicDataSourceSource, getControlConfig} from './utils'
-import {
-	CirclePlus,
-	Remove,
-} from '@element-plus/icons-vue'
-import * as Vue from 'vue'
-
-export default {
-	components: {
-		searchFormNumber,
-		SearchConditionInput,
-		SearchConditionList,
-		CirclePlus,
-		Remove
-	},
-	name: 'SearchForm',
-	props: {
-		searchableColumns: {
-			type: Array,
-			default: null,
-		},
-		searchFormList: {
-			type: Array,
-			default: null,
-		},
-		propMap: {
-			type: Object,
-			default: null,
-		},
-		code: {
-			type: String,
-			default: null,
-		},
-		isSql: {
-			type: Boolean,
-			default: false,
-		},
-	},
-	data() {
-		const gridParams = store.get(this.code)
-		let tableName
-		if (gridParams && gridParams.basicInfo && gridParams.basicInfo.tableName) {
-			tableName = gridParams.basicInfo.tableName
-		}
-		let isHasJoinTable
-		if (
-				gridParams &&
-				gridParams.basicInfo &&
-				gridParams.basicInfo.hasJoinTable
-		) {
-			isHasJoinTable = gridParams.basicInfo.hasJoinTable
-		}
-		const customComponentNames = new Set()
-		return {
-			customComponentNames: customComponentNames,
-			currentRow: null,
-			formFlag: true,
-			operationArr: [],
-			tableName,
-			isJoinTable: isHasJoinTable, // 是否是关联表
-			controlConfig: getControlConfig(this.column)
-		}
-	},
-	computed: {},
-	watch: {
-		searchableColumns: {
-			deep: true,
-			handler(newValue, oldValue) {
-				this.searchableColumns = newValue
-				this.refreshOperators()
-				this.formFlag = false
-				this.$nextTick(() => {
-					this.formFlag = true
-				})
-			},
-		},
-	},
-	created() {
-		this.refreshOperators()
-		if (!this.searchFormList || this.searchFormList.length < 1) {
-			this.add()
-		}
-	},
-	methods: {
-		...searchMethods,
-		getDynamicDataSourceOptions(column) {
-			const gridParams = store.get(this.code)
-			let baseURL = gridParams.options.backendUrl
-			if (!baseURL) {
-				baseURL = window.$vueApp.config.globalProperties.baseURL
-			}
-			return getDynamicDataSourceOptions(
-					column,
-					this.isSql,
-					gridParams.additionalParamMap,
-					baseURL
-			)
-		},
-		// 值设置是否是动态数据源类型的数据源
-		isDynamicDataSourceSource(column) {
-			return isDynamicDataSourceSource(column)
-		},
-		refreshOperators() {
-			if (this.searchableColumns && this.searchableColumns.length > 0) {
-				for (var i = 0; i < this.searchableColumns.length; i++) {
-					const prop = this.searchableColumns[i].prop
-					const item = this.propMap[prop]
-					this.operationArr[i] = this.getOperators(item)
-				}
-			}
-		},
-		handleCurrentChange(val) {
-			this.currentRow = val
-		},
-		tableRowClassName({row, rowIndex}) {
-			// 把每一行的索引放进row
-			row.index = rowIndex
-		},
-		// 选择行
-		selectRow(row) {
-			this.$refs.table.setCurrentRow(row)
-		},
-		// 改变选择的属性
-		changeFieldName(index) {
-			const prop = this.currentRow.prop
-			const item = this.propMap[prop]
-			this.searchFormList[index].dataType = item.dataType
-			this.searchFormList[index].orgProp = item.orgProp
-			this.searchFormList[index].componentType = item.componentType
-			this.searchFormList[index].componentName = item.componentName
-			this.searchFormList[index].queryMatching = item.queryMatching
-			this.searchFormList[index].searchControlWidth = item.searchControlWidth
-			this.searchFormList[index].fuzzy = item.fuzzy
-			this.searchFormList[index].valueSet = item.valueSet
-			this.operationArr[index] = this.getOperators(item)
-		},
-		setValueToModelProp(index, value, componentName) {
-			if (index !== null && index !== undefined) {
-				this.searchFormList[index]['value'] = value
-			}
-		},
-		componentTypeTypeIsTree(componentType) {
-			if (componentType) {
-				if (componentType.indexOf('DeptManTree') > 0) {
-					// 说明是部门人员树
-					return true
-				}
-				if (componentType.indexOf('DeptTree') > 0) {
-					// 说明是部门树
-					return true
-				}
-				if (componentType.indexOf('WgManTree') > 0) {
-					// 说明是工作组人员树
-					return true
-				}
-				if (componentType.indexOf('WgManTree') > 0) {
-					// 说明是工作组树
-					return true
-				}
-			}
-			return false
-		},
-		getTreeFields(orgTreeSet) {
-			if (orgTreeSet && orgTreeSet !== '') {
-				return JSON.parse(orgTreeSet)
-			}
-		},
-		getTreeIsMultiTree(componentType) {
-			if (
-					componentType &&
-					componentType.indexOf('single') >= 0 &&
-					componentType.indexOf('Tree') > 0
-			) {
-				return false
-			} else {
-				return true
-			}
-		},
-		getTreeType(componentType) {
-			if (componentType) {
-				if (componentType.indexOf('DeptManTree') > 0) {
-					// 说明是部门人员树
-					return 'DeptUserTree'
-				}
-				if (componentType.indexOf('DeptTree') > 0) {
-					// 说明是部门树
-					return 'DeptTree'
-				}
-				if (componentType.indexOf('WgTree') > 0) {
-					// 说明是工作组人员树
-					return 'WgTree'
-				}
-				if (componentType.indexOf('WgManTree') > 0) {
-					// 说明是工作组树
-					return 'WgUserTree'
-				}
-			}
-		},
-		// 组织结构树文本框值改变事件
-		organizationInputEvent(prop, value) {
-			if (this.currentRow) {
-				this.currentRow['value'] = value
-			}
-		},
-		// 组织结构树文本框值清空事件
-		clearOrganizationInputEvent(prop) {
-			if (this.currentRow) {
-				this.currentRow['value'] = null
-			}
-		},
-		customComponent(prop) {
-			const column = this.propMap[prop]
-			const gridParams = store.get(this.code)
-			if (column.componentName && column.componentName !== '') {
-				this.customComponentNames.add(column.componentName)
-				return true
-			}
-			if (
-					(!column.componentName || column.componentName === '') &&
-					gridParams.options &&
-					gridParams.options.search &&
-					gridParams.options.search.customSearchElements
-			) {
-				// 定义了自定义查询组件
-				const propSearchEle =
-						gridParams.options.search.customSearchElements[column.prop]
-				// console.log('customComponent-customSearchElements-propSearchEle-', column.prop)
-				if (propSearchEle) {
-					column.componentName = 'custom-' + column.prop
-					const component = propSearchEle.call(this, column)
-					// console.log('customComponent-customSearchElements-')
-					if (component) {
-						this.customComponentNames.add(column.componentName)
-						window.$vueApp.component(column.componentName, component)
-						return true
-					}
-				}
-			}
-			return false
-		},
-		validateForm() {
-			return new Promise((resolve, reject) => {
-				resolve(true)
-			})
-		},
-		resetForm() {
-			if (this.customComponentNames && this.customComponentNames.length > 0) {
-				for (const componentName of this.customComponentNames) {
-					// 遍历
-					this.$refs[componentName][0].resetField()
-				}
-			}
-			// 当是保持页数默认赋值的查询字段resetFields()不会被清空，需要下面的方法遍历设未null
-			$emit(this, 'resetForm')
-			this.add()
-		},
-		setNumberValue(value, r, n) {
-			if (this.currentRow) {
-				this.currentRow['value'] = value
-			}
-		},
-		// 添加
-		add() {
-			if (!this.searchFormList) {
-				this.searchFormList = []
-			}
-			this.searchFormList.push({
-				leftBracket: '',
-				prop: '',
-				operator: '',
-				value: '',
-				rightBracket: '',
-				joinSign: 'or',
-				dataType: '',
-				propDbName: '',
-			})
-			this.operationArr.push([])
-		},
-		// 删除
-		remove(index) {
-			if (index !== null && index !== undefined && index !== -1) {
-				this.searchFormList.splice(index, 1)
-			} else {
-				if (this.currentRow === null) {
-					this.$alert(this.$t('message.pleaseSelectARow'))
-					return
-				}
-				if (
-						this.currentRow &&
-						this.currentRow.index &&
-						this.currentRow.index !== null &&
-						this.currentRow.index !== undefined
-				) {
-					this.searchFormList.splice(this.currentRow.index, 1)
-				}
-			}
-		},
-		// 实时根据类型改变连接符
-		getOperators(item) {
-			if (item) {
-				if (
-						item.dataType === 'INTEGER' ||
-						item.dataType === 'LONG' ||
-						item.dataType === 'DOUBLE' ||
-						item.dataType === 'FLOAT'
-				) {
-					return [
-						{
-							name: 'GT',
-							label: this.$t('imatrixUIPublicModel.greaterThan'),
-						},
-						{
-							name: 'LT',
-							label: this.$t('imatrixUIPublicModel.lessThan'),
-						},
-						{
-							name: 'EQ',
-							label: this.$t('imatrixUIPublicModel.beEqualTo'),
-						},
-						{
-							name: 'LET',
-							label: this.$t('imatrixUIPublicModel.notGreaterThan'),
-						},
-						{
-							name: 'GET',
-							label: this.$t('imatrixUIPublicModel.notLessThan'),
-						},
-						{
-							name: 'NET',
-							label: this.$t('imatrixUIPublicModel.notEqualTo'),
-						},
-						{
-							name: 'IS_NULL',
-							label: this.$t('imatrixUIPublicModel.isNull'),
-						},
-						{
-							name: 'IS_NOT_NULL',
-							label: this.$t('imatrixUIPublicModel.isNotNull'),
-						},
-					]
-				} else if (item.dataType === 'DATE' || item.dataType === 'TIME') {
-					return [
-						{
-							name: 'GT',
-							label: this.$t('imatrixUIPublicModel.laterThan'),
-						},
-						{
-							name: 'LT',
-							label: this.$t('imatrixUIPublicModel.earlierThan'),
-						},
-						{
-							name: 'EQ',
-							label: this.$t('imatrixUIPublicModel.beEqualTo'),
-						},
-						{
-							name: 'LET',
-							label: this.$t('imatrixUIPublicModel.noLaterThan'),
-						},
-						{
-							name: 'GET',
-							label: this.$t('imatrixUIPublicModel.noEarlierThan'),
-						},
-						{
-							name: 'IS_NULL',
-							label: this.$t('imatrixUIPublicModel.isNull'),
-						},
-						{
-							name: 'IS_NOT_NULL',
-							label: this.$t('imatrixUIPublicModel.isNotNull'),
-						},
-					]
-				} else if (item.dataType === 'TEXT') {
-					return [
-						{
-							name: 'EQ',
-							label: this.$t('imatrixUIPublicModel.beEqualTo'),
-						},
-						{
-							name: 'NET',
-							label: this.$t('imatrixUIPublicModel.notEqualTo'),
-						},
-						{
-							name: 'CONTAIN',
-							label: this.$t('imatrixUIPublicModel.contain'),
-						},
-						{
-							name: 'NOT_CONTAIN',
-							label: this.$t('imatrixUIPublicModel.notIncluded'),
-						},
-						{
-							name: 'IS_NULL',
-							label: this.$t('imatrixUIPublicModel.isNull'),
-						},
-						{
-							name: 'IS_NOT_NULL',
-							label: this.$t('imatrixUIPublicModel.isNotNull'),
-						},
-					]
-				} else {
-					return [
-						{
-							name: 'EQ',
-							label: this.$t('imatrixUIPublicModel.beEqualTo'),
-						},
-						{
-							name: 'NET',
-							label: this.$t('imatrixUIPublicModel.notEqualTo'),
-						},
-						{
-							name: 'IS_NULL',
-							label: this.$t('imatrixUIPublicModel.isNull'),
-						},
-						{
-							name: 'IS_NOT_NULL',
-							label: this.$t('imatrixUIPublicModel.isNotNull'),
-						},
-					]
-				}
-			} else {
-				return [
-					{
-						name: 'EQ',
-						label: this.$t('imatrixUIPublicModel.beEqualTo'),
-					},
-					{
-						name: 'NET',
-						label: this.$t('imatrixUIPublicModel.notEqualTo'),
-					},
-					{
-						name: 'IS_NULL',
-						label: this.$t('imatrixUIPublicModel.isNull'),
-					},
-					{
-						name: 'IS_NOT_NULL',
-						label: this.$t('imatrixUIPublicModel.isNotNull'),
-					},
-				]
-			}
-		},
-	},
-	emits: ['resetForm'],
-}
-</script>
-
-<style scoped>
-.grid-search-form :deep(.el-form-item) {
-	margin-bottom: 0px;
-}
-
-.grid-search-form :deep(.search-btn) {
-	margin-bottom: 5px;
-	text-align: center;
-}
-
-.grid-search-form :deep(.el-select),
-.grid-search-form :deep(.customComponent) {
-  width: 100%;
-}
-</style>