Browse Source

tableform添加clear按钮

master_hella_20240701
zhang_li 4 months ago
parent
commit
160805c8c5
  1. 8
      src/components/BasicForm/src/BasicForm.vue
  2. 8
      src/components/TableForm/src/TableForm.vue
  3. 7
      src/views/wms/purchasereceiptManage/supplierdeliver/supplierdeliverRequestMain/index.vue
  4. 1
      src/views/wms/purchasereceiptManage/supplierdeliver/supplierdeliverRequestMain/supplierdeliverRequestMain.data.ts

8
src/components/BasicForm/src/BasicForm.vue

@ -96,6 +96,7 @@
@inputNumberChange="inputNumberChange"
@tableFormSelectOnBlur="tableFormSelectOnBlur"
@formFormDateChange="formFormDateChange"
@clearInput='clearInput'
>
<template v-slot="{row}">
<slot :row="row"></slot>
@ -443,6 +444,7 @@ const opensearchTable = (
searchDetailSchemas
)
}
// searchTable
const changeDialogWidth = (width)=>{
searchTableRef.value.changeDialogWidth(width)
@ -650,7 +652,8 @@ const emit = defineEmits([
'inputNumberChange',
'formFormDateChange',
'footButtonClick',
'clearSearchInput'
'clearSearchInput',
'clearInput'
])
//
const formSelectChange = (field, val, row) => {
@ -719,6 +722,9 @@ const inpuFocus = (headerItem, row, index) => {
headerItem.tableForm?.searchDetailSchemas
)
}
const clearInput = (field, row, index) => {
emit('clearInput',field, row, index)
}
/**
* 监听改变事件
* @param field 当前操作字段

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

@ -69,6 +69,7 @@
style="flex:1"
@blur="inputStringBlur(headerItem.field, row[headerItem.field], row)"
/>
<Icon icon="ep:circle-close" v-if="headerItem?.tableForm?.isInpuFocusShow && headerItem?.tableForm?.disabled&& headerItem?.tableForm?.clearable" style='position:absolute;right:50px;cursor: pointer;' @click="clearInput(headerItem.field,row,index)"/>
<el-button :key="headerItem.field+$index+'button'" v-if="headerItem?.tableForm?.isInpuFocusShow" @click="inpuFocus(headerItem,row,index)"><Icon icon="ep:search" size="14"/></el-button>
</el-form-item>
<el-form-item v-if="headerItem?.tableForm?.type == 'slot'">
@ -414,7 +415,8 @@ const emit = defineEmits([
'buttonOperationClick',
'inputStringBlur',
'tableFormSelectOnBlur',
'formFormDateChange'
'formFormDateChange',
'clearInput'
])
// | type = radio | type = select
const initSelectOptions = (item) => {
@ -511,7 +513,9 @@ const inpuFocus = (headerItem, row, index)=>{
const inputStringBlur = (field, val,row) => {
emit('inputStringBlur', field, val,row)
}
const clearInput= (field, row, index) => {
emit('clearInput',field, row, index)
}
//table
const buttonOperationClick = (row, label, index)=> {
emit("buttonOperationClick", row, label, index);

7
src/views/wms/purchasereceiptManage/supplierdeliver/supplierdeliverRequestMain/index.vue

@ -132,6 +132,7 @@
@searchTableSuccess="searchTableSuccessLabel"
@submitForm="submitFormLabel"
:isShowReduceButton="false"
@clearInput='clearInput'
/>
<!-- 上传质量报告 -->
<BasicForm
@ -798,6 +799,12 @@ const submitFormLabel = async (formType, data) => {
formLabelRef.value.dialogVisible = false
}
}
const clearInput = async (field,row,index) => {
row[field]=''
row['secondPackQty']=''
SupplierdeliverRequestDetailRules.secondPackQty[0].required = false
}
const BASE_URL = import.meta.env.VITE_JMREPORT_BASE_URL

1
src/views/wms/purchasereceiptManage/supplierdeliver/supplierdeliverRequestMain/supplierdeliverRequestMain.data.ts

@ -1568,6 +1568,7 @@ export const SupplierdeliverRequestDetailLabel = useCrudSchemas(reactive<CrudSch
}
},
tableForm: {
clearable: true,
disabled: true,
isInpuFocusShow: true,
searchListPlaceholder: '请选择包装',

Loading…
Cancel
Save