Browse Source

失去焦点和保存按钮先后问题

hella_online_20240829
张立 6 months ago
parent
commit
f499241e76
  1. 21
      src/api/wms/business/inputBlur.ts
  2. 69
      src/components/BasicForm/src/BasicForm.vue
  3. 14
      src/components/Form/src/Form.vue
  4. 8
      src/components/TableForm/src/TableForm.vue

21
src/api/wms/business/inputBlur.ts

@ -23,7 +23,9 @@ const { t } = useI18n() // 国际化
* FormBlur * FormBlur
*/ */
export const tableFormBlurVer = async (headerItem, val, row, index, routeName, formRef, detailData, tableData, callback) => { export const tableFormBlurVer = async (headerItem, val, row, index, routeName, formRef, detailData, tableData, callback) => {
if (headerItem.tableForm.searchPage && headerItem.tableForm.verificationParams) {
try {
if (headerItem?.tableForm?.searchPage && headerItem?.tableForm?.verificationParams) {
if (val && isString(val)) { if (val && isString(val)) {
if (val.indexOf(',') > -1) { if (val.indexOf(',') > -1) {
message.alert('该输入框只能输入一条数据') message.alert('该输入框只能输入一条数据')
@ -204,8 +206,16 @@ export const tableFormBlurVer = async (headerItem, val, row, index, routeName, f
}) })
} }
} }
} catch {
message.warning('暂无数据')
row[headerItem.field] = ''
return
}
} }
export const FormBlur = async (field, val, routeName, formRef, detailData, formSchema, callback) => { export const FormBlur = async (field, val, routeName, formRef, detailData, formSchema, callback) => {
const setV = {}
setV[field] = ''
try {
if (formSchema.searchPage && formSchema.verificationParams) { if (formSchema.searchPage && formSchema.verificationParams) {
//获取data.ts参数信息 //获取data.ts参数信息
const searchCondition = formSchema?.searchCondition || [] const searchCondition = formSchema?.searchCondition || []
@ -216,8 +226,7 @@ export const FormBlur = async (field, val, routeName, formRef, detailData, formS
// searchCondition = [...searchCondition, ...verificationParams] // searchCondition = [...searchCondition, ...verificationParams]
if (val && isString(val)) { if (val && isString(val)) {
const setV = {}
setV[field] = ''
let params = {} let params = {}
const _searchCondition = {} const _searchCondition = {}
const filters: any[] = [] const filters: any[] = []
@ -381,6 +390,12 @@ export const FormBlur = async (field, val, routeName, formRef, detailData, formS
}) })
} }
} }
} catch {
message.alert('暂无数据')
formRef.setValues(setV)
return
}
} }

69
src/components/BasicForm/src/BasicForm.vue

@ -20,6 +20,7 @@
@onChange="onChange" @onChange="onChange"
@onBlur="onBlur" @onBlur="onBlur"
@onEnter="onEnter" @onEnter="onEnter"
@onFocus="onFocus"
> >
<template #crontab="formSchema1" v-if="fromeWhere == 'countPlan'"> <template #crontab="formSchema1" v-if="fromeWhere == 'countPlan'">
<crontab <crontab
@ -105,6 +106,7 @@
@batchAdd="batchAdd" @batchAdd="batchAdd"
:routeName="routeName" :routeName="routeName"
@visibleChange="visibleChange" @visibleChange="visibleChange"
@inputStringFcous='inputStringFcous'
> >
<template v-slot="{ row }"> <template v-slot="{ row }">
<slot :row="row"></slot> <slot :row="row"></slot>
@ -126,7 +128,7 @@
</div> </div>
<template #footer> <template #footer>
<slot name="foorter"></slot> <slot name="foorter"></slot>
<ButtonBase :Butttondata="Butttondata" @button-base-click="buttonBaseClick" /> <ButtonBase :Butttondata="Butttondata" @button-base-click="buttonBaseClick" :key="count" />
</template> </template>
</Dialog> </Dialog>
<SearchTable <SearchTable
@ -148,6 +150,7 @@ import TableFormCountPlan from '@/components/TableFormCountPlan/src/TableFormCou
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict' import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
import { tableFormBlurVer, FormBlur, getListByBottonInput } from '@/api/wms/business/inputBlur' import { tableFormBlurVer, FormBlur, getListByBottonInput } from '@/api/wms/business/inputBlur'
import { isString } from 'min-dash' import { isString } from 'min-dash'
const count = ref(0)
const props = defineProps({ const props = defineProps({
// //
@ -365,7 +368,6 @@ const tableFormRules = ref(props.tableFormRules)
const route = useRoute() // const route = useRoute() //
const routeName = ref('') const routeName = ref('')
routeName.value = route.name routeName.value = route.name
const isExecute = ref(true) //true
// - // -
// const buttondata = [ // const buttondata = [
@ -410,7 +412,7 @@ const opensearchTable = (
// searchCondition.forEach((item) => { // searchCondition.forEach((item) => {
// row // row
if (searchCondition[i].isMainValue) { if (searchCondition[i].isMainValue) {
if(searchCondition[i].isFilterValue){ if (searchCondition[i].isFilterValue) {
//filters //filters
filters.push({ filters.push({
action: searchCondition[i].action, action: searchCondition[i].action,
@ -423,9 +425,10 @@ const opensearchTable = (
? row[searchCondition[i].value] ? row[searchCondition[i].value]
: '' : ''
}) })
}else{ } else {
_searchCondition[searchCondition[i].key] = formRef.value.formModel[
_searchCondition[searchCondition[i].key] = formRef.value.formModel[searchCondition[i].value] searchCondition[i].value
]
? formRef.value.formModel[searchCondition[i].value] ? formRef.value.formModel[searchCondition[i].value]
: props.detailData : props.detailData
? props.detailData[searchCondition[i].value] ? props.detailData[searchCondition[i].value]
@ -447,7 +450,6 @@ const opensearchTable = (
return return
} }
} }
} else if (searchCondition[i].isTableRowValue) { } else if (searchCondition[i].isTableRowValue) {
if (searchCondition[i].required) { if (searchCondition[i].required) {
if (row[searchCondition[i].value] == '' || row[searchCondition[i].value] == undefined) { if (row[searchCondition[i].value] == '' || row[searchCondition[i].value] == undefined) {
@ -613,6 +615,7 @@ const open = async (
} }
formType.value = type formType.value = type
resetForm() resetForm()
count.value = 0
// //
// masterIdnumber // masterIdnumber
if (masterParmas) { if (masterParmas) {
@ -856,10 +859,9 @@ const onChange = (field, cur) => {
* @param field 当前操作字段 * @param field 当前操作字段
* @param e * @param e
*/ */
const onBlur = async (field, e) => { const onBlur = async (field, e) => {
isExecute.value = false
let formSchemaObj = formSchema.value.find((item) => item.field == field)?.componentProps let formSchemaObj = formSchema.value.find((item) => item.field == field)?.componentProps
if (formSchemaObj?.enterSearch) { if (formSchemaObj?.enterSearch) {
await FormBlur( await FormBlur(
field, field,
@ -872,10 +874,17 @@ const onBlur = async (field, e) => {
emit('searchTableSuccess', field, formSchemaObj.searchField, list, formRef.value, 'form') emit('searchTableSuccess', field, formSchemaObj.searchField, list, formRef.value, 'form')
} }
) )
console.log(22222)
if (props.isShowFooterButtton && !props.footButttondata) {
Butttondata = [
defaultButtons.formSaveBtn(null), //
defaultButtons.formCloseBtn(null) //
]
count.value++
}
} else { } else {
emit('onBlur', field, e) emit('onBlur', field, e)
} }
isExecute.value = true
} }
// //
@ -908,10 +917,10 @@ const batchAdd = async (val) => {
) )
} }
) )
} }
const inputStringBlur = async (headerItem, val, row, index) => { const inputStringBlur = async (headerItem, val, row, index) => {
// isExecute.value = false
await tableFormBlurVer( await tableFormBlurVer(
headerItem, headerItem,
val, val,
@ -921,7 +930,7 @@ const inputStringBlur = async (headerItem, val, row, index) => {
formRef.value, formRef.value,
props.detailData, props.detailData,
props.tableData, props.tableData,
( list) => { (list) => {
emit( emit(
'searchTableSuccess', 'searchTableSuccess',
headerItem.field, headerItem.field,
@ -935,10 +944,38 @@ const inputStringBlur = async (headerItem, val, row, index) => {
) )
} }
) )
if (props.isShowFooterButtton && !props.footButttondata) {
// isExecute.value = true Butttondata = [
defaultButtons.formSaveBtn(null), //
defaultButtons.formCloseBtn(null) //
]
count.value++
}
}
//
const onFocus = (field) => {
let formSchemaObj = formSchema.value.find((item) => item.field == field)?.componentProps
if (formSchemaObj?.enterSearch) {
if (props.isShowFooterButtton && !props.footButttondata) {
Butttondata = [
defaultButtons.formSaveBtn({ disabled: true }), //
defaultButtons.formCloseBtn(null) //
]
}
count.value++
}
}
const inputStringFcous= (headerItem) => {
if (headerItem?.tableForm?.searchPage && headerItem?.tableForm?.verificationParams) {
if (props.isShowFooterButtton && !props.footButttondata) {
Butttondata = [
defaultButtons.formSaveBtn({ disabled: true }), //
defaultButtons.formCloseBtn(null) //
]
}
count.value++
}
} }
/** /**
* 回车事件 * 回车事件
* @param field 当前操作字段 * @param field 当前操作字段
@ -946,7 +983,7 @@ const inputStringBlur = async (headerItem, val, row, index) => {
*/ */
const onEnter = async (field, value, e) => { const onEnter = async (field, value, e) => {
let formSchemaObj = formSchema.value.find((item) => item.field == field)?.componentProps let formSchemaObj = formSchema.value.find((item) => item.field == field)?.componentProps
if (formSchemaObj?.enterSearch && formSchemaObj?.isEnter ) { if (formSchemaObj?.enterSearch && formSchemaObj?.isEnter) {
await FormBlur( await FormBlur(
field, field,
value, value,

14
src/components/Form/src/Form.vue

@ -55,7 +55,7 @@ export default defineComponent({
vLoading: propTypes.bool.def(false), vLoading: propTypes.bool.def(false),
labelPosition: propTypes.string.def('left'), labelPosition: propTypes.string.def('left'),
}, },
emits: ['register','opensearchTable','clearSearchInput', 'onChange', 'onBlur','onEnter','hiddenFilterButton','changeDialogWidth','onInput'], emits: ['register','opensearchTable','clearSearchInput', 'onChange', 'onBlur','onFocus','onEnter','hiddenFilterButton','changeDialogWidth','onInput'],
setup(props, { slots, expose, emit }) { setup(props, { slots, expose, emit }) {
// element form // element form
const elFormRef = ref<ComponentRef<typeof ElForm>>() const elFormRef = ref<ComponentRef<typeof ElForm>>()
@ -204,6 +204,10 @@ export default defineComponent({
const onBlur = (field, e) => { const onBlur = (field, e) => {
emit('onBlur', field, e) emit('onBlur', field, e)
} }
const onFocus = (field) => {
emit('onFocus', field)
}
const onInput = (field,value) => { const onInput = (field,value) => {
emit('onInput', field,value) emit('onInput', field,value)
} }
@ -270,8 +274,8 @@ export default defineComponent({
emit('onEnter',item.field,formModel.value[item.field],event) emit('onEnter',item.field,formModel.value[item.field],event)
} }
}} }}
onBlur={(e) => { onBlur(item.field, e) }}
onBlur={(e)=>{onBlur(item.field, e)}} onFocus={(e) => { onFocus(item.field) }}
onChange={(e)=>{onChange(item.field, e)}} onChange={(e)=>{onChange(item.field, e)}}
v-slots={{ v-slots={{
suffix: () => ( suffix: () => (
@ -325,6 +329,7 @@ export default defineComponent({
}} }}
onBlur={(e)=>{onBlur(item.field,formModel.value[item.field])}} onBlur={(e)=>{onBlur(item.field,formModel.value[item.field])}}
onFocus={(e) => { onFocus(item.field)}}
onChange={(e)=>{onChange(item.field,formModel.value[item.field])}} onChange={(e)=>{onChange(item.field,formModel.value[item.field])}}
disabled={item?.componentProps?.enterSearch?false:true} v-slots={{ disabled={item?.componentProps?.enterSearch?false:true} v-slots={{
suffix: () => ( suffix: () => (
@ -392,7 +397,8 @@ export default defineComponent({
{...setComponentProps(item)} {...setComponentProps(item)}
style={item.componentProps?.style} style={item.componentProps?.style}
onChange={(e)=>{onChange(item.field, e)}} onChange={(e)=>{onChange(item.field, e)}}
onBlur={(e)=>{onBlur(item.field, e)}} onBlur={(e) => { onBlur(item.field, e) }}
onFocus={(e) => { onFocus(item.field) }}
onInput={(value)=>{onInput(item.field,value)}} onInput={(value)=>{onInput(item.field,value)}}
{...(notRenderOptions.includes(item?.component as string) && {...(notRenderOptions.includes(item?.component as string) &&
item?.componentProps?.options item?.componentProps?.options

8
src/components/TableForm/src/TableForm.vue

@ -93,6 +93,7 @@
style="flex: 1" style="flex: 1"
@blur="inputStringBlur(headerItem, row[headerItem.field], row, index)" @blur="inputStringBlur(headerItem, row[headerItem.field], row, index)"
@clear='clearInput(headerItem.field, row, index)' @clear='clearInput(headerItem.field, row, index)'
@focus="inputStringFcous(headerItem)"
/> />
<Icon <Icon
icon="ep:circle-close" icon="ep:circle-close"
@ -526,7 +527,8 @@ const emit = defineEmits([
'formFormDateChange', 'formFormDateChange',
'clearInput', 'clearInput',
'batchAdd', 'batchAdd',
'visibleChange' 'visibleChange',
'inputStringFcous'
]) ])
// | type = radio | type = select // | type = radio | type = select
const initSelectOptions = (headerItem,row) => { const initSelectOptions = (headerItem,row) => {
@ -653,6 +655,10 @@ const inpuFocus = (headerItem, row, index) => {
const inputStringBlur = (headerItem, val, row, index) => { const inputStringBlur = (headerItem, val, row, index) => {
emit('inputStringBlur', headerItem, val, row, index) emit('inputStringBlur', headerItem, val, row, index)
} }
//
const inputStringFcous = (headerItem) => {
emit('inputStringFcous', headerItem)
}
const clearInput = (field, row, index) => { const clearInput = (field, row, index) => {
emit('clearInput', field, row, index) emit('clearInput', field, row, index)
} }

Loading…
Cancel
Save