主数据分页Loading优化

 Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue

@@ -319,7 +319,8 @@
        hasUpload: true,
        height: 110
      },
      result: ''
      result: '',
      elapsedTime:'',
    };
  },
  computed: {
@@ -681,21 +682,37 @@
        });
      }
    },
    handleSizeChange(val) {
    async CrudRend() {
      this.elapsedTime = 0;
      const startTime = performance.now();
      const res = await TableData({
        templateOid: this.templateOid,
        codeClassifyOid: this.codeClassifyOid,
        page: this.page.currentPage,
        limit: this.page.pageSize,
      });
      const endTime = performance.now();
      this.elapsedTime = Math.floor(endTime - startTime) * 1;
      console.log(this.elapsedTime)
      this.page.total = res.data.total;
      this.data = res.data.data;
      this.tableData = res.data.data;
    },

    async handleSizeChange(val) {
      this.isLoading = true;
      setTimeout(() => {
      await this.CrudRend();
        this.page.pageSize = val;
        this.$emit("pageSize", val);
        this.CrudRend();
      }, 3000);
      this.isLoading = false;
    },
    handleCurrentChange(val) {

    async handleCurrentChange(val) {
      this.isLoading = true;
      setTimeout(() => {
      await this.CrudRend();
        this.page.currentPage = val;
        this.$emit("currentPage", val);
        this.CrudRend();
      }, 3000);
      this.isLoading = false;
    },
    // 监听单元格点击事件并存储正在编辑的行
    handleCellClick(row, column) {
@@ -746,43 +763,6 @@
          this.$refs.dataTable.doLayout();
        }
      })
    },
    //表格头渲染
    CrudHeaderRend() {
      if (this.codeClassifyOid != "") {
        MasterTable({
          codeClassifyOid: this.codeClassifyOid
        }).then((res) => {
          this.options = res.data.tableDefineVO.seniorQueryColumns;
          this.List = res.data.tableDefineVO.cols[0];
          this.List.forEach((item) => {
            let columnItem = {
              label: item.title,
              prop: item.queryField,
              type: this.columnType[item.type],
              sortable: item.sort,
              width: item.minWidth,
            };
            this.option.column.push(columnItem);
            this.option.column = this.tableHeadData;
            this.templateOid = res.data.tableDefineVO.oid;
            this.$emit("templateOid", this.templateOid);
          });
        });
      }
    },
    //表格数据
    CrudRend() {
      TableData({
        templateOid: this.templateOid,
        codeClassifyOid: this.codeClassifyOid,
        page: this.page.currentPage,
        limit: this.page.pageSize,
      }).then((res) => {
        this.page.total = res.data.total;
        this.data = res.data.data;
        this.tableData = res.data.data;
      });
    },
    // 排序
    sortChange(val) {

 Source/UBCS-WEB/src/components/template/Stage.vue

@@ -11,7 +11,6 @@
        </template>
      </avue-crud>
    </div>

    <el-dialog :visible.sync="dialogNode" append-to-body="true" title="模板阶段" width="50%">
      <avue-crud ref="crud" :data="stageData" :option="stageOption" :table-loading="loading" @on-load="getStagelist"
                 @row-click="handleRowStageClick">

 Source/UBCS-WEB/src/views/MasterData/items.vue

@@ -3,18 +3,42 @@
    <el-aside>
      <basic-container style="overflow: hidden;">
        <!--          树组件-->
        <master-tree @codeClassifyOid="codeClassifyOidList" @coderuleoid="coderuleoidList" :pageSize="this.pageSize"
          :currentPage="this.currentPage" @tableDataArray="tableDataArrays" @tableHeadDataFateher="tableHeadDatas"
          @tableHeadBttoms="tableHeadBttoms" @total="totals" @nodeClick="nodeClick"
          @tableHeadFindData="tableHeadFindDatas" @Treedata="TreedataList" @TreeValue="TreeValueEmit"></master-tree>
        <master-tree
          :currentPage="this.currentPage"
          :pageSize="this.pageSize"
          @TreeValue="TreeValueEmit"
          @Treedata="TreedataList"
          @codeClassifyOid="codeClassifyOidList"
          @coderuleoid="coderuleoidList"
          @nodeClick="nodeClick"
          @tableDataArray="tableDataArrays"
          @tableHeadBttoms="tableHeadBttoms"
          @tableHeadDataFateher="tableHeadDatas"
          @tableHeadFindData="tableHeadFindDatas"
          @total="totals"
        >
        </master-tree>
      </basic-container>
    </el-aside>
    <el-main>
      <!--        表格组件-->
      <VciMasterCrud :page="this.page" :codeClassifyOid="this.codeClassifyOid" :coderuleoid="this.coderuleoid"
        @pageSize="pageSizes" @currentPage="currentPages" :tableDataArray="tableDataArray" :total="this.total"
        :tableHeadDataFateher="this.tableHeadDataFateher" :isLoading="isLoading" :templateOid="templateOid"
        :tableHeadFindData="tableHeadFindData" :tableHeadBtnData="masterVrBtnList" :Treedata="Treedata" :TreeValue="TreeValue"></VciMasterCrud>
      <VciMasterCrud
        :TreeValue="TreeValue"
        :Treedata="Treedata"
        :codeClassifyOid="this.codeClassifyOid"
        :coderuleoid="this.coderuleoid"
        :isLoading="isLoading"
        :page="this.page"
        :tableDataArray="tableDataArray"
        :tableHeadBtnData="masterVrBtnList"
        :tableHeadDataFateher="this.tableHeadDataFateher"
        :tableHeadFindData="tableHeadFindData"
        :templateOid="templateOid"
        :total="this.total"
        @currentPage="currentPages"
        @pageSize="pageSizes"
      >
      </VciMasterCrud>
    </el-main>
  </el-container>
</template>

 Source/UBCS-WEB/src/views/integration/systemInfo.vue

@@ -294,6 +294,7 @@
        // this.ModifyProperties(this.TreeData, 'text', 'label');
        // 根据this.TreeData的长度计算延迟时间
        const delayTime = this.TreeData.length * 1;
        console.log(delayTime)
        setTimeout(() => {
          this.loading = false;
          this.reload = Math.random();