bug修复
This commit is contained in:
parent
c344954779
commit
fc771fcf71
|
|
@ -33,15 +33,6 @@
|
|||
start-placeholder="开始日期" end-placeholder="结束日期" v-if="item.f_type === 'dateRange'"
|
||||
v-model="queryParams[item.f_model]" @change="onChangeTime($event, item.dateType)"
|
||||
:picker-options="pickerOptions" />
|
||||
<el-date-picker
|
||||
type="year"
|
||||
:style="{ width: item.f_width || '140px' }"
|
||||
:value-format="item.valueFormat || 'yyyy'"
|
||||
v-if="item.f_type === 'year'"
|
||||
v-model="queryParams[item.f_model]"
|
||||
:placeholder="`请选择${item.f_label}`"
|
||||
:picker-options="item.group === 'yearRange' ? getYearRangeOptions(item) : {}"
|
||||
/>
|
||||
<el-input-number :min="0" style="width: 240px" v-if="item.f_type === 'num'"
|
||||
v-model="queryParams[item.f_model]" />
|
||||
</el-form-item>
|
||||
|
|
@ -216,6 +207,11 @@ export default {
|
|||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 表格最大高度(像素),默认600px
|
||||
tableMaxHeight: {
|
||||
type: [Number, String],
|
||||
default: 600,
|
||||
},
|
||||
// 是否自动加载数据 默认自动加载
|
||||
autoLoad: {
|
||||
type: Boolean,
|
||||
|
|
@ -248,19 +244,20 @@ export default {
|
|||
},
|
||||
/* 表格卡片动态高度 */
|
||||
tableCardStyle() {
|
||||
const baseHeight = this.showSearch ? 200 : 120 // 搜索区域高度
|
||||
const toolbarHeight = this.showRightTools ? 40 : 0 // 工具栏高度
|
||||
const paginationHeight = 60 // 分页区域高度
|
||||
const availableHeight = `calc(100vh - ${baseHeight + toolbarHeight + paginationHeight + 25
|
||||
}px)`
|
||||
return {
|
||||
height: availableHeight,
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
// 去掉固定高度,让卡片自然适应内容
|
||||
}
|
||||
},
|
||||
/* 表格容器样式 */
|
||||
tableContainerStyle() {
|
||||
return {
|
||||
flex: 1, // 占满父元素剩余空间
|
||||
overflow: 'auto', // 超出部分显示滚动条
|
||||
maxHeight: `calc(100vh - 200px)`, // 可根据实际情况调整
|
||||
}
|
||||
return {}
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
|
|
@ -279,7 +276,6 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tableMaxHeight: 'calc(100vh - 220px)', // 动态计算最大高度
|
||||
// 表单校验
|
||||
formRules: {},
|
||||
loading: false,
|
||||
|
|
@ -328,12 +324,9 @@ export default {
|
|||
/* 生成查询参数 */
|
||||
this.formLabel.map((e) => {
|
||||
if (e.f_type === 'dateRange') {
|
||||
// 将每组日期的dateType存入二维数组
|
||||
this.typeList.push(e.dateType);
|
||||
// 初始化查询参数(原逻辑保留)
|
||||
this.$set(this.queryParams, e.dateType[0], '');
|
||||
this.$set(this.queryParams, e.dateType[1], '');
|
||||
this.$set(this.queryParams, e.f_model, []);
|
||||
this.$set(this.queryParams, e.dateType[0], '')
|
||||
this.$set(this.queryParams, e.dateType[1], '')
|
||||
this.typeList = e.dateType
|
||||
|
||||
if (this.isOneMonth) {
|
||||
this.pickerOptions = {
|
||||
|
|
@ -373,32 +366,21 @@ export default {
|
|||
this.dynamicWidth = this.getOperatorWidth()
|
||||
},
|
||||
methods: {
|
||||
|
||||
// 获取年份范围的限制配置
|
||||
getYearRangeOptions(item) {
|
||||
// 如果是结束年份,限制不能小于开始年份
|
||||
if (item.f_model === 'endTime') {
|
||||
return {
|
||||
disabledDate: (time) => {
|
||||
const startYear = this.queryParams.startTime;
|
||||
if (!startYear) return false; // 开始年份未选择时不限制
|
||||
const currentYear = time.getFullYear();
|
||||
return currentYear < Number(startYear); // 结束年份不能小于开始年份
|
||||
}
|
||||
};
|
||||
}
|
||||
// 开始年份无限制(或可根据需求添加最大年份限制)
|
||||
return {};
|
||||
},
|
||||
|
||||
|
||||
/** 获取列表数据 */
|
||||
async getTableList() {
|
||||
try {
|
||||
if (
|
||||
this.queryParams.time &&
|
||||
this.queryParams.time.length !== 0
|
||||
) {
|
||||
this.queryParams[this.typeList[0]] =
|
||||
this.queryParams.time[0]
|
||||
this.queryParams[this.typeList[1]] =
|
||||
this.queryParams.time[1]
|
||||
}
|
||||
|
||||
const params = { ...this.queryParams }
|
||||
const queryParams = JSON.parse(JSON.stringify(params))
|
||||
console.log('查询参数',queryParams)
|
||||
delete queryParams.time // 剔除无关参数
|
||||
// 删除日期范围选择器绑定的临时数组字段(如 openTime),保留实际使用的两个字段(如 openStartTime, openEndTime)
|
||||
this.formLabel.forEach((item) => {
|
||||
|
|
@ -447,32 +429,29 @@ export default {
|
|||
/** 重置按钮 */
|
||||
resetQuery() {
|
||||
this.$refs.queryFormRef.resetFields()
|
||||
// 直接遍历所有日期组,无需判断length
|
||||
this.typeList.forEach((dateType) => {
|
||||
const [startKey, endKey] = dateType;
|
||||
const modelKey = this.formLabel.find(item => item.dateType && item.dateType[0] === startKey)?.f_model;
|
||||
this.$set(this.queryParams, startKey, '');
|
||||
this.$set(this.queryParams, endKey, '');
|
||||
if (modelKey) {
|
||||
this.$set(this.queryParams, modelKey, []);
|
||||
if (this.typeList.length > 1) {
|
||||
if (this.isCurrentDate) {
|
||||
this.queryParams[this.typeList[0]] = new Date()
|
||||
.toISOString()
|
||||
.split('T')[0]
|
||||
this.queryParams[this.typeList[1]] = new Date()
|
||||
.toISOString()
|
||||
.split('T')[0]
|
||||
this.queryParams.time = [
|
||||
new Date().toISOString().split('T')[0],
|
||||
new Date().toISOString().split('T')[0],
|
||||
]
|
||||
} else {
|
||||
this.queryParams[this.typeList[0]] = ''
|
||||
this.queryParams[this.typeList[1]] = ''
|
||||
this.queryParams.time = []
|
||||
}
|
||||
});
|
||||
// 处理isCurrentDate场景(如果需要)
|
||||
if (this.isCurrentDate && this.typeList.length > 0) {
|
||||
const today = new Date().toISOString().split('T')[0];
|
||||
this.typeList.forEach((dateType) => {
|
||||
const [startKey, endKey] = dateType;
|
||||
const modelKey = this.formLabel.find(item => item.dateType && item.dateType[0] === startKey)?.f_model;
|
||||
this.$set(this.queryParams, startKey, today);
|
||||
this.$set(this.queryParams, endKey, today);
|
||||
if (modelKey) {
|
||||
this.$set(this.queryParams, modelKey, [today, today]);
|
||||
} else {
|
||||
this.queryParams[this.typeList[0]] = ''
|
||||
}
|
||||
});
|
||||
}
|
||||
this.queryParams.pageNum = 1;
|
||||
this.queryParams.pageSize = 10;
|
||||
this.getTableList();
|
||||
this.queryParams.pageNum = 1
|
||||
this.queryParams.pageSize = 10
|
||||
this.getTableList()
|
||||
},
|
||||
/** 级联选择 */
|
||||
handleCas(e, val) {
|
||||
|
|
@ -697,8 +676,6 @@ export default {
|
|||
// 新增表格容器样式
|
||||
.table-container {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
|
||||
::v-deep .el-table {
|
||||
width: 100%;
|
||||
|
|
|
|||
Loading…
Reference in New Issue