标签页缓存,tablebug修复

zth
lijingjia 1 week ago
parent 88392f1125
commit bfd83575cb

@ -10,9 +10,9 @@
> >
<Row v-bind="getRow" :gutter="15" style="position: relative;"> <Row v-bind="getRow" :gutter="15" style="position: relative;">
<slot name="formHeader"></slot> <slot name="formHeader"></slot>
<template v-for="schema in getSchema" :key="schema.field"> <template v-for="(schema, index) in getSchema" :key="schema.field">
<FormItem <FormItem
v-if="getFormItemVisible(schema)" v-if="getFormItemVisible(schema, index)"
:is-advanced="fieldsIsAdvancedMap[schema.field]" :is-advanced="fieldsIsAdvancedMap[schema.field]"
:table-action="tableAction" :table-action="tableAction"
:form-action-type="formActionType" :form-action-type="formActionType"
@ -136,10 +136,16 @@
() => ({ ...attrs, ...props, ...unref(getProps) } as Recordable), () => ({ ...attrs, ...props, ...unref(getProps) } as Recordable),
) )
const getFormItemVisible = (schema: FormSchema) => { const getFormItemVisible = (schema: FormSchema, index) => {
const visibleFlag = schema.isEdit != 1 || schema.component == 'Divider' // item
if (unref(getBindValue).textAreaReadOnly) return visibleFlag if (index < 6 && !advanceState.isAdvanced && unref(getBindValue).autoSubmitOnEnter) {
return visibleFlag || schema.component == 'InputTextArea' return true
} else {
if (!advanceState.isAdvanced && unref(getBindValue).autoSubmitOnEnter) return false
const visibleFlag = schema.isEdit != 1 || schema.component == 'Divider'
if (unref(getBindValue).textAreaReadOnly) return visibleFlag
return visibleFlag || schema.component == 'InputTextArea'
}
} }
const getReadonlyColItemVisible = (schema: FormSchema) => { const getReadonlyColItemVisible = (schema: FormSchema) => {
const visibleFlag = const visibleFlag =

@ -33,10 +33,11 @@
show-overflow show-overflow
show-header-overflow show-header-overflow
show-footer-overflow show-footer-overflow
:min-height="tableHeightRef + 35"
:height="tableHeightRef + 35" :height="tableHeightRef + 35"
:row-config="{ isCurrent: true, isHover: true }" :row-config="{ isCurrent: true, isHover: true }"
:column-config="{ resizable: true }" :column-config="{ resizable: true }"
:scroll-y="{ enabled: true, gt: 15 }" :scroll-y="{ enabled: true, gt: 0 }"
:scroll-x="{ enabled: true, gt: 0 }" :scroll-x="{ enabled: true, gt: 0 }"
:sort-config="{ trigger: 'cell', remote: true }" :sort-config="{ trigger: 'cell', remote: true }"
rowSelection rowSelection
@ -45,15 +46,14 @@
@cell-dblclick="dbclickVxeRow" @cell-dblclick="dbclickVxeRow"
@sort-change="sortChangeEvent" @sort-change="sortChangeEvent"
@resizable-change="resizableChangeEvent" @resizable-change="resizableChangeEvent"
> >
<template #empty> <template #empty>
<div> <div>
<img style="width: 100px;" src="../../../assets/images/nodata.png" /> <img src="../../../assets/images/nodata.png" />
</div> </div>
</template> </template>
<vxe-column type="checkbox" width="40"></vxe-column> <vxe-column type="checkbox" fixed="left" width="40"></vxe-column>
<!-- <vxe-column type="seq" width="40"></vxe-column> --> <!-- <vxe-column type="seq" title="序号" width="45"></vxe-column> -->
<template <template
v-for="(item, index) in getBindValues.columns" v-for="(item, index) in getBindValues.columns"
> >
@ -102,12 +102,12 @@
</Table> </Table>
<slot name="right" class="right" ></slot> <slot name="right" class="right" ></slot>
</div> </div>
<Pagination v-if="getBindValues.tableComponent === 'vxe'" v-bind="getBindValues.pagination" @change="pageChange" /> <Pagination v-if="getBindValues.tableComponent === 'vxe'" v-bind="getBindValues.pagination" @change="pageChange" @showSizeChange="onShowSizeChange" />
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import type { BasicTableProps, TableActionType, SizeType, ColumnChangeParam } from './types/table' import type { BasicTableProps, TableActionType, SizeType, ColumnChangeParam } from './types/table'
import { defineComponent, ref, computed, unref, toRaw, inject, watchEffect, watch, onUnmounted } from 'vue' import { defineComponent, ref, computed, unref, toRaw, inject, watchEffect, watch, onUpdated, onActivated, onDeactivated, nextTick } from 'vue'
import { Table, Pagination } from 'ant-design-vue' import { Table, Pagination } from 'ant-design-vue'
import { BasicForm, useForm } from '/@/components/Form/index' import { BasicForm, useForm } from '/@/components/Form/index'
import { PageWrapperFixedHeightKey } from '/@/components/Page' import { PageWrapperFixedHeightKey } from '/@/components/Page'
@ -367,6 +367,13 @@ export default defineComponent({
setPagination(pageConfig) setPagination(pageConfig)
reload() reload()
} }
const onShowSizeChange = (current, pageSize) => {
const pageConfig = toRaw(unref(getPaginationInfo))
pageConfig.current = current
pageConfig.pageSize = pageSize
setPagination(pageConfig)
reload()
}
const vxeSetId = ref('0') const vxeSetId = ref('0')
// vxe // vxe
const getVxeColSetData = () => { const getVxeColSetData = () => {
@ -383,6 +390,27 @@ export default defineComponent({
}) })
} }
} }
// let vxeTableScrollTop = null
// onActivated(() => {
// console.log(vxeTableScrollTop)
// if (vxeTableScrollTop && tableElRef.value?.scrollTo) {
// tableElRef.value.scrollTo(null, vxeTableScrollTop)
// }
// })
// onUpdated(() => {
// setTimeout(() => {
// if (vxeTableScrollTop && tableElRef.value?.scrollTo) {
// tableElRef.value.scrollTo(null, vxeTableScrollTop)
// }
// }, 10)
// })
// onDeactivated(() => {
// if (tableElRef.value?.getScroll) {
// const scrollData = tableElRef.value.getScroll()
// vxeTableScrollTop = scrollData.scrollTop
// console.log(vxeTableScrollTop)
// }
// })
const tableAction: TableActionType = { const tableAction: TableActionType = {
reload, reload,
getSelectRows, getSelectRows,
@ -443,6 +471,7 @@ export default defineComponent({
} }
// vxe // vxe
const resizableChangeEvent = (item) => { const resizableChangeEvent = (item) => {
if (item?.columm?.type === 'seq' || item?.columm?.type === 'checkbox') return
if (vxeSetId.value == '0') return if (vxeSetId.value == '0') return
const postData = { const postData = {
permissionId: permissionsInfo().permissionId, permissionId: permissionsInfo().permissionId,
@ -459,9 +488,6 @@ export default defineComponent({
}) })
setColumns(data) setColumns(data)
} }
onUnmounted(() => {
console.log(111111111111111)
})
// vxe // vxe
// const filterChangeEvent = ({ filterList }) => { // const filterChangeEvent = ({ filterList }) => {
// console.log(filterList) // console.log(filterList)
@ -478,6 +504,7 @@ export default defineComponent({
getBindValues, getBindValues,
getLoading, getLoading,
registerForm, registerForm,
onShowSizeChange,
handleSearchInfoChange, handleSearchInfoChange,
getEmptyDataIsShowTable, getEmptyDataIsShowTable,
sortChangeEvent, sortChangeEvent,

@ -222,7 +222,7 @@
...item, ...item,
}) })
}) })
console.log(ret)
return ret return ret
} }

@ -109,14 +109,15 @@ export function useColumns(
const getColumnsRef = computed(() => { const getColumnsRef = computed(() => {
const columns = cloneDeep(unref(columnsRef)) const columns = cloneDeep(unref(columnsRef))
// 原表格设置操作列到和序号columns vxetable跳过这部分逻辑
handleIndexColumn(propsRef, getPaginationRef, columns) if (unref(propsRef).tableComponent !== 'vxe') {
handleActionColumn(propsRef, columns) handleIndexColumn(propsRef, getPaginationRef, columns)
handleActionColumn(propsRef, columns)
}
if (!columns) { if (!columns) {
return [] return []
} }
const { ellipsis } = unref(propsRef) const { ellipsis } = unref(propsRef)
columns.forEach((item) => { columns.forEach((item) => {
const { customRender, slots } = item const { customRender, slots } = item
item['resizable'] = true item['resizable'] = true
@ -145,7 +146,6 @@ export function useColumns(
const getViewColumns = computed(() => { const getViewColumns = computed(() => {
const viewColumns = sortFixedColumn(unref(getColumnsRef)) const viewColumns = sortFixedColumn(unref(getColumnsRef))
console.log(getColumnsRef)
const mapFn = (column) => { const mapFn = (column) => {
const { slots, customRender, format, edit, editRow, flag } = column const { slots, customRender, format, edit, editRow, flag } = column

@ -266,7 +266,6 @@ export function formatParams(params = {}, searchForm: any = [], otherQuery: any
} }
postData.queryCondition = JSON.stringify(conditions) postData.queryCondition = JSON.stringify(conditions)
console.log(postData)
return postData return postData
} }
// 获取列表设置详情接口 // 获取列表设置详情接口

@ -1,5 +1,5 @@
<!-- <!--
* @Description: * @Description: 配置缓存标签页面入口
* @Author: lijj * @Author: lijj
* @Date: 2024-04-15 17:08:08 * @Date: 2024-04-15 17:08:08
--> -->
@ -48,8 +48,6 @@
const tabStore = useMultipleTabStore() const tabStore = useMultipleTabStore()
const { getOpenKeepAlive } = useRootSetting() const { getOpenKeepAlive } = useRootSetting()
console.log(getOpenKeepAlive.value)
console.log(getShowMultipleTab.value)
const { getBasicTransition, getEnableTransition } = useTransitionSetting() const { getBasicTransition, getEnableTransition } = useTransitionSetting()

@ -23,7 +23,7 @@ export default {
totalField: 'total', totalField: 'total',
}, },
// Number of pages that can be selected // Number of pages that can be selected
pageSizeOptions: ['20', '50', '80', '100', '500'], pageSizeOptions: ['10', '20', '50', '80', '100'],
// Default display quantity on one page // Default display quantity on one page
defaultPageSize: 100, defaultPageSize: 100,
// Default Size // Default Size

@ -232,7 +232,7 @@
useSearchForm: true, useSearchForm: true,
showTableSetting: true, showTableSetting: true,
bordered: true, bordered: true,
showIndexColumn: true, showIndexColumn: false,
indexColumnProps: { indexColumnProps: {
width: 60, width: 60,
}, },

@ -488,7 +488,7 @@ export const formSchema: FormSchema[] = [
componentProps: ({ formModel }) => { componentProps: ({ formModel }) => {
return { return {
api: GetSupplierListByCode, api: GetSupplierListByCode,
params: { code: 'yard' }, params: { code: 'isYard' },
labelField: 'pinYinCode', labelField: 'pinYinCode',
showName: 'description', showName: 'description',
valueField: 'shortName', valueField: 'shortName',
@ -703,7 +703,7 @@ export const formSchema: FormSchema[] = [
componentProps: ({ formModel }) => { componentProps: ({ formModel }) => {
return { return {
api: GetSupplierListByCode, api: GetSupplierListByCode,
params: { code: 'yard' }, params: { code: 'isYard' },
labelField: 'pinYinCode', labelField: 'pinYinCode',
showName: 'description', showName: 'description',
valueField: 'shortName', valueField: 'shortName',

@ -437,7 +437,7 @@ export const formSchema: FormSchema[] = [
componentProps: ({ formModel }) => { componentProps: ({ formModel }) => {
return { return {
api: GetSupplierListByCode, api: GetSupplierListByCode,
params: { code: 'yard' }, params: { code: 'isYard' },
labelField: 'pinYinCode', labelField: 'pinYinCode',
showName: 'shortName', showName: 'shortName',
valueField: 'shortName', valueField: 'shortName',

@ -614,7 +614,7 @@ export const yardSchema: FormSchema[] = [
componentProps: ({ formModel }) => { componentProps: ({ formModel }) => {
return { return {
api: GetSupplierListByCode, api: GetSupplierListByCode,
params: { code: 'yard' }, params: { code: 'isYard' },
labelField: 'pinYinCode', labelField: 'pinYinCode',
placeholder: '场站', placeholder: '场站',
showName: 'shortName', showName: 'shortName',

@ -314,7 +314,7 @@
</div> </div>
</template> </template>
<script lang="ts" setup name="订单管理"> <script lang="ts" setup name="订单管理">
import { ref, defineAsyncComponent, onActivated, onMounted } from 'vue' import { ref, defineAsyncComponent, onActivated } from 'vue'
const TableActionBar = defineAsyncComponent(() => import("./components/tableActionBar.vue")) const TableActionBar = defineAsyncComponent(() => import("./components/tableActionBar.vue"))
import { CheckCircleFilled, CloseCircleFilled, RedoOutlined } from '@ant-design/icons-vue' import { CheckCircleFilled, CloseCircleFilled, RedoOutlined } from '@ant-design/icons-vue'
const tableActionBarRight = defineAsyncComponent(() => import("./components/tableActionBarRight.vue")) const tableActionBarRight = defineAsyncComponent(() => import("./components/tableActionBarRight.vue"))
@ -425,7 +425,6 @@ const calcColumns = [
width: 120, width: 120,
} }
] ]
console.log(columns)
// //
const fieldFlag = ref(true) const fieldFlag = ref(true)
// //
@ -480,7 +479,6 @@ const [registerTable, { reload, getVxeSelectRows, setLoading }] = useTable({
appStore.setIds(ids, 'hyck') appStore.setIds(ids, 'hyck')
} }
resolve({ data: [...res.data.list], total: res.data.totalCount }) resolve({ data: [...res.data.list], total: res.data.totalCount })
console.log(getVxeSelectRows)
}) })
}, },
// //
@ -652,7 +650,7 @@ function compareSuccess() {
setLoading(false); setLoading(false);
reload() reload()
} }
onMounted(() => { onActivated(() => {
// //
reload() reload()
}) })

@ -374,7 +374,7 @@ export const formSchema1: FormSchema[] = [
componentProps: ({ formModel }) => { componentProps: ({ formModel }) => {
return { return {
api: GetSupplierListByCode, api: GetSupplierListByCode,
params: { code: 'agent' }, params: { code: 'isAgent' },
labelField: 'pinYinCode', labelField: 'pinYinCode',
showName: 'shortName', showName: 'shortName',
valueField: 'shortName', valueField: 'shortName',

Loading…
Cancel
Save