|
@@ -2,8 +2,8 @@
|
|
|
* @Author: fxs bjnsfxs@163.com
|
|
|
* @Date: 2024-08-20 18:16:18
|
|
|
* @LastEditors: fxs bjnsfxs@163.com
|
|
|
- * @LastEditTime: 2024-10-15 11:49:12
|
|
|
- * @FilePath: \Game-Backstage-Management-System\src\components\Table.vue
|
|
|
+ * @LastEditTime: 2024-10-16 11:15:24
|
|
|
+ * @FilePath: \Quantity-Creation-Management-Systemc:\Users\NINGMEI\Desktop\Game-Backstage-Management-System\src\components\Table.vue
|
|
|
* @Description:
|
|
|
*
|
|
|
-->
|
|
@@ -67,6 +67,9 @@ const queryFormData = reactive<{ [key: string]: any }>({})
|
|
|
|
|
|
const backupQueryFormData = reactive<{ [key: string]: any }>({})
|
|
|
|
|
|
+// 备份其他的请求信息
|
|
|
+let backupReqOtherOptions = {}
|
|
|
+
|
|
|
// 分页数据
|
|
|
const paginationConfig = reactive<TablePaginationSetting>({
|
|
|
currentPage: 1,
|
|
@@ -235,7 +238,6 @@ const queryTableData = () => {
|
|
|
reqconfig.otherOptions = { ...props.requestConfig.otherOptions, ...queryFormData }
|
|
|
getData()
|
|
|
} else {
|
|
|
- console.log('执行')
|
|
|
let filteredTable = []
|
|
|
// 过滤出来所有符合formData数据的条件
|
|
|
filteredTable = backupTableData.filter((item) => {
|
|
@@ -262,9 +264,7 @@ const throttleQueryTableData = throttleFunc(queryTableData, throttleTime)
|
|
|
* @param {*} formEl 表单对象
|
|
|
* @return {*}
|
|
|
*/
|
|
|
-const resetQueryForm = (formEl: FormInstance | undefined) => {
|
|
|
- if (!formEl) return
|
|
|
-
|
|
|
+const resetQueryForm = (neewQuery: boolean = true) => {
|
|
|
// 使用函数返回保存的备份信息,这样可以正确的给queryformdata赋值
|
|
|
// JSON.stringify()第二个参数可以用来处理undefined的情况,第一个参数设置为_可以避免ts检查
|
|
|
function resetFormData() {
|
|
@@ -274,8 +274,9 @@ const resetQueryForm = (formEl: FormInstance | undefined) => {
|
|
|
return data
|
|
|
}
|
|
|
Object.assign(queryFormData, resetFormData())
|
|
|
+ reqconfig.otherOptions = backupReqOtherOptions // 要把请求的参数也重置一次,不然切换平台等操作,会带着原来的查询参数请求
|
|
|
|
|
|
- queryTableData()
|
|
|
+ if (neewQuery) queryTableData()
|
|
|
}
|
|
|
|
|
|
// 把重置方法包装一下,节流
|
|
@@ -334,7 +335,8 @@ const tableCellStyle = (info: any) => {
|
|
|
watch(
|
|
|
() => [paginationConfig.limit, paginationConfig.currentPage],
|
|
|
([newLimit], [oldLimit]) => {
|
|
|
- console.log(newLimit, oldLimit)
|
|
|
+ resetQueryForm(false)
|
|
|
+
|
|
|
if (newLimit != oldLimit) {
|
|
|
// 需要给分页按钮加上:current-page.sync="current_page" 配置,不然不生效
|
|
|
// 当改变每页大小时把之前的缓存全部清除,重新开始
|
|
@@ -360,6 +362,7 @@ watch(
|
|
|
() => props.requestConfig?.otherOptions.gid,
|
|
|
(newGid, oldGid) => {
|
|
|
if (newGid != oldGid) {
|
|
|
+ resetQueryForm(false)
|
|
|
reqconfig.otherOptions.gid = newGid
|
|
|
|
|
|
getData()
|
|
@@ -373,6 +376,7 @@ const watchPf = watch(
|
|
|
() => props.requestConfig?.otherOptions.pf,
|
|
|
(newPf, oldPf) => {
|
|
|
if (newPf != oldPf) {
|
|
|
+ resetQueryForm(false)
|
|
|
reqconfig.otherOptions.pf = newPf
|
|
|
getData()
|
|
|
}
|
|
@@ -384,6 +388,7 @@ const watchPf = watch(
|
|
|
const changeDataList = watch(
|
|
|
() => [props.dataList],
|
|
|
() => {
|
|
|
+ resetQueryForm(false)
|
|
|
getData()
|
|
|
},
|
|
|
{
|
|
@@ -395,6 +400,7 @@ const changeDataList = watch(
|
|
|
const watchDateChange = watch(
|
|
|
() => [props.requestConfig?.otherOptions.startTime, props.requestConfig?.otherOptions.endTime],
|
|
|
() => {
|
|
|
+ resetQueryForm(false)
|
|
|
getData()
|
|
|
},
|
|
|
{ deep: true }
|
|
@@ -456,6 +462,7 @@ const initFormData = () => {
|
|
|
* @return {*}
|
|
|
*/
|
|
|
const tableSortChange = (data: { column: any; prop: string; order: any }) => {
|
|
|
+ resetQueryForm(false)
|
|
|
let { order } = { ...data }
|
|
|
if (order === 'ascending') order = 'asc'
|
|
|
else if (order === 'descending') order = 'desc'
|
|
@@ -475,6 +482,7 @@ const deleteRow = (url: string, filedsInfo: any) => {
|
|
|
.post(url, { ...filedsInfo })
|
|
|
.then((data) => {
|
|
|
analysisResCode(data).then(() => {
|
|
|
+ resetQueryForm(false)
|
|
|
getData()
|
|
|
})
|
|
|
})
|
|
@@ -499,32 +507,21 @@ const outGetTableData = () => {
|
|
|
return toRaw(tableData).flat()
|
|
|
}
|
|
|
|
|
|
-// const registerWatchProps = () => {
|
|
|
-// props.watchReqProps?.forEach((item) => {
|
|
|
-// watch(
|
|
|
-// () => props.requestConfig?.otherOptions?.[item],
|
|
|
-// () => {
|
|
|
-// // getData()
|
|
|
-// reqconfig.otherOptions[item] = props.requestConfig?.otherOptions?.[item]
|
|
|
-// },
|
|
|
-// { deep: true }
|
|
|
-// )
|
|
|
-// })
|
|
|
-// }
|
|
|
-
|
|
|
// 定义暴露出去的方法
|
|
|
defineExpose({
|
|
|
getData,
|
|
|
resetTableData,
|
|
|
deleteRow,
|
|
|
downLoadTable,
|
|
|
- outGetTableData
|
|
|
+ outGetTableData,
|
|
|
+ resetQueryForm
|
|
|
})
|
|
|
|
|
|
onMounted(() => {
|
|
|
initpageConfig()
|
|
|
initReqConfig()
|
|
|
initFormData()
|
|
|
+ backupReqOtherOptions = reqconfig.otherOptions // 备份一份请求参数
|
|
|
// registerWatchProps()
|
|
|
if (props.loadingState !== undefined) {
|
|
|
loading.value = props.loadingState
|
|
@@ -600,11 +597,7 @@ onMounted(() => {
|
|
|
<el-button class="queryBtn" color="#165dff" @click="throttleQueryTableData">
|
|
|
<el-icon><Search /></el-icon>查询
|
|
|
</el-button>
|
|
|
- <el-button
|
|
|
- class="refreshBtn"
|
|
|
- color="#f2f3f5"
|
|
|
- @click="throttleResetQueryForm(queryFormRef)"
|
|
|
- >
|
|
|
+ <el-button class="refreshBtn" color="#f2f3f5" @click="throttleResetQueryForm()">
|
|
|
<el-icon><RefreshRight /></el-icon>重置
|
|
|
</el-button>
|
|
|
</div>
|