|
@@ -2,7 +2,7 @@
|
|
|
* @Author: fxs bjnsfxs@163.com
|
|
|
* @Date: 2024-08-20 18:16:18
|
|
|
* @LastEditors: fxs bjnsfxs@163.com
|
|
|
- * @LastEditTime: 2024-11-27
|
|
|
+ * @LastEditTime: 2024-11-28
|
|
|
* @Description:
|
|
|
*
|
|
|
-->
|
|
@@ -172,88 +172,74 @@ const handleSizeChange = (val: number) => {
|
|
|
* @description 加载表格数据
|
|
|
*/
|
|
|
const loadTableData = async (): Promise<boolean> => {
|
|
|
- return new Promise(async (resolve, reject) => {
|
|
|
- loading.value = true
|
|
|
+ loading.value = true
|
|
|
+
|
|
|
+ try {
|
|
|
// 如果是直接传入的数据
|
|
|
if (props.dataList) {
|
|
|
tableData.splice(0, tableData.length, ...props.dataList)
|
|
|
if (props.paginationConfig) {
|
|
|
paginationConfig.total = props.paginationConfig.total
|
|
|
}
|
|
|
+ return true
|
|
|
+ }
|
|
|
|
|
|
- loading.value = false
|
|
|
-
|
|
|
- resolve(true)
|
|
|
- } else {
|
|
|
- // 如果是需要表格自己请求数据的
|
|
|
- if (props.requestConfig) {
|
|
|
- try {
|
|
|
- // 如果开启了分页查询,那么要计算出需要展示的页码位置所对应的偏移量
|
|
|
- // 同时要将查询的条数改为对应的用户选择的展示条数
|
|
|
-
|
|
|
- if (props.openRemoteQuery) {
|
|
|
- reqConfig.otherOptions.offset =
|
|
|
- (paginationConfig.currentPage - 1) * paginationConfig.limit
|
|
|
- reqConfig.otherOptions.limit = paginationConfig.limit
|
|
|
- }
|
|
|
- // console.log(reqConfig.otherOptions)
|
|
|
- await getTableData(reqConfig.url, reqConfig.otherOptions, props.openRemoteQuery)
|
|
|
-
|
|
|
- backupTableData.splice(0, backupTableData.length, ...tableData)
|
|
|
- resolve(true)
|
|
|
- } catch (err) {
|
|
|
- console.log(err)
|
|
|
- reject(err)
|
|
|
- } finally {
|
|
|
- loading.value = false
|
|
|
- }
|
|
|
- } else {
|
|
|
- loading.value = false
|
|
|
-
|
|
|
- throw new Error('no match requestConfig')
|
|
|
+ // 如果需要表格自己请求数据的
|
|
|
+ if (props.requestConfig) {
|
|
|
+ if (props.openRemoteQuery) {
|
|
|
+ reqConfig.otherOptions.offset = (paginationConfig.currentPage - 1) * paginationConfig.limit
|
|
|
+ reqConfig.otherOptions.limit = paginationConfig.limit
|
|
|
}
|
|
|
+
|
|
|
+ await getTableData(reqConfig.url, reqConfig.otherOptions, props.openRemoteQuery)
|
|
|
+ backupTableData.splice(0, backupTableData.length, ...tableData)
|
|
|
+ return true
|
|
|
}
|
|
|
- })
|
|
|
+
|
|
|
+ // 如果 dataList 和 requestConfig 都没有传入,返回 false
|
|
|
+ console.warn('Both dataList and requestConfig are undefined. Returning early.')
|
|
|
+ return false
|
|
|
+ } catch (err) {
|
|
|
+ console.error('Error while loading table data:', err)
|
|
|
+ return false // 确保返回 false 表示失败
|
|
|
+ } finally {
|
|
|
+ loading.value = false // 确保 loading 状态被正确重置
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @description: 获取数据,如果没有直接传入数据,则去请求数据,有则直接用
|
|
|
- * @return Promise
|
|
|
*/
|
|
|
-const getData = () => {
|
|
|
- return new Promise(async (resolve, reject) => {
|
|
|
- try {
|
|
|
- // 等待数据加载完成
|
|
|
- await loadTableData()
|
|
|
- // 如果需要平均值字段,则需要在表格头部插入一行计算平均值
|
|
|
- if (props.needAverage) {
|
|
|
- let rowData: any = {}
|
|
|
- let oldList: Array<any> = JSON.parse(JSON.stringify(tableData))
|
|
|
- Object.values(props.tableFieldsInfo).map((item: TableFieldInfo, index: number) => {
|
|
|
- let sum = oldList
|
|
|
- .map((item) => item.count)
|
|
|
- .reduce((accumulator, currentValue) => accumulator + currentValue, 0)
|
|
|
- let averageList = oldList
|
|
|
- .map((val) => val[item.name])
|
|
|
- .filter((item) => item !== undefined)
|
|
|
- if (index === 0) rowData[item.name] = '均值'
|
|
|
- else if (item.name === 'count') rowData[item.name] = sum
|
|
|
- else {
|
|
|
- let num =
|
|
|
- averageList.reduce((accumulator, currentValue) => accumulator + currentValue, 0) /
|
|
|
- averageList.length
|
|
|
-
|
|
|
- rowData[item.name] = isNaN(num) ? 0 : num.toFixed(2)
|
|
|
- }
|
|
|
- })
|
|
|
- insertRow(0, rowData)
|
|
|
- }
|
|
|
- resolve(true)
|
|
|
- } catch (err) {
|
|
|
- console.log(err)
|
|
|
- reject(err)
|
|
|
+const getData = async () => {
|
|
|
+ try {
|
|
|
+ // 等待数据加载完成
|
|
|
+ await loadTableData()
|
|
|
+ // 如果需要平均值字段,则需要在表格头部插入一行计算平均值
|
|
|
+ if (props.needAverage) {
|
|
|
+ let rowData: any = {}
|
|
|
+ let oldList: Array<any> = JSON.parse(JSON.stringify(tableData))
|
|
|
+ Object.values(props.tableFieldsInfo).map((item: TableFieldInfo, index: number) => {
|
|
|
+ let sum = oldList
|
|
|
+ .map((item) => item.count)
|
|
|
+ .reduce((accumulator, currentValue) => accumulator + currentValue, 0)
|
|
|
+ let averageList = oldList.map((val) => val[item.name]).filter((item) => item !== undefined)
|
|
|
+ if (index === 0) rowData[item.name] = '均值'
|
|
|
+ else if (item.name === 'count') rowData[item.name] = sum
|
|
|
+ else {
|
|
|
+ let num =
|
|
|
+ averageList.reduce((accumulator, currentValue) => accumulator + currentValue, 0) /
|
|
|
+ averageList.length
|
|
|
+
|
|
|
+ rowData[item.name] = isNaN(num) ? 0 : num.toFixed(2)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ insertRow(0, rowData)
|
|
|
}
|
|
|
- })
|
|
|
+ return true
|
|
|
+ } catch (err) {
|
|
|
+ console.log(err)
|
|
|
+ return false
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
// 包装一下获取数据
|
|
@@ -623,10 +609,10 @@ onMounted(() => {
|
|
|
class="queryForm"
|
|
|
:label-position="'left'"
|
|
|
>
|
|
|
- <template v-for="item in inputFieldsList">
|
|
|
+ <template v-for="item in inputFieldsList" :key="item.name">
|
|
|
<!-- 所有的input查询框 -->
|
|
|
<el-form-item
|
|
|
- @keyup.enter.native="throttleQueryTableData"
|
|
|
+ @keyup.enter="throttleQueryTableData"
|
|
|
:label="item.label"
|
|
|
v-if="item.valueType !== 'int'"
|
|
|
class="filterItem"
|
|
@@ -638,7 +624,7 @@ onMounted(() => {
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
<el-form-item
|
|
|
- @keyup.enter.native="throttleQueryTableData"
|
|
|
+ @keyup.enter="throttleQueryTableData"
|
|
|
:label="item.label"
|
|
|
v-else
|
|
|
class="filterItem"
|
|
@@ -653,19 +639,34 @@ onMounted(() => {
|
|
|
</template>
|
|
|
|
|
|
<!-- 所有选择框 -->
|
|
|
- <el-form-item :label="item.label" v-for="item in selectFieldsList" class="filterItem">
|
|
|
+ <el-form-item
|
|
|
+ :label="item.label"
|
|
|
+ v-for="item in selectFieldsList"
|
|
|
+ :key="item.name"
|
|
|
+ class="filterItem"
|
|
|
+ >
|
|
|
<el-select
|
|
|
:empty-values="[undefined, null]"
|
|
|
v-model="queryFormData[item.name]"
|
|
|
:placeholder="item.placeholder"
|
|
|
:value-key="item.name"
|
|
|
>
|
|
|
- <el-option v-for="val in item.otherOption" :label="val.cnName" :value="val.value" />
|
|
|
+ <el-option
|
|
|
+ v-for="val in item.otherOption"
|
|
|
+ :key="val.name"
|
|
|
+ :label="val.cnName"
|
|
|
+ :value="val.value"
|
|
|
+ />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
|
|
|
<!-- 所有日期选择框 -->
|
|
|
- <el-form-item :label="item.label" v-for="item in dateFieldsList" class="filterItem">
|
|
|
+ <el-form-item
|
|
|
+ :label="item.label"
|
|
|
+ v-for="item in dateFieldsList"
|
|
|
+ :key="item.name"
|
|
|
+ class="filterItem"
|
|
|
+ >
|
|
|
<el-date-picker
|
|
|
v-model="queryFormData[item.name]"
|
|
|
type="date"
|
|
@@ -676,7 +677,12 @@ onMounted(() => {
|
|
|
</el-form-item>
|
|
|
|
|
|
<!-- 所有自定义筛选条件 -->
|
|
|
- <el-form-item :label="item.label" v-for="item in customFieldsList" class="filterItem">
|
|
|
+ <el-form-item
|
|
|
+ :label="item.label"
|
|
|
+ v-for="item in customFieldsList"
|
|
|
+ :key="item.name"
|
|
|
+ class="filterItem"
|
|
|
+ >
|
|
|
<el-button plain size="default" :icon="Filter" @click="openCustomFilter(item)"
|
|
|
>筛选
|
|
|
</el-button>
|
|
@@ -703,7 +709,7 @@ onMounted(() => {
|
|
|
</div>
|
|
|
<el-dialog v-model="customFilterDialog" title="自定义筛选条件" width="800">
|
|
|
<CustomFilter
|
|
|
- :filter-list="customFilterList[activeCustomFilterKey]"
|
|
|
+ :custom-filter-list="customFilterList[activeCustomFilterKey]"
|
|
|
:filter="customFilterInfo[activeCustomFilterKey]"
|
|
|
ref="customFilterRef"
|
|
|
></CustomFilter>
|
|
@@ -788,7 +794,7 @@ onMounted(() => {
|
|
|
type="index"
|
|
|
:index="computedRowIndex"
|
|
|
/>
|
|
|
- <template v-for="item in tableFieldsInfo">
|
|
|
+ <template v-for="item in tableFieldsInfo" :key="item.name">
|
|
|
<el-table-column
|
|
|
:prop="item.name"
|
|
|
:label="item.cnName"
|
|
@@ -869,7 +875,7 @@ onMounted(() => {
|
|
|
table-layout="fixed"
|
|
|
layout="prev, pager, next ,jumper ,sizes,total,"
|
|
|
:total="paginationConfig.total"
|
|
|
- :current-page.sync="paginationConfig.currentPage"
|
|
|
+ :current-page="paginationConfig.currentPage"
|
|
|
@current-change="handleCurrentChange"
|
|
|
@size-change="handleSizeChange"
|
|
|
/>
|