--fix bug

src/components/common/BaseTable.vue

@@ -12,8 +12,9 @@
   />
 </template>
 <script setup>
-import {defineProps, defineExpose, ref, computed, onMounted, defineEmits} from "vue";
+import {defineProps, defineExpose, ref, computed, onMounted, defineEmits, nextTick} from "vue";
 import {useRowsPageNoInit} from "@/api/request";
+import {useResetRef} from "@/utils/useCommon";
 
 const props = defineProps({
   type: {
@@ -44,10 +45,10 @@ const props = defineProps({
 const emit = defineEmits(["update:params", "update:selectedRowKeys", "update:selectedRows"]);
 const rowSelectKeys = ref([]);
 const selectsData = ref([]);
-const params = ref({ pageNo: 1, pageSize: 10 });
+const params = useResetRef({ pageNo: 1, pageSize: 10 });
 const postParam = computed(() => ({ ...params.value, ...props.params }));
 
-const { data, loading, total, fetch } = props.request(props.url, postParam);
+const { data, loading, total, fetch: onFetch } = props.request(props.url, postParam);
 
 const rowSelection = computed(() => (props.type ? {
   type: props.type,
@@ -76,6 +77,8 @@ const customRow = (record) => ({
   }
 });
 
+onMounted(() => props.init && nextTick(onFetch));
+
 function onSelectChange(e, l) {
   rowSelectKeys.value = e;
   selectsData.value = l;
@@ -92,14 +95,13 @@ const pagination = computed(() => ({
 }));
 const changePagination = (e) => {
   params.value.pageNo = e;
-  fetch();
+  onFetch();
 };
-onMounted(() => props.init && fetch());
 
 function reset(v = {}) {
-  params.value = { pageNo: 1, pageSize: 10, ...v };
+  params.reset();
   emit("update:params", { ...v });
-  fetch();
+  nextTick(onFetch);
 }
 
 function resetSelected() {
@@ -109,18 +111,16 @@ function resetSelected() {
   emit("update:selectedRows", []);
 }
 
-function clear() {
+function clear(v = {}) {
   rowSelectKeys.value = [];
   selectsData.value = [];
-  params.value = { pageNo: 1, pageSize: 10 };
-  emit("update:params", {});
+  params.reset();
+  emit("update:params", { ...v });
   emit("update:selectedRowKeys", []);
   emit("update:selectedRows", []);
 }
 
-function toLoading() {
-  loading.value = true;
-}
+const toLoading = () => loading.value = true;
 
 function remove(i) {
   rowSelectKeys.value.splice(i, 1);
@@ -129,6 +129,8 @@ function remove(i) {
   emit("update:selectedRows", selectsData.value);
 }
 
+const fetch = () => nextTick(onFetch);
+
 defineExpose({ fetch, reset, resetSelected, clear, toLoading, remove });
 
 </script>

src/components/drawers/AddOpenCourse.vue

@@ -62,7 +62,7 @@
         </div>
         <div class="main_table">
           <div class="drawerbox">
-            <BaseTable ref="tableRef" :url="COURSE_PLAN_PAGE" :params="params" :columns="columns"/>
+            <BaseTable ref="tableRef" :url="COURSE_PLAN_PAGE" v-model:params="params" :columns="columns"/>
           </div>
         </div>
       </div>
@@ -341,7 +341,7 @@
   </a-drawer>
 </template>
 <script setup>
-import {defineProps, ref} from "vue";
+import {defineProps, ref, nextTick} from "vue";
 import {Form, message} from "ant-design-vue";
 import FJUpload from "@/components/common/FJUpload";
 import CheckBox from "@/components/common/CheckBox";
@@ -356,6 +356,7 @@ import dayjs from "dayjs";
 import BaseTable from "@/components/common/BaseTable";
 import {request} from "@/api/request";
 import dialog from "@/utils/dialog";
+import {useResetRef} from "@/utils/useCommon";
 
 const props = defineProps({
   type: Number,
@@ -433,7 +434,7 @@ const validated = ref(0);
 const dateTime = ref([]);
 const courseName = ref();
 
-const formData = ref({
+const formData = useResetRef({
   name: "",
   address: "",
   teacherId: "",
@@ -486,7 +487,7 @@ const formDataRule = {
     },
   ],
 };
-const { resetFields, validate } = Form.useForm(formData, formDataRule);
+const { validate } = Form.useForm(formData, formDataRule);
 
 function timeChange(time, timeStr) {
   formData.value.beginTime = timeStr[0];
@@ -498,12 +499,20 @@ function search() {
 }
 
 function reset() {
-  tableRef.value.reset();
+  tableRef.value.reset({
+    type: props.type,
+    offcourseId: params.value.offcourseId,
+    draftTaskId: params.value.draftTaskId,
+  });
 }
 
 const closeDrawer = () => {
   openCourseVisible.value = false;
-  tableRef.value.reset();
+  tableRef.value.reset({
+    type: props.type,
+    offcourseId: params.value.offcourseId,
+    draftTaskId: params.value.draftTaskId,
+  });
 };
 
 function confirm() {
@@ -511,8 +520,7 @@ function confirm() {
 }
 
 const createNewCourse = () => {
-  resetFields({
-    id: null,
+  formData.reset({
     type: props.type,
     offcourseId: params.value.offcourseId,
     draftTaskId: params.value.draftTaskId,
@@ -552,7 +560,7 @@ function planEdit(record) {
   validated.value = 0;
   formData.value.homeWorkId && request(WORK_DETAIL(formData.value.homeWorkId), {}).then(res => formData.value.workInfo = res.data);
   formData.value.testId && request(EXAM_DETAIL(formData.value.testId), {}).then(res => formData.value.examInfo = res.data);
-  dateTime.value=[formData.value.beginTime,formData.value.endTime]
+  dateTime.value = [formData.value.beginTime, formData.value.endTime];
   offCourseNewVisiable.value = true;
 }
 
@@ -563,7 +571,7 @@ function openDrawer(row) {
   formData.value.offcourseId = row.courseId;
   formData.value.draftTaskId = row.id;
   courseName.value = row.name;
-  tableRef.value && tableRef.value.fetch();
+  nextTick(tableRef.value.fetch);
 }
 
 const disabledDate = (current) => current && current < dayjs().startOf("day");

src/utils/useCommon.js

@@ -22,9 +22,7 @@ export function useInterval(fun, time) {
 export function useResetRef(initValue = {}) {
   const valueRef = ref({ ...initValue });
 
-  function reset(v = {}) {
-    valueRef.value = { ...initValue, ...v };
-  }
+  const reset = v => valueRef.value = { ...initValue, ...v };
 
   return Object.assign(valueRef, { reset });
 }