sfms3.0
/
sfms3.0-ui
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

添加明细按钮点击的时候失去焦点内容还没有获取到

linshi20240813
zhang_li 3 months ago
parent
f7be8ea9a4
commit
a8e6411b02
2 changed files with 76 additions and 58 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7
      src/components/BasicForm/src/BasicForm.vue
  2. 115
      src/components/TableForm/src/TableForm.vue

7
src/components/BasicForm/src/BasicForm.vue
View File

@ -107,6 +107,7 @@
:routeName="routeName" :routeName="routeName"
@visibleChange="visibleChange" @visibleChange="visibleChange"
@inputStringFcous='inputStringFcous' @inputStringFcous='inputStringFcous'
:sureDisabled="sureDisabled"
> >
<template v-slot="{ row }"> <template v-slot="{ row }">
<slot :row="row"></slot> <slot :row="row"></slot>
@ -373,6 +374,7 @@ const tableAllSchemas = ref(props.tableAllSchemas)
const tableFormRules = ref(props.tableFormRules) const tableFormRules = ref(props.tableFormRules)
const route = useRoute() // 路由信息 const route = useRoute() // 路由信息
const routeName = ref('') const routeName = ref('')
const sureDisabled = ref(false)
routeName.value = route.name routeName.value = route.name
// 列表-按钮 // 列表-按钮
@ -888,6 +890,7 @@ const onBlur = async (field, e) => {
] ]
count.value++ count.value++
} }
sureDisabled.value= false
} else { } else {
emit('onBlur', field, e) emit('onBlur', field, e)
} }
@ -957,6 +960,8 @@ const inputStringBlur = async (headerItem, val, row, index) => {
] ]
count.value++ count.value++
} }
sureDisabled.value= false
} }
// 聚焦 // 聚焦
const onFocus = (field) => { const onFocus = (field) => {
@ -969,6 +974,7 @@ const onFocus = (field) => {
] ]
} }
count.value++ count.value++
sureDisabled.value= true
} }
} }
const inputStringFcous= (headerItem) => { const inputStringFcous= (headerItem) => {
@ -980,6 +986,7 @@ const inputStringFcous= (headerItem) => {
] ]
} }
count.value++ count.value++
sureDisabled.value= true
} }
} }
/** /**

115
src/components/TableForm/src/TableForm.vue
View File

@ -65,7 +65,8 @@
:width="headerItem?.tableForm?.width" :width="headerItem?.tableForm?.width"
:min-width="headerItem?.tableForm?.minWidth || '200px'" :min-width="headerItem?.tableForm?.minWidth || '200px'"
> >
<el-form @submit.native.prevent <el-form
@submit.native.prevent
ref="TableBaseForm_Ref" ref="TableBaseForm_Ref"
:model="row" :model="row"
style="width: 100%" style="width: 100%"
@ -92,7 +93,7 @@
:disabled="disabledInput(headerItem, row)" :disabled="disabledInput(headerItem, row)"
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)" @focus="inputStringFcous(headerItem)"
/> />
<Icon <Icon
@ -116,7 +117,7 @@
<slot :row="row"></slot> <slot :row="row"></slot>
</el-form-item> </el-form-item>
<!-- 金额输入框 --> <!-- 金额输入框 -->
<el-form-item v-if="headerItem?.tableForm?.type == 'number'" :prop="headerItem.field" > <el-form-item v-if="headerItem?.tableForm?.type == 'number'" :prop="headerItem.field">
<el-input <el-input
:key="headerItem.field + $index" :key="headerItem.field + $index"
v-model="row[headerItem.field]" v-model="row[headerItem.field]"
@ -169,10 +170,10 @@
@visible-change="visibleChange(headerItem.field, $event, row, $index)" @visible-change="visibleChange(headerItem.field, $event, row, $index)"
> >
<el-option <el-option
v-for="op in initSelectOptions(headerItem,row)" v-for="op in initSelectOptions(headerItem, row)"
:label="t(`ts.${initLabel(headerItem,op)}`).replace('ts.', '')" :label="t(`ts.${initLabel(headerItem, op)}`).replace('ts.', '')"
:value="initValue(headerItem,op)" :value="initValue(headerItem, op)"
:key="initValue(headerItem,op)" :key="initValue(headerItem, op)"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -199,7 +200,7 @@
@blur="tableFormSelectOnBlur(headerItem.field, $event, row, $index)" @blur="tableFormSelectOnBlur(headerItem.field, $event, row, $index)"
> >
<el-option-group <el-option-group
v-for="group in initSelectOptions(headerItem,row)" v-for="group in initSelectOptions(headerItem, row)"
:key="group.type" :key="group.type"
:label="t(`ts.${group.name}`).replace('ts.', '')" :label="t(`ts.${group.name}`).replace('ts.', '')"
> >
@ -305,7 +306,7 @@
:id="headerItem?.tableForm?.id" :id="headerItem?.tableForm?.id"
> >
<el-radio <el-radio
v-for="(item, index) in initSelectOptions(headerItem,row)" v-for="(item, index) in initSelectOptions(headerItem, row)"
:key="index" :key="index"
:label="t(`ts.${item.value}`).replace('ts.', '')" :label="t(`ts.${item.value}`).replace('ts.', '')"
:size="headerItem?.tableForm?.size" :size="headerItem?.tableForm?.size"
@ -329,7 +330,7 @@
:fill="headerItem?.tableForm?.fill" :fill="headerItem?.tableForm?.fill"
> >
<el-checkbox <el-checkbox
v-for="(item, index) in initSelectOptions(headerItem,row)" v-for="(item, index) in initSelectOptions(headerItem, row)"
:key="index" :key="index"
:label="t(`ts.${item.value}`).replace('ts.', '')" :label="t(`ts.${item.value}`).replace('ts.', '')"
:disabled="itemIsDisabled(headerItem, row)" :disabled="itemIsDisabled(headerItem, row)"
@ -391,32 +392,34 @@
layout="total, prev, pager, next, jumper" layout="total, prev, pager, next, jumper"
:total="tableData.length" :total="tableData.length"
/> />
<div class="button flex" v-if="isShowButton || isShowReduceButtonSelection"> <div class="button flex" style="padding-top: 10px" v-if="isShowButton || isShowReduceButtonSelection">
<div class="p-12px" v-if="isShowButton" @click.stop="handleAddTable"> <el-button
<Icon icon="ep:circle-plus" color="#409eff" size="26" style="cursor: pointer" /> type="primary"
<div>{{ t('ts.添加明细') }}</div> link
</div> v-if="isShowButton"
<div class="p-12px" v-if="isShowReduceButtonSelection" @click.stop="handleSelectionDelete"> @click.stop="handleAddTable"
<Icon icon="ep:delete" color="#409eff" size="26" style="cursor: pointer" /> :disabled="sureDisabled"
<div>{{ t('ts.批量删除') }}</div> :icon="CirclePlus"
</div> size="large"
<div
class="p-12px"
v-if="
isShowTableFormSearch?.isShowTableFormSearch||
routeName == 'PurchaseMain' ||
routeName == 'PurchaseMain' ||
routeName == 'ProductionMain' ||
routeName == 'ZZBJDeliverPlanMain' ||
routeName == 'DeliverPlanMain' ||
routeName == 'DeliverRequestMain' ||
routeName == 'ZZBJDeliverRequestMain' ||
routeName == 'UnplannedreceiptRequestMain'||
routeName == 'RepleinshRequestMain'
"
> >
<el-input v-model="keyWord" style="width: 240px" :placeholder="`请输入${isShowTableFormSearch?.label}，多条数据逗号分隔`" /> <span>{{ t('ts.添加明细') }}</span>
</el-button>
<el-button
type="primary"
link
v-if="isShowReduceButtonSelection"
@click.stop="handleSelectionDelete"
:icon="Remove"
size="large"
>
<span>{{ t('ts.批量删除') }}</span>
</el-button>
<div class="p-12px" v-if="isShowTableFormSearch?.isShowTableFormSearch">
<el-input
v-model="keyWord"
style="width: 240px"
:placeholder="`请输入${isShowTableFormSearch?.label}，多条数据逗号分隔`"
/>
<el-button type="primary" style="margin-left: 10px" @click.stop="batchAdd">{{ <el-button type="primary" style="margin-left: 10px" @click.stop="batchAdd">{{
t('批量添加') t('批量添加')
}}</el-button> }}</el-button>
@ -429,6 +432,7 @@
const { t } = useI18n() // 国际化 const { t } = useI18n() // 国际化
import * as defaultButtons from '@/utils/disposition/defaultButtons' import * as defaultButtons from '@/utils/disposition/defaultButtons'
import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict' import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
import { CirclePlus, Remove } from '@element-plus/icons-vue'
const props = defineProps({ const props = defineProps({
// 是否显示添加按钮 // 是否显示添加按钮
isShowButton: { isShowButton: {
@ -502,11 +506,16 @@ const props = defineProps({
type: String, type: String,
required: false, required: false,
default: '' default: ''
},
// 添加明细是否可点击
sureDisabled: {
type: Boolean,
default: false
} }
}) })
let isShowTableFormSearch = ref({}) let isShowTableFormSearch = ref({})
console.log(33333,props.tableFields) console.log(33333, props.tableFields)
isShowTableFormSearch.value =props.tableFields.find(item=>item.isShowTableFormSearch) isShowTableFormSearch.value = props.tableFields.find((item) => item.isShowTableFormSearch)
// 传递给父类 // 传递给父类
const emit = defineEmits([ const emit = defineEmits([
@ -531,11 +540,13 @@ const emit = defineEmits([
'inputStringFcous' 'inputStringFcous'
]) ])
// 获取下拉列表 | type = radio | type = select // 获取下拉列表 | type = radio | type = select
const initSelectOptions = (headerItem,row) => { const initSelectOptions = (headerItem, row) => {
if(row[headerItem.field+'InitOptions']){ if (row[headerItem.field + 'InitOptions']) {
return row[headerItem.field+'InitOptions'] return row[headerItem.field + 'InitOptions']
}else{ } else {
return headerItem.dictType ? getStrDictOptions(headerItem.dictType) : headerItem.tableForm.initOptions return headerItem.dictType
? getStrDictOptions(headerItem.dictType)
: headerItem.tableForm.initOptions
} }
} }
//普通下拉改变事件 //普通下拉改变事件
@ -622,7 +633,7 @@ const TableBaseForm_Ref = ref()
const validateForm = () => { const validateForm = () => {
let _lists = TableBaseForm_Ref.value?.map((v) => v.validate()) let _lists = TableBaseForm_Ref.value?.map((v) => v.validate())
if(!_lists ||_lists.length == 0){ if (!_lists || _lists.length == 0) {
return false return false
} }
return Promise.all(_lists) return Promise.all(_lists)
@ -667,7 +678,7 @@ const buttonOperationClick = (row, label, index) => {
emit('buttonOperationClick', row, label, index) emit('buttonOperationClick', row, label, index)
} }
const visibleChange = (field, val, row, index) => { const visibleChange = (field, val, row, index) => {
emit('visibleChange',field, val, row, index) emit('visibleChange', field, val, row, index)
} }
const currentPage = ref(1) const currentPage = ref(1)
const pageSize = ref(10) const pageSize = ref(10)
@ -711,19 +722,19 @@ const disabledInput = (headerItem, row) => {
) )
} }
} }
const initLabel=(headerItem,op)=>{ const initLabel = (headerItem, op) => {
if(headerItem?.tableForm?.labelField){ if (headerItem?.tableForm?.labelField) {
return op[headerItem?.tableForm?.labelField] return op[headerItem?.tableForm?.labelField]
}else{ } else {
return op.label return op.label
}
} }
} const initValue = (headerItem, op) => {
const initValue=(headerItem,op)=>{ if (headerItem?.tableForm?.valueField) {
if(headerItem?.tableForm?.valueField){
return op[headerItem?.tableForm?.valueField] return op[headerItem?.tableForm?.valueField]
}else{ } else {
return op.value return op.value
} }
} }
// setup 语法糖 抛出方法 // setup 语法糖 抛出方法
defineExpose({ defineExpose({

Write Preview
Loading…
Cancel
Save